@font-face{font-family:Roboto Flex Variable;font-style:normal;font-display:swap;font-weight:100 1000;src:url(./roboto-flex-cyrillic-ext-wght-normal-CVcCQn0y.woff2) format("woff2-variations");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Roboto Flex Variable;font-style:normal;font-display:swap;font-weight:100 1000;src:url(./roboto-flex-cyrillic-wght-normal-BJ-nQEdz.woff2) format("woff2-variations");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Roboto Flex Variable;font-style:normal;font-display:swap;font-weight:100 1000;src:url(./roboto-flex-greek-wght-normal-DeN4rzfy.woff2) format("woff2-variations");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:Roboto Flex Variable;font-style:normal;font-display:swap;font-weight:100 1000;src:url(./roboto-flex-vietnamese-wght-normal-AVFfiTln.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Roboto Flex Variable;font-style:normal;font-display:swap;font-weight:100 1000;src:url(./roboto-flex-latin-ext-wght-normal-gysdOMcS.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Roboto Flex Variable;font-style:normal;font-display:swap;font-weight:100 1000;src:url(./roboto-flex-latin-wght-normal-n-dP9qr2.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--seed: #c0392b;--md-primary: #d0bcff;--md-on-primary: #381e72;--md-primary-container: #4f378b;--md-on-primary-container: #eaddff;--md-secondary-container: #4a4458;--md-on-secondary-container: #e8def8;--md-surface: #141218;--md-surface-container-low: #1d1b20;--md-surface-container: #211f26;--md-surface-container-high: #2b2930;--md-surface-container-highest: #36343b;--md-on-surface: #e6e0e9;--md-on-surface-variant: #cac4d0;--md-outline: #938f99;--md-outline-variant: #49454f;--shape-xs: 4px;--shape-sm: 8px;--shape-md: 12px;--shape-lg: 16px;--shape-xl: 28px;--shape-full: 999px;--spring-fast: .32s cubic-bezier(.42, 1.5, .3, .96);--spring-default: .48s cubic-bezier(.38, 1.2, .24, 1);--eff-fast: .16s cubic-bezier(.2, 0, 0, 1);--eff-default: .28s cubic-bezier(.2, 0, 0, 1);--ease-emphasized: cubic-bezier(.2, 0, 0, 1)}@supports (color: oklch(from red l c h)){:root{--md-primary: oklch(from var(--seed) .82 min(c, .13) h);--md-on-primary: oklch(from var(--seed) .28 min(c, .1) h);--md-primary-container: oklch(from var(--seed) .42 min(c, .11) h);--md-on-primary-container: oklch(from var(--seed) .92 min(c, .06) h);--md-secondary-container: oklch(from var(--seed) .37 min(c, .05) h);--md-on-secondary-container: oklch(from var(--seed) .91 min(c, .03) h);--md-surface: oklch(from var(--seed) .18 min(c, .015) h);--md-surface-container-low: oklch(from var(--seed) .22 min(c, .018) h);--md-surface-container: oklch(from var(--seed) .24 min(c, .02) h);--md-surface-container-high: oklch(from var(--seed) .27 min(c, .022) h);--md-surface-container-highest: oklch(from var(--seed) .31 min(c, .025) h);--md-on-surface: oklch(from var(--seed) .93 min(c, .012) h);--md-on-surface-variant: oklch(from var(--seed) .79 min(c, .025) h);--md-outline: oklch(from var(--seed) .6 min(c, .025) h);--md-outline-variant: oklch(from var(--seed) .36 min(c, .025) h)}}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--md-surface);color:var(--md-on-surface);font-family:Roboto Flex Variable,Roboto Flex,Roboto,Segoe UI,system-ui,sans-serif}button{font-family:inherit;-webkit-tap-highlight-color:transparent}#app{display:flex;height:100dvh}#stage-wrap{position:relative;flex:1;min-width:0}#stage{display:block;width:100%;height:100%;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}#stage:active{cursor:grabbing}#vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 95% at 50% 42%,transparent 58%,rgba(0,0,0,.36) 100%);z-index:1}#hint,#results,#charge,#roll-fab,#sidebar-toggle{z-index:2}.ripple{position:relative;overflow:hidden}.ink{position:absolute;border-radius:50%;background:currentColor;opacity:.13;transform:scale(0);animation:ink .55s var(--ease-emphasized) forwards;pointer-events:none}@keyframes ink{to{transform:scale(1);opacity:0}}.btn,.step,.icon-btn,.env-card,.btn-group button,#roll-fab,#sidebar-toggle{isolation:isolate}.btn:after,.step:after,.icon-btn:after,.env-card:after,.btn-group button:after,#roll-fab:after,#sidebar-toggle:after{content:"";position:absolute;inset:0;background:currentColor;border-radius:inherit;opacity:0;transition:opacity var(--eff-fast);pointer-events:none;z-index:-1}.btn:hover:not(:disabled):after,.step:hover:not(:disabled):after,.icon-btn:hover:not(:disabled):after,.env-card:hover:after,.btn-group button:hover:after,#roll-fab:hover:after,#sidebar-toggle:hover:after{opacity:.08}.btn:active:not(:disabled):after,.env-card:active:after,.btn-group button:active:after{opacity:.1}#hint{position:absolute;top:14px;left:16px;padding:8px 16px;font-size:12px;font-weight:450;letter-spacing:.02em;color:var(--md-on-surface-variant);background:color-mix(in srgb,var(--md-surface-container) 78%,transparent);border:1px solid var(--md-outline-variant);border-radius:var(--shape-full);backdrop-filter:blur(10px);pointer-events:none;transition:opacity .6s var(--ease-emphasized)}#hint.dim{opacity:.4}#results{position:absolute;left:50%;bottom:32px;transform:translate(-50%);max-width:min(82%,680px);padding:16px 24px;text-align:center;background:color-mix(in srgb,var(--md-surface-container-high) 88%,transparent);border:1px solid var(--md-outline-variant);border-radius:var(--shape-xl);box-shadow:0 6px 24px #00000073;backdrop-filter:blur(12px);pointer-events:none;animation:rise-in var(--spring-default) backwards}#results.hidden{display:none}@keyframes rise-in{0%{opacity:0;transform:translate(-50%) translateY(18px) scale(.92)}}.res-label{font-size:12px;font-weight:550;letter-spacing:.08em;text-transform:uppercase;color:var(--md-on-surface-variant)}.res-big{font-size:56px;font-weight:780;line-height:1.1;color:var(--md-primary);font-variant-numeric:tabular-nums}.res-row{display:flex;align-items:center;gap:10px;margin:7px 0;text-align:left}.g-label{min-width:46px;font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--md-on-surface-variant)}.g-sub{margin-left:auto;font-size:14px;font-weight:700;color:var(--md-on-secondary-container);background:var(--md-secondary-container);border-radius:var(--shape-full);padding:3px 11px}.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{min-width:32px;padding:4px 9px;font-size:15px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--md-on-surface);background:var(--md-surface-container-highest);border:1px solid var(--md-outline-variant);border-radius:var(--shape-sm);animation:chip-pop var(--spring-fast) backwards}@keyframes chip-pop{0%{opacity:0;transform:scale(.5) translateY(10px)}}.res-total{margin-top:12px;padding-top:10px;border-top:1px solid var(--md-outline-variant);font-size:14px;color:var(--md-on-surface-variant)}.res-total b{margin-left:6px;font-size:26px;font-weight:760;color:var(--md-primary);font-variant-numeric:tabular-nums}.rolling{display:flex;align-items:center;gap:12px;font-size:16px;font-weight:500;color:var(--md-on-surface-variant)}.load-shape{width:20px;height:20px;background:var(--md-primary);animation:shape-spin 1.6s linear infinite,shape-morph 1.6s ease-in-out infinite}@keyframes shape-spin{to{transform:rotate(360deg)}}@keyframes shape-morph{0%,to{border-radius:50%}33%{border-radius:28% 72% 60% 40%/50% 36% 64% 50%}66%{border-radius:30%}}#charge{position:absolute;left:50%;bottom:12px;transform:translate(-50%);width:min(48%,440px);height:14px;pointer-events:none}#charge.hidden{display:none}#charge .wave{position:absolute;inset:0;overflow:hidden;border-radius:var(--shape-full)}#charge .wave svg{display:block;animation:wave-slide .6s linear infinite}@keyframes wave-slide{to{transform:translate(-12px)}}#charge .wave path{fill:none;stroke-width:4;stroke-linecap:round}#charge .track path{stroke:var(--md-outline-variant)}#charge .fill{width:0%;color:var(--md-primary);transition:width 80ms linear}#charge .fill path{stroke:currentColor}#roll-fab{position:absolute;right:18px;bottom:18px;width:60px;height:60px;display:grid;place-items:center;overflow:hidden;border:none;border-radius:var(--shape-lg);color:var(--md-on-primary-container);background:var(--md-primary-container);cursor:pointer;box-shadow:0 6px 20px #00000073;touch-action:none;user-select:none;-webkit-user-select:none;transition:border-radius var(--spring-default),transform var(--spring-fast)}#roll-fab:hover{border-radius:30px}#roll-fab:active{border-radius:var(--shape-md);transform:scale(.9) rotate(-10deg)}#sidebar-toggle{position:absolute;top:12px;right:14px;display:none;width:44px;height:44px;font-size:20px;color:var(--md-on-surface);background:color-mix(in srgb,var(--md-surface-container-high) 82%,transparent);border:1px solid var(--md-outline-variant);border-radius:var(--shape-md);cursor:pointer;backdrop-filter:blur(8px);transition:border-radius var(--spring-default)}#sidebar-toggle:hover{border-radius:var(--shape-full)}#sidebar{display:flex;flex-direction:column;width:340px;flex-shrink:0;background:var(--md-surface-container-low);border-left:1px solid var(--md-outline-variant);overflow-y:auto;padding:18px 16px;scrollbar-width:thin;scrollbar-color:var(--md-outline-variant) transparent}.sb-header{display:flex;align-items:center;gap:14px;padding-bottom:16px;margin-bottom:6px}.sb-logo{display:grid;place-items:center;width:54px;height:54px;font-size:26px;background:var(--md-primary-container);border-radius:58% 42% 55% 45%/50% 58% 42% 50%;animation:blob-morph 9s ease-in-out infinite}@keyframes blob-morph{0%,to{border-radius:58% 42% 55% 45%/50% 58% 42% 50%}33%{border-radius:45% 55% 48% 52%/60% 42% 58% 40%}66%{border-radius:52% 48% 60% 40%/45% 55%}}.sb-header h1{margin:0;font-size:22px;font-weight:650;letter-spacing:-.01em}.sb-sub{margin:0;font-size:12px;color:var(--md-on-surface-variant)}.sb-section{padding:10px 0}.sect-label{margin:0 0 8px 6px;font-size:14px;font-weight:600;color:var(--md-primary)}.sb-spacer{flex:1}.btn{display:flex;align-items:center;justify-content:center;width:100%;padding:12px 0;font-size:14px;font-weight:550;border:none;border-radius:var(--shape-full);cursor:pointer;transition:border-radius var(--spring-default),transform var(--spring-fast),font-weight var(--eff-default)}.btn:disabled{opacity:.38;cursor:default}.btn:active:not(:disabled){border-radius:var(--shape-lg);transform:scale(.98)}.btn.filled{color:var(--md-on-primary);background:var(--md-primary)}.btn.filled.xl{padding:17px 0;font-size:16px;font-weight:650}.btn.filled:hover:not(:disabled){font-weight:700}.btn.tonal{margin-top:8px;color:var(--md-on-secondary-container);background:var(--md-secondary-container)}.kbd{font-size:11px;font-weight:600;padding:2px 8px;margin-left:8px;background:#00000038;border-radius:6px}.sb-tip{margin:10px 0 0;font-size:12px;text-align:center;color:var(--md-on-surface-variant)}.group{display:flex;flex-direction:column;gap:3px}.group>*{border-radius:6px;background:var(--md-surface-container-high);transition:border-radius var(--spring-default)}.group>:first-child{border-radius:20px 20px 6px 6px}.group>:last-child{border-radius:6px 6px 20px 20px}.group>:only-child{border-radius:20px}.set-row{display:flex;align-items:center;gap:8px;padding:9px 10px;animation:row-pop var(--spring-fast) backwards}@keyframes row-pop{0%{opacity:0;transform:scale(.92) translateY(-6px)}}.select-wrap{position:relative;flex:1}.select-wrap:after{content:"▾";position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:12px;color:var(--md-on-surface-variant);pointer-events:none}.set-type{width:100%;appearance:none;-webkit-appearance:none;padding:10px 28px 10px 14px;font-size:14px;font-weight:600;font-family:inherit;color:var(--md-on-surface);background:var(--md-surface-container-highest);border:1px solid transparent;border-radius:var(--shape-md);cursor:pointer;transition:border-color var(--eff-fast)}.set-type:hover,.set-type:focus-visible{border-color:var(--md-primary);outline:none}.stepper{display:flex;align-items:center;gap:2px;background:var(--md-surface-container-highest);border-radius:var(--shape-full);padding:2px}.step{width:30px;height:30px;display:grid;place-items:center;font-size:16px;font-weight:700;color:var(--md-on-surface);background:transparent;border:none;border-radius:var(--shape-full);cursor:pointer;transition:border-radius var(--spring-fast)}.step:active:not(:disabled){border-radius:var(--shape-sm)}.step:disabled{opacity:.3;cursor:default}.cnt{min-width:22px;text-align:center;font-size:14px;font-weight:700;font-variant-numeric:tabular-nums}.icon-btn{width:32px;height:32px;display:grid;place-items:center;font-size:13px;color:var(--md-on-surface-variant);background:transparent;border:none;border-radius:var(--shape-full);cursor:pointer}.icon-btn:disabled{opacity:.3;cursor:default}.btn-group{display:flex;gap:3px}.btn-group button{flex:1;padding:12px 0;font-size:13px;font-weight:550;color:var(--md-on-surface);background:var(--md-surface-container-high);border:none;border-radius:var(--shape-sm);cursor:pointer;transition:border-radius var(--spring-default),background var(--eff-default),color var(--eff-default),font-weight var(--eff-default)}.btn-group button:first-child{border-radius:var(--shape-full) var(--shape-sm) var(--shape-sm) var(--shape-full)}.btn-group button:last-child{border-radius:var(--shape-sm) var(--shape-full) var(--shape-full) var(--shape-sm)}.btn-group button.active{border-radius:var(--shape-full);background:var(--md-primary);color:var(--md-on-primary);font-weight:700}.seg-check{display:inline-block;max-width:0;overflow:hidden;vertical-align:-1px;transition:max-width var(--spring-default),margin var(--spring-default)}.btn-group button.active .seg-check{max-width:16px;margin-right:5px}.swatches{display:grid;grid-template-columns:repeat(9,1fr);gap:7px}.swatch{position:relative;aspect-ratio:1;border-radius:var(--shape-md);border:2px solid transparent;outline:1px solid var(--md-outline-variant);cursor:pointer;transition:border-radius var(--spring-default),transform var(--spring-fast),border-color var(--eff-fast)}.swatch:hover{transform:scale(1.12);border-radius:var(--shape-full)}.swatch.active{border-color:var(--md-primary);border-radius:var(--shape-full)}.swatch.custom{display:flex;align-items:center;justify-content:center;background:var(--md-surface-container-highest);color:var(--md-on-surface-variant);font-weight:700;font-size:13px}.swatch.custom input{position:absolute;inset:0;opacity:0;cursor:pointer}.env-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.env-card{position:relative;display:flex;flex-direction:column;gap:8px;padding:8px;text-align:left;color:var(--md-on-surface);background:var(--md-surface-container-high);border:2px solid transparent;border-radius:var(--shape-lg);cursor:pointer;transition:border-color var(--eff-fast),border-radius var(--spring-default),transform var(--spring-fast)}.env-card:hover{border-radius:var(--shape-xl);transform:translateY(-2px)}.env-card.active{border-color:var(--md-primary)}.env-hero{display:block;height:48px;border-radius:var(--shape-md);transition:border-radius var(--spring-default)}.env-card:hover .env-hero,.env-card.active .env-hero{border-radius:var(--shape-lg)}.env-name{font-size:12.5px;font-weight:550;padding:0 2px 2px}.env-badge{position:absolute;top:12px;right:12px;width:22px;height:22px;display:grid;place-items:center;font-size:12px;font-weight:700;color:var(--md-on-primary);background:var(--md-primary);border-radius:var(--shape-full);opacity:0;transform:scale(.4);transition:opacity var(--eff-fast),transform var(--spring-fast)}.env-card.active .env-badge{opacity:1;transform:scale(1)}@media(max-width:860px){#sidebar{position:fixed;top:0;right:0;height:100dvh;width:min(360px,90vw);transform:translate(100%);transition:transform var(--spring-default);z-index:20;border-radius:var(--shape-lg) 0 0 var(--shape-lg);border-left:none;box-shadow:-14px 0 44px #0000008c}#sidebar.open{transform:translate(0)}#sidebar-toggle{display:block;z-index:30}}
