:root{
 --e-ink:#17151F;--e-ink-2:#4A4858;--e-mute:#7A7889;
 --e-bg:#EEF0F4;--e-surface:#FFFFFF;--e-surface-2:#F6F7FA;--e-line:#DADDE4;--e-line-2:#C2C6D0;
 --e-lav:#A99FFC;--e-vio:#857EB6;--e-vio-2:#7F78C5;--e-graphite:#16151C;--e-graphite-2:#211F2A;
 --e-silver:#E7E9F0;--e-focus:#7F78C5;
 --e-sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
 --e-display:'Inter Tight','Inter',system-ui,sans-serif;
 --e-mono:'JetBrains Mono',ui-monospace,Consolas,monospace;
}

.big_beautiful_bar{position:relative;height:16px;border-radius:3px;background:#857EB6;overflow:hidden;
 box-shadow:inset 0 2px 3px rgba(30,24,70,.45),inset 0 -1px 0 rgba(255,255,255,.35),0 1px 0 rgba(255,255,255,.7),0 0 0 1px #E4E6EE,0 0 0 2px rgba(135,139,153,.55),0 0 7px 1px rgba(214,218,230,.85)}
.big_beautiful_bar .bbb-fill{position:absolute;inset:0 auto 0 0;width:0;border-radius:3px;background:linear-gradient(180deg,#C9C2FF 0%,#A99FFC 42%,#968BF0 100%);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.65),inset 0 -1px 0 rgba(70,60,160,.35);transition:width .35s cubic-bezier(.2,.8,.2,1),height .35s cubic-bezier(.2,.8,.2,1)}
.big_beautiful_bar{--fx:85.41%;--fy:38.20%;--glow:.35}
.big_beautiful_bar .bbb-flare{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;opacity:min(1, calc(.35 + .45 * var(--glow) + .4 * var(--flare,0)));filter:brightness(calc(.85 + .7 * var(--glow)));
 background:
  radial-gradient(circle at var(--fx) var(--fy), rgba(255,255,255,.98) 0, rgba(255,240,248,.9) calc(1.5px + 2.5px * var(--glow) + 3px * var(--flare,0)), rgba(255,182,214,.55) calc(4px + 8px * var(--glow) + 10px * var(--flare,0)), rgba(255,182,214,0) calc(10px + 16px * var(--glow) + 22px * var(--flare,0))),
  linear-gradient(90deg, rgba(255,200,226,0) 0%, rgba(255,214,234,calc(.15 + .3 * var(--glow) + .4 * var(--flare,0))) calc(var(--fx) - 18%), rgba(255,255,255,calc(.4 + .4 * var(--glow) + .4 * var(--flare,0))) var(--fx), rgba(255,214,234,calc(.15 + .3 * var(--glow) + .4 * var(--flare,0))) calc(var(--fx) + 9%), rgba(255,200,226,0) 100%) 0 var(--fy) / 100% 1.5px no-repeat,
  radial-gradient(circle at calc(108% - var(--fx)) calc(100% - var(--fy)), rgba(255,190,225,calc(.08 + .2 * var(--glow) + .25 * var(--flare,0))) 0, rgba(255,190,225,0) 7px),
  radial-gradient(circle at calc(var(--fx) - 30%) 70%, rgba(220,230,255,calc(.05 + .15 * var(--glow) + .2 * var(--flare,0))) 0, rgba(220,230,255,0) 5px)}
.big_beautiful_bar .bbb-rim{position:absolute;inset:0;border-radius:3px;pointer-events:none;padding:1.5px;
 background:radial-gradient(70px circle at var(--rx,-200px) var(--ry,-200px), rgba(255,255,255,.95), rgba(255,255,255,0) 70%),linear-gradient(180deg,rgba(255,255,255,.97) 0%,rgba(240,240,240,.9) 40%,rgba(220,220,220,.85) 100%);
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.big_beautiful_bar.is-v{width:16px;height:120px}
.big_beautiful_bar.is-v .bbb-fill{inset:auto 0 0 0;width:100%;height:0}
.big_beautiful_bar.is-off{filter:grayscale(1);opacity:.45}

.e-stage{display:flex;flex-direction:column;gap:6px}
.e-stage-head{display:flex;align-items:baseline;gap:10px;font:500 12.5px/1.2 var(--e-sans);color:var(--e-ink-2)}
.e-stage-name{color:var(--e-ink)}
.e-stage-time{margin-left:auto;font:400 11.5px/1 var(--e-mono);color:var(--e-mute);font-variant-numeric:tabular-nums}
.e-stage-steps{display:flex;justify-content:space-between;font:400 10.5px/1 var(--e-sans);color:var(--e-mute);letter-spacing:.02em}
.e-stage-steps span.is-on{color:var(--e-vio-2)}
.e-stage-steps span.is-done{color:var(--e-ink-2)}

.e-chip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:8px;border:1px solid var(--e-line);
 background:linear-gradient(180deg,#FFFFFF,#F1F2F6);color:var(--e-ink);font:500 12.5px/1 var(--e-sans);cursor:pointer;
 box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 1px 2px rgba(23,21,31,.06);transition:border-color .15s,background .15s}
.e-chip:hover{border-color:var(--e-lav)}
.e-chip:focus-visible,.e-btn:focus-visible,.e-icon-btn:focus-visible{outline:2px solid var(--e-focus);outline-offset:2px}
.e-chip .e-caret{width:8px;height:8px;opacity:.55}
.e-chip svg.e-tess{width:18px;height:18px}
.e-chip-eff{--eff:.5}
.e-chip-eff .e-tess-face{fill:rgba(169,159,252,calc(.12 + .5 * var(--eff)))}

.e-icon-btn{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:8px;border:1px solid transparent;background:none;color:var(--e-ink-2);cursor:pointer}
.e-icon-btn:hover{background:var(--e-surface-2);border-color:var(--e-line)}
.e-icon-btn svg{width:18px;height:18px}

.e-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border-radius:10px;border:1px solid transparent;
 font:600 14px/1 var(--e-sans);cursor:pointer;text-decoration:none;transition:filter .15s,background .15s,border-color .15s}
.e-btn-primary{color:#130F24;background:linear-gradient(180deg,#C9C2FF,#A99FFC 55%,#968BF0);border-color:#7F78C5;
 box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 6px 18px -6px rgba(127,120,197,.65)}
.e-btn-primary:hover{filter:brightness(1.05)}
.e-btn-ghost{color:inherit;background:transparent;border-color:currentColor}
.e-btn-ghost:hover{background:rgba(127,120,197,.12)}

.e-pop{position:fixed;z-index:80;min-width:260px;max-width:min(360px,calc(100vw - 32px));padding:14px;border-radius:12px;border:1px solid var(--e-line-2);
 background:linear-gradient(180deg,#FFFFFF,#F3F4F8);color:var(--e-ink);font:400 13px/1.45 var(--e-sans);
 box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 40px -12px rgba(23,21,31,.35),0 2px 6px rgba(23,21,31,.08)}
.e-pop-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}
.e-pop-name{font:600 13px/1 var(--e-sans)}
.e-pop-val{font:500 13px/1 var(--e-sans);color:var(--e-vio-2)}
.e-pop-foot{margin-top:10px;padding-top:9px;border-top:1px solid var(--e-line);font:400 11.5px/1.4 var(--e-sans);color:var(--e-mute);display:flex;justify-content:space-between;gap:10px}

.e-eff-track{position:relative;padding:4px 0}
.e-eff-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.e-eff-ticks{display:grid;grid-template-columns:repeat(var(--n,6),1fr);margin-top:8px;font:500 10.5px/1.1 var(--e-sans);color:var(--e-mute);text-align:center}
.e-eff-ticks span{cursor:pointer;padding:3px 0}
.e-eff-ticks span:first-child{text-align:left}
.e-eff-ticks span:last-child{text-align:right}
.e-eff-ticks span.is-on{color:var(--e-vio-2)}
.e-eff-desc{margin-top:10px;min-height:2.9em;color:var(--e-ink-2)}
.e-dots{display:inline-flex;gap:3px;vertical-align:middle}
.e-dots i{width:6px;height:6px;border-radius:50%;background:var(--e-line-2)}
.e-dots i.on{background:var(--e-vio-2)}

.e-model-opt{display:flex;gap:10px;align-items:flex-start;width:100%;padding:9px 10px;border-radius:9px;border:1px solid transparent;background:none;text-align:left;cursor:pointer;color:inherit;font:inherit}
.e-model-opt:hover{background:var(--e-surface-2);border-color:var(--e-line)}
.e-model-opt.is-on{border-color:var(--e-lav);background:rgba(169,159,252,.10)}
.e-model-opt b{display:block;font:600 13px/1.3 var(--e-sans)}
.e-model-opt span{display:block;color:var(--e-mute);font-size:12px}
.e-radio{flex:0 0 14px;height:14px;margin-top:2px;border-radius:50%;border:1.5px solid var(--e-line-2);background:#fff}
.e-model-opt.is-on .e-radio{border-color:var(--e-vio-2);box-shadow:inset 0 0 0 3px #fff;background:var(--e-vio-2)}

.e-eq{display:flex;gap:22px;align-items:flex-end;justify-content:center;padding:4px 0 2px}
.e-eq-band{display:flex;flex-direction:column;align-items:center;gap:7px;font:500 11px/1.2 var(--e-sans);color:var(--e-ink-2);touch-action:none}
.e-eq-band .big_beautiful_bar{cursor:ns-resize}
.e-eq-band.is-off{color:var(--e-mute)}
.e-eq-band.is-off .big_beautiful_bar{cursor:not-allowed}
.e-eq-val{font:500 11px/1 var(--e-mono);color:var(--e-vio-2)}
.e-eq-band.is-off .e-eq-val{color:var(--e-mute)}
.e-eq-note{margin-top:10px;font-size:11.5px;color:var(--e-mute);text-align:center}
.e-field{width:100%;height:32px;padding:0 10px;border-radius:8px;border:1px solid var(--e-line-2);background:#fff;font:400 12.5px/1 var(--e-sans);color:var(--e-ink)}
.e-field:focus{outline:2px solid var(--e-focus);outline-offset:0;border-color:transparent}
.e-label{display:block;margin:12px 0 6px;font:600 11px/1 var(--e-sans);letter-spacing:.04em;text-transform:uppercase;color:var(--e-mute)}

@media (prefers-reduced-motion:reduce){
 .big_beautiful_bar .bbb-fill{transition:none}
}