.mdc-topbar{display:flex;align-items:center;justify-content:center;gap:clamp(24px,8vw,96px);flex-wrap:wrap;margin-bottom:24px;}
.mdc-controls{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap;}
.mdc-mode-knob{position:relative;width:9rem;height:9rem;border:0;border-radius:50%;background:linear-gradient(#dad6d1,#f0efed);box-shadow:0 2px 6px rgba(0,0,0,.1);cursor:pointer;}
.mdc-mode-knob:focus-visible{outline:3px solid rgba(6,177,69,.45);outline-offset:4px;}
.mdc-mode-knob-inner{position:absolute;inset:.5rem;border-radius:50%;background:linear-gradient(90deg,#e6e3de,#b3afab 40%,#ccc8c3 41%,#ccc8c3 59%,#f0efed 60%,#dad6d1 75%);box-shadow:inset 0 1px 1px 1px #ccc8c3,0 0 1px 1px #959292;transition:transform .35s cubic-bezier(.2,.9,.4,1.1);}
.mdc-mode-knob-inner::before{content:"";display:block;width:.25rem;height:1.5rem;margin:0 auto;background:#06b145;box-shadow:0 0 1px 1px rgba(255,255,255,.2),inset 0 0 1px rgba(0,0,0,.5);border-radius:0 0 .25rem .25rem;opacity:.85;}
.mdc-mode-knob-inner.state-left{transform:rotate(-60deg);}
.mdc-mode-knob-inner.state-right{transform:rotate(60deg);}
.mdc-mode-label{position:absolute;top:.35rem;width:clamp(5.5rem,18vw,9rem);font-size:.85rem;font-weight:700;line-height:1.1;color:#2b2f36;white-space:normal;overflow-wrap:anywhere;text-shadow:2px 2px 0 #fff;z-index:2;}
.mdc-mode-label.mode-left{right:calc(100% + .45rem);text-align:right;}
.mdc-mode-label.mode-right{left:calc(100% + .45rem);text-align:left;}
.mdc-panel{margin-top:18px;}
.mdc-lcd-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:16px;}
.mdc-lcd-card{padding:16px;border:1px solid rgba(148,181,79,.35);border-radius:12px;background:linear-gradient(180deg,rgba(139,172,15,.16),rgba(48,98,48,.08));box-shadow:inset 0 0 18px rgba(15,56,15,.12);}
.mdc-lcd-label{display:block;font-family:'IBM Plex Mono',monospace;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#747276;margin-bottom:6px;}
.mdc-lcd-value{display:block;font-family:'Rajdhani',sans-serif;font-size:30px;line-height:1;font-weight:800;color:#525ca8;}
.mdc-lcd-value.is-running{color:#06b145;text-shadow:0 0 12px rgba(6,177,69,.35);}
.mdc-rhythm-track{position:relative;height:140px;background:#8bac0f;border:4px solid #306230;border-radius:6px;overflow:hidden;box-shadow:4px 4px 8px rgba(0,0,0,.3),inset 0 0 20px rgba(0,0,0,.2);}
.mdc-rhythm-track.active{box-shadow:4px 4px 8px rgba(0,0,0,.3),inset 0 0 20px rgba(0,0,0,.2),0 0 30px rgba(148,181,79,.5);}
.mdc-rhythm-track.glow{box-shadow:4px 4px 8px rgba(0,0,0,.3),inset 0 0 20px rgba(0,0,0,.2),0 0 40px rgba(148,181,79,.8),0 0 60px rgba(148,181,79,.4);transition:box-shadow .05s ease-out;}
.mdc-rhythm-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(0,0,0,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.1) 1px,transparent 1px);background-size:8px 8px;pointer-events:none;}
.mdc-rhythm-block{position:absolute;top:50%;transform:translateY(-50%);width:56px;height:56px;background:linear-gradient(145deg,#0f380f,#306230);border:3px solid #0f380f;border-radius:2px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 8px rgba(0,0,0,.4);transition:background .05s,border-color .05s,box-shadow .05s;}
.mdc-rhythm-block.hit{background:linear-gradient(145deg,#8bac0f,#9bbc0f);border-color:#8bac0f;box-shadow:0 0 20px rgba(139,172,15,.8);}
.mdc-rhythm-block span{font-family:'IBM Plex Mono',monospace;font-size:20px;font-weight:800;color:#9bbc0f;}
.mdc-rhythm-block.hit span{color:#0f380f;}
.mdc-target-zone{position:absolute;left:20%;top:0;width:60px;height:100%;pointer-events:none;}
.mdc-target-marker{width:100%;height:100%;border-left:4px dashed rgba(15,56,15,.6);border-right:4px dashed rgba(15,56,15,.6);background:rgba(15,56,15,.15);}
.mdc-hint{text-align:center;font-size:14px;color:#747276;font-family:'Rajdhani',sans-serif;font-weight:700;letter-spacing:.05em;margin:14px 0 0;}
.mdc-grid-scroll{overflow-x:auto;padding:4px 0 8px;}
.mdc-grid-container{display:flex;gap:clamp(10px,2.8vw,24px);justify-content:center;min-width:min-content;}
.mdc-capsule-unit{display:flex;flex-direction:column;align-items:center;width:clamp(56px,12vw,80px);min-width:56px;}
.mdc-arrow-wrap{width:100%;height:32px;display:flex;align-items:flex-end;justify-content:center;}
.mdc-grid-arrow{width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:16px solid #94b54f;filter:drop-shadow(0 2px 3px rgba(0,0,0,.5));animation:mdcArrowBounce .6s ease-in-out infinite;}
@keyframes mdcArrowBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
.mdc-mini-grid-screen{position:relative;width:100%;aspect-ratio:9/20;min-height:120px;overflow:visible;z-index:1;}
.mdc-grid-shell{position:relative;width:100%;height:100%;background:radial-gradient(circle at 22% 28%,rgba(190,210,118,.92),rgba(123,181,66,.9) 28%,rgba(55,94,46,.92) 64%,rgba(38,38,38,.96)),linear-gradient(145deg,#a8c45d,#708d3d);border:3px solid #3a3a3a;border-radius:6px;box-shadow:3px 3px 10px rgba(0,0,0,.35),inset 0 0 12px rgba(0,0,0,.28);overflow:hidden;transition:border-color .35s ease,box-shadow .35s ease;}
.mdc-grid-shell::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(38,38,38,.12) 0,rgba(38,38,38,.12) 1px,transparent 1px,transparent 4px),repeating-linear-gradient(90deg,rgba(55,94,46,.14) 0,rgba(55,94,46,.14) 1px,transparent 1px,transparent 4px);opacity:.95;pointer-events:none;z-index:0;}
.mdc-mini-grid-screen.idle .mdc-grid-shell,.mdc-mini-grid-screen.active .mdc-grid-shell,.mdc-mini-grid-screen.armed .mdc-grid-shell,.mdc-mini-grid-screen.pending .mdc-grid-shell{border-color:#141a14;box-shadow:2px 2px 8px rgba(0,0,0,.55),inset 0 0 12px rgba(0,0,0,.45);}
.mdc-grid-layer{position:absolute;left:0;width:100%;height:50%;opacity:1;transition:background .35s ease;z-index:1;background:radial-gradient(circle at 22% 28%,rgba(32,40,30,.95),rgba(24,30,22,.92) 42%,rgba(14,18,14,.96)),linear-gradient(145deg,#1b221b,#0f1310);}
.mdc-grid-layer.layer-1{top:0;}
.mdc-grid-layer.layer-2{top:50%;}
.mdc-grid-layer.cleared{background:transparent;}
.mdc-mini-grid-screen.completed.valid .mdc-grid-shell,.mdc-mini-grid-screen.valid .mdc-grid-shell{border-color:#708d3d;box-shadow:0 0 10px rgba(112,141,61,.35);}
.mdc-mini-grid-screen.completed.microFault .mdc-grid-shell,.mdc-mini-grid-screen.microFault .mdc-grid-shell{border-color:#c0392b;box-shadow:0 0 10px rgba(192,57,43,.35);}
.mdc-mini-grid-screen.completed.keyFault .mdc-grid-shell,.mdc-mini-grid-screen.keyFault .mdc-grid-shell{border-color:#e67e22;box-shadow:0 0 10px rgba(230,126,34,.35);}
.mdc-grid-number{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:'Rajdhani',sans-serif;font-size:12px;font-weight:800;color:rgba(255,255,255,.62);pointer-events:none;z-index:2;}
.mdc-instructions{margin-top:16px;padding:14px 16px;border-radius:12px;background:rgba(230,227,222,.38);border:1px solid rgba(204,200,195,.65);color:#747276;font-size:13px;display:grid;gap:6px;}
.mdc-instructions strong{color:#06b145;}
.mdc-result-card{margin-top:16px;padding:16px;border-radius:14px;background:linear-gradient(180deg,rgba(230,227,222,.5),rgba(255,255,255,.36));border:1px solid rgba(204,200,195,.75);box-shadow:0 12px 30px rgba(0,0,0,.08);}
.mdc-result-head{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#747276;font-family:'IBM Plex Mono',monospace;text-transform:uppercase;font-size:12px;letter-spacing:.12em;}
.mdc-result-card h3{margin:10px 0 6px;font-family:'Rajdhani',sans-serif;font-size:24px;line-height:1.1;color:#2b2f36;}
.mdc-result-card p{margin:0;color:#525054;}
.mdc-result-foot{margin-top:12px;font-family:'IBM Plex Mono',monospace;font-size:12px;color:#959292;}
.mdc-interval-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
.mdc-interval-item{display:flex;align-items:center;gap:6px;padding:6px 10px;background:rgba(230,227,222,.55);border:1px solid #ccc8c3;border-radius:6px;font-size:12px;font-family:'IBM Plex Mono',monospace;}
.mdc-interval-item span{color:#747276;font-weight:700;}
.mdc-interval-item strong{color:#525ca8;}
.mdc-interval-item.fast{background:rgba(171,47,121,.15);border-color:#ab2f79;}
.mdc-interval-item.fast strong{color:#ab2f79;}
[data-theme="dark"] .mdc-mode-label{color:#e6e3de;text-shadow:1px 1px 0 #141414;}
[data-theme="dark"] .mdc-lcd-card,[data-theme="dark"] .mdc-result-card,[data-theme="dark"] .mdc-instructions{background:rgba(20,24,20,.78);border-color:rgba(148,181,79,.24);}
[data-theme="dark"] .mdc-result-card h3{color:#e6e3de;}
[data-theme="dark"] .mdc-result-card p{color:#ccc8c3;}
@media(max-width:720px){.mdc-topbar{gap:28px}.mdc-mode-knob{width:7.5rem;height:7.5rem}.mdc-mode-label{top:.2rem;width:clamp(4.6rem,24vw,6.8rem);font-size:.72rem}.mdc-mode-label.mode-left{right:calc(100% + .25rem)}.mdc-mode-label.mode-right{left:calc(100% + .25rem)}.mdc-lcd-grid{grid-template-columns:1fr}.mdc-rhythm-track{height:100px}.mdc-rhythm-block{width:48px;height:48px}.mdc-rhythm-block span{font-size:16px}.mdc-grid-container{justify-content:flex-start}}
