:root{--font-primary:"Outfit", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-secondary:"Inter", -apple-system, sans-serif;--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--ease-smooth:cubic-bezier(.25, 1, .5, 1);--trans-fast:.15s var(--ease-smooth);--trans-normal:.25s var(--ease-smooth);--trans-spring:.4s var(--ease-spring);--header-height:64px;--nav-height:68px;--max-app-width:500px;--theme-hue:205}:root.light-mode{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg-primary:#f2f3f7;--bg-secondary:#fff;--bg-tertiary:#e9ebee;--text-primary:#191b22;--text-secondary:#697082;--text-tertiary:#9da3b4;--text-danger:#d32f2f;--text-button-secondary:#4a5060;--border-light:#00000014;--border-strong:#00000026;--card-shadow:0 4px 16px #0000000a;--modal-backdrop:#00000059;--overlay-bg:#fffffff5;--accent-color:hsl(var(--theme-hue), 94%, 60%);--accent-light:hsla(var(--theme-hue), 94%, 60%, .1);--glass-bg:#f2f3f7bf}:root,:root.dark-mode{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-primary:#0d0e11;--bg-secondary:#16171d;--bg-tertiary:#21232c;--text-primary:#f5f6fa;--text-secondary:#9aa1b1;--text-tertiary:#5d6475;--text-danger:#ff8e8e;--text-button-secondary:#dce0e8;--border-light:#ffffff0f;--border-strong:#ffffff1f;--card-shadow:0 8px 24px #00000040;--modal-backdrop:#0000008c;--overlay-bg:#16171df5;--accent-color:hsl(var(--theme-hue), 92%, 65%);--accent-light:hsla(var(--theme-hue), 92%, 65%, .15);--glass-bg:#0d0e11bf}.card-color-0{--card-theme:#163ba2;--card-text:#fff}.card-color-1{--card-theme:#f47615;--card-text:#fff}.card-color-2{--card-theme:#d9266e;--card-text:#fff}.card-color-3{--card-theme:#5a717c;--card-text:#fff}.card-color-4{--card-theme:#169864;--card-text:#fff}.card-color-5{--card-theme:#e0a906;--card-text:#fff}.card-color-6{--card-theme:#0f98b3;--card-text:#fff}.card-color-7{--card-theme:#7a2fbc;--card-text:#fff}*{box-sizing:border-box;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;margin:0;padding:0;-webkit-tap-highlight-color:transparent!important}input,textarea,[contenteditable=true]{-webkit-user-select:text;user-select:text}button,a,img,svg,.nav-item,.counter-card{-webkit-user-drag:none;user-drag:none}button:focus,a:focus,select:focus,div[tabindex]:focus,[tabindex]:focus{outline:none}button:focus-visible,a:focus-visible,select:focus-visible,.nav-item:focus-visible,.counter-card:focus-visible{outline:2px solid var(--accent-color);outline-offset:2px}html,body{overscroll-behavior:none;overscroll-behavior-y:none}body{font-family:var(--font-primary);background-color:var(--bg-primary);color:var(--text-primary);justify-content:center;align-items:center;min-height:100vh;display:flex;overflow:hidden}body:before{content:"";z-index:-1;pointer-events:none;background-image:radial-gradient(circle at 30% 20%,#55b1f914 0%,#0000 40%),radial-gradient(circle at 80% 70%,#f9851a0f 0%,#0000 45%);position:absolute;inset:0}.app-header,.app-main,.app-nav,dialog{width:100%;max-width:var(--max-app-width)}body>.app-header,body>.app-main,body>.app-nav{position:fixed;left:50%;transform:translate(-50%)}@supports (scrollbar-color:auto){*{scrollbar-color:var(--text-tertiary) transparent;scrollbar-width:thin}}@supports not (scrollbar-color:auto){::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-thumb{background:var(--text-tertiary);border-radius:3px}::-webkit-scrollbar-track{background:0 0}}.app-header{height:calc(var(--header-height) + env(safe-area-inset-top,0px));background-color:var(--glass-bg);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border-light);padding:env(safe-area-inset-top,0px) calc(16px + env(safe-area-inset-right,0px)) 0 calc(16px + env(safe-area-inset-left,0px));z-index:100;grid-template-columns:1fr auto 1fr;align-items:center;display:grid;top:0}.header-left{font-family:var(--font-secondary);color:var(--text-primary);cursor:pointer;background-color:var(--leader-bg,var(--bg-tertiary));text-overflow:ellipsis;white-space:nowrap;border:1px solid var(--leader-border,var(--border-light));max-width:130px;transition:all var(--trans-fast);border-radius:20px;align-items:center;gap:6px;padding:6px 12px;font-size:14px;font-weight:600;display:flex;overflow:hidden}.header-left:hover{background-color:var(--leader-border,var(--border-light))}.leader-icon{color:var(--leader-color,var(--accent-color));justify-content:center;align-items:center;display:flex}.header-center{text-align:center}.app-title{letter-spacing:-.2px;color:var(--text-primary);font-size:19px;font-weight:700}.header-right{justify-content:flex-end;gap:8px;display:flex}.header-btn{color:var(--text-secondary);cursor:pointer;width:38px;height:38px;transition:all var(--trans-fast);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex}.header-btn:hover{background-color:var(--bg-tertiary);color:var(--text-primary)}.header-btn:active{transform:scale(.92)}.app-main{top:calc(var(--header-height) + env(safe-area-inset-top,0px));bottom:calc(var(--nav-height) + env(safe-area-inset-bottom,0px));-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;padding:16px calc(16px + env(safe-area-inset-right,0px)) 16px calc(16px + env(safe-area-inset-left,0px));scroll-behavior:smooth;z-index:10;overflow-y:auto}.tab-content{height:100%;animation:fadeIn var(--trans-normal);display:none}.tab-content.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.counters-container{height:100%;transition:all var(--trans-normal);flex-direction:column;gap:12px;display:flex}html[data-layout=grid] .counters-container{grid-template-columns:repeat(2,1fr);grid-auto-rows:1fr;gap:12px;height:100%;display:grid}.counter-card{background-color:var(--card-theme,var(--bg-secondary));color:var(--card-text,var(--text-primary));height:auto;min-height:80px;box-shadow:var(--card-shadow);transition:transform var(--trans-spring), box-shadow var(--trans-normal);border:1px solid #ffffff14;border-radius:16px;flex-direction:column;flex:1;justify-content:space-between;display:flex;position:relative;overflow:hidden}html[data-layout=grid] .counter-card{height:auto}@media (hover:hover){.counter-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px #0000004d}}.card-header{z-index:5;touch-action:none;background-color:#0000001f;justify-content:space-between;align-items:center;height:44px;padding:0 12px;display:flex;position:relative}[data-drag-enabled=true] .card-header{cursor:grab}[data-drag-enabled=true] .card-header:active{cursor:grabbing}.counter-card.dragging{display:none!important}.drag-ghost{pointer-events:none;z-index:9999;opacity:.92;will-change:transform;border-radius:16px;position:fixed;top:0;left:0;transform:rotate(1.5deg)scale(1.03);box-shadow:0 16px 40px #00000073;transition:none!important}.drag-placeholder{border:2px dashed var(--accent-color);opacity:.5;pointer-events:none;background-color:#ffffff0d;border-radius:16px;flex-shrink:0}.hue-slider{-webkit-appearance:none;background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:6px;outline:none;width:100%;height:12px;margin-top:10px;margin-bottom:5px}.hue-slider::-webkit-slider-thumb{appearance:none;background:var(--accent-color);cursor:pointer;width:24px;height:24px;transition:transform var(--trans-fast);border:2px solid #fff;border-radius:50%;box-shadow:0 2px 5px #0006}.hue-slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.hue-slider:focus-visible::-webkit-slider-thumb{outline:2px solid var(--text-primary);outline-offset:3px}.card-btn{color:inherit;opacity:.65;cursor:pointer;width:28px;height:28px;transition:all var(--trans-fast);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex}.card-btn:hover{opacity:1;background-color:#ffffff26}.card-btn:active{transform:scale(.88)}.card-btn:focus-visible{background-color:#ffffff26;outline:none;box-shadow:0 0 0 2px #fff9}.counter-label{font-family:var(--font-secondary);letter-spacing:.1px;text-overflow:ellipsis;white-space:nowrap;text-align:center;max-width:60%;font-size:18px;font-weight:600;overflow:hidden}.card-body-wrapper{flex:1;justify-content:space-between;align-items:stretch;width:100%;display:flex;position:relative}.card-value-body{cursor:pointer;flex:0 auto;justify-content:center;align-items:center;min-width:25%;padding:0 8px;display:flex}.value-display{font-family:var(--font-primary);letter-spacing:-1.5px;text-shadow:0 2px 8px #00000026;transition:transform var(--trans-spring);white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:46px;font-weight:400;overflow:hidden}html[data-layout=grid] .value-display{font-size:32px}html[data-layout=grid] .card-value-body{min-width:40%;padding:0 4px}html[data-layout=grid] .card-direct-zone{flex:30%;min-width:32px}html[data-layout=grid] .card-direct-zone-minus{padding-left:10px}html[data-layout=grid] .card-direct-zone-plus{padding-right:10px}.card-value-body:active .value-display{transform:scale(.96)}.card-direct-zone{opacity:.45;cursor:pointer;min-width:48px;transition:all var(--trans-normal);background-color:#fff0;flex:40%;align-items:center;font-size:24px;font-weight:300;display:flex}.card-direct-zone-minus{justify-content:flex-start;padding-left:15px}.card-direct-zone-plus{justify-content:flex-end;padding-right:15px}@media (hover:hover){.counter-card:hover .card-direct-zone{opacity:.7}.card-direct-zone:hover{background-color:#ffffff14;opacity:1!important}}.card-direct-zone:active{background-color:#ffffff26}.card-value-body:focus-visible,.card-direct-zone:focus-visible{box-shadow:inset 0 0 0 2px var(--focus-ring);border-radius:12px;outline:none}.zone-active-flash{animation:.3s ease-out cardEdgeActive}@keyframes cardEdgeActive{0%{background-color:#fff0}30%{background-color:#ffffff38}to{background-color:#fff0}}.empty-state{text-align:center;color:var(--text-secondary);box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;height:100%;padding:60px 24px;display:flex}.empty-state.hidden{display:none}.empty-state-card{background-color:var(--bg-secondary);border:1.5px solid var(--border-strong);cursor:pointer;width:180px;height:180px;box-shadow:var(--card-shadow);transition:transform var(--trans-fast) var(--ease-spring), border-color var(--trans-fast), box-shadow var(--trans-fast);border-radius:20px;outline:none;flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex}.empty-state-card:hover{border-color:var(--accent-color);transform:translateY(-2px);box-shadow:0 12px 28px #0000004d}.empty-state-card:active{transform:scale(.96)}.empty-state-card:focus-visible{outline:2px solid var(--accent-color);outline-offset:4px}.empty-state-card .placeholder-icon{color:var(--accent-color);transition:transform var(--trans-fast) var(--ease-spring);margin-bottom:0}.empty-state-card:hover .placeholder-icon{transform:scale(1.08)}.empty-illustration{color:var(--text-tertiary);margin-bottom:20px;animation:3s ease-in-out infinite floatIllustration}@keyframes floatIllustration{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.empty-state h2{color:var(--text-primary);margin-bottom:8px;font-size:20px;font-weight:600}.empty-state p{max-width:280px;margin-bottom:24px;font-size:14px;line-height:1.5}.empty-state-text-btn{color:var(--text-secondary);font-size:16px;font-family:var(--font-primary);transition:color var(--trans-fast);font-weight:600}.empty-state-card:hover .empty-state-text-btn{color:var(--text-primary)}.primary-btn{background-color:var(--accent-color);color:#000;font-family:var(--font-primary);cursor:pointer;transition:all var(--trans-fast);border:none;border-radius:12px;padding:12px 24px;font-size:15px;font-weight:600}.primary-btn:hover{opacity:.92;box-shadow:0 4px 12px var(--accent-light)}.primary-btn:active{transform:scale(.96)}.primary-btn.full-width{width:100%}.secondary-btn{background-color:var(--bg-tertiary);color:var(--text-button-secondary);border:1px solid var(--border-light);font-family:var(--font-primary);cursor:pointer;transition:all var(--trans-fast);border-radius:12px;padding:12px 24px;font-size:15px;font-weight:600}@media (hover:hover){.secondary-btn:hover{border-color:var(--accent-color);color:var(--text-primary)}}.secondary-btn:active{background-color:var(--bg-secondary);transform:scale(.97)}.placeholder-container{text-align:center;color:var(--text-secondary);flex-direction:column;justify-content:center;align-items:center;height:100%;padding:80px 24px;display:flex}.placeholder-icon{color:var(--accent-color);margin-bottom:24px}.placeholder-icon svg{width:64px;height:64px;display:block}.placeholder-container h2{color:var(--text-primary);margin-bottom:12px;font-size:22px;font-weight:700}.placeholder-container p{max-width:300px;margin-bottom:30px;font-size:14px;line-height:1.5}.dice-container{text-align:center;color:var(--text-secondary);box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:16px;height:100%;padding:16px;display:flex}.dice-container .placeholder-icon{margin-bottom:0}.dice-container h2{color:var(--text-primary);font-size:24px;font-weight:700;font-family:var(--font-secondary);margin:0}.dice-type-row{grid-template-columns:repeat(3,auto);justify-content:center;gap:12px;width:100%;max-width:280px;display:grid}.dice-type-btn{background-color:var(--bg-secondary);border:1.5px solid var(--border-strong);color:var(--text-primary);width:60px;height:60px;font-family:var(--font-primary);cursor:pointer;transition:all var(--trans-fast) var(--ease-spring);text-align:center;border-radius:12px;justify-content:center;align-items:center;font-size:14px;font-weight:600;display:flex;box-shadow:0 2px 6px #00000026}.dice-type-btn:hover{border-color:var(--accent-color);transform:translateY(-2px);box-shadow:0 4px 12px #00000040}.dice-type-btn:active{transform:scale(.95)}.dice-type-btn.active{background-color:var(--accent-color);color:#000;box-shadow:0 4px 14px var(--accent-light);border-color:#0000}.dice-stepper-row{background-color:var(--bg-secondary);border:1px solid var(--border-strong);box-shadow:var(--card-shadow);border-radius:16px;justify-content:center;align-items:center;gap:16px;padding:8px 16px;display:flex}.stepper-btn{background-color:var(--bg-tertiary);border:1.5px solid var(--border-strong);color:var(--text-primary);cursor:pointer;width:38px;height:38px;transition:all var(--trans-fast);border-radius:10px;justify-content:center;align-items:center;font-size:20px;font-weight:700;display:flex;box-shadow:0 1px 3px #0003}.stepper-btn:hover{background-color:var(--bg-tertiary);border-color:var(--accent-color);color:var(--accent-color)}.stepper-btn:active{transform:scale(.9)}.stepper-value{font-family:var(--font-primary);color:var(--text-primary);text-align:center;min-width:24px;font-size:18px;font-weight:700}.dice-roll-action-btn{border-radius:14px;width:100%;max-width:220px;padding:14px 28px;font-size:16px;box-shadow:0 4px 16px #0003}.dice-result-card{background-color:var(--bg-secondary);border:1.5px solid var(--border-strong);width:100%;max-width:320px;min-height:120px;box-shadow:var(--card-shadow);box-sizing:border-box;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;padding:16px;transition:all .3s cubic-bezier(.175,.885,.32,1.275);display:flex}.dice-result-card.rolled{border-color:var(--accent-color);transform:scale(1.02);box-shadow:0 8px 24px #0000004d}.dice-result-breakdown{font-family:var(--font-primary);color:var(--text-secondary);letter-spacing:.2px;min-height:18px;margin-bottom:6px;font-size:14px;font-weight:500}.dice-result-breakdown:empty{display:none}.dice-result-total{font-family:var(--font-secondary);color:var(--text-primary);font-size:54px;font-weight:800;line-height:1;transition:transform .2s}.dice-result-total.animate-pop{animation:.25s cubic-bezier(.175,.885,.32,1.275) popTotal}@keyframes popTotal{0%{transform:scale(.8)}50%{transform:scale(1.15)}to{transform:scale(1)}}.placeholder-timer-visual{background-color:var(--bg-secondary);border:1px solid var(--border-strong);box-shadow:var(--card-shadow);border-radius:20px;margin-bottom:20px;padding:16px 36px}.timer-tick{color:var(--accent-color);font-family:monospace;font-size:36px;font-weight:700}.timer-increment-row{justify-content:center;gap:16px;width:100%;margin-bottom:24px;display:flex}.timer-inc-btn{background-color:var(--bg-tertiary);border:1.5px solid var(--border-light);color:var(--text-primary);font-family:var(--font-primary);cursor:pointer;transition:all var(--trans-fast);border-radius:9999px;padding:10px 16px;font-size:14px;font-weight:600;box-shadow:0 2px 6px #00000026}.timer-inc-btn:hover{opacity:.9;transform:translateY(-1px)}.timer-inc-btn:active{transform:scale(.95)}.timer-controls{gap:12px;display:flex}.secondary-btn:disabled{opacity:.35;cursor:not-allowed;pointer-events:none}.shake-animation.active{animation:.4s ease-in-out shake}@keyframes shake{0%,to{transform:rotate(0)}20%{transform:rotate(-12deg)scale(1.1)}40%{transform:rotate(12deg)scale(1.1)}60%{transform:rotate(-8deg)scale(1.1)}80%{transform:rotate(8deg)scale(1.1)}}.animate-shuffle{animation:.35s cubic-bezier(.175,.885,.32,1.275) shufflePop}@keyframes shufflePop{0%{transform:scale(1)}50%{opacity:.85;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.animate-reset .counter-card{transform-style:preserve-3d;animation:.6s cubic-bezier(.175,.885,.32,1.275) resetCardFlip}@keyframes resetCardFlip{0%{opacity:0;transform:perspective(800px)rotateX(-90deg)}to{opacity:1;transform:perspective(800px)rotateX(0)}}.settings-wrapper{flex-direction:column;gap:24px;padding-bottom:24px;display:flex}.settings-section{background-color:var(--bg-secondary);border:1px solid var(--border-light);box-shadow:var(--card-shadow);border-radius:16px;padding:16px}.settings-section h3{text-transform:uppercase;letter-spacing:.8px;color:var(--accent-color);margin-bottom:16px;font-size:15px;font-weight:600}.settings-row{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;padding:12px 0;display:flex}.settings-row:last-child{border-bottom:none;padding-bottom:0}.settings-row:first-child{padding-top:0}.settings-info{flex-direction:column;gap:2px;max-width:75%;display:flex}.setting-title{color:var(--text-primary);font-size:15px;font-weight:500}.setting-desc{color:var(--text-secondary);font-size:12px;line-height:1.4}.switch-toggle{width:48px;height:26px;display:inline-block;position:relative}.switch-toggle input{opacity:0;width:0;height:0}.slider-round{cursor:pointer;background-color:var(--bg-tertiary);border:1px solid var(--border-strong);border-radius:34px;transition:all .3s;position:absolute;inset:0}.slider-round:before{content:"";background-color:var(--text-primary);width:18px;height:18px;transition:.3s var(--ease-spring);border-radius:50%;position:absolute;bottom:3px;left:3px}input:checked+.slider-round{background-color:var(--accent-color);border-color:#0000}input:checked+.slider-round:before{background-color:#000;transform:translate(22px)}.switch-toggle input:focus-visible{box-shadow:none}.switch-toggle input:focus-visible+.slider-round{box-shadow:0 0 0 2px var(--bg-secondary), 0 0 0 4px var(--focus-ring,#000)}.settings-select{background-color:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-strong);font-family:var(--font-primary);cursor:pointer;border-radius:8px;outline:none;padding:8px 12px;font-size:14px;font-weight:500}.settings-column{flex-direction:column;gap:12px;padding:4px 0;display:flex}.settings-input{background-color:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-strong);font-family:var(--font-primary);border-radius:10px;outline:none;width:100%;padding:10px 14px;font-size:14px}.settings-input:focus{border-color:var(--accent-color)}.danger-heading{color:var(--text-danger)!important}.danger-column p{color:var(--text-secondary);margin-bottom:8px;font-size:13px}.danger-actions{gap:12px;display:flex}.danger-btn{color:#fff;font-family:var(--font-primary);cursor:pointer;transition:all var(--trans-fast);background-color:#f85c5c;border:none;border-radius:10px;flex:1;padding:10px 16px;font-size:14px;font-weight:600}.danger-btn:hover{background-color:#e54b4b}.danger-btn:active{transform:scale(.97)}.danger-btn-outline{box-shadow:inset 0 0 0 1.5px var(--text-danger);color:var(--text-danger);background-color:#0000}.danger-btn-outline:hover{background-color:#f85c5c14}.danger-btn-outline:active{background-color:#f85c5c26;transform:scale(.97)}.about-version{text-align:center;color:var(--text-tertiary);flex-direction:column;gap:4px;margin-top:10px;font-size:12px;display:flex}.app-nav{height:calc(var(--nav-height) + env(safe-area-inset-bottom,0px));background-color:var(--glass-bg);-webkit-backdrop-filter:blur(16px);border-top:1px solid var(--border-light);padding:0 env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);z-index:100;grid-template-columns:repeat(3,1fr);align-items:center;display:grid;bottom:0}.nav-item{color:var(--text-tertiary);cursor:pointer;height:100%;transition:all var(--trans-fast);background:0 0;border:none;flex-direction:column;justify-content:center;align-items:center;gap:4px;display:flex}.nav-icon{transition:transform var(--trans-spring);justify-content:center;align-items:center;display:flex}.nav-icon svg{width:22px;height:22px;display:block}.nav-text{font-family:var(--font-secondary);letter-spacing:.1px;font-size:11px;font-weight:500}.nav-item.active{color:var(--accent-color)}.nav-item.active .nav-icon{transform:scale(1.12)}.nav-item:active .nav-icon{transform:scale(.9)}.nav-item:focus-visible{box-shadow:inset 0 0 0 2px var(--accent-color);border-radius:16px;outline:none!important}dialog{z-index:200;background:0 0;border:none;outline:none}dialog:not([open]){pointer-events:none;display:none}dialog::backdrop{background-color:var(--modal-backdrop);-webkit-backdrop-filter:blur(8px);opacity:0;transition:display .4s allow-discrete, overlay .4s allow-discrete, opacity .4s ease-out}dialog[open]::backdrop{opacity:1}@starting-style{dialog[open]::backdrop{opacity:0}}.bottom-sheet-dialog{max-width:var(--max-app-width);background-color:var(--overlay-bg);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-light);border-top:3px solid var(--sheet-theme,var(--border-light));width:100%;max-height:92vh;padding:0 env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);transition-behavior:allow-discrete;border-bottom:none;border-top-left-radius:24px;border-top-right-radius:24px;flex-direction:column;margin:0;transition-property:transform,display,overlay;transition-duration:.4s;transition-timing-function:cubic-bezier(.16,1,.3,1);display:flex;position:fixed;top:auto;bottom:0;left:50%;transform:translate(-50%,100%);box-shadow:0 -8px 32px #00000059}.bottom-sheet-dialog .primary-btn{background-color:var(--sheet-theme,var(--accent-color));color:#fff}.bottom-sheet-dialog .primary-btn:hover{opacity:.9;box-shadow:0 4px 14px color-mix(in srgb, var(--sheet-theme,var(--accent-color)) 25%, transparent)}.bottom-sheet-dialog .op-btn.active{background-color:var(--sheet-theme,var(--accent-color));color:#fff;border-color:#0000}.bottom-sheet-dialog .form-input:focus{border-color:var(--sheet-theme,var(--accent-color))}.bottom-sheet-dialog .math-display-wrapper:has(.math-number-input:focus){border-color:var(--sheet-theme,var(--accent-color))}.bottom-sheet-dialog .drag-handle{background-color:var(--sheet-theme,var(--text-tertiary))}.bottom-sheet-dialog.dragging{transition:none!important}dialog[open].bottom-sheet-dialog{transform:translate(-50%)}@starting-style{dialog[open].bottom-sheet-dialog{transform:translate(-50%,100%)}}.bottom-sheet-header{border-bottom:1px solid var(--border-light);flex-direction:column;align-items:center;padding:12px 16px 16px;display:flex;position:relative}.drag-handle{background-color:var(--text-tertiary);opacity:.5;border-radius:2px;width:36px;height:4px;margin-bottom:12px}.sheet-title{color:var(--text-primary);text-align:center;font-size:17px;font-weight:700}.sheet-title-pill{font-family:var(--font-secondary);color:var(--sheet-theme,var(--text-primary));background-color:var(--pill-bg,var(--bg-tertiary));border:1px solid var(--pill-border,var(--border-light));text-align:center;transition:all var(--trans-normal);border-radius:20px;align-items:center;gap:6px;padding:5px 14px;font-size:14px;font-weight:600;display:inline-flex}.dark-mode .sheet-title-pill{color:color-mix(in srgb, var(--sheet-theme,var(--text-primary)) 60%, white);background-color:color-mix(in srgb, var(--sheet-theme,var(--bg-tertiary)) 15%, transparent);border-color:color-mix(in srgb, var(--sheet-theme,var(--border-light)) 30%, transparent)}.light-mode .sheet-title-pill{color:color-mix(in srgb, var(--sheet-theme,var(--text-primary)) 85%, black);background-color:color-mix(in srgb, var(--sheet-theme,var(--bg-tertiary)) 10%, transparent);border-color:color-mix(in srgb, var(--sheet-theme,var(--border-light)) 30%, transparent)}.sheet-close-btn{color:var(--text-secondary);cursor:pointer;width:32px;height:32px;transition:all var(--trans-fast);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex}.sheet-close-btn:hover{background-color:var(--bg-tertiary);color:var(--text-primary)}.sheet-close-btn:active{background-color:var(--bg-secondary);transform:scale(.92)}.header-actions{gap:8px;display:flex;position:absolute;top:14px;right:16px}.header-left-actions{gap:8px;display:flex;position:absolute;top:14px;left:16px}.header-icon-btn{cursor:pointer;width:32px;height:32px;transition:all var(--trans-fast);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex}.header-icon-btn.danger-color{color:var(--text-danger)}.header-icon-btn:hover{background-color:var(--bg-tertiary)}.bottom-sheet-body{background-color:rgba(var(--bg-primary), .3);padding:16px;overflow-y:auto}.calculator-wrapper{flex-direction:column;align-items:center;display:flex}.quick-add-grid{grid-template-columns:repeat(3,1fr);gap:10px;width:100%;margin-bottom:12px;display:grid}.quick-add-grid>button:nth-child(n+4){grid-column:span 1}.quick-add-grid>button{background-color:var(--bg-tertiary);border:1px solid var(--border-light);color:var(--accent-color);font-family:var(--font-primary);cursor:pointer;transition:all var(--trans-fast);border-radius:12px;padding:14px 0;font-size:16px;font-weight:600;box-shadow:0 2px 6px #0000001a}.quick-add-grid>button:hover{background-color:var(--accent-light);border-color:var(--accent-color)}.quick-add-grid>button:active{transform:scale(.94)}.tweak-caption{color:var(--text-secondary);opacity:.65;margin-bottom:16px;font-size:11px}.dialog-divider{background-color:var(--border-light);border:none;width:100%;height:1px;margin:16px 0 20px}.math-entry-row{grid-template-columns:80px 1fr 1fr;gap:8px;width:100%;height:56px;margin-bottom:20px;display:grid}#calc-btn-submit{text-overflow:ellipsis;overflow:hidden}.operation-toggles{background-color:var(--bg-tertiary);border:1px solid var(--border-strong);border-radius:12px;padding:3px;display:flex}.op-btn{color:var(--text-secondary);font-family:var(--font-primary);cursor:pointer;transition:all var(--trans-fast);background:0 0;border:none;border-radius:9px;flex:1;justify-content:center;align-items:center;padding:6px 0;font-size:20px;font-weight:500;display:flex}.op-btn.active{background-color:var(--accent-color);color:#000;font-weight:600}.math-display-wrapper{background-color:var(--bg-tertiary);border:1px solid var(--border-strong);border-radius:12px;align-items:center;padding:0 16px;display:flex;position:relative}.math-op-indicator{color:var(--accent-color);margin-right:10px;font-size:20px;font-weight:600}.math-number-input{color:var(--text-primary);font-family:var(--font-primary);text-align:right;letter-spacing:.5px;-moz-appearance:textfield;background:0 0;border:none;outline:none;width:100%;font-size:22px;font-weight:700}input[type=number]{-moz-appearance:textfield}input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.calc-numpad{grid-template-columns:repeat(4,1fr);gap:10px;width:100%;display:grid}.num-btn{background-color:var(--bg-tertiary);border:1px solid var(--border-light);color:var(--text-primary);font-family:var(--font-primary);cursor:pointer;transition:all var(--trans-fast);border-radius:12px;justify-content:center;align-items:center;padding:14px 0;font-size:20px;font-weight:500;display:flex;box-shadow:0 2px 6px #00000014}.num-btn:hover{background-color:var(--border-light)}.num-btn:active{transform:scale(.92)}.double-key{font-size:18px}.op-key{color:var(--text-secondary);font-size:18px}.op-key:hover{background-color:#ffffff0d}.submit-key{background-color:var(--accent-color);color:#000;border-color:#0000;grid-row:span 2;height:100%;font-weight:600}.submit-key:hover{background-color:var(--accent-color);opacity:.9}.edit-form{flex-direction:column;gap:18px;display:flex}.color-palette-wrapper{flex-direction:column;gap:8px;display:flex}.palette-desc{color:var(--text-secondary);font-size:13px;font-weight:500}.palette-grid{flex-wrap:wrap;gap:10px;display:flex}.palette-swatch{cursor:pointer;width:32px;height:32px;transition:all var(--trans-fast);border:2px solid #0000;border-radius:50%;box-shadow:0 2px 6px #00000026}.palette-swatch.custom-color-picker{justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.palette-swatch.custom-color-picker input[type=color]{opacity:0;cursor:pointer;width:200%;height:200%;position:absolute;top:-10px;left:-10px}.palette-swatch.custom-color-picker .custom-color-icon{color:#fff;z-index:1;pointer-events:none;filter:drop-shadow(0 1px 2px #0000004d)}.palette-swatch:hover{transform:scale(1.1)}.palette-swatch.active{outline:2px solid var(--text-primary);outline-offset:3px;box-shadow:none;transform:scale(1.1)}.palette-swatch:focus-within,.palette-swatch:focus-visible{box-shadow:0 0 0 2px var(--bg-primary), 0 0 0 4px var(--focus-ring);outline:none}.form-group{flex-direction:column;flex:1;gap:6px;display:flex}.form-group label{color:var(--text-secondary);letter-spacing:.2px;font-size:13px;font-weight:600}.form-input{background-color:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-strong);font-family:var(--font-primary);width:100%;transition:border var(--trans-fast);border-radius:12px;outline:none;padding:12px 14px;font-size:15px}.form-input:focus{border-color:var(--accent-color)}.form-row{gap:14px;display:flex}.field-hint{color:var(--text-tertiary);margin-top:2px;font-size:11px}.sheet-action-row{margin-top:8px}.options-menu-dialog{background-color:var(--overlay-bg);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-light);box-shadow:var(--card-shadow);opacity:0;transition-behavior:allow-discrete;border-radius:20px;width:calc(100% - 32px);max-width:380px;margin:0;transition:transform .3s cubic-bezier(.34,1.56,.64,1),opacity .25s ease-out,display .3s,overlay .3s;position:fixed;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)scale(.92)}dialog[open].options-menu-dialog{opacity:1;transform:translate(-50%,-50%)scale(1)}@starting-style{dialog[open].options-menu-dialog{opacity:0;transform:translate(-50%,-50%)scale(.92)}}.options-dialog-header{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.options-dialog-header h2{color:var(--text-primary);font-size:16px;font-weight:700}.options-close-btn{color:var(--text-secondary);cursor:pointer;width:28px;height:28px;transition:all var(--trans-fast);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex}.options-close-btn:hover{background-color:var(--bg-tertiary);color:var(--text-primary)}.options-close-btn:active{background-color:var(--bg-secondary);transform:scale(.92)}.options-dialog-body{flex-direction:column;gap:20px;padding:20px;display:flex}.options-group{flex-direction:column;gap:12px;display:flex}.options-group.border-top{border-top:1px solid var(--border-light);padding-top:16px}.options-group h4{text-transform:uppercase;color:var(--text-secondary);letter-spacing:.5px;font-size:12px;font-weight:600}.toggle-buttons-row{background-color:var(--bg-tertiary);border:1px solid var(--border-light);border-radius:12px;grid-template-columns:repeat(2,1fr);gap:8px;padding:4px;display:grid}.toggle-btn{color:var(--text-secondary);font-family:var(--font-primary);cursor:pointer;transition:all var(--trans-fast);background:0 0;border:none;border-radius:9px;justify-content:center;align-items:center;gap:8px;padding:10px 0;font-size:14px;font-weight:500;display:flex}.toggle-btn.active{background-color:var(--accent-light);color:var(--accent-color);font-weight:600}.selection-stack{flex-direction:column;gap:6px;display:flex}.select-row-btn{background-color:var(--bg-tertiary);border:1px solid var(--border-light);color:var(--text-secondary);font-family:var(--font-primary);text-align:left;cursor:pointer;transition:all var(--trans-fast);border-radius:10px;align-items:center;gap:10px;padding:12px 14px;font-size:13.5px;font-weight:600;display:flex}@media (hover:hover){.select-row-btn:hover{border-color:var(--accent-color);color:var(--text-primary)}}.select-row-btn:active{background-color:var(--bg-secondary);transform:scale(.97)}.select-row-btn.active{background-color:var(--accent-light);border-color:var(--accent-color);color:var(--accent-color);font-weight:600}.setting-switch-row{justify-content:space-between;align-items:center;padding:4px 0;display:flex}.switch-title{color:var(--text-primary);font-size:13.5px;font-weight:500}.history-list{flex-direction:column;gap:10px;display:flex}.history-item{background-color:var(--bg-tertiary);border:1px solid var(--border-light);font-family:var(--font-secondary);border-radius:12px;align-items:center;gap:12px;padding:12px 14px;display:flex}.history-badge{background-color:var(--history-theme,var(--accent-color));border-radius:4px;width:8px;height:28px}.history-details{flex-direction:column;flex:1;gap:2px;display:flex}.history-row-top{justify-content:space-between;align-items:baseline;display:flex}.history-counter{color:var(--text-primary);font-size:13.5px;font-weight:600}.history-time{color:var(--text-tertiary);font-size:11px}.history-row-bottom{justify-content:space-between;align-items:center;margin-top:2px;display:flex}.history-event{color:var(--accent-color);font-size:12.5px;font-weight:500}.history-progression{color:var(--text-secondary);font-size:12px}.history-empty{text-align:center;color:var(--text-tertiary);flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:40px 24px;display:flex}.history-empty.hidden{display:none}.history-empty p{font-size:13px;font-weight:500}.toast-notification{bottom:calc(84px + env(safe-area-inset-bottom,0px));background-color:var(--bg-tertiary);border:1px solid var(--border-strong);z-index:300;pointer-events:none;opacity:1;border-radius:20px;padding:8px 16px;transition:transform .3s cubic-bezier(.175,.885,.32,1.275),opacity .2s ease-out;position:fixed;left:50%;transform:translate(-50%)translateY(0);box-shadow:0 4px 16px #0003}.toast-notification.hidden{opacity:0;transform:translate(-50%)translateY(16px)}.toast-message{font-family:var(--font-secondary);color:var(--text-primary);white-space:pre-wrap;font-size:13px;font-weight:500}@media (width>=600px) and (width<=1024px){:root{--max-app-width:100%}body{background-color:var(--bg-primary)}}@media (width>=1025px){:root{--max-app-width:800px}body{background-color:var(--bg-primary)}.app-header,.app-main,.app-nav,dialog{border-left:1px solid var(--border-light);border-right:1px solid var(--border-light);box-shadow:0 0 32px #0003}}.counter-card.animate-entry{animation:.35s cubic-bezier(.34,1.56,.64,1) forwards card-fade-in}@keyframes card-fade-in{0%{opacity:0;transform:scale(.9)translateY(16px)}to{opacity:1;transform:scale(1)translateY(0)}}@media (prefers-reduced-motion:reduce){.bottom-sheet-dialog{transition-behavior:allow-discrete;transition:opacity .15s ease-out,display .15s,overlay .15s;transform:translate(-50%)}dialog[open].bottom-sheet-dialog{opacity:1;transform:translate(-50%)}@starting-style{dialog[open].bottom-sheet-dialog{opacity:0}}.options-menu-dialog{transition-behavior:allow-discrete;transition:opacity .15s ease-out,display .15s,overlay .15s;transform:translate(-50%,-50%)scale(1)}dialog[open].options-menu-dialog{opacity:1;transform:translate(-50%,-50%)scale(1)}@starting-style{dialog[open].options-menu-dialog{opacity:0}}.counter-card.animate-entry{animation:.15s ease-out forwards card-fade-in-reduced}.counter-card.animate-exit{animation:.15s ease-out forwards card-fade-out-reduced}@keyframes card-fade-in-reduced{0%{opacity:0}to{opacity:1}}@keyframes card-fade-out-reduced{0%{opacity:1}to{opacity:0}}}:focus-visible{outline:2px solid var(--focus-ring,#000);outline-offset:2px}input:focus-visible,select:focus-visible,textarea:focus-visible{box-shadow:0 0 0 2px var(--bg-secondary), 0 0 0 4px var(--focus-ring,#000);outline:none}input.math-number-input:focus-visible{box-shadow:none}.math-display-wrapper:has(.math-number-input:focus-visible){box-shadow:0 0 0 2px var(--bg-secondary), 0 0 0 4px var(--focus-ring,#000)}:root.light-mode{--focus-ring:#191b22}:root,:root.dark-mode{--focus-ring:#f5f6fa}.header-btn,.card-btn,.header-icon-btn,.op-btn,.timer-inc-btn,.sheet-close-btn,.options-close-btn{position:relative}dialog:focus,dialog:focus-visible,.sheet-close-btn:focus,.options-close-btn:focus,.sheet-close-btn:focus-visible,.options-close-btn:focus-visible{box-shadow:none!important;outline:none!important}.header-btn:after,.card-btn:after,.header-icon-btn:after,.op-btn:after,.timer-inc-btn:after,.sheet-close-btn:after,.options-close-btn:after{content:"";width:48px;height:48px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@media (width<=400px){.palette-grid .card-color-3{display:none!important}}