/* ── Reset + Design tokens ───────────────────────────────────────────────── */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#050810;--bg2:#0c1018;
  --ac:#00d4ff;--ac2:#7c3aed;
  --gn:#00ff88;--or:#ff8c42;--rd:#ff4757;--pu:#c084fc;
  --tx:#e2e8f0;--mu:#566880;--br:#192233;
  --surface:rgba(9,13,20,.85);--surface2:rgba(6,9,16,.96);
  --compiler-opacity:.32;
}
html,body{height:100vh;height:100dvh;overflow:hidden;overflow-x:hidden;background:var(--bg);color:var(--tx);font-family:'Outfit',sans-serif}
body{position:relative}
button,input{font:inherit}
button{background:none;border:none;cursor:pointer}

/* ── Compiler background ─────────────────────────────────────────────────── */
#compiler-bg{position:fixed;inset:0;z-index:0;pointer-events:none;display:block;padding:0;overflow:hidden;}
#compiler-shell{position:fixed;inset:0;width:100%;height:100%;height:100dvh;border:none;border-radius:0;background:transparent;box-shadow:none;overflow:hidden;opacity:var(--compiler-opacity);will-change:opacity;transform:none;}
#compiler-head{display:none;}
.comp-left,.comp-right{display:flex;align-items:center;gap:10px}
.comp-dots{display:flex;gap:6px}
.comp-dot{width:10px;height:10px;border-radius:50%}
.comp-dot.r{background:#ff5f56}.comp-dot.y{background:#ffbd2e}.comp-dot.g{background:#27c93f}
.comp-pill{padding:3px 8px;border:1px solid rgba(19,28,40,.95);border-radius:999px}
#compiler-title{color:rgba(0,212,255,.9)}
#compiler-stage{color:rgba(0,255,136,.72)}
#compiler-screen{height:100%;padding:28px 32px 28px 16px;overflow:hidden;white-space:pre;word-break:normal;scrollbar-width:none;font-family:'JetBrains Mono',monospace;font-size:15px;line-height:1.75;color:rgba(220,232,245,.9);min-width:0;max-width:100%;}
#compiler-screen::-webkit-scrollbar{display:none}
.comp-key{color:rgba(0,212,255,.95)}.comp-type{color:rgba(192,132,252,.92)}.comp-cmt{color:rgba(68,85,102,.95)}.comp-log{color:rgba(0,255,136,.82)}.comp-warn{color:rgba(255,140,66,.84)}
.comp-cur{display:inline-block;width:10px;height:1.15em;vertical-align:-.18em;background:rgba(0,212,255,.95);box-shadow:0 0 12px rgba(0,212,255,.5);animation:curblink 1s steps(1,end) infinite}
@keyframes curblink{50%{opacity:0}}

/* ── Vignette + particles ─────────────────────────────────────────────────── */
#vig{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse 60% 70% at 50% 50%,rgba(6,9,16,.92) 0%,rgba(6,9,16,.5) 45%,rgba(6,9,16,.06) 100%)}
#ptcv{position:fixed;inset:0;z-index:61;pointer-events:none}

/* ── Landing ─────────────────────────────────────────────────────────────── */
#land{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:rgba(5,8,16,.93);backdrop-filter:blur(16px);transition:opacity .6s ease,transform .6s ease;padding:20px;overflow-y:auto;-webkit-overflow-scrolling:touch;}
#land.gone{opacity:0;pointer-events:none;transform:scale(1.03)}
.land-step{display:none;flex-direction:column;align-items:center;width:min(600px,100%);animation:stepIn .4s ease}
.land-step.active{display:flex}
@keyframes stepIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}

/* Logo */
.land-logo-row{display:flex;align-items:center;gap:10px;margin-bottom:32px}
.land-logo-icon{font-size:22px;filter:drop-shadow(0 0 8px rgba(0,212,255,.55))}
.land-logo-txt{font-family:'Outfit',sans-serif;font-weight:700;font-size:19px;background:linear-gradient(90deg,var(--ac),var(--pu));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.06em}
.land-version{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--mu);border:1px solid var(--br);border-radius:4px;padding:2px 7px}

/* Tagline */
.land-tagline{font-family:'Outfit',sans-serif;font-size:48px;font-weight:300;text-align:center;line-height:1.12;margin-bottom:12px;letter-spacing:-.025em}
.land-tagline strong{font-weight:700;color:var(--ac);text-shadow:0 0 32px rgba(0,212,255,.22)}
.land-desc{font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--mu);text-align:center;line-height:1.85;margin-bottom:36px}

/* Mode grid — 2 col for 2 cards, 1 col on mobile */
.land-modes-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:min(480px,100%);margin-bottom:22px;margin-left:auto;margin-right:auto;}
.land-mode-card{padding:18px 16px;border:1px solid var(--br);border-radius:12px;background:rgba(9,13,20,.7);text-align:left;cursor:pointer;transition:all .22s;position:relative;display:flex;flex-direction:column;gap:6px;}
.land-mode-card:hover:not(:disabled){border-color:rgba(0,212,255,.3);background:rgba(0,212,255,.04);transform:translateY(-1px)}
.land-mode-card.active{border-color:var(--ac);background:rgba(0,212,255,.07);box-shadow:0 0 28px rgba(0,212,255,.1),inset 0 0 20px rgba(0,212,255,.03)}
.land-mode-card.soon-card{opacity:.35;cursor:default;pointer-events:none}
.land-mode-card.locked-card{opacity:.52;cursor:not-allowed;}
.land-mode-card.locked-card:hover{border-color:var(--br);background:rgba(9,13,20,.7);transform:none;box-shadow:none;}
.locked-badge{background:rgba(148,163,184,.06);color:rgba(148,163,184,.6);border:1px solid rgba(148,163,184,.18);}
.lmc-icon{font-size:22px;margin-bottom:3px}
.lmc-name{font-family:'Outfit',sans-serif;font-size:14px;font-weight:600;color:var(--tx)}
.lmc-desc{font-family:'JetBrains Mono',monospace;font-size:9.5px;color:var(--mu);line-height:1.55}
.lmc-badge{position:absolute;top:10px;right:10px;font-family:'JetBrains Mono',monospace;font-size:8px;padding:2px 7px;border-radius:20px}
.active-badge{background:rgba(0,212,255,.12);color:var(--ac);border:1px solid rgba(0,212,255,.25)}
.soon-badge{background:rgba(255,255,255,.04);color:var(--mu);border:1px solid var(--br)}

/* More modes note */
.land-more-modes{font-family:'JetBrains Mono',monospace;font-size:9.5px;color:var(--mu);text-align:center;margin-bottom:26px;letter-spacing:.04em;opacity:.42;}

/* Features row */
.land-features-row{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:36px}
.lf-item{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu);display:flex;align-items:center;gap:6px;padding:5px 12px;border:1px solid rgba(25,34,51,.85);border-radius:20px;background:rgba(9,13,20,.5)}
.lf-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0}

/* Next / back buttons */
.land-next-btn{padding:13px 44px;border:1px solid var(--ac);border-radius:10px;background:linear-gradient(135deg,rgba(0,212,255,.09),rgba(124,58,237,.07));color:var(--ac);font-family:'Outfit',sans-serif;font-size:14px;font-weight:600;letter-spacing:.05em;cursor:pointer;transition:all .25s;margin-bottom:16px;}
.land-next-btn:hover{background:linear-gradient(135deg,rgba(0,212,255,.16),rgba(124,58,237,.12));box-shadow:0 0 36px rgba(0,212,255,.15),0 4px 20px rgba(0,212,255,.08)}
.land-back-btn{align-self:flex-start;font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--mu);padding:4px 0;margin-bottom:16px;cursor:pointer;background:none;border:none;transition:color .2s}
.land-back-btn:hover{color:var(--tx)}
.land-step2-mode{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ac);letter-spacing:.1em;margin-bottom:20px;border:1px solid rgba(0,212,255,.2);padding:4px 16px;border-radius:20px;background:rgba(0,212,255,.04)}

/* Duration picker */
.land-dur-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;width:100%;margin-bottom:14px}
.land-dur-btn{padding:18px 8px;border:1px solid var(--br);border-radius:10px;background:transparent;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;align-items:center;gap:3px;}
.land-dur-btn:hover{border-color:rgba(124,58,237,.4);background:rgba(124,58,237,.04)}
.land-dur-btn.on{border-color:rgba(124,58,237,.7);background:linear-gradient(135deg,rgba(124,58,237,.13),rgba(124,58,237,.05));box-shadow:0 0 20px rgba(124,58,237,.12)}
.land-dur-btn:focus{outline:none}
.ldb-min{font-family:'Outfit',sans-serif;font-size:28px;font-weight:600;color:var(--tx);line-height:1}
.ldb-unit{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--mu)}
.ldb-break{font-family:'JetBrains Mono',monospace;font-size:8.5px;color:rgba(0,255,136,.45);margin-top:3px}
.land-dur-btn.on .ldb-min{color:var(--pu)}
.land-dur-btn.on .ldb-break{color:var(--gn)}

/* Custom duration */
.land-custom-row{display:flex;gap:7px;margin-bottom:18px}
#land-custom-input{padding:8px 14px;border:1px solid var(--br);border-radius:7px;background:rgba(9,13,20,.6);color:var(--tx);font-family:'JetBrains Mono',monospace;font-size:11px;width:120px;outline:none;transition:border-color .2s,box-shadow .2s;text-align:center;}
#land-custom-input:focus{border-color:var(--pu);box-shadow:0 0 14px rgba(124,58,237,.1)}
#land-custom-input::placeholder{color:var(--mu)}
#land-custom-btn{padding:8px 16px;border:1px solid var(--br);border-radius:7px;color:var(--mu);font-family:'JetBrains Mono',monospace;font-size:10.5px;cursor:pointer;transition:all .2s;}
#land-custom-btn:hover{border-color:var(--pu);color:var(--pu)}

/* Sets row */
.land-sets-row{display:flex;align-items:center;gap:10px;margin-bottom:20px}
.land-sets-label{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu);white-space:nowrap}
.land-sets-btns{display:flex;gap:6px}
.lsb{padding:5px 13px;border:1px solid var(--br);border-radius:6px;color:var(--mu);font-family:'JetBrains Mono',monospace;font-size:10.5px;cursor:pointer;transition:all .2s}
.lsb:hover{border-color:rgba(0,255,136,.3);color:rgba(0,255,136,.7)}
.lsb.on{border-color:rgba(0,255,136,.55);color:var(--gn);background:rgba(0,255,136,.07);box-shadow:0 0 12px rgba(0,255,136,.08)}

/* Sound toggle */
.land-sound-row{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.land-stog{width:30px;height:16px;border-radius:8px;background:var(--br);position:relative;transition:background .3s;border:none;cursor:pointer;flex-shrink:0}
.land-stog.on{background:rgba(0,212,255,.45)}
.land-stog::after{content:'';position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:var(--mu);transition:all .3s}
.land-stog.on::after{left:16px;background:var(--ac)}
#land-sound-lbl{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu)}

/* Hard mode toggle */
.land-hard-row{display:flex;align-items:center;gap:10px;margin-bottom:20px}
.land-hard-tog{width:30px;height:16px;border-radius:8px;background:var(--br);position:relative;transition:background .3s;border:none;cursor:pointer;flex-shrink:0}
.land-hard-tog.on{background:rgba(255,71,87,.45)}
.land-hard-tog::after{content:'';position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:var(--mu);transition:all .3s}
.land-hard-tog.on::after{left:16px;background:var(--rd)}
#land-hard-lbl{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu)}
.land-hard-reward{margin-top:.35rem;font-size:.82rem;font-weight:700;letter-spacing:.03em;color:rgba(248,113,113,.95);text-shadow:0 0 16px rgba(248,113,113,.22);font-family:'JetBrains Mono',monospace}

/* Goal input */
.land-goal-row{width:100%;margin-bottom:20px}
#land-goal-input{width:100%;padding:13px 18px;border:1px solid var(--br);border-radius:10px;background:rgba(9,13,20,.7);color:var(--tx);font-family:'JetBrains Mono',monospace;font-size:11.5px;outline:none;transition:border-color .2s,box-shadow .2s;}
#land-goal-input:focus{border-color:var(--ac);box-shadow:0 0 20px rgba(0,212,255,.08)}
#land-goal-input::placeholder{color:var(--mu);font-style:italic}

/* Start button */
.land-start-btn{width:100%;padding:16px;border:1px solid var(--gn);border-radius:10px;background:rgba(0,255,136,.07);color:var(--gn);font-family:'Outfit',sans-serif;font-size:15px;font-weight:600;letter-spacing:.05em;cursor:pointer;transition:all .25s;}
.land-start-btn:hover{background:rgba(0,255,136,.12);box-shadow:0 0 40px rgba(0,255,136,.14),0 4px 24px rgba(0,255,136,.08);transform:translateY(-1px)}

/* Legacy landing classes (kept for compat) */
.land-badge{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--gn);letter-spacing:.3em;text-transform:uppercase;border:1px solid rgba(0,255,136,.25);border-radius:20px;padding:5px 16px;margin-bottom:36px;animation:badge-pulse 3s ease-in-out infinite}
@keyframes badge-pulse{0%,100%{box-shadow:0 0 0 rgba(0,255,136,0)}50%{box-shadow:0 0 16px rgba(0,255,136,.15)}}
.land-h1{font-size:64px;font-weight:300;text-align:center;line-height:1.1;margin-bottom:20px;letter-spacing:-.025em}.land-h1 strong{font-weight:700;color:var(--ac)}
.land-sub{font-family:'JetBrains Mono',monospace;font-size:12.5px;color:var(--mu);text-align:center;line-height:1.9;margin-bottom:48px}.land-sub b{color:rgba(0,212,255,.55)}
.land-feats{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:48px}.feat{display:flex;align-items:center;gap:7px;padding:6px 14px;border:1px solid var(--br);border-radius:20px;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu)}
.feat i{width:5px;height:5px;border-radius:50%;flex-shrink:0}.f1 i{background:var(--ac);box-shadow:0 0 6px var(--ac)}.f2 i{background:var(--gn);box-shadow:0 0 6px var(--gn)}.f3 i{background:var(--pu);box-shadow:0 0 6px var(--pu)}.f4 i{background:var(--or);box-shadow:0 0 6px var(--or)}.f5 i{background:var(--rd);box-shadow:0 0 6px var(--rd)}
.land-ctas{display:flex;gap:12px;margin-bottom:52px}.land-btn{padding:13px 36px;border-radius:9px;border:1px solid;font-size:14px;font-weight:600;letter-spacing:.04em;transition:all .25s}.land-btn.pr{border-color:var(--ac);color:var(--ac);background:rgba(0,212,255,.06)}.land-btn.pr:hover{background:rgba(0,212,255,.13);box-shadow:0 0 28px rgba(0,212,255,.15)}.land-btn.gh{border-color:var(--br);color:var(--mu)}.land-btn.gh:hover{border-color:var(--mu);color:var(--tx)}
.land-modes{display:flex;gap:8px}.lm{padding:5px 14px;border:1px solid var(--br);border-radius:5px;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu)}.lm.on{border-color:var(--ac);color:var(--ac)}.lm.soon{opacity:.3}
.land-pricing{font-family:'JetBrains Mono',monospace;font-size:9.5px;color:var(--mu);text-align:center}

/* ── Top bar ──────────────────────────────────────────────────────────────── */
#bar{position:fixed;top:0;left:0;right:0;height:48px;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:0 22px;border-bottom:1px solid rgba(148,163,184,.14);background:linear-gradient(180deg,rgba(8,13,26,.98),rgba(4,7,16,.96));backdrop-filter:blur(18px);font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--mu);box-shadow:0 8px 30px rgba(0,0,0,.28),inset 0 -1px 0 rgba(0,212,255,.05)}
.bl{display:flex;align-items:center;gap:12px}
.logo{display:flex;align-items:center;gap:8px;font-weight:800;font-size:14px;color:var(--ac);letter-spacing:.08em;text-shadow:0 0 18px rgba(0,212,255,.25)}
.logo i{width:8px;height:8px;background:var(--ac);border-radius:50%;box-shadow:0 0 10px var(--ac),0 0 24px rgba(0,212,255,.45)}
.pill{padding:4px 10px;border:1px solid rgba(148,163,184,.16);border-radius:999px;font-size:10px;color:rgba(180,196,216,.82);background:rgba(15,23,42,.45);transition:all .25s ease}
.pill.on{border-color:rgba(0,212,255,.42);color:var(--ac);background:rgba(0,212,255,.07);box-shadow:0 0 18px rgba(0,212,255,.08)}
.pill.brk{border-color:rgba(0,255,136,.42);color:var(--gn);background:rgba(0,255,136,.06)}
#dot{width:6px;height:6px;border-radius:50%;background:var(--gn);box-shadow:0 0 8px var(--gn),0 0 18px rgba(0,255,136,.35);animation:blink 2.5s ease-in-out infinite;transition:all .4s}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.22}}
#bst{color:rgba(203,213,225,.78);font-size:10px;letter-spacing:.08em;text-transform:uppercase}
#bclk{font-size:9px;padding:1px 7px;color:rgba(180,196,216,.65)}

/* XP bar */
#xps{position:fixed;top:48px;left:0;right:0;height:3px;background:rgba(25,34,51,.55);z-index:30}
#xpf{height:100%;background:linear-gradient(90deg,var(--ac2),var(--pu),var(--ac));transition:width .8s ease;box-shadow:0 0 12px rgba(0,212,255,.5),0 0 4px rgba(0,212,255,.8)}

/* Hard mode indicator */
#hard-indicator{position:fixed;top:51px;left:50%;transform:translateX(-50%);z-index:31;font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--rd);letter-spacing:.18em;text-transform:uppercase;padding:2px 12px;border:1px solid rgba(255,71,87,.28);border-radius:4px;background:rgba(255,71,87,.07);display:none;}
#hard-indicator.show{display:block}

/* Bar buttons */
#compact-btn{font-size:10px;padding:2px 8px;border:1px solid var(--br);border-radius:4px;color:var(--mu);transition:all .2s;cursor:pointer}
#compact-btn:hover{border-color:rgba(0,212,255,.35);color:var(--ac)}
#compact-btn.on{border-color:var(--ac);color:var(--ac)}
#stats-btn{font-size:10px;padding:2px 8px;border:1px solid var(--br);border-radius:4px;color:var(--mu);transition:all .2s;cursor:pointer}
#stats-btn:hover{border-color:rgba(0,212,255,.35);color:var(--ac)}

/* ── Legacy hidden elements ───────────────────────────────────────────────── */
#stats{position:fixed;top:52px;right:20px;z-index:15;font-family:'JetBrains Mono',monospace;font-size:9.5px;color:var(--mu);text-align:right;line-height:2.2;display:none}
#streak-box{position:fixed;top:52px;left:20px;z-index:15;display:none}
.sdots{display:flex;gap:5px;margin-bottom:5px}
.sdot{width:10px;height:10px;border-radius:2px;border:1px solid var(--br);transition:all .5s}
.sdot.done{background:var(--ac);border-color:var(--ac);box-shadow:0 0 5px rgba(0,212,255,.45)}
.sdot.now{background:var(--gn);border-color:var(--gn);animation:snow .9s ease-in-out infinite alternate}
@keyframes snow{from{box-shadow:0 0 4px rgba(0,255,136,.4)}to{box-shadow:0 0 12px rgba(0,255,136,.9)}}
.slbl{font-family:'JetBrains Mono',monospace;font-size:9.5px;color:var(--mu)}

/* ── Settings panel ───────────────────────────────────────────────────────── */
#settings{position:fixed;top:51px;right:0;width:280px;height:calc(100vh - 51px);z-index:40;padding:24px 20px;display:none;flex-direction:column;gap:20px;background:rgba(5,8,16,.99);border-left:1px solid rgba(25,34,51,.9);backdrop-filter:blur(16px);overflow-y:auto}
#settings.open{display:flex}
.set-title{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--mu);letter-spacing:.22em;text-transform:uppercase;margin-bottom:6px;padding-bottom:8px;border-bottom:1px solid rgba(25,34,51,.8)}
.set-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 0}
.set-label{font-family:'Outfit',sans-serif;font-size:11px;font-weight:500;color:var(--tx)}
.set-sub{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--mu);margin-top:2px}
.tog{width:32px;height:17px;border-radius:9px;background:var(--br);position:relative;transition:background .3s;flex-shrink:0}
.tog.on{background:rgba(0,212,255,.45)}
.tog::after{content:'';position:absolute;top:2px;left:2px;width:13px;height:13px;border-radius:50%;background:var(--mu);transition:all .3s}
.tog.on::after{left:17px;background:var(--ac)}
.set-divider{height:1px;background:rgba(25,34,51,.8)}
.set-stat{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu);display:flex;justify-content:space-between;padding:4px 0}
.set-stat span{color:var(--tx)}
.set-reset{width:100%;padding:9px;border:1px solid rgba(255,71,87,.22);border-radius:7px;color:rgba(255,71,87,.65);font-family:'JetBrains Mono',monospace;font-size:10px;transition:all .2s}
.set-reset:hover{border-color:var(--rd);color:var(--rd);background:rgba(255,71,87,.05)}

/* Session history */
#session-history{display:flex;flex-direction:column;gap:5px;margin-top:6px;max-height:180px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(0,212,255,.14) transparent}
.hist-item{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:6px 9px;border-radius:5px;background:rgba(9,13,20,.65);border:1px solid rgba(25,34,51,.7);font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--mu);}
.hist-item .hi-goal{color:var(--tx);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hist-item .hi-dur{color:var(--ac)}
.hist-item .hi-date{font-size:8px}

/* ── Main app ─────────────────────────────────────────────────────────────── */
#app{position:relative;z-index:10;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:51px}
#modes{display:flex;gap:6px;margin-bottom:44px}
.mb{padding:5px 14px;border:1px solid var(--br);border-radius:5px;color:var(--mu);font-family:'JetBrains Mono',monospace;font-size:10.5px;transition:all .2s}
.mb:hover{border-color:rgba(0,212,255,.35);color:rgba(0,212,255,.75)}
.mb.on{border-color:var(--ac);color:var(--ac);background:rgba(0,212,255,.07);box-shadow:0 0 14px rgba(0,212,255,.07)}
.mb.lk{opacity:.28;cursor:default}

/* Ring timer */
#tz{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:300px;height:300px;margin-bottom:36px}
#tz::before{content:'';position:absolute;inset:-54px;z-index:0;pointer-events:none;background:radial-gradient(circle at 50% 50%,rgba(0,212,255,.16),rgba(124,58,237,.08) 36%,transparent 68%);filter:blur(18px);opacity:.58;transition:opacity .6s ease,transform .6s ease}
#tz>*{position:relative;z-index:1}
#rsvg{position:absolute;inset:0;transform:rotate(-90deg);overflow:visible}
#rbg{fill:none;stroke:#0a111c;stroke-width:3}
#rglow{fill:none;stroke:rgba(0,212,255,.05);stroke-width:22;stroke-linecap:round}
#rprog{fill:none;stroke:var(--ac);stroke-width:3;stroke-linecap:round;stroke-dasharray:880;stroke-dashoffset:880;transition:stroke-dashoffset 1s linear;filter:drop-shadow(0 0 8px rgba(0,212,255,.9)) drop-shadow(0 0 16px rgba(0,212,255,.3))}
#rprog.brk{stroke:var(--gn);filter:drop-shadow(0 0 8px rgba(0,255,136,.9)) drop-shadow(0 0 16px rgba(0,255,136,.3))}

/* Timer info */
#ti{display:flex;flex-direction:column;align-items:center;gap:8px;position:relative;z-index:2}
#tlbl{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.35em;color:rgba(120,145,170,.8);text-transform:uppercase}
#goal-display{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--ac);letter-spacing:.1em;max-width:240px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:0;transition:opacity .4s;margin-top:2px;}
#goal-display.show{opacity:1}
#tdsp{font-family:'JetBrains Mono',monospace;font-size:clamp(72px,7.2vw,92px);font-weight:500;color:var(--tx);letter-spacing:-.075em;line-height:.95;font-variant-numeric:tabular-nums;text-shadow:0 0 28px rgba(255,255,255,.05),0 0 70px rgba(0,212,255,.06);transition:color .5s,text-shadow .5s,transform .45s ease}
#tdsp.fc{color:#fff;text-shadow:0 0 40px rgba(0,212,255,.28),0 0 86px rgba(0,212,255,.10);animation:activeTimerPulse 2.8s ease-in-out infinite}
#tdsp.br{color:var(--gn);text-shadow:0 0 40px rgba(0,255,136,.30),0 0 80px rgba(0,255,136,.12)}
@keyframes activeTimerPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.012)}}
#tpct{font-family:'JetBrains Mono',monospace;font-size:10px;color:rgba(120,145,170,.75);min-height:16px}
#distraction-counter{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--rd);text-align:center;opacity:0;transition:opacity .3s;margin-top:2px;}
#distraction-counter.show{opacity:1}

/* Under-timer */
#under-timer{display:flex;flex-direction:column;align-items:center;gap:10px;width:min(360px,82vw);margin-bottom:20px;opacity:0;transition:opacity .5s}
body.session-started #under-timer{opacity:1}
#linear-prog-wrap{width:100%;height:4px;background:rgba(25,34,51,.8);border-radius:999px;overflow:hidden}
#linear-prog-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--ac2),var(--pu),var(--ac));border-radius:999px;transition:width .8s linear;box-shadow:0 0 10px rgba(0,212,255,.6),0 0 20px rgba(0,212,255,.2)}
#under-stats{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;font-family:'JetBrains Mono',monospace;font-size:10px;color:rgba(203,213,225,.86);line-height:1.6;}
#under-stats span:not(:nth-child(2)):not(:nth-child(4)){padding:3px 8px;border:1px solid rgba(148,163,184,.13);border-radius:999px;background:rgba(15,23,42,.35);}
#under-stats span:nth-child(2),#under-stats span:nth-child(4){color:rgba(148,163,184,.35);}
#under-streak{display:flex;gap:5px;margin-top:2px;min-height:10px}

/* Legacy duration/sets pickers (hidden) */
#dur{display:flex;gap:6px;margin-bottom:20px}
.db{padding:5px 14px;border:1px solid var(--br);border-radius:5px;color:var(--mu);font-family:'JetBrains Mono',monospace;font-size:10.5px;transition:all .2s}
.db:hover{border-color:var(--mu);color:var(--tx)}
.db.on{border-color:rgba(124,58,237,.7);color:var(--pu);background:rgba(124,58,237,.07)}
#custom-dur-wrap{display:flex;align-items:center;gap:6px;margin-top:6px}
#custom-dur-input{width:60px;padding:4px 8px;border:1px solid var(--br);border-radius:5px;background:transparent;color:var(--tx);font-family:'JetBrains Mono',monospace;font-size:10px;text-align:center;outline:none;transition:border-color .2s;}
#custom-dur-input:focus{border-color:var(--pu)}
#custom-dur-input::placeholder{color:var(--mu)}
#custom-dur-btn{padding:4px 10px;border:1px solid var(--br);border-radius:5px;color:var(--mu);font-family:'JetBrains Mono',monospace;font-size:10px;transition:all .2s;}
#custom-dur-btn:hover{border-color:var(--pu);color:var(--pu)}
#sets-wrap{display:flex;align-items:center;gap:6px;margin-top:6px}
#sets-label{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu);margin-right:2px}
.sb{padding:4px 11px;border:1px solid var(--br);border-radius:5px;color:var(--mu);font-family:'JetBrains Mono',monospace;font-size:10px;transition:all .2s}
.sb:hover{border-color:var(--mu);color:var(--tx)}
.sb.on{border-color:rgba(0,255,136,.5);color:var(--gn);background:rgba(0,255,136,.06)}
#set-indicator{font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--gn);letter-spacing:.1em;margin-top:4px;display:none;text-align:center;}

/* Controls */
#ctrls{display:flex;gap:12px;margin-bottom:16px}
.cb{padding:10px 28px;border:1px solid var(--br);border-radius:9px;color:var(--mu);font-size:13px;font-weight:500;letter-spacing:.04em;transition:all .22s}
.cb:hover{border-color:rgba(180,196,216,.4);color:var(--tx);background:rgba(255,255,255,.02);transform:translateY(-1px)}
.cb.s{position:relative;overflow:hidden;border-color:var(--ac);color:var(--ac);background:linear-gradient(135deg,rgba(0,212,255,.08),rgba(124,58,237,.05))}
.cb.s::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at center,rgba(0,212,255,.22),transparent 58%);opacity:0;transform:scale(.4);transition:opacity .28s ease,transform .28s ease;pointer-events:none}
.cb.s:active::after{opacity:1;transform:scale(1)}
.cb.s:hover{background:linear-gradient(135deg,rgba(0,212,255,.14),rgba(124,58,237,.09));box-shadow:0 0 28px rgba(0,212,255,.14),0 4px 16px rgba(0,212,255,.07);transform:translateY(-1px)}
.cb.p{border-color:var(--or);color:var(--or);background:rgba(255,140,66,.05)}

/* Sound toggle */
#srow{display:flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;font-size:10.5px;color:rgba(120,145,170,.7)}
#stog{width:28px;height:15px;border-radius:8px;background:var(--br);position:relative;transition:background .3s;flex-shrink:0}
#stog.on{background:rgba(0,212,255,.4)}
#stog::after{content:'';position:absolute;top:2px;left:2px;width:11px;height:11px;border-radius:50%;background:var(--mu);transition:all .3s}
#stog.on::after{left:15px;background:var(--ac)}

/* Live logs */
#logs{position:fixed;bottom:28px;left:24px;display:flex;flex-direction:column;gap:5px;z-index:15;pointer-events:none}
.log{font-family:'JetBrains Mono',monospace;font-size:10.5px;padding:3px 0;opacity:0;transform:translateX(-10px);transition:all .35s ease;white-space:nowrap}
.log.in{opacity:1;transform:translateX(0)}
.log.out{opacity:0;transform:translateX(-10px)}
.ok{color:var(--gn)}.inf{color:var(--ac)}.wrn{color:var(--or)}.bld{color:var(--pu)}

/* RPG rank corner */
#rpg{position:fixed;bottom:28px;right:24px;text-align:right;z-index:15;padding-top:10px;border-top:1px solid rgba(25,34,51,.8)}
#rrlbl{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--mu);letter-spacing:.2em;text-transform:uppercase}
#rrname{font-size:15px;font-weight:600;color:var(--ac);margin:3px 0;text-shadow:0 0 16px rgba(0,212,255,.35);transition:all .4s}
#rxp{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu)}

/* ── Session complete / break overlay ────────────────────────────────────── */
#brkov{position:fixed;inset:0;z-index:60;display:none;flex-direction:column;align-items:center;justify-content:center;background:transparent;transition:background .5s}
#brkov.show{display:flex;background:rgba(5,8,16,.97);backdrop-filter:blur(12px)}
.bov{display:flex;flex-direction:column;align-items:center;gap:18px;opacity:0;transform:translateY(16px);transition:all .5s ease}
#brkov.show .bov{opacity:1;transform:translateY(0)}
.bov-tag{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--gn);letter-spacing:.45em;text-transform:uppercase}
.bov-title{font-size:50px;font-weight:300;text-align:center;line-height:1.1}
.bov-title span{color:var(--ac)}
.bov-div{width:280px;height:1px;background:linear-gradient(90deg,transparent,var(--br),transparent);margin:4px 0}
.bov-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;width:min(360px,92vw)}
.bov-card{background:rgba(9,13,20,.9);border:1px solid rgba(25,34,51,.9);border-radius:10px;padding:16px;text-align:center;transition:border-color .2s,box-shadow .2s}
.bov-card:hover{border-color:rgba(0,212,255,.2);box-shadow:0 0 16px rgba(0,212,255,.05)}
.bov-cv{font-size:26px;font-weight:600;margin-bottom:4px;color:rgba(224,237,248,1)}
.bov-cl{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--mu);letter-spacing:.15em;text-transform:uppercase}
.bov-xp{font-family:'JetBrains Mono',monospace;font-size:15px;color:var(--ac);animation:pg 2s ease-in-out infinite}
@keyframes pg{0%,100%{text-shadow:0 0 10px rgba(0,212,255,.3)}50%{text-shadow:0 0 28px rgba(0,212,255,.9)}}
.bov-ach{display:flex;align-items:center;gap:10px;background:rgba(124,58,237,.1);border:1px solid rgba(124,58,237,.3);border-radius:9px;padding:10px 20px;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--pu);max-width:360px;opacity:0;transform:translateY(6px);transition:all .4s .3s ease}
#brkov.show .bov-ach.show{opacity:1;transform:translateY(0)}
.bov-acts{display:flex;gap:10px;margin-top:6px}
.bov-btn{padding:11px 30px;border:1px solid;border-radius:9px;font-size:13px;font-weight:500;letter-spacing:.04em;transition:all .22s;min-height:44px}
.bov-btn.pr{border-color:var(--gn);color:var(--gn)}
.bov-btn.pr:hover{background:rgba(0,255,136,.09);box-shadow:0 0 22px rgba(0,255,136,.12);transform:translateY(-1px)}
.bov-btn.sc{border-color:var(--br);color:var(--mu)}
.bov-btn.sc:hover{border-color:rgba(180,196,216,.4);color:var(--tx)}

/* Break timer screen */
#brk-wrap{display:none;flex-direction:column;align-items:center;gap:18px}
#brkov.brk-on #brk-wrap{display:flex}
#brkov.brk-on .bov{display:none}
.brk-lbl{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.35em;color:rgba(0,255,136,.5);text-transform:uppercase}
.brk-time{font-family:'JetBrains Mono',monospace;font-size:80px;font-weight:300;color:var(--gn);text-shadow:0 0 50px rgba(0,255,136,.35),0 0 90px rgba(0,255,136,.1)}
.brk-hint{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--mu);text-align:center}
#brk-content{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:8px;width:360px;}
.brk-motivation{font-family:'Outfit',sans-serif;font-size:15px;font-weight:300;color:rgba(226,232,240,.65);text-align:center;font-style:italic;}
.brk-fact{background:rgba(0,212,255,.05);border:1px solid rgba(0,212,255,.15);border-radius:10px;padding:12px 18px;font-family:'JetBrains Mono',monospace;font-size:10.5px;color:rgba(0,212,255,.75);text-align:center;line-height:1.65;max-width:360px;}
.brk-exercise{background:rgba(0,255,136,.05);border:1px solid rgba(0,255,136,.15);border-radius:10px;padding:12px 18px;font-family:'JetBrains Mono',monospace;font-size:10.5px;color:rgba(0,255,136,.75);text-align:center;line-height:1.65;}
#brklogs{display:flex;flex-direction:column;gap:4px;align-items:center;margin-top:8px}
.brk-log{font-family:'JetBrains Mono',monospace;font-size:10.5px;color:rgba(0,255,136,.4);opacity:0;transform:translateY(4px);transition:all .4s}
.brk-log.in{opacity:1;transform:translateY(0)}
.brk-skip{margin-top:20px;padding:10px 28px;border:1px solid rgba(0,255,136,.25);border-radius:8px;color:rgba(0,255,136,.6);font-family:'JetBrains Mono',monospace;font-size:10.5px;transition:all .22s;min-height:40px}
.brk-skip:hover{border-color:var(--gn);color:var(--gn);background:rgba(0,255,136,.05);box-shadow:0 0 16px rgba(0,255,136,.08)}

/* Rank-up flash */
#ru{position:fixed;inset:0;z-index:70;pointer-events:none;display:flex;align-items:center;justify-content:center;opacity:0}
#ru.flash{animation:rf 2.2s ease-in-out forwards}
@keyframes rf{0%{opacity:0}8%{opacity:1}72%{opacity:1}100%{opacity:0}}
.rui{text-align:center;background:rgba(5,8,16,.96);border:1px solid var(--ac2);border-radius:16px;padding:36px 64px;box-shadow:0 0 100px rgba(124,58,237,.25),0 0 40px rgba(124,58,237,.1),inset 0 0 30px rgba(124,58,237,.04)}
.rutl{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--pu);letter-spacing:.3em;text-transform:uppercase;margin-bottom:10px}
.run2{font-size:38px;font-weight:600}
.rusub{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu);margin-top:8px;letter-spacing:.05em}

/* Toasts */
#ach-toast{position:fixed;bottom:80px;right:24px;z-index:80;background:rgba(9,13,20,.97);border:1px solid rgba(124,58,237,.4);border-radius:10px;padding:12px 18px;display:flex;align-items:center;gap:10px;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--pu);opacity:0;transform:translateX(20px);transition:all .4s ease;pointer-events:none;max-width:280px;box-shadow:0 0 24px rgba(124,58,237,.1)}
#ach-toast.show{opacity:1;transform:translateX(0)}
.ach-ico{font-size:16px;flex-shrink:0}
#toast{position:fixed;top:64px;left:50%;transform:translateX(-50%) translateY(-12px);background:linear-gradient(180deg,rgba(15,23,42,.98),rgba(3,7,18,.96));border:1px solid rgba(0,212,255,.22);border-radius:999px;padding:9px 20px;font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--ac);opacity:0;transition:all .3s ease;z-index:100;white-space:nowrap;pointer-events:none;box-shadow:0 12px 32px rgba(0,0,0,.32),0 0 28px rgba(0,212,255,.08)}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
#pricing-toast{position:fixed;bottom:80px;left:50%;transform:translateX(-50%) translateY(12px);background:rgba(9,13,20,.97);border:1px solid rgba(0,212,255,.2);border-radius:8px;padding:10px 20px;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu);opacity:0;transition:all .4s ease;z-index:80;white-space:nowrap;pointer-events:none;}
#pricing-toast.show{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto}
#pricing-toast .pt-close{color:var(--ac);margin-left:12px;cursor:pointer}

/* ── Stats overlay ────────────────────────────────────────────────────────── */
#stats-ov{position:fixed;inset:0;z-index:55;display:none;flex-direction:column;background:rgba(5,8,16,.99);backdrop-filter:blur(16px);overflow-y:auto;padding:60px 24px 48px}
#stats-ov.open{display:flex}
.stats-close{position:fixed;top:48px;right:20px;z-index:56;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--mu);padding:5px 14px;border:1px solid var(--br);border-radius:5px;transition:all .2s;background:rgba(5,8,16,.96)}
.stats-close:hover{border-color:var(--ac);color:var(--ac)}
.stats-inner{max-width:700px;margin:0 auto;width:100%;display:flex;flex-direction:column;gap:32px}
.stats-section{display:flex;flex-direction:column;gap:12px}
.stats-h{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--mu);letter-spacing:.22em;text-transform:uppercase;padding-bottom:10px;border-bottom:1px solid rgba(25,34,51,.8)}
.stats-big-row{display:flex;gap:12px;flex-wrap:wrap}
.stats-big-card{flex:1;min-width:100px;background:rgba(9,13,20,.85);border:1px solid rgba(25,34,51,.9);border-radius:10px;padding:16px;text-align:center;transition:border-color .2s,box-shadow .2s}
.stats-big-card:hover{border-color:rgba(0,212,255,.2);box-shadow:0 0 20px rgba(0,212,255,.05)}
.stats-big-val{font-family:'JetBrains Mono',monospace;font-size:26px;font-weight:600;color:var(--ac)}
.stats-big-lbl{font-family:'JetBrains Mono',monospace;font-size:8.5px;color:var(--mu);letter-spacing:.12em;text-transform:uppercase;margin-top:5px}
.chart-wrap{background:rgba(9,13,20,.7);border:1px solid rgba(25,34,51,.9);border-radius:12px;padding:18px;height:220px;position:relative}
.chart-wrap canvas{width:100%!important;height:100%!important}
.heatmap-grid{display:flex;gap:3px;flex-wrap:wrap;justify-content:flex-start}
.hm-cell{width:14px;height:14px;border-radius:3px;background:rgba(25,34,51,.7);transition:all .2s}
.hm-cell.l1{background:rgba(0,212,255,.18)}.hm-cell.l2{background:rgba(0,212,255,.38)}.hm-cell.l3{background:rgba(0,212,255,.6)}.hm-cell.l4{background:rgba(0,212,255,.85)}
.hm-legend{display:flex;align-items:center;gap:6px;margin-top:8px;font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--mu)}

/* Accessibility toggles */
.ff-access-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px;}
.ff-access-btn{padding:8px 10px;border:1px solid var(--br);border-radius:6px;color:var(--mu);font-family:'JetBrains Mono',monospace;font-size:10px;transition:all .2s ease;}
.ff-access-btn:hover{border-color:var(--mu);color:var(--tx);background:rgba(255,255,255,.03);}
.ff-access-btn.on{border-color:var(--ac);color:var(--ac);background:rgba(0,212,255,.08);box-shadow:0 0 14px rgba(0,212,255,.08);}

/* Achievement color classes */
.ach-first{color:#60a5fa}.ach-five{color:var(--or)}.ach-hour{color:var(--ac)}.ach-streak3{color:#c084fc}.ach-senior{color:#fbbf24}.ach-night{color:#818cf8}

/* ── Compact mode overrides ───────────────────────────────────────────────── */
body.compact #modes{display:none}
body.compact #dur{display:none}
body.compact #srow{display:none}
body.compact #logs{display:none}
body.compact #rpg{display:none}
body.compact #streak-box{display:none}
body.compact #stats{display:none}
body.compact #compiler-bg{display:none}
body.compact #vig{display:none}
body.compact #app{background:var(--bg)}
body.compact #tz{width:180px;height:180px;margin:0}
body.compact #tz #rsvg{width:180px;height:180px;transform:rotate(-90deg) scale(0.6)}
body.compact #tdsp{font-size:48px}
body.compact #tlbl{font-size:8px}
body.compact #tpct{font-size:9px}
body.compact #ctrls{margin-bottom:0}
body.compact #ctrls .cb{padding:8px 18px;font-size:12px}
body.compact #bar .pill:not(#modepill):not(#bclk){display:none}

/* ── Compiler layout + wrap ───────────────────────────────────────────────── */
#compiler-wrap{display:flex;height:100%;width:100%;max-width:100%;overflow:hidden;position:relative;}
#compiler-lines{padding:28px 10px 28px 12px;font-family:'JetBrains Mono',monospace;font-size:15px;line-height:1.75;color:rgba(68,85,102,.6);text-align:right;min-width:48px;flex-shrink:0;user-select:none;overflow:hidden;border-right:1px solid rgba(19,28,40,.5);background:rgba(8,12,18,.25);}
#compiler-screen{height:100%;padding:28px 32px 28px 16px;flex:1 1 auto;min-width:0;max-width:100%;overflow:hidden;}

/* ── Hard mode compiler effects (JS-controlled — keep intact) ────────────── */
.ff-compiler-danger-1,
.ff-compiler-danger-2,
.ff-compiler-danger-3{position:relative;}
.ff-compiler-danger-1{box-shadow:0 0 28px rgba(239,68,68,.22),inset 0 0 44px rgba(239,68,68,.08);}
.ff-compiler-danger-2{box-shadow:0 0 46px rgba(239,68,68,.38),inset 0 0 70px rgba(239,68,68,.15);}
.ff-compiler-danger-3{box-shadow:0 0 70px rgba(239,68,68,.55),inset 0 0 100px rgba(239,68,68,.22);}

.ff-system-warning-overlay{position:fixed;inset:0;display:grid;place-items:center;pointer-events:none;opacity:0;z-index:40;font-size:clamp(5rem,16vw,15rem);line-height:.85;font-weight:950;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,70,70,.34);text-shadow:0 0 22px rgba(255,70,70,.75),0 0 70px rgba(255,40,40,.45),0 0 150px rgba(255,20,20,.25);transform:scale(.92);transition:opacity 180ms ease,transform 220ms ease;}
.ff-system-warning-overlay.is-visible{opacity:1;transform:scale(1);}
.ff-system-warning-overlay::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 50%,rgba(239,68,68,.13),transparent 42%),radial-gradient(circle at 80% 50%,rgba(239,68,68,.16),transparent 34%),linear-gradient(90deg,transparent 0%,rgba(239,68,68,.08) 100%);opacity:0;transition:opacity 180ms ease;}
.ff-system-warning-overlay.is-visible::before{opacity:1;}
.ff-system-warning-overlay::after{position:fixed;right:clamp(1rem,4vw,4rem);top:50%;transform:translateY(-50%);width:min(34vw,420px);pointer-events:none;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;font-size:clamp(.72rem,1.15vw,1rem);line-height:1.7;letter-spacing:.04em;text-align:left;white-space:pre-line;color:rgba(255,190,190,.64);text-shadow:0 0 18px rgba(255,40,40,.28);opacity:0;transition:opacity 180ms ease,transform 220ms ease;}
.ff-system-warning-overlay.is-visible::after{opacity:1;transform:translateY(-50%) translateX(0);}
.ff-system-warning-overlay.level-1::after{content:"[warn] focus integrity compromised\A[penalty] discipline breach logged\A[system] return to focus";}
.ff-system-warning-overlay.level-2::after{content:"[error] build context unstable\A[rollback] checkpoint recovery started\A[system] further breach may crash";}
.ff-system-warning-overlay.level-3::after{content:"[signal] SIGSEGV\A[core] dumped\A[rollback] main.cpp\A[system] rebuild required";}
.ff-system-warning-overlay.level-1{color:rgba(255,100,80,.32);}
.ff-system-warning-overlay.level-2{color:rgba(255,55,55,.46);text-shadow:0 0 26px rgba(255,60,60,.85),0 0 84px rgba(255,30,30,.55),0 0 160px rgba(255,0,0,.30);}
.ff-system-warning-overlay.level-3{color:rgba(255,35,35,.58);text-shadow:0 0 34px rgba(255,70,70,1),0 0 110px rgba(255,20,20,.72),0 0 210px rgba(255,0,0,.42);}
.ff-compiler-glitching{animation:ffCompilerGlitch .18s linear 5;}
.ff-compiler-crashing{animation:ffCompilerCrashShake .12s linear infinite;}
.ff-compiler-crashing #compiler-screen,.ff-compiler-crashing #compiler-lines{transform:scale(1.045);transform-origin:center;transition:transform 220ms ease;}
.ff-compiler-blackout{opacity:.08;transition:opacity 260ms ease;}
@keyframes ffCompilerGlitch{0%{transform:translate(0,0);filter:none}25%{transform:translate(1px,-1px);filter:saturate(1.4)}50%{transform:translate(-1px,1px);filter:contrast(1.2)}75%{transform:translate(1px,1px);filter:saturate(1.2)}100%{transform:translate(0,0);filter:none}}
@keyframes ffCompilerCrashShake{0%{transform:translate(0,0)}25%{transform:translate(2px,-1px)}50%{transform:translate(-2px,1px)}75%{transform:translate(1px,2px)}100%{transform:translate(0,0)}}

/* ── XP penalty flash ─────────────────────────────────────────────────────── */
@keyframes xp-flash{0%{box-shadow:0 0 0 rgba(255,71,87,0)}50%{box-shadow:0 0 30px rgba(255,71,87,.4)}100%{box-shadow:0 0 0 rgba(255,71,87,0)}}
.xp-penalty-flash{animation:xp-flash .6s ease}

/* ── Accessibility overrides (JS-controlled — keep intact) ───────────────── */
body.ff-large-text #compiler-screen{font-size:24px}
body.ff-large-text #compiler-lines{font-size:20px}
body.ff-large-text #tdsp{font-size:82px}
body.ff-large-text #tlbl{font-size:10px}
body.ff-large-text #tpct{font-size:12px}
body.ff-large-text #under-stats{font-size:12px}
body.ff-large-text .cb{font-size:13px;padding:10px 24px}
body.ff-large-text .db{font-size:11px;padding:5px 13px}
body.ff-large-text .mb{font-size:11px;padding:5px 13px}
body.ff-large-text #bar{font-size:11px}
body.ff-high-contrast{--bg:#010409;--bg2:#050913;--tx:#f8fafc;--mu:#9fb0c7;--br:#2a3648;--ac:#57e5ff;--ac2:#9b6bff;--gn:#37ff9d;--or:#ffae63;--rd:#ff6576;--pu:#d7a9ff;--compiler-opacity:.40;}
body.ff-high-contrast #compiler-screen{color:rgba(248,250,252,.99);}
body.ff-high-contrast #vig{background:linear-gradient(90deg,rgba(1,4,9,.08) 0%,rgba(1,4,9,.28) 30%,rgba(1,4,9,.72) 56%,rgba(1,4,9,.92) 100%);}
body.ff-high-contrast #rbg{stroke:#1b2533;}
body.ff-high-contrast #rglow{stroke:rgba(87,229,255,.12);}
body.ff-high-contrast #under-stats,body.ff-high-contrast #tpct,body.ff-high-contrast .set-sub,body.ff-high-contrast .feat,body.ff-high-contrast .pill{color:rgba(215,225,240,.88);}
body.ff-high-contrast #sx-fill{background:linear-gradient(0deg,var(--ac),var(--pu));box-shadow:0 0 14px var(--ac);}
body.ff-high-contrast #sx-value{color:var(--tx);}

/* ── Session XP HUD ──────────────────────────────────────────────────────── */
#session-xp-hud{position:fixed;left:calc(50% + 285px);top:50%;transform:translateY(-50%);z-index:25;width:104px;padding:14px 12px;border:1px solid rgba(148,163,184,.14);border-radius:24px;background:linear-gradient(180deg,rgba(15,23,42,.58),rgba(3,7,18,.74));box-shadow:0 18px 42px rgba(0,0,0,.38),inset 0 0 20px rgba(255,255,255,.025);backdrop-filter:blur(10px);display:none;flex-direction:column;align-items:center;gap:10px;pointer-events:none;transition:transform .35s ease;}
body.session-started #session-xp-hud{display:flex;}
.sx-title{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--mu);}
.sx-value{font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:700;color:var(--tx);}
#sx-track{width:12px;height:min(38vh,300px);min-height:190px;position:relative;overflow:hidden;border-radius:999px;background:rgba(15,23,42,.96);border:1px solid rgba(148,163,184,.22);box-shadow:inset 0 0 14px rgba(0,0,0,.8);}
#sx-fill{position:absolute;left:0;bottom:0;width:100%;height:0%;border-radius:999px;background:linear-gradient(0deg,var(--ac),var(--pu));box-shadow:0 0 14px rgba(0,212,255,.55),0 0 28px rgba(255,0,255,.32);transition:height .45s ease;}
.sx-penalty{min-height:14px;font-family:'JetBrains Mono',monospace;font-size:11px;color:#fb7185;}
#session-xp-hud.penalty-hit #sx-fill{animation:xpPenaltyFlash .45s ease;}
@keyframes xpPenaltyFlash{0%,100%{filter:brightness(1)}35%{filter:brightness(1.9) saturate(1.5)}}
.sx-meta{width:100%;display:flex;justify-content:space-between;gap:6px;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu);}
.sx-meta strong{color:var(--tx);font-weight:700;}
@media(max-width:1100px){#session-xp-hud{left:auto;right:18px;}}
@media(max-width:760px){
  #session-xp-hud{position:relative;left:auto;right:auto;top:auto;transform:none;z-index:12;width:min(92vw,380px);min-height:0;margin:0 auto 12px;padding:10px 12px;display:none;grid-template-columns:auto 1fr 1fr;align-items:center;gap:8px 12px;border-radius:8px;}
  body.session-started #session-xp-hud{display:grid;}
  #session-xp-hud .sx-title{grid-column:1;font-size:9px;white-space:nowrap;}
  #session-xp-hud #sx-value{grid-column:2 / 4;text-align:right;font-size:12px;white-space:nowrap;}
  #session-xp-hud #sx-track{display:none;}
  #session-xp-hud .sx-penalty{grid-column:1 / -1;min-height:0;text-align:center;}
  #session-xp-hud .sx-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;font-size:9px;}
}

/* ── Session Debrief ─────────────────────────────────────────────────────── */
.debrief{width:100%;font-family:'JetBrains Mono',monospace;display:flex;flex-direction:column;gap:6px;font-size:11px;color:var(--mu);border-top:1px solid rgba(148,163,184,.12);padding-top:10px;margin-top:2px;}
.debrief:empty{display:none;}
.db-goal{font-size:13px;color:var(--tx);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px;}
.db-row{display:flex;justify-content:space-between;gap:12px;}
.db-lbl{color:var(--mu);}
.db-val{color:var(--tx);font-weight:600;}
.db-bonus{color:var(--gn);}
.db-penalty{color:#fb7185;}
.db-status{margin-top:4px;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--ac);}

/* ── Focus Insights ──────────────────────────────────────────────────────── */
.sv-insights{margin-top:8px;}
.sv-insights-body{display:flex;flex-direction:column;gap:8px;padding:4px 0;}
.insight-row{display:flex;justify-content:space-between;align-items:baseline;font-family:'JetBrains Mono',monospace;font-size:10px;}
.insight-lbl{color:var(--mu);}
.insight-val{color:var(--tx);font-weight:700;}
.sv-insights-empty{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu);padding:6px 0;}

/* ── Theme overrides (JS-controlled — keep intact) ───────────────────────── */
@media (max-width: 900px){
  #under-timer{width:min(320px,86vw);}
  #under-stats{font-size:10px;gap:10px;}
  .ff-access-row{grid-template-columns:1fr;}
}
@media (max-width:700px){
  html,body{height:100vh;min-height:100svh;}
  body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);}
  #bar{min-height:38px;height:auto;flex-wrap:wrap;align-content:center;row-gap:4px;padding-top:calc(4px + env(safe-area-inset-top));padding-bottom:4px;}
  #xps{top:calc(38px + env(safe-area-inset-top));}
  #app{height:auto;min-height:100svh;padding:calc(56px + env(safe-area-inset-top)) 0 calc(16px + env(safe-area-inset-bottom));justify-content:center;overflow:hidden;}
  #tz{margin-bottom:18px;}
  #under-timer{width:min(92vw,360px);margin-bottom:12px;}
  #under-stats{gap:8px 10px;line-height:1.45;text-align:center;}
  #ctrls{position:relative;z-index:20;margin-bottom:12px;}
}
#sets-wrap{display:flex;align-items:center;gap:6px;margin-top:6px}
#sets-label{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu);margin-right:2px}
.sb{padding:4px 11px;border:1px solid var(--br);border-radius:5px;color:var(--mu);font-family:'JetBrains Mono',monospace;font-size:10px;transition:all .2s}
.sb:hover{border-color:var(--mu);color:var(--tx)}
.sb.on{border-color:rgba(0,255,136,.5);color:var(--gn);background:rgba(0,255,136,.06)}
#set-indicator{font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--gn);letter-spacing:.1em;margin-top:4px;display:none;text-align:center;}
#session-history{display:flex;flex-direction:column;gap:4px;margin-top:6px;max-height:180px;overflow-y:auto;scrollbar-width:thin}
.hist-item{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:5px 8px;border-radius:4px;background:rgba(19,28,40,.4);font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--mu);}
.hist-item .hi-goal{color:var(--tx);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hist-item .hi-dur{color:var(--ac)}
.hist-item .hi-date{font-size:8px}
body.theme-neon{--ac:#ff00ff;--ac2:#00ffff;--gn:#00ff00;--pu:#ff66ff}
body.theme-amber{--ac:#ffbf00;--ac2:#ff6600;--gn:#88cc00;--pu:#ffdd44}
body.theme-ghost{--compiler-opacity:.08;--mu:#334455}

/* ── Desktop (>900px) ─────────────────────────────────────────────────────── */
@media(min-width:901px){
  #compiler-bg{justify-content:flex-start;align-items:stretch;padding:0;}
  #compiler-shell{position:fixed;top:0;left:0;bottom:0;right:auto;width:min(46vw,740px);height:100vh;max-width:none;border-left:none;border-radius:0;transform:none;opacity:var(--compiler-opacity);will-change:opacity;background:linear-gradient(180deg,rgba(8,12,20,.92),rgba(5,8,16,.98));box-shadow:0 0 120px rgba(0,0,0,.55),inset 0 0 0 1px rgba(255,255,255,.02);}
  #compiler-wrap{height:100vh;flex-direction:column;}
  #compiler-head{padding:0 18px;}
  #compiler-lines{min-width:52px;padding:22px 10px 28px 14px;font-size:17px;line-height:1.65;color:rgba(100,125,150,.75);background:rgba(10,14,22,.4);}
  #compiler-screen{padding:22px 24px 28px 18px;font-size:20px;line-height:1.65;color:rgba(230,238,248,.93);overflow-y:auto;overflow-x:hidden;}
  #vig{background:linear-gradient(90deg,rgba(5,8,16,.05) 0%,rgba(5,8,16,.25) 32%,rgba(5,8,16,.75) 56%,rgba(5,8,16,.95) 100%);}
}

/* ── Tablet (max 900px) ───────────────────────────────────────────────────── */
@media(max-width:900px){
  .land-h1{font-size:42px}
  #compiler-bg{overflow:hidden;}
  #compiler-shell{width:100vw;height:100vh;height:100dvh;max-width:100vw;overflow:hidden;}
  #compiler-wrap{width:100vw;height:100vh;height:100dvh;max-width:100vw;overflow:hidden;}
  #compiler-screen{font-size:12px;line-height:1.6;min-width:0;max-width:100vw;overflow:hidden;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;}
  #under-timer{width:min(320px,86vw);}
  #under-stats{font-size:10px;gap:10px;}
  .ff-access-row{grid-template-columns:1fr;}
  .ff-system-warning-overlay{font-size:clamp(3.6rem,18vw,7rem);}
  .ff-system-warning-overlay::after{display:none;}
}

/* ── Mobile (max 600px) ───────────────────────────────────────────────────── */
@media(max-width:600px){
  html,body{width:100%;min-width:0;height:auto;min-height:100dvh;overflow-x:hidden;overflow-y:auto;}
  body{padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);}
  #bar{height:auto;min-height:44px;padding:calc(5px + env(safe-area-inset-top)) 9px 5px;gap:6px;flex-wrap:nowrap;overflow:hidden;}
  #bar .bl{min-width:0;gap:6px;}
  #bar .bl:first-child{flex:1 1 auto;}
  #bar .bl:last-child{flex:0 0 auto;}
  .logo{font-size:10.5px;letter-spacing:.04em;min-width:0;}
  .logo i{width:6px;height:6px}
  .pill{min-height:40px;padding:8px 9px;font-size:9px;display:inline-flex;align-items:center;}
  #modepill{max-width:104px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  #dot{width:4px;height:4px;flex:0 0 auto;}
  #bst,#bclk{display:none}
  #compact-btn,#stats-btn,#settings-btn{flex:0 0 auto;min-height:40px;padding:7px 8px;font-size:9px;}
  #settings-btn{max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  #xps{top:calc(44px + env(safe-area-inset-top));}
  #hard-indicator{top:calc(49px + env(safe-area-inset-top));font-size:8px;}
  #stats{display:none}
  #streak-box{display:none}
  #compiler-bg,#compiler-shell,#compiler-wrap{display:block;width:100vw;max-width:100vw;height:100dvh;overflow:hidden;}
  #compiler-lines{display:none;}
  #compiler-screen{font-size:clamp(10px,2.85vw,12px);line-height:1.5;padding:calc(50px + env(safe-area-inset-top)) 10px calc(96px + env(safe-area-inset-bottom));width:100vw;max-width:100vw;color:rgba(225,238,248,.72);white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;opacity:.72;}
  #compiler-screen .comp-cur{width:7px;}
  #vig{background:radial-gradient(ellipse 82% 52% at 50% 36%,rgba(6,9,16,.66) 0%,rgba(6,9,16,.36) 48%,rgba(6,9,16,.05) 100%)}
  #app{height:auto;min-height:100dvh;padding:calc(74px + env(safe-area-inset-top)) 12px calc(112px + env(safe-area-inset-bottom));gap:8px;justify-content:flex-start;align-items:center;overflow:visible;background:transparent;}
  body.session-started #app{padding-top:calc(62px + env(safe-area-inset-top));padding-bottom:calc(128px + env(safe-area-inset-bottom));gap:6px;}
  #tz{width:min(218px,66vw);height:min(218px,66vw);margin:clamp(8px,2.5dvh,22px) 0 6px}
  body.session-started #tz{width:min(204px,62vw);height:min(204px,62vw);margin:clamp(4px,1.8dvh,12px) 0 4px;}
  #tz::before{inset:-30px;opacity:.46;filter:blur(14px);}
  #tz #rsvg{width:100%;height:100%;transform-origin:center;transform:rotate(-90deg) scale(.74)}
  #ti{gap:5px;}
  #tdsp{font-size:clamp(48px,15vw,58px);letter-spacing:-.055em;}
  #tlbl{font-size:7.5px;letter-spacing:.16em}
  #tpct{font-size:8.5px;min-height:12px}
  #goal-display{max-width:210px;font-size:8px;}
  #distraction-counter{font-size:8px;max-width:220px;}
  #dur{margin-bottom:12px;gap:8px;flex-wrap:wrap;justify-content:center;}
  .db{min-height:44px;font-size:10px;padding:8px 14px}
  #under-timer{width:min(92vw,330px);gap:6px;margin-bottom:2px;}
  body.session-started #under-timer{width:min(90vw,320px);gap:4px;margin-bottom:2px;}
  #linear-prog-wrap{height:4px;}
  body.session-started #linear-prog-wrap{height:3px;}
  #under-stats{gap:6px;font-size:8.5px;line-height:1.3;max-width:92vw;text-align:center;}
  #under-stats span:not(:nth-child(2)):not(:nth-child(4)){padding:3px 7px;}
  #under-stats span:nth-child(2),#under-stats span:nth-child(4){display:none;}
  #under-streak{margin-top:0;min-height:8px;}
  #ctrls{position:relative;z-index:35;gap:8px;margin:4px 0 2px}
  .cb{min-height:44px;padding:9px 18px;font-size:12px}
  #srow,body.compact #srow{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;font-size:9px;margin:0 0 6px;}
  #logs{display:flex;top:calc(50px + env(safe-area-inset-top));bottom:auto;left:12px;right:12px;max-width:calc(100vw - 24px);max-height:42px;overflow:hidden;gap:2px;opacity:.72;}
  body.session-started #logs{top:calc(46px + env(safe-area-inset-top));max-height:30px;opacity:.58;}
  .log{font-size:8px;line-height:1.25;white-space:normal;max-width:100%;padding:1px 0;}
  #rpg,body.compact #rpg{display:block;bottom:10px;right:10px;max-width:124px;padding-top:6px;background:rgba(5,8,16,.72);border-top-color:rgba(0,212,255,.16);border-radius:8px 0 0 0;}
  #rrname{font-size:12px}
  #rxp{font-size:9px}
  #land{align-items:flex-start;padding:calc(18px + env(safe-area-inset-top)) 16px calc(22px + env(safe-area-inset-bottom));}
  .land-step{width:min(560px,100%);}
  .land-tagline{font-size:34px}
  .land-modes-grid{grid-template-columns:1fr;max-width:100%}
  .land-dur-picker{grid-template-columns:repeat(2,1fr)}
  .ldb-min{font-size:24px}
  .land-next-btn{min-height:44px;padding:12px 28px;font-size:13px;width:100%}
  .land-ctas{flex-direction:column;align-items:center;gap:10px;margin-bottom:32px}
  .land-btn{min-height:44px;padding:12px 28px;font-size:13px}
  .land-badge{font-size:9px;letter-spacing:.2em;padding:4px 12px;margin-bottom:24px}
  .land-features-row{gap:6px}
  .lf-item{min-height:36px;font-size:9.5px;padding:7px 10px}
  .lsb{min-height:44px;padding:8px 13px}
  .land-dur-btn{min-height:72px;padding:12px 8px}
  #land-custom-input,#land-goal-input{font-size:16px}
  #land-custom-btn,.land-start-btn{min-height:44px}
  .comp-dot{width:18px;height:18px}
  .bov-title{font-size:36px}
  .bov-grid{width:min(360px,92vw);gap:8px}
  .bov-cv{font-size:20px}
  .brk-time{font-size:64px}
  #settings{top:calc(44px + env(safe-area-inset-top));height:calc(100dvh - 44px - env(safe-area-inset-top));width:100vw;border-left:none;border-top:1px solid rgba(25,34,51,.9)}
  #toast{max-width:calc(100vw - 24px);white-space:normal;text-align:center;}
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    scroll-behavior:auto;
    animation-duration:.001ms;
    animation-iteration-count:1;
    transition-duration:.001ms;
  }

  .land-step,
  .land-mode-card,
  .land-next-btn,
  .land-start-btn,
  .cb,
  .bov,
  .bov-ach,
  .brk-log,
  #tdsp,
  #compiler-wrap,
  #compiler-screen{
    animation:none;
    transform:none;
  }

  .ff-system-warning-overlay,
  .ff-system-warning-overlay::after{
    animation:none;
  }

  .land-mode-card:hover:not(:disabled),
  .land-start-btn:hover,
  .cb:hover,
  .cb.s:hover,
  .bov-btn.pr:hover{
    transform:none;
  }

  #tdsp.fc,
  #dot,
  .land-badge,
  .sdot.now{
    animation:none;
  }

  #ptcv{
    display:none;
  }

  .ff-compiler-glitching,
  .ff-compiler-crashing{
    animation:none;
  }
}

/* ── The Program ─────────────────────────────────────────────────────────── */
.prog-line-added{font-size:.75rem;color:var(--clr-ok,#4ade80);font-family:monospace;margin-top:.5rem;padding:.4rem .6rem;background:rgba(74,222,128,.08);border-left:2px solid var(--clr-ok,#4ade80);border-radius:2px}

.program-panel{position:fixed;bottom:1.5rem;right:1.5rem;width:320px;background:var(--clr-surface,#0f1117);border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:1rem;z-index:50;font-family:monospace}

.pp-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}
.pp-filename{color:var(--clr-accent,#7dd3fc);font-size:.8rem}
.pp-progress{color:rgba(255,255,255,.4);font-size:.7rem}

.pp-code{font-size:.7rem;line-height:1.6;max-height:200px;overflow-y:auto;color:rgba(255,255,255,.6)}
.pp-code .line-clean{color:rgba(255,255,255,.55)}
.pp-code .line-buggy{color:#f87171}
.pp-code .line-new{color:#fff;font-weight:600}
.pp-code .line-locked{color:rgba(255,255,255,.15)}
.pp-code .ln{display:inline-block;width:1.6em;color:rgba(255,255,255,.2);user-select:none}

.pp-compile-btn{margin-top:.75rem;width:100%;padding:.5rem;background:var(--clr-accent,#7dd3fc);color:#000;border:none;border-radius:4px;font-family:monospace;font-size:.8rem;cursor:pointer}
.pp-compile-btn:hover{opacity:.85}

.pp-debug-cta{margin-top:.75rem;font-size:.7rem;color:#f87171;padding:.4rem;border:1px solid rgba(248,113,113,.3);border-radius:4px}

.pp-terminal{margin-top:.75rem;font-size:.7rem;color:#4ade80;line-height:1.7;border-top:1px solid rgba(255,255,255,.06);padding-top:.5rem}

/* ── Line quality ───────────────────────────────────────────────────────── */
.line-starred{color:#fbbf24}
.line-repaired{color:#34d399}
.prog-line-added.quality-starred{color:#fbbf24;border-left-color:#fbbf24;background:rgba(251,191,36,.08)}
.prog-line-added.quality-buggy{color:#f87171;border-left-color:#f87171;background:rgba(248,113,113,.08)}
.prog-line-added.quality-repaired{color:#34d399;border-left-color:#34d399;background:rgba(52,211,153,.08)}

/* ── Debug mode row ─────────────────────────────────────────────────────── */
#debug-mode-row{display:flex;align-items:center;gap:10px;margin-bottom:20px}
.tog-label{display:flex;align-items:center;gap:10px;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--mu);cursor:pointer}

/* ── Terminal animation ──────────────────────────────────────────────────── */
.term-line{margin:1px 0;transition:opacity .15s}

/* ── Share card ──────────────────────────────────────────────────────────── */
#pp-share-card{position:fixed;inset:0;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;z-index:100}
.share-card{background:var(--clr-surface,#0f1117);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:2rem;width:340px;font-family:monospace;text-align:center}
.sc-brand{color:var(--clr-accent,#7dd3fc);font-size:.8rem;margin-bottom:1rem}
.sc-filename{color:#fff;font-size:1.1rem;font-weight:700;margin-bottom:.5rem}
.sc-stats{color:rgba(255,255,255,.5);font-size:.75rem;margin-bottom:.25rem}
.sc-quality{color:#fbbf24;font-size:.8rem;margin-bottom:1rem}
.sc-output{color:#4ade80;font-size:.8rem;margin-bottom:1.5rem}
.sc-copy-btn,.sc-next-btn{padding:.5rem 1rem;border-radius:4px;font-family:monospace;font-size:.8rem;cursor:pointer;border:none;margin:.25rem}
.sc-copy-btn{background:rgba(255,255,255,.1);color:#fff}
.sc-next-btn{background:var(--clr-accent,#7dd3fc);color:#000}
.sc-next-btn:disabled{opacity:.4;cursor:default}
.sc-actions{margin-top:1rem}

/* ── Living Repository ───────────────────────────────────────────────────── */
.repo-panel{position:fixed;right:1.5rem;bottom:12rem;width:300px;background:var(--clr-surface,#0f1117);border:1px solid rgba(255,255,255,.06);border-radius:8px;padding:.875rem;z-index:50;font-family:monospace;cursor:pointer}
.rp-header{display:flex;justify-content:space-between;margin-bottom:.5rem}
.rp-filename{color:rgba(255,255,255,.4);font-size:.7rem}
.rp-progress{color:rgba(255,255,255,.25);font-size:.7rem}
.rp-code{font-size:.68rem;line-height:1.7;min-height:1.5rem}
.rp-line{color:rgba(255,255,255,.45)}
.rp-clean{color:rgba(255,255,255,.45)}
.rp-starred{color:#fbbf24}
.rp-buggy{color:#f87171}
.rp-repaired{color:#34d399}
.rp-empty{color:rgba(255,255,255,.2);font-style:italic}
.rp-cursor{display:inline-block;color:var(--clr-accent,#7dd3fc);animation:blink 1s step-end infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
.rp-meta{margin-top:.5rem;font-size:.62rem;color:rgba(255,255,255,.2)}
.repo-counter{font-family:monospace;font-size:.7rem;color:rgba(255,255,255,.3);text-align:center;margin-top:.4rem}
.rc-sep{margin:0 .3rem}

/* ── Living Repository fullscreen view ───────────────────────────────────── */
.repo-view{position:fixed;inset:0;background:var(--clr-surface,#0a0d13);z-index:200;opacity:0;transition:opacity .3s ease;display:flex;flex-direction:column;font-family:monospace}
.repo-view.rv-visible{opacity:1}
.rv-header{display:flex;align-items:center;gap:1rem;padding:1.25rem 1.5rem;border-bottom:1px solid rgba(255,255,255,.06)}
.rv-back-btn{background:none;border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.5);padding:.35rem .75rem;border-radius:4px;font-family:monospace;font-size:.75rem;cursor:pointer}
.rv-back-btn:hover{border-color:rgba(255,255,255,.3);color:#fff}
.rv-title{color:#fff;font-size:.9rem;font-weight:600}
.rv-subtitle{color:rgba(255,255,255,.3);font-size:.75rem;margin-left:auto}
.rv-body{display:flex;flex:1;overflow:hidden}
.rv-tree{width:280px;border-right:1px solid rgba(255,255,255,.06);padding:1rem;overflow-y:auto;font-size:.75rem;line-height:2;color:rgba(255,255,255,.5);flex-shrink:0;white-space:pre}
.rv-tree-month{color:rgba(255,255,255,.6);font-weight:600}
.rv-tree-week{color:rgba(255,255,255,.4)}
.rv-tree-day{cursor:pointer;padding:.1rem .25rem;border-radius:3px}
.rv-tree-day:hover{background:rgba(255,255,255,.05);color:#fff}
.rv-tree-day.selected{background:rgba(125,211,252,.1);color:var(--clr-accent,#7dd3fc)}
.rv-detail{flex:1;padding:1.5rem;overflow-y:auto}
.rv-detail-empty{color:rgba(255,255,255,.2);font-size:.8rem;margin-top:2rem;text-align:center}
.rv-file-header{color:var(--clr-accent,#7dd3fc);font-size:.9rem;margin-bottom:.25rem}
.rv-file-meta{color:rgba(255,255,255,.3);font-size:.7rem;margin-bottom:1rem}
.rv-code-line{font-size:.8rem;line-height:1.8;color:rgba(255,255,255,.6)}
.rv-clean{color:rgba(255,255,255,.6)}
.rv-starred{color:#fbbf24}
.rv-buggy{color:#f87171}
.rv-repaired{color:#34d399}
.rv-code-locked{color:rgba(255,255,255,.15);font-size:.8rem;line-height:1.8}
.rv-empty{color:rgba(255,255,255,.2);font-size:.8rem;text-align:center;margin-top:3rem}
@media(max-width:767px){.rv-body{flex-direction:column}.rv-tree{width:100%;border-right:none;border-bottom:1px solid rgba(255,255,255,.06);max-height:200px}}

/* ── Onboarding ───────────────────────────────────────────────────────────── */
.onboard{position:fixed;inset:0;background:var(--clr-surface,#0a0d13);z-index:300;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:monospace}
.ob-screen{display:none;flex-direction:column;align-items:center;text-align:center;max-width:340px;padding:2rem}
.ob-screen.active{display:flex}
.ob-icon{font-size:3rem;margin-bottom:1.5rem;color:var(--clr-accent,#7dd3fc)}
.ob-headline{font-size:1.6rem;font-weight:700;color:#fff;line-height:1.3;margin-bottom:.75rem}
.ob-sub{color:rgba(255,255,255,.4);font-size:.85rem;margin-bottom:2rem;line-height:1.5}
.ob-next-btn{background:var(--clr-accent,#7dd3fc);color:#000;border:none;padding:.65rem 1.75rem;border-radius:6px;font-family:monospace;font-size:.9rem;font-weight:600;cursor:pointer}
.ob-start{background:#fff}
.ob-dots{display:flex;gap:.5rem;margin-top:2rem}
.ob-dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.2);transition:background .2s}
.ob-dot.active{background:var(--clr-accent,#7dd3fc)}

/* ── First-session hint ───────────────────────────────────────────────────── */
.land-first-hint{font-size:.72rem;color:rgba(255,255,255,.25);text-align:center;margin-top:.5rem;font-family:monospace}

/* ── Repo panel pulse ─────────────────────────────────────────────────────── */
@keyframes rpPulse{0%,100%{box-shadow:0 0 0 0 rgba(125,211,252,0)}50%{box-shadow:0 0 0 6px rgba(125,211,252,.25)}}
.rp-pulse{animation:rpPulse 1s ease 3}