[hidden]{display:none!important}

:root{--bg:#050608;--panel:rgba(18,20,25,.86);--panel2:rgba(28,31,38,.78);--text:#f5f5f7;--muted:#9aa4b2;--line:rgba(255,255,255,.09);--accent:#0a84ff;--green:#32d74b;--orange:#ff9f0a;--red:#ff453a;--shadow:0 26px 80px rgba(0,0,0,.46)}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;min-height:100vh;background:#050608;color:var(--text);font:16px -apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",system-ui,sans-serif}body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 70% 0%,rgba(10,132,255,.18),transparent 34%),radial-gradient(circle at 15% 20%,rgba(180,125,35,.12),transparent 26%),linear-gradient(180deg,#050608,#090b10 48%,#050608);pointer-events:none}.nav{position:fixed;left:0;top:0;bottom:0;width:196px;z-index:50;padding:20px 12px;background:rgba(7,8,11,.92);border-right:1px solid var(--line);backdrop-filter:saturate(150%) blur(24px);display:flex;flex-direction:column;gap:16px}.brand{display:flex;gap:12px;align-items:center}.logo{width:42px;height:42px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(145deg,#1d65ff,#12151b);box-shadow:0 12px 35px rgba(10,132,255,.24);font-size:24px}.brand b{display:block;font-size:18px;letter-spacing:-.03em}.brand small,.search small,.navnote{color:var(--muted)}.search{display:grid;gap:8px}.search label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#737d8c}.search div{display:flex;gap:8px}input{min-width:0;width:100%;border:1px solid var(--line);border-radius:14px;padding:11px 12px;background:rgba(255,255,255,.06);color:var(--text);outline:none}input:focus{border-color:rgba(10,132,255,.55);box-shadow:0 0 0 4px rgba(10,132,255,.12)}nav{display:grid;gap:8px}nav button{justify-content:flex-start;text-align:left;background:transparent;box-shadow:none;border-color:transparent;color:#cbd3df}nav button.active,nav button:hover{background:rgba(255,255,255,.08);border-color:var(--line);color:#fff}.navnote{display:none!important}.app{margin-left:196px;min-height:100vh}header{position:sticky;top:0;z-index:30;display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding:24px 34px;border-bottom:1px solid var(--line);background:rgba(5,6,8,.72);backdrop-filter:saturate(180%) blur(22px)}h1{margin:0 0 5px;font-size:34px;letter-spacing:-.045em;font-weight:780}p{margin:0;color:var(--muted)}main{position:relative;display:grid;grid-template-columns:minmax(330px,560px) minmax(320px,1fr);gap:26px;padding:28px;max-width:1400px;margin:0 auto}.board-panel,.card{background:var(--panel);border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow);backdrop-filter:saturate(150%) blur(24px)}.board-panel{padding:22px}.board-shell{display:flex;gap:14px;align-items:stretch}.board-wrap{position:relative;width:100%;max-width:560px;margin:auto}#board{width:100%;max-width:560px;border-radius:20px;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.55)}.evalbar{width:12px;border-radius:999px;background:rgba(255,255,255,.10);overflow:hidden;display:flex;align-items:flex-end}.evalbar,#eval{border:1px solid var(--line)}#evalFill{width:100%;height:50%;background:linear-gradient(180deg,#f5f5f7,#111318);transition:height .25s ease}.controls{display:flex;gap:10px;margin-top:18px}button{appearance:none;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);color:var(--text);border:1px solid var(--line);padding:11px 15px;border-radius:16px;cursor:pointer;font-weight:650;box-shadow:0 10px 28px rgba(0,0,0,.18);transition:transform .15s ease,background .15s ease,border-color .15s ease}button:hover{transform:translateY(-1px);background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.16)}#eval{display:inline-block;margin-top:14px;padding:9px 13px;border-radius:999px;background:rgba(255,255,255,.06);color:var(--muted);font-size:14px}.side{display:grid;gap:18px;min-width:0}.card{padding:20px}.card h2{font-size:17px;margin:0 0 14px;letter-spacing:-.02em}.highlight{background:linear-gradient(180deg,rgba(16,34,57,.88),rgba(18,20,25,.86));border-color:rgba(10,132,255,.22)}.opening-card{border-color:rgba(10,132,255,.25);background:linear-gradient(180deg,rgba(10,38,77,.72),rgba(18,20,25,.86))}.plan{margin-top:10px;color:var(--muted);line-height:1.45}.label{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em}.big{font-size:22px;font-weight:760;margin:6px 0 10px;line-height:1.18}#moves{line-height:2.05}.move{display:inline-block;padding:2px 7px;border-radius:10px;cursor:pointer}.move:hover{background:rgba(10,132,255,.12)}.move.active{background:rgba(10,132,255,.22);color:#76b9ff}.move.good{color:#56d364}.move.mistake{color:#ffb340}.move.blunder{color:#ff6961}.alt{padding:11px 0;border-top:1px solid var(--line);line-height:1.4}.alt:first-child{border-top:0}.square-55d63{position:relative}.badge,.goodmark,.bookmark{position:absolute;right:4px;top:4px;z-index:5;width:24px;height:24px;border-radius:999px;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:13px;color:white;box-shadow:0 5px 14px rgba(0,0,0,.3)}.badge.mistake{background:var(--orange)}.badge.blunder{background:var(--red)}.badge.blunder:before{content:'??'}.badge.mistake:before{content:'?'}.goodmark.ok{background:#7ee787;color:#0b3d19}.goodmark.top{background:var(--green);color:white}.bookmark{background:#8b5e34;color:#fff7ed;font-size:14px}#arrowLayer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.arrow-line{stroke:#0a84ff;stroke-width:6;stroke-linecap:round;opacity:.72}.arrow-head{fill:#0a84ff;opacity:.85}#openingTag{font-weight:500;color:var(--muted);font-size:13px;margin-left:8px}#batchStatus{color:var(--muted);font-size:14px;min-width:180px;text-align:right}.progress{position:absolute;left:34px;right:34px;bottom:-1px;height:3px;background:rgba(255,255,255,.07);overflow:hidden;display:none}#progressBar{height:100%;width:0;background:linear-gradient(90deg,#0a84ff,#32d74b);transition:width .25s ease}#gamePicker{display:grid;gap:10px;margin-top:10px}.hint{color:var(--muted);font-size:14px;line-height:1.4;padding:12px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.04)}.gamepick.rich{display:grid;grid-template-columns:58px minmax(160px,1fr) 70px 54px 54px 82px;align-items:center;gap:12px;text-align:left;border-radius:22px;background:rgba(255,255,255,.055);box-shadow:none}.gamepick.win{box-shadow:inset 4px 0 0 var(--green)}.gamepick.loss{box-shadow:inset 4px 0 0 var(--red)}.clock{display:flex;flex-direction:column;align-items:center;color:var(--green);font-size:24px}.clock small{font-size:11px;color:var(--muted);font-weight:600}.players{display:grid;gap:5px;text-align:left;min-width:0}.players b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.players em{font-style:normal;color:var(--muted);font-weight:500}.side.white,.side.black{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:8px}.side.white{background:#f7f7f7;border:1px solid #d2d2d7}.side.black{background:#53565c}.scores,.acc{display:grid;gap:2px;text-align:center}.scores small,.acc small{color:var(--muted);font-size:10px}.colorpill{font-size:12px;color:#dbe7ff;background:rgba(10,132,255,.16);border:1px solid rgba(10,132,255,.22);border-radius:999px;padding:6px 8px;text-align:center}.date{color:#c8d0dc;font-weight:650}.errorpick{display:flex;flex-direction:column;align-items:flex-start;gap:5px;text-align:left;background:rgba(255,255,255,.055)}.errorpick span{color:var(--muted);font-size:13px;line-height:1.35}.errorpick small{color:#76b9ff}@media(max-width:1050px){.nav{position:relative;width:auto;bottom:auto}.app{margin-left:0}main{grid-template-columns:1fr}}@media(max-width:850px){header{padding:20px 22px}h1{font-size:28px}main{padding:18px;gap:18px}.gamepick.rich{grid-template-columns:42px minmax(130px,1fr) 62px}.scores,.acc,.date{display:none}.card,.board-panel{border-radius:22px}}

.opening-card{padding:12px 14px;cursor:pointer;transition:max-height .2s ease,background .2s ease}
.opening-card h2{margin:0;font-size:14px;color:#dbe7ff}
.opening-card h2:after{content:"  ▾";color:var(--muted);font-size:12px}
.opening-card #openingSummary,.opening-card #openingPlans{display:none}
.opening-card.open{padding:18px 20px}
.opening-card.open h2{font-size:17px;margin-bottom:12px}
.opening-card.open h2:after{content:"  ▴"}
.opening-card.open #openingSummary,.opening-card.open #openingPlans{display:block}
.drawer-card{transition:opacity .18s ease,transform .18s ease}
body:not(.list-open) .drawer-card{opacity:.58}
body:not(.list-open) .drawer-card #gamePicker{max-height:48px;overflow:hidden}
.arrow-line.best{stroke:#32d74b;stroke-width:8;opacity:.92;filter:drop-shadow(0 0 8px rgba(50,215,75,.45))}
.arrow-line.alt{stroke:#0a84ff;stroke-width:4;opacity:.32;stroke-dasharray:10 8}
.arrow-head.best{fill:#32d74b;opacity:.95}
.arrow-head.alt{fill:#0a84ff;opacity:.38}

.landing{position:relative;z-index:100;display:grid;place-items:center;min-height:100vh;min-height:100dvh;padding:32px 28px calc(64px + env(safe-area-inset-bottom,0px));overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;background:#040507}
/* Photo lives on its own transformable layer so it can Ken-Burns zoom on the GPU. */
.landing-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.landing-bg:before{content:"";position:absolute;inset:0;background:url("assets/landing-duel-still-v2.jpg") center/cover no-repeat;transform:scale(1.085);will-change:transform;animation:landing-zoom 17s cubic-bezier(.22,.61,.36,1) .15s forwards}
@keyframes landing-zoom{to{transform:scale(1)}}
/* Drifting fog: two soft blurred sheets gliding in opposite directions. */
.landing-bg i{position:absolute;left:-30%;width:160%;border-radius:50%;pointer-events:none;will-change:transform;filter:blur(46px)}
.landing-bg i.fog-a{top:34%;height:46%;background:radial-gradient(ellipse at 42% 55%,rgba(212,222,236,.13),transparent 58%),radial-gradient(ellipse at 70% 45%,rgba(125,211,252,.07),transparent 55%);opacity:.8;animation:landing-fog-drift 52s ease-in-out infinite alternate}
.landing-bg i.fog-b{top:58%;height:42%;background:radial-gradient(ellipse at 60% 50%,rgba(228,232,240,.11),transparent 60%),radial-gradient(ellipse at 30% 60%,rgba(214,166,74,.05),transparent 55%);opacity:.7;animation:landing-fog-drift 74s ease-in-out infinite alternate-reverse}
@keyframes landing-fog-drift{from{transform:translate3d(-5%,1.5%,0)}to{transform:translate3d(5%,-1.5%,0)}}
.landing:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.30),rgba(3,4,6,.62)),radial-gradient(circle at 50% 12%,rgba(180,125,35,.16),transparent 31%),radial-gradient(circle at 74% 0%,rgba(10,132,255,.17),transparent 34%),linear-gradient(90deg,rgba(0,0,0,.42),transparent 25%,transparent 75%,rgba(0,0,0,.44));pointer-events:none}
.landing:after{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse at 50% 82%,rgba(214,166,74,.10),transparent 42%),radial-gradient(ellipse at 78% 30%,rgba(10,132,255,.10),transparent 35%);pointer-events:none}
@media(max-width:600px){.landing-bg i{filter:blur(30px)}}
@media(prefers-reduced-motion:reduce){.landing-bg:before{animation:none;transform:scale(1)}.landing-bg i{animation:none}}

.landing-stage{position:relative;z-index:1;width:min(760px,100%);display:grid;justify-items:center;gap:20px;margin:auto}
.landing-stage:before,.landing-stage:after{content:"";position:fixed;inset:auto -10% -8% -10%;height:42%;pointer-events:none;background:radial-gradient(ellipse at 35% 68%,rgba(255,255,255,.08),transparent 42%),radial-gradient(ellipse at 68% 58%,rgba(125,211,252,.055),transparent 45%),linear-gradient(0deg,rgba(255,255,255,.075),transparent 70%);filter:blur(28px);opacity:.34;animation:landing-fog-rise 18s ease-in-out infinite alternate}
.landing-stage:after{inset:auto -20% 12% -20%;height:34%;opacity:.18;filter:blur(38px);animation-duration:24s;animation-direction:alternate-reverse}
.landing-card{position:relative;width:min(760px,100%);padding:38px 40px 34px;border:1px solid rgba(255,255,255,.08);border-radius:34px;background:linear-gradient(180deg,rgba(24,27,34,.78),rgba(10,12,17,.84));box-shadow:0 36px 110px rgba(0,0,0,.60),0 0 90px rgba(180,125,35,.08);backdrop-filter:saturate(160%) blur(28px);text-align:center;overflow:hidden}
.landing-card:before{content:"";position:absolute;inset:-35% 10% auto;height:260px;background:radial-gradient(circle,rgba(214,166,74,.10),transparent 64%);pointer-events:none}
.landing-card>*{position:relative}
.landing-kicker{display:inline-flex;margin-bottom:14px;padding:8px 13px;border:1px solid rgba(10,132,255,.28);border-radius:999px;background:rgba(10,132,255,.12);color:#8ec5ff;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.landing h1{max-width:680px;margin:0 auto 12px;font-size:clamp(36px,6vw,64px);line-height:.96;letter-spacing:-.065em}
.landing p{max-width:560px;margin:0 auto 20px;color:#b9c2cf;font-size:18px;line-height:1.42}
.landing-benefits{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 auto 12px;max-width:650px}
.landing-benefits span,.auth-benefits span{display:inline-flex;align-items:center;min-height:30px;padding:6px 10px;border:1px solid rgba(125,211,252,.16);border-radius:999px;background:rgba(125,211,252,.075);color:#dbeafe;font-size:12px;font-weight:780;white-space:nowrap}
.landing-preview-grid{display:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:650px;margin:0 auto 16px;text-align:left}
.landing-preview-grid div{display:grid;gap:4px;padding:12px;border:1px solid rgba(255,255,255,.09);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.landing-preview-grid small{color:#8ec5ff;font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.07em}
.landing-preview-grid b{color:#f7fbff;font-size:14px;letter-spacing:-.01em}
.landing-preview-grid span{color:#9aa6b5;font-size:12px;line-height:1.3}
.landing-card.logged-in-entry .landing-kicker,.landing-card.logged-in-entry .landing-benefits,.landing-card.logged-in-entry .landing-preview-grid{display:none}
.landing-card.logged-in-entry{padding:38px 40px 34px;text-align:center}
.landing-card.logged-in-entry h1{max-width:620px;margin:0 auto 10px;font-size:clamp(34px,6vw,58px);text-align:center;letter-spacing:-.038em;word-spacing:.06em}
.landing-card.logged-in-entry>p{max-width:520px;margin:0 auto 14px;color:#d2dbe6;text-align:center}
.landing-card.logged-in-entry .enter-lab-cta{margin:0 auto 12px;height:62px;font-size:17px;background:linear-gradient(135deg,#f0b429,#0a84ff 72%);box-shadow:0 22px 54px rgba(10,132,255,.28),0 12px 34px rgba(240,180,41,.18)}
.analyze-other-toggle{display:inline-flex;align-items:center;justify-content:center;min-height:36px;margin:6px auto 4px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.11);color:#cfd8e5;font-size:13px;font-weight:800;box-shadow:none}
.landing-search{display:flex;gap:12px;max-width:620px;margin:0 auto 12px;padding:8px;border:1px solid rgba(255,255,255,.10);border-radius:24px;background:rgba(255,255,255,.06)}
.landing-search.secondary{max-width:560px;opacity:.78;background:rgba(255,255,255,.035)}
.landing-search input{height:56px;border:0;background:transparent;font-size:17px;padding:0 14px}
.landing-search button{height:56px;padding:0 22px;border-radius:18px;background:linear-gradient(135deg,#0a84ff,#0066d6);border-color:rgba(255,255,255,.14);white-space:nowrap}
.enter-lab-cta{display:block;width:100%;max-width:620px;height:58px;margin:8px auto 16px;border-radius:20px;background:linear-gradient(135deg,#f0b429,#0a84ff);border:1px solid rgba(255,255,255,.2);color:white;font-size:16px;font-weight:900;box-shadow:0 18px 44px rgba(10,132,255,.24),0 10px 28px rgba(240,180,41,.16)}
.enter-lab-cta[hidden]{display:none}.enter-lab-cta:disabled{opacity:.7;cursor:wait;transform:none}
.landing-search button:disabled{opacity:.65;cursor:wait;transform:none}
.landing-error{min-height:22px;color:#ff8a80;font-weight:650}
.landing small{color:#7f8a99}
body.landing-active .nav,body.landing-active .app{display:none}
body:not(.landing-active) .landing{display:none}
.boot-splash{display:none}
body.app-booting .landing,body.app-booting .nav,body.app-booting .app{display:none}
body.app-booting .boot-splash{position:fixed;inset:0;z-index:200;display:grid;place-items:center;background:radial-gradient(circle at 50% 18%,rgba(10,132,255,.14),transparent 32%),linear-gradient(180deg,#07090d,#020304);color:#eef6ff}
.boot-splash-inner{display:grid;justify-items:center;gap:14px;text-align:center}
.boot-splash img{width:clamp(190px,34vw,280px);height:auto;filter:drop-shadow(0 18px 42px rgba(10,132,255,.16))}
.boot-splash .boot-spinner{width:38px;height:38px;border-radius:50%;border:2px solid rgba(255,255,255,.14);border-top-color:#f0b429;animation:boot-spin .8s linear infinite}
.boot-splash small{color:#9fb3c8;font-weight:650;letter-spacing:.02em}
@keyframes boot-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.boot-splash .boot-spinner{animation:none;border-top-color:rgba(255,255,255,.14)}}
@media(max-width:720px){.landing-card{padding:28px 18px;border-radius:26px}.landing-search{display:grid}.landing-search button{width:100%}}
@keyframes landing-fog-rise{0%{transform:translate3d(-2%,18px,0) scale(1);opacity:.20}45%{opacity:.36}100%{transform:translate3d(3%,-28px,0) scale(1.04);opacity:.26}}
@media (prefers-reduced-motion:reduce){.landing-stage:before,.landing-stage:after{animation:none}}
@media(max-width:720px){.landing-brand{margin-bottom:18px}.landing-brand .logo{width:36px;height:36px;border-radius:13px}.landing-brand span:last-child{font-size:15px}.top-brand{gap:8px}.top-brand .logo{width:34px;height:34px;border-radius:12px}.top-brand h1{font-size:20px}}

/* Premium my-chesslab.com branding */
.brand,.top-brand,.landing-brand{min-width:0}
.brand{justify-content:center;text-align:center;padding:2px 0;border:0;border-radius:0;background:transparent;box-shadow:none}
.brand-home{width:100%;appearance:none;cursor:pointer;color:inherit;box-shadow:none;transition:background .15s ease,transform .15s ease,opacity .15s ease}
.brand-home:hover{background:rgba(255,255,255,.055);transform:translateY(-1px);opacity:.96}
.brand-home:focus-visible{outline:2px solid rgba(214,166,74,.55);outline-offset:3px}
.top-brand{display:flex;align-items:center;gap:12px}
.landing-brand{position:relative;display:grid;justify-items:center;gap:6px;margin:0 auto 8px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:#f8fbff;font-weight:760;letter-spacing:-.025em}
.logo.brand-mark{position:relative;overflow:visible;width:42px;height:42px;border-radius:0;background:transparent;box-shadow:none}
.logo.brand-mark:before{display:none}
.logo.brand-mark svg{position:relative;z-index:1;width:24px;height:24px;fill:none;stroke:#eef8ff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 6px rgba(255,255,255,.22))}
.logo.brand-image{background-image:url("assets/mychess-logo.png");background-size:245%;background-position:center 48%;background-repeat:no-repeat}
.logo.brand-image:before{display:none}
.brand b,.top-brand h1{text-transform:lowercase}
.brand b{font-size:18px;letter-spacing:-.04em}
.top-brand h1{font-size:30px;margin:0;letter-spacing:-.055em}
.landing-brand .logo.brand-mark{width:132px;height:132px;border-radius:0;background-color:transparent;box-shadow:none}
.brand-home>div{display:grid;justify-items:center;gap:3px;min-width:0}
.brand-wordmark{display:block;height:auto;max-width:100%;object-fit:contain;filter:drop-shadow(0 10px 28px rgba(0,0,0,.28)) drop-shadow(0 0 18px rgba(214,166,74,.10))}
.landing-brand .landing-wordmark{width:clamp(260px,24vw,320px)}
.brand .nav-wordmark{width:clamp(120px,76%,150px);margin:0 auto 2px}
.landing-brand small{font-size:13px;color:#9fb3a9;font-weight:650;letter-spacing:.01em}
.player-profile-link{color:inherit;text-decoration:none;border-radius:8px}
.player-profile-link:hover,.player-profile-link:focus-visible{text-decoration:underline;text-decoration-color:rgba(125,211,252,.65);text-underline-offset:3px;outline:0}
.player-avatar-link{display:inline-grid;place-items:center;flex:0 0 auto}
.active-player-card .player-avatar-link,.match-player .player-avatar-link{text-decoration:none}
@media(max-width:720px){.landing-stage{gap:18px}.landing-brand{gap:5px;margin-bottom:18px}.landing-brand .logo.brand-mark{width:104px;height:104px;border-radius:0}.landing-brand .landing-wordmark{width:clamp(180px,58vw,220px)}.landing-brand small{font-size:12px}.top-brand{gap:8px}.top-brand .logo.brand-mark{width:34px;height:34px;border-radius:0}.top-brand h1{font-size:20px}.brand{padding:1px 0}.brand .logo.brand-mark{width:36px;height:36px;border-radius:0}.brand .nav-wordmark{width:clamp(120px,72%,140px)}}

/* staged flow */
body.landing-active .nav,body.landing-active .app{display:none}
body.games-active .landing,body.analysis-active .landing{display:none}
.brand-watermark{display:none!important}
body.landing-active .brand-watermark{display:none}
.app{position:relative;z-index:2}
@media(max-width:1050px){.brand-watermark{width:84px;right:22px;bottom:22px;opacity:.82}}
@media(max-width:720px){.brand-watermark{display:none}}
body.opening-trainer-active .landing{display:none}
body.opening-trainer-active main{display:none}
body:not(.opening-trainer-active) .opening-trainer-view{display:none}
body.games-active .nav{display:flex}
body.games-active .app{margin-left:196px}
body.games-active header{padding:18px 34px;align-items:center;justify-content:center}
body.games-active #batchStatus{position:absolute;right:34px;bottom:4px;min-width:0;max-width:calc(100% - 68px);text-align:right;pointer-events:none}
body.games-active .top-title{display:none}
body.games-active .top-title h1{font-size:24px;margin:0}
body.games-active #meta{display:none}
.matchup-header{display:flex;align-items:center;gap:10px;min-width:0;max-width:780px}
.match-player{display:flex;align-items:center;gap:8px;min-width:0;flex:1 1 0}
.match-player.black{justify-content:flex-end;text-align:right}
.match-player img,.match-player>i{width:34px;height:34px;border-radius:12px;flex:0 0 auto;display:grid;place-items:center;object-fit:cover;background:linear-gradient(145deg,rgba(125,211,252,.17),rgba(255,255,255,.055));border:1px solid rgba(125,211,252,.20);box-shadow:0 10px 24px rgba(0,0,0,.22);color:#dff7ff;font-style:normal;font-weight:850;font-size:11px}
.match-copy{display:grid;gap:2px;min-width:0}
.match-copy b{display:flex;align-items:center;gap:5px;min-width:0;max-width:100%;font-size:14px;line-height:1.1;color:#f8fbff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.match-copy strong{flex:0 0 auto;padding:2px 4px;border-radius:7px;background:rgba(125,211,252,.12);border:1px solid rgba(125,211,252,.20);color:#dff7ff;font-size:9px;line-height:1}
.match-flag{flex:0 0 auto;font-style:normal}
.match-copy small{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.match-result{flex:0 0 auto;padding:5px 9px;border-radius:999px;background:rgba(125,211,252,.11);border:1px solid rgba(125,211,252,.24);color:#e0f7ff;font-size:12px;font-weight:850;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.top-search{display:none;gap:10px;align-items:center;flex:1;max-width:520px}
.top-search input{height:46px}
.top-search button{height:46px;white-space:nowrap;background:linear-gradient(135deg,#0a84ff,#0066d6)}
body.games-active .top-search,body.analysis-active .top-search{display:flex}
.active-player{display:none;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.055);padding:10px 14px;min-width:170px}
.active-player span{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.07em}
.active-player b{display:block}
.active-player small{color:var(--muted)}
body.games-active .top-search{display:none}
body.games-active.mobile-search-open .top-search{display:flex;max-width:min(520px,100%);padding:8px;border:1px solid rgba(125,211,252,.14);border-radius:18px;background:rgba(8,13,22,.72);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.active-player .change-player{display:inline-flex}
body.games-active .active-player{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;max-width:1040px;min-width:0;padding:10px 12px;border-radius:22px;background:linear-gradient(145deg,rgba(20,28,40,.78),rgba(9,12,18,.66));border-color:rgba(125,211,252,.14);box-shadow:0 18px 50px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.08)}
body.games-active main{display:block;max-width:1040px;padding:30px}
body.games-active .board-panel,
body.games-active .opening-card,
body.games-active .side>.card:not(.drawer-card),
body.games-active .analysis-tabs,
body.games-active .global-controls,
body.games-active .tab-pane{display:none!important}
body.games-active .side{display:block}
body.games-active .drawer-card{opacity:1!important;max-width:100%;padding:28px}
body.games-active .drawer-card>h2{display:none}
body.games-active .drawer-card #gamePicker{max-height:none!important}
body.games-active .gamepick.rich{grid-template-columns:64px minmax(220px,1fr) 82px 58px 58px 96px;padding:16px}
body.analysis-active .landing{display:none}
body.analysis-active .app{display:block}
body.analysis-active .nav{display:flex}
body.analysis-active .drawer-card{display:none}
.back-btn{display:none}
body.analysis-active .back-btn{display:inline-flex}
body.learning-active .landing{display:none}
body.learning-active .app{display:block}
body.learning-active .nav{display:flex}
body.learning-active .drawer-card,
body.learning-active .analysis-tabs,
body.learning-active .global-controls,
body.learning-active .tab-pane,
body.learning-active .controls.board-controls,
body.learning-active #mobileAnalysisTabs,
body.learning-active #mobileMoveNav,
body.learning-active #mobileReviewStrip{display:none!important}
body.learning-active .learning-center-card{display:block}
body:not(.learning-active) .learning-center-card{display:none}
.learning-nav-btn{margin-top:8px;background:rgba(125,211,252,.10);border-color:rgba(125,211,252,.20)}
.learning-center-card{border-color:rgba(125,211,252,.22);background:linear-gradient(180deg,rgba(16,34,57,.88),rgba(12,14,19,.88))}
.learning-head{display:grid;gap:9px}
.learning-head span{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.learning-head b{font-size:22px;line-height:1.15;color:#f8fbff}
.learning-head p{margin:0;color:#b9c2cf;line-height:1.45}
.learning-meta{display:grid;gap:7px;margin:8px 0 12px}
.learning-meta span{padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.045);color:#dbe7ff;font-size:13px}
.learning-box small{display:block;margin:4px 0 8px;color:var(--muted);font-weight:700}
.learning-actions{margin-top:14px}
.learning-more{display:grid;gap:7px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.learning-more button,.learning-actions #learningAnalyzeMore{justify-self:start;background:rgba(125,211,252,.12);border-color:rgba(125,211,252,.26);color:#dff7ff}
.learning-more span{color:var(--muted);font-size:13px}
.training-label{display:inline-flex;white-space:nowrap}
.training-label span{transition:color .35s ease}
nav button.training-arena-loading .training-label span{animation:trainingLetter 2.8s ease-in-out infinite;animation-delay:calc(var(--i)*95ms)}
nav button.training-arena-ready{animation:trainingReadyPulse 2.8s ease-out 2}
@keyframes trainingLetter{0%,38%{color:#cbd3df}58%,100%{color:#fff}}
@keyframes trainingReadyPulse{0%,100%{box-shadow:none}35%{box-shadow:0 0 0 1px rgba(214,166,74,.18),0 0 18px rgba(214,166,74,.16);border-color:rgba(214,166,74,.30)}}
@media(prefers-reduced-motion:reduce){nav button.training-arena-loading .training-label span,nav button.training-arena-ready{animation:none}.training-label span{color:inherit}}
.learning-progress{height:7px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);overflow:hidden}
.learning-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#0ea5e9,#22c55e);box-shadow:0 0 16px rgba(34,211,238,.26);transition:width .25s ease}
body.learning-active main{grid-template-columns:minmax(0,680px) minmax(300px,420px);gap:24px;max-width:1180px;align-items:start;justify-content:center;overflow-x:hidden}
body.learning-active .board-panel{min-width:0;overflow:visible;padding:18px}
body.learning-active .board-shell{min-width:0;width:100%;align-items:center}
body.learning-active .board-wrap{width:min(100%,680px,max(420px,calc(100vh - 210px)));max-width:100%;min-width:0;aspect-ratio:1/1}
body.learning-active #board{width:100%!important;max-width:100%!important;height:auto!important;aspect-ratio:1/1}
body.learning-active #board .board-b72b1{width:100%!important;height:100%!important}
body.learning-active .learning-center-card{min-width:0;align-self:start}
body.learning-active.learning-loading main,
body.learning-active.learning-empty main,
body.learning-choice main,
body.learning-complete main{grid-template-columns:minmax(0,720px);max-width:760px}
body.learning-active.learning-loading .board-panel,
body.learning-active.learning-empty .board-panel,
body.learning-choice .board-panel,
body.learning-complete .board-panel{display:none!important}
body.learning-choice #batchStatus{display:none!important}
body.learning-active.learning-ready .learning-center-card{display:block}
.analysis-tabs{display:flex;gap:8px;margin-bottom:12px}
.analysis-tabs button{flex:1;padding:9px 10px;font-size:12px;box-shadow:none}
.board-player{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;padding:10px 13px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.05)}
.board-player.bottom{margin:12px 0 0}
.board-player b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board-player span{color:var(--muted);font-size:12px}
.board-timestamp{margin:6px 2px 0;color:var(--muted);font-size:12px;line-height:1.25}
body.analysis-active .board-player,
body.analysis-active .board-timestamp,
body.learning-active .board-player,
body.learning-active .board-timestamp{display:none!important}
@media(max-width:850px){
 body.games-active header,body.analysis-active header{display:grid}
 .top-search{max-width:none;width:100%}
 body.games-active main{max-width:100vw;width:100%;padding:16px;overflow-x:hidden}
 body.games-active .side,body.games-active .drawer-card,body.games-active #gamePicker{width:100%;max-width:100%;min-width:0}
 body.games-active .drawer-card{padding:16px;border-radius:22px}
 body.games-active .gamepick.rich{width:100%;max-width:100%;min-width:0;grid-template-columns:1fr;gap:10px;padding:14px;overflow:hidden}
 body.games-active .gamepick.rich>*{min-width:0;max-width:100%}
 body.games-active .players b{white-space:normal;overflow-wrap:anywhere}
 body.games-active .colorpill,.card-cta{justify-self:start}
 .active-player{width:100%}
  body.learning-active main{grid-template-columns:1fr;max-width:100vw;padding:16px}
  body.learning-active.learning-ready main{display:grid}
  body.learning-active.learning-ready .side{order:2}
  body.learning-active.learning-ready .learning-center-card{order:2}
  body.learning-active.learning-ready .board-panel{order:1}
  body.learning-active .learning-center-card{border-radius:22px;padding:16px}
  body.learning-active .board-panel{padding:12px}
  body.learning-active.learning-ready:not(.blunder-rush-active) main{padding:10px 12px 18px;gap:10px;align-content:start}
  body.learning-active.learning-ready:not(.blunder-rush-active) .side{order:2}
  body.learning-active.learning-ready:not(.blunder-rush-active) .board-panel{order:1;padding:8px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.025));box-shadow:0 18px 48px rgba(0,0,0,.30)}
  body.learning-active.learning-ready:not(.blunder-rush-active) .learning-center-card{padding:9px 10px;border-radius:18px;background:rgba(255,255,255,.035);border-color:rgba(125,211,252,.14);box-shadow:none}
  body.learning-active.learning-ready:not(.blunder-rush-active) .learning-box{gap:6px;padding:10px;border-radius:16px;background:rgba(255,255,255,.035)}
  body.learning-active.learning-ready:not(.blunder-rush-active) .learning-box>b{font-size:16px;line-height:1.15}
  body.learning-active.learning-ready:not(.blunder-rush-active) .learning-box>span:not(.variation-played){font-size:13px}
  body.learning-active.learning-ready:not(.blunder-rush-active) .arena-goal-progress{height:6px}
  body.learning-active.learning-ready:not(.blunder-rush-active) .arena-goal-stats{display:flex!important;gap:6px!important;margin:0!important}
  body.learning-active.learning-ready:not(.blunder-rush-active) .arena-goal-stats span{flex:1;padding:6px 8px;font-size:10px}
  body.learning-active.learning-ready:not(.blunder-rush-active) .arena-goal-stats b{font-size:13px}
  body.learning-active.learning-ready:not(.blunder-rush-active) .variation-played{font-size:11px;line-height:1.25}
  body.learning-active.learning-ready:not(.blunder-rush-active) .variation-box div{margin-top:2px}
  body.learning-active.learning-ready:not(.blunder-rush-active) .learning-more{display:none}
  body.learning-choice .board-panel{display:none!important}
  body.learning-choice .nav-daily-status{display:none!important}
  body.learning-choice #batchStatus{display:none!important}
  body.learning-choice main{gap:10px;align-content:start}
  body.learning-choice .side{order:1}
  body.learning-choice .learning-center-card{margin-top:10px}
  body.learning-choice .mistake-mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.learning-choice .mistake-mode-grid .blunder-choice-card.daily{grid-column:1/-1;min-height:78px}
  body.learning-choice .mistake-mode-grid .blunder-choice-card{min-height:104px;padding:11px!important}
  body.learning-choice .mistake-mode-grid .blunder-choice-card b{font-size:18px;line-height:1.12}
  body.learning-choice .mistake-mode-grid .blunder-choice-card span{font-size:10px;letter-spacing:.10em}
  body.learning-active .board-shell{gap:9px}
  body.learning-active .evalbar{width:9px}
  body.blunder-rush-active.learning-ready main{padding:8px 10px 14px;gap:8px;align-content:start}
  body.blunder-rush-active .nav-daily-status{display:none!important}
  body.blunder-rush-active.learning-ready .board-panel{order:1;padding:8px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));box-shadow:0 18px 48px rgba(0,0,0,.32)}
  body.blunder-rush-active.learning-ready .side{order:2}
  body.blunder-rush-active.learning-ready .learning-center-card{padding:10px;border-radius:20px;background:transparent;border-color:transparent;box-shadow:none}
  body.blunder-rush-active .board-player{display:none}
  body.blunder-rush-active .board-shell{gap:4px}
  body.blunder-rush-active .board-wrap{width:min(100%,calc(100vh - 342px),390px);min-width:292px}
  body.blunder-rush-active .evalbar{width:7px;min-height:292px}
  body.blunder-rush-active .blunder-rush-box{padding:10px;border-radius:18px}
  body.blunder-rush-active .blunder-rush-hud{gap:6px!important;margin-right:30px!important}
  body.blunder-rush-active .blunder-rush-hud span{padding:7px 8px}
  body.blunder-rush-active .blunder-rush-hud b{font-size:18px}
  body.blunder-rush-active .variation-played,.rush-prompt{font-size:11px}
}

.games-usp{margin:0 0 14px;color:#b9c2cf;font-size:15px;line-height:1.45}
.game-result{display:grid;gap:3px;min-width:72px}
.game-result b{font-size:16px}
.game-result small{color:var(--muted);font-size:11px}
.color-dot{display:inline-block;width:12px;height:12px;border-radius:999px;margin-right:9px;vertical-align:-1px;box-shadow:0 0 0 1px rgba(255,255,255,.18)}
.white-dot{background:#f5f5f7}
.black-dot{background:#111318}
.card-cta{justify-self:end;padding:9px 13px;border-radius:999px;background:linear-gradient(135deg,#0a84ff,#0066d6);color:white;font-size:13px;font-weight:760;white-space:nowrap;box-shadow:0 10px 26px rgba(10,132,255,.24)}
body.games-active .gamepick.rich{grid-template-columns:76px minmax(240px,1fr) 82px 78px 96px 58px 160px}
body.games-active .scores{display:none}

.tab-pane{display:none}
.tab-pane.active{display:grid;gap:18px}
.analysis-tabs button.active{background:rgba(10,132,255,.18);border-color:rgba(10,132,255,.32);color:#fff}
.summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:16px}
.summary-grid div,.cat{border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.045);padding:12px}
.summary-grid span{display:block;color:var(--muted);font-size:12px;margin-bottom:6px}
.summary-grid b{font-size:15px}
.category-counts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.summary-desktop .accuracy-grid{margin-bottom:12px}
.summary-desktop .category-counts{margin-bottom:14px}
.cat{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px}
.cat b{width:28px;height:28px;border-radius:10px;display:grid;place-items:center}
.cat span{font-size:13px;color:#dbe3ee}
.cat em{font-style:normal;color:var(--muted);font-weight:800}
.cat.brilliant b{background:#7dd3fc;color:#04131f}
.cat.beautiful b{background:#38bdf8;color:#04131f}
.cat.top b{background:#22c55e;color:#031307}
.cat.good b{background:#16a34a;color:white}
.cat.ok b{background:#86efac;color:#052e12}
.cat.theory b{background:#8b5e34;color:#fff7ed}
@media(max-width:850px){.summary-grid,.category-counts{grid-template-columns:1fr}}


/* Premium board arrows and move-quality annotations */
.quality-mark{position:absolute;right:-2px;top:-2px;z-index:6;min-width:23px;height:23px;padding:0 5px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:12px;line-height:1;letter-spacing:-.01em;border:1px solid rgba(255,255,255,.22);box-shadow:0 7px 18px rgba(0,0,0,.34),0 0 16px var(--quality-glow,rgba(255,255,255,.12));pointer-events:none}
.quality-mark.brilliant{background:linear-gradient(180deg,#7dd3fc,#0891b2);color:#03121d;--quality-glow:rgba(125,211,252,.62);text-shadow:0 0 9px rgba(236,254,255,.8)}
.quality-mark.beautiful{background:linear-gradient(180deg,#60a5fa,#2563eb);color:#eff6ff;--quality-glow:rgba(96,165,250,.46)}
.quality-mark.top{background:linear-gradient(180deg,#34d399,#16a34a);color:#031307;--quality-glow:rgba(52,211,153,.42);font-size:14px}
.quality-mark.good{background:linear-gradient(180deg,#86efac,#22c55e);color:#052e16;--quality-glow:rgba(34,197,94,.28)}
.quality-mark.ok{background:linear-gradient(180deg,#dcfce7,#86efac);color:#14532d;--quality-glow:rgba(134,239,172,.20);opacity:.9}
.quality-mark.theory{background:linear-gradient(180deg,#9a6a40,#713f12);color:#fff7ed;--quality-glow:rgba(180,83,9,.36);font-size:11px}
.quality-mark.mistake{background:linear-gradient(180deg,#ffb340,#ff9f0a);color:#1f1200;--quality-glow:rgba(255,159,10,.50)}
.quality-mark.blunder{background:linear-gradient(180deg,#ff6961,#ff453a);color:white;--quality-glow:rgba(255,69,58,.56);font-size:11px}
.arrow-line{stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;filter:drop-shadow(0 3px 8px rgba(0,0,0,.38))}
.arrow-line.best{stroke:#32d74b;stroke-width:3.6;opacity:.78;filter:drop-shadow(0 0 5px rgba(50,215,75,.30))}
.arrow-line.alt1{stroke:#0a84ff;stroke-width:2.6;opacity:.30}
.arrow-line.alt2{stroke:#0a84ff;stroke-width:2.1;opacity:.18}
.arrow-head.best{fill:#32d74b;opacity:.78}
.arrow-head.alt1{fill:#0a84ff;opacity:.32}
.arrow-head.alt2{fill:#0a84ff;opacity:.20}

/* Interactive Summary and refined eval/arrows */
.evalbar{width:16px;min-height:360px;background:linear-gradient(180deg,rgba(245,245,247,.92) 0 50%,rgba(20,24,32,.96) 50% 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 10px 28px rgba(0,0,0,.25)}
#evalFill{background:linear-gradient(180deg,#8fd3ff,#0a84ff);box-shadow:0 0 18px rgba(10,132,255,.35)}
.eval-graph{height:96px;display:flex;align-items:center;gap:2px;margin:2px 0 16px;padding:12px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.035)}
.eval-graph.empty{height:auto;color:var(--muted)}
.eval-bar{flex:1;min-width:3px;height:100%;align-items:center;padding:0;border:0;border-radius:7px;background:rgba(255,255,255,.045);box-shadow:none;overflow:hidden;transform:none}
.eval-bar:hover{transform:none;background:rgba(255,255,255,.09)}
.eval-bar span{display:block;width:100%;border-radius:7px;background:rgba(10,132,255,.45)}
.eval-bar.white{align-items:flex-start}.eval-bar.black{align-items:flex-end}
.eval-bar.black span{background:rgba(148,163,184,.45)}
.eval-bar.active{outline:2px solid rgba(125,211,252,.85);outline-offset:2px;background:rgba(125,211,252,.15)}
.category-counts .cat{appearance:none;text-align:left;box-shadow:none;cursor:pointer;width:100%;padding:12px;border:1px solid var(--line);background:rgba(255,255,255,.045);border-radius:16px;color:var(--text)}
.category-counts .cat.disabled{opacity:.42;cursor:not-allowed;filter:saturate(.55)}
.category-counts .cat.current,.review-chip.current{transform:translateY(-1px) scale(1.015);border-color:rgba(125,211,252,.42);box-shadow:0 0 0 1px rgba(125,211,252,.15),0 0 24px rgba(125,211,252,.18);background:rgba(125,211,252,.08)}
.category-counts .cat.brilliant.current,.category-counts .cat.beautiful.current,.review-chip.brilliant.current,.review-chip.beautiful.current{border-color:rgba(125,211,252,.52);box-shadow:0 0 0 1px rgba(125,211,252,.20),0 0 28px rgba(125,211,252,.25)}
.category-counts .cat.top.current,.category-counts .cat.good.current,.category-counts .cat.ok.current,.review-chip.top.current,.review-chip.good.current,.review-chip.ok.current{border-color:rgba(34,197,94,.42);box-shadow:0 0 0 1px rgba(34,197,94,.14),0 0 24px rgba(34,197,94,.18)}
.category-counts .cat.theory.current,.review-chip.theory.current{border-color:rgba(216,180,122,.42);box-shadow:0 0 0 1px rgba(216,180,122,.14),0 0 22px rgba(216,180,122,.16)}
.category-counts .cat.mistake.current,.review-chip.mistake.current{border-color:rgba(255,159,10,.50);box-shadow:0 0 0 1px rgba(255,159,10,.17),0 0 26px rgba(255,159,10,.20)}
.category-counts .cat.blunder.current,.review-chip.blunder.current{border-color:rgba(255,69,58,.52);box-shadow:0 0 0 1px rgba(255,69,58,.18),0 0 28px rgba(255,69,58,.22)}
.cat.brilliant b{background:#7dd3fc;color:#04131f;box-shadow:0 0 20px rgba(125,211,252,.62),0 0 42px rgba(125,211,252,.20)}
.cat.brilliant b{animation:genius-shimmer 2.8s ease-in-out infinite}
.quality-mark.brilliant{animation:genius-shimmer 2.8s ease-in-out infinite}
@keyframes genius-shimmer{0%,100%{filter:brightness(1)}50%{filter:brightness(1.24)}}
.arrow-line.best{stroke:#7dd3fc;stroke-width:4.8;opacity:.74;filter:drop-shadow(0 0 7px rgba(125,211,252,.36))}
.arrow-line.alt1{stroke:#38bdf8;stroke-width:3.6;opacity:.42;filter:drop-shadow(0 0 5px rgba(56,189,248,.20))}
.arrow-line.alt2{stroke:#38bdf8;stroke-width:3;opacity:.26;filter:drop-shadow(0 0 4px rgba(56,189,248,.16))}
.arrow-head.best{fill:#7dd3fc;opacity:.76}
.arrow-head.alt1{fill:#38bdf8;opacity:.44}
.arrow-head.alt2{fill:#38bdf8;opacity:.28}

/* Analysis layout polish */
body.analysis-active main{grid-template-columns:minmax(620px,760px) minmax(360px,1fr);gap:24px;max-width:1620px;padding:24px 28px}
body.analysis-active .board-panel{padding:22px 22px 18px;border-radius:30px;background:linear-gradient(180deg,rgba(24,27,34,.82),rgba(9,11,15,.88));box-shadow:0 36px 110px rgba(0,0,0,.48)}
body.analysis-active .board-wrap{max-width:680px}
body.analysis-active #board{max-width:680px;border-radius:24px;box-shadow:0 28px 85px rgba(0,0,0,.62),inset 0 0 0 1px rgba(255,255,255,.12)}
.white-1e1d7{background:#d9c49d!important;color:rgba(20,16,12,.55)!important}
.black-3c85d{background:#94704f!important;color:rgba(255,255,255,.55)!important}
.notation-322f9{font-weight:700;opacity:.62}
.analysis-tabs{display:flex;gap:8px;margin-bottom:8px;padding:4px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.035)}
.analysis-tabs button{flex:1;min-height:38px;padding:8px 10px;border-radius:14px;font-size:12px;box-shadow:none;background:transparent;border-color:transparent;color:#cfe3f7}
.analysis-tabs button.active{background:rgba(125,211,252,.13);border-color:rgba(125,211,252,.24);color:#dff7ff}
body.analysis-active .card{border-radius:24px;padding:18px}
body.analysis-active .summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px}
body.analysis-active .summary-grid div{padding:11px 12px;border-radius:15px}
.evalbar{position:relative;width:18px;min-height:440px;border-radius:999px;background:linear-gradient(180deg,rgba(245,245,247,.95) 0 50%,rgba(11,15,23,.98) 50% 100%)}
.evalbar:after{content:"";position:absolute;left:-5px;right:-5px;bottom:calc(var(--eval-pct,50%) - 4px);height:8px;border-radius:999px;background:#7dd3fc;box-shadow:0 0 16px rgba(125,211,252,.70);border:1px solid rgba(255,255,255,.42)}
#evalFill{border-radius:999px;background:linear-gradient(180deg,#bae6fd,#0ea5e9 60%,#075985);transition:height .22s ease}
.eval-graph{height:82px;gap:3px;margin:0 0 13px;padding:10px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025))}
.eval-bar{position:relative;border-radius:8px;transition:background .15s ease,outline .15s ease}
.eval-bar span{border-radius:8px;background:linear-gradient(180deg,rgba(125,211,252,.72),rgba(14,165,233,.38))}
.eval-bar.black span{background:linear-gradient(180deg,rgba(100,116,139,.45),rgba(30,41,59,.78))}
.eval-bar.top span{background:linear-gradient(180deg,rgba(34,197,94,.85),rgba(21,128,61,.48))}
.eval-bar.mistake span{background:linear-gradient(180deg,rgba(251,146,60,.9),rgba(239,68,68,.52))}
.eval-bar.book span{background:linear-gradient(180deg,rgba(180,126,72,.82),rgba(92,58,33,.62))}
.eval-bar i{position:absolute;top:-7px;left:50%;transform:translateX(-50%);font-style:normal;font-size:10px;line-height:1;background:rgba(5,6,8,.9);border:1px solid var(--line);border-radius:999px;padding:2px 4px;color:#e5f6ff}
.eval-bar.active{outline:2px solid rgba(125,211,252,.85);outline-offset:2px;background:rgba(125,211,252,.18)}
.opening-card{padding:13px 15px;background:linear-gradient(180deg,rgba(12,29,49,.78),rgba(18,20,25,.82));border-color:rgba(125,211,252,.18)}
.opening-card h2{display:grid;gap:3px;margin:0;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#8ec5ff}
.opening-card h2 b{font-size:15px;text-transform:none;letter-spacing:-.02em;color:#f5f5f7}
.opening-card h2:after{content:""}
.opening-card #openingSummary{display:block;margin-top:8px;color:#c6d0df;font-size:13px;line-height:1.35}
.opening-card #openingPlans{display:none;margin-top:12px}
.opening-card.open #openingPlans{display:grid;gap:12px}
.opening-cta{width:max-content;padding:8px 12px;border-radius:999px;background:rgba(125,211,252,.12);border-color:rgba(125,211,252,.24);color:#dff7ff;font-size:12px;box-shadow:none}
@media(max-width:1250px){body.analysis-active main{grid-template-columns:1fr}.evalbar{min-height:360px}}

/* Keep analysis tabs compact inside the side grid */
body.analysis-active .side{align-content:start}
body.analysis-active .analysis-tabs{align-self:start;height:auto;min-height:0;align-items:center}
body.analysis-active .analysis-tabs button{height:38px;min-height:38px;max-height:38px;padding:0 10px}
body.sandbox-analysis-active .side>.analysis-tabs,
body.sandbox-analysis-active #mobileAnalysisTabs,
body.sandbox-analysis-active .global-controls{display:none!important}
body.sandbox-analysis-active #tab-analysis{display:grid!important}

/* Analysis view proportion/sidebar/navigation refinements */
.home-btn{display:none;width:100%;justify-content:center;background:rgba(125,211,252,.10);border-color:rgba(125,211,252,.24);color:#dff7ff;box-shadow:none}
body.analysis-active .nav{width:196px;padding:18px 14px;gap:14px}
body.analysis-active .app{margin-left:196px}
body.analysis-active .search,body.analysis-active .navnote{display:block}
body.analysis-active .brand b{font-size:15px}
body.analysis-active .logo{width:36px;height:36px;border-radius:13px;font-size:20px}
body.analysis-active .home-btn{display:none}
body.analysis-active main{grid-template-columns:minmax(560px,690px) minmax(360px,1fr);max-width:1460px;padding:20px 24px;gap:22px}
body.analysis-active .board-panel{padding:18px;border-radius:26px}
body.analysis-active .board-wrap{max-width:620px}
body.analysis-active #board{max-width:620px;border-radius:22px}
body.analysis-active .board-player{padding:9px 12px;margin-bottom:10px}
body.analysis-active .board-player.bottom{margin-top:10px}
.board-controls{display:none!important}
.analysis-move-ghost{position:absolute;z-index:24;pointer-events:none;transition:transform .22s ease;will-change:transform}
.analysis-piece-hidden{visibility:hidden!important}
.panel-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:14px}
.panel-controls button{padding:9px 8px;border-radius:14px;background:linear-gradient(135deg,rgba(14,165,233,.26),rgba(10,132,255,.16));border-color:rgba(125,211,252,.25);color:#dff7ff;box-shadow:none;font-size:12px}
.panel-controls button:hover{background:linear-gradient(135deg,rgba(14,165,233,.34),rgba(10,132,255,.24))}
/* two-tone eval bar: white area grows upward, black area fills the rest */
.evalbar{position:relative;width:16px;min-height:390px;background:#111827;border-color:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 10px 26px rgba(0,0,0,.28)}
#evalFill{position:absolute;left:0;right:0;bottom:0;height:var(--white-pct,50%);background:linear-gradient(180deg,#f8fafc,#dbe4ef);box-shadow:none;border-radius:0 0 999px 999px;transition:height .22s ease}
.evalbar:before{content:"";position:absolute;left:0;right:0;top:0;bottom:var(--white-pct,50%);background:linear-gradient(180deg,#151b27,#0a0d13);border-radius:999px 999px 0 0;z-index:0}
.evalbar:after{content:"";position:absolute;left:-5px;right:-5px;bottom:calc(var(--white-pct,50%) - 3px);height:6px;border-radius:999px;background:rgba(255,255,255,.72);box-shadow:0 0 10px rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.28)}
.category-counts{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.category-counts .cat{min-height:50px;padding:9px 10px}
.cat.top b{font-size:17px;line-height:1;transform:scale(1.08)}
.cat.mistake b{background:var(--orange);color:#1f1200}
.cat.blunder b{background:var(--red);color:white}
/* consistent premium cyan arrows */
.arrow-line.best{stroke:#7dd3fc;stroke-width:6.2;opacity:.82;filter:drop-shadow(0 0 8px rgba(125,211,252,.42))}
.arrow-line.alt1{stroke:#38bdf8;stroke-width:4.6;opacity:.56;filter:drop-shadow(0 0 6px rgba(56,189,248,.25))}
.arrow-line.alt2{stroke:#38bdf8;stroke-width:4;opacity:.38;filter:drop-shadow(0 0 5px rgba(56,189,248,.18))}
.arrow-head.best{fill:#7dd3fc;opacity:.84}
.arrow-head.alt1{fill:#38bdf8;opacity:.58}
.arrow-head.alt2{fill:#38bdf8;opacity:.42}
@media(max-width:1050px){body.analysis-active .nav{width:auto}body.analysis-active .app{margin-left:0}.panel-controls{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Right-side normalized eval graph + icon navigation */
.eval-graph{position:relative;height:92px;display:block;margin:0 0 13px;padding:0 14px;border-radius:18px;overflow:hidden;background:linear-gradient(180deg,rgba(248,250,252,.055),rgba(10,14,22,.04) 50%,rgba(15,23,42,.12));border:1px solid var(--line)}
.eval-zero{position:absolute;left:12px;right:12px;top:50%;height:1px;background:rgba(255,255,255,.22);box-shadow:0 0 10px rgba(255,255,255,.06)}
.eval-point{position:absolute;width:18px;height:18px;min-width:18px;padding:0;border:0;border-radius:999px;background:transparent;box-shadow:none;transform:translate(-50%,-50%);z-index:2}
.eval-point:hover{transform:translate(-50%,-50%) scale(1.08);background:transparent}
.eval-point span{display:block;width:8px;height:8px;margin:auto;border-radius:999px;background:#7dd3fc;box-shadow:0 0 10px rgba(125,211,252,.45)}
.eval-point.black span{background:#94a3b8;box-shadow:0 0 8px rgba(148,163,184,.25)}
.eval-point.top span{background:#22c55e}.eval-point.mistake span{background:#fb923c}.eval-point.book span{background:#9a6a40}
.eval-point.active span{width:13px;height:13px;background:#e0f2fe;box-shadow:0 0 0 3px rgba(125,211,252,.24),0 0 18px rgba(125,211,252,.55)}
.eval-point i{position:absolute;top:-13px;left:50%;transform:translateX(-50%);font-style:normal;font-size:10px;line-height:1;background:rgba(5,6,8,.92);border:1px solid var(--line);border-radius:999px;padding:2px 4px;color:#e5f6ff;white-space:nowrap}
.eval-point.start span{background:rgba(255,255,255,.45);box-shadow:none}
.panel-controls{grid-template-columns:.75fr 1.25fr 1.25fr .75fr;gap:9px}
.panel-controls button{min-height:42px;padding:0;border-radius:15px;background:linear-gradient(135deg,rgba(14,165,233,.30),rgba(10,132,255,.18));border-color:rgba(125,211,252,.28);color:#e0f2fe;font-size:24px;font-weight:800;line-height:1;box-shadow:0 10px 26px rgba(10,132,255,.10)}
.panel-controls .nav-step{font-size:31px}.panel-controls .nav-jump{font-size:24px}
.panel-controls button:hover{background:linear-gradient(135deg,rgba(14,165,233,.42),rgba(10,132,255,.26));border-color:rgba(125,211,252,.40)}

/* Cleaner analysis header and sparse premium summary graph */
body.analysis-active header .top-search,body.analysis-active header #batchStatus{display:none!important}
body.analysis-active header{padding:18px 28px;align-items:center}
body.analysis-active header h1{font-size:30px;margin-bottom:2px}
body.analysis-active .back-btn{display:inline-flex;padding:9px 14px;border-radius:999px;background:rgba(255,255,255,.07);box-shadow:none}
.eval-graph{background:linear-gradient(180deg,rgba(11,15,23,.88) 0 50%,rgba(248,250,252,.78) 50% 100%);cursor:crosshair}
.eval-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.eval-svg polygon{fill:rgba(125,211,252,.16)}
.eval-svg polyline{fill:none;stroke:#7dd3fc;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px rgba(125,211,252,.25))}
.eval-zero{background:rgba(255,255,255,.42)}
.eval-point{z-index:4}
.eval-point:not(.active):not(.start) span{width:10px;height:10px}
.eval-point.blunder span{background:#ff453a;box-shadow:0 0 12px rgba(255,69,58,.48)}
.eval-point.mistake span{background:#ff9f0a;box-shadow:0 0 12px rgba(255,159,10,.45)}
.eval-point.brilliant span,.eval-point.beautiful span{background:#7dd3fc;box-shadow:0 0 14px rgba(125,211,252,.55)}

/* Eval number and unclipped graph markers */
.evalbar{overflow:visible}
#evalNumber{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-90deg);z-index:3;padding:3px 7px;border-radius:999px;background:rgba(5,6,8,.72);border:1px solid rgba(255,255,255,.16);color:#f8fafc;font-size:11px;font-weight:800;letter-spacing:.02em;white-space:nowrap;box-shadow:0 6px 18px rgba(0,0,0,.28)}
.eval-graph{overflow:visible;padding-top:14px;padding-bottom:10px;margin-top:6px}
.eval-point i.mark{top:-19px;font-weight:900;border-radius:10px;border:1px solid rgba(255,255,255,.22);box-shadow:0 8px 18px rgba(0,0,0,.26)}
.eval-point i.mark.brilliant{background:#7dd3fc;color:#04131f;box-shadow:0 0 18px rgba(125,211,252,.58)}
.eval-point i.mark.beautiful{background:#38bdf8;color:#04131f}
.eval-point i.mark.mistake{background:var(--orange);color:#1f1200}
.eval-point i.mark.blunder{background:var(--red);color:white}

/* Final visual calm: eval bar, graph markers, arrows, opening card */
.evalbar{width:14px;min-height:380px;overflow:visible;background:#0b1018;border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 0 0 1px rgba(255,255,255,.035),0 10px 24px rgba(0,0,0,.24)}
.evalbar:before{content:"";position:absolute;inset:0 0 var(--white-pct,50%) 0;background:#0b1018;border-radius:999px 999px 0 0;z-index:0}
.evalbar:after{content:none!important}
#evalFill{position:absolute;left:0;right:0;bottom:0;height:var(--white-pct,50%);background:linear-gradient(180deg,#f4f7fb,#cbd5e1);border-radius:0 0 999px 999px;box-shadow:none;z-index:1;transition:height .22s ease}
#evalNumber{left:50%;top:50%;transform:translate(-50%,-50%) rotate(-90deg);font-size:10px;padding:2px 6px;background:rgba(6,8,12,.78);border-color:rgba(255,255,255,.14);box-shadow:0 4px 12px rgba(0,0,0,.24);z-index:4}
.eval-graph{height:100px;padding-top:22px;padding-bottom:12px;overflow:visible;background:linear-gradient(180deg,rgba(9,13,20,.9) 0 50%,rgba(245,247,251,.72) 50% 100%)}
.eval-svg polygon{fill:rgba(125,211,252,.12)}
.eval-svg polyline{stroke:#88d8ff;stroke-width:2;filter:drop-shadow(0 0 4px rgba(125,211,252,.22))}
.eval-point{width:15px;height:15px;min-width:15px}
.eval-point span{width:7px;height:7px}
.eval-point:not(.active):not(.start) span{width:8px;height:8px;opacity:.88}
.eval-point.active span{width:12px;height:12px;box-shadow:0 0 0 3px rgba(125,211,252,.22),0 0 14px rgba(125,211,252,.48)}
.eval-point i.mark{top:-17px;font-size:9px;padding:2px 4px;opacity:.88;box-shadow:0 5px 14px rgba(0,0,0,.22)}
.eval-point i.mark.mistake{background:rgba(255,159,10,.88);color:#1f1200}
.eval-point i.mark.blunder{background:rgba(255,69,58,.88);color:white}
.eval-point i.mark.brilliant{background:rgba(125,211,252,.92);color:#04131f;box-shadow:0 0 14px rgba(125,211,252,.45)}
.eval-point i.mark.beautiful{background:rgba(56,189,248,.88);color:#04131f}
.arrow-line.best{stroke:#7dd3fc;stroke-width:6.6;opacity:.88;filter:drop-shadow(0 0 8px rgba(125,211,252,.42))}
.arrow-line.alt1{stroke:#38bdf8;stroke-width:5;opacity:.62;filter:drop-shadow(0 0 6px rgba(56,189,248,.26))}
.arrow-line.alt2{stroke:#38bdf8;stroke-width:4.4;opacity:.46;filter:drop-shadow(0 0 5px rgba(56,189,248,.20))}
.arrow-head.best{fill:#7dd3fc;opacity:.9}.arrow-head.alt1{fill:#38bdf8;opacity:.66}.arrow-head.alt2{fill:#38bdf8;opacity:.52}
.opening-card #openingSummary{font-size:13px;line-height:1.35;max-width:72ch}
.opening-card #openingPlans ul{margin:0;padding-left:18px;color:#c6d0df;line-height:1.45;font-size:13px}
.opening-card #openingPlans li{margin:2px 0}

/* Graph tooltip + marker click cleanup */
.eval-svg polyline{stroke-width:1.45;opacity:.9}
.eval-point.important span{display:none}
.eval-point.important{width:auto;min-width:0;height:auto}
.eval-point.important i.mark{position:static;display:grid;place-items:center;transform:none;min-width:22px;height:20px;padding:0 5px;font-size:10px;line-height:1;opacity:.9}
.eval-point.important:hover i.mark{filter:brightness(1.08);transform:scale(1.03)}
.eval-point[data-tip]:hover:after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);z-index:20;min-width:190px;max-width:260px;padding:8px 10px;border-radius:12px;background:rgba(8,11,17,.96);border:1px solid rgba(125,211,252,.24);box-shadow:0 14px 34px rgba(0,0,0,.38);color:#e5edf7;font-size:11px;font-weight:700;line-height:1.25;white-space:normal;text-align:left;pointer-events:none}
.eval-point[data-tip]:hover:before{content:"";position:absolute;left:50%;bottom:calc(100% + 3px);transform:translateX(-50%);border:5px solid transparent;border-top-color:rgba(8,11,17,.96);z-index:21;pointer-events:none}

/* Subtle accuracy balance bars + final eval label placement */
.accuracy-balance{margin-top:9px;display:grid;gap:5px}
.accuracy-balance div{display:flex!important;gap:0;height:5px;padding:0!important;border:0!important;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.07)}
.accuracy-balance span{height:100%;background:rgba(34,197,94,.72);display:block;margin:0!important}
.accuracy-balance i{height:100%;background:linear-gradient(90deg,rgba(255,159,10,.72),rgba(255,69,58,.68));display:block}
.accuracy-balance small{color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.01em}
#evalNumber{left:-30px!important;top:auto!important;bottom:calc(var(--white-pct,50%) - 10px);transform:none!important;font-size:10px;padding:2px 6px;background:rgba(6,8,12,.86);border-color:rgba(255,255,255,.16)}
.eval-svg polyline{stroke-width:1.05!important;opacity:.82}

/* Current move line stays independent from player-filtered important markers */
.eval-current{position:absolute;top:8px;bottom:8px;width:0;border-left:1px solid rgba(224,242,254,.58);z-index:3;pointer-events:none;filter:drop-shadow(0 0 7px rgba(125,211,252,.38))}
.eval-current:before{content:"";position:absolute;left:-4px;top:0;bottom:0;width:8px;background:linear-gradient(90deg,transparent,rgba(125,211,252,.18),transparent);border-radius:999px}
.eval-current-label{position:absolute;top:6px;z-index:6;max-width:min(210px,72%);padding:5px 8px;border-radius:999px;background:rgba(6,10,18,.82);border:1px solid rgba(125,211,252,.22);box-shadow:0 10px 24px rgba(0,0,0,.26),0 0 16px rgba(125,211,252,.12);color:#e5f6ff;font-size:11px;font-weight:800;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transform:translateX(-50%);pointer-events:none}

/* Evaluation graph as advantage map: active dot, no full-height playhead */
.eval-svg polygon{fill:transparent!important}
.eval-svg .white-area{fill:rgba(248,250,252,.42)!important}
.eval-svg .black-area{fill:rgba(6,10,18,.38)!important}
.eval-playhead{position:absolute;width:11px;height:11px;min-width:11px;padding:0;border:1px solid rgba(224,242,254,.9);border-radius:999px;background:#e0f2fe;box-shadow:0 0 0 3px rgba(125,211,252,.16),0 0 14px rgba(125,211,252,.46);transform:translate(-50%,-50%);z-index:5;pointer-events:none}
.eval-current{display:block!important}

/* True center-based evaluation graph fills */
.eval-svg .eval-segment.white-fill{fill:rgba(248,250,252,.50)!important}
.eval-svg .eval-segment.black-fill{fill:rgba(2,6,14,.44)!important}
.eval-svg .white-area,.eval-svg .black-area{display:none!important}

/* Final analysis polish: calmer graph, matte board, concise opening card */
.eval-graph{background:linear-gradient(180deg,rgba(9,13,20,.82),rgba(11,15,23,.70))!important}
.eval-svg .eval-segment.white-fill{fill:rgba(245,247,250,.34)!important}
.eval-svg .eval-segment.black-fill{fill:rgba(0,0,0,.30)!important}
.eval-zero{background:rgba(255,255,255,.18)!important;box-shadow:none!important}
.eval-svg polyline{stroke:#7dd3fc!important;stroke-width:.95!important;opacity:.84!important;filter:drop-shadow(0 0 3px rgba(125,211,252,.18))!important}
.white-1e1d7{background:#cfc3aa!important;color:rgba(28,31,35,.48)!important}
.black-3c85d{background:#6f675d!important;color:rgba(245,247,250,.46)!important}
body.analysis-active #board{box-shadow:0 28px 80px rgba(0,0,0,.58),0 0 0 1px rgba(255,255,255,.10),inset 0 0 0 1px rgba(255,255,255,.08)}
.arrow-line.best{stroke:#7dd3fc!important;stroke-width:6.4!important;opacity:.86!important;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 8px rgba(125,211,252,.36))}
.arrow-line.alt1{stroke:#7dd3fc!important;stroke-width:4.9!important;opacity:.56!important;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 6px rgba(125,211,252,.20))}
.arrow-line.alt2{stroke:#7dd3fc!important;stroke-width:4.2!important;opacity:.40!important;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px rgba(125,211,252,.16))}
.arrow-head.best,.arrow-head.alt1,.arrow-head.alt2{fill:#7dd3fc!important}
.opening-card h2 span{font-size:10px;letter-spacing:.12em;color:#8ec5ff}
.opening-card #openingSummary{font-size:12.5px;line-height:1.35;color:#d7e0ec}
.opening-ideas{display:flex;flex-wrap:wrap;gap:7px}
.opening-ideas span{display:inline-flex;padding:6px 9px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.10);color:#cbd5e1;font-size:12px;line-height:1.2}

/* Final small polish: curve-following light fill, softer arrows, warmer matte board */
.eval-graph{height:108px!important;background:linear-gradient(180deg,rgba(8,11,17,.90),rgba(12,15,21,.78))!important}
.eval-svg .curve-fill{fill:rgba(246,243,235,.52)!important}
.eval-svg .eval-segment{display:none!important}
.eval-svg polyline{stroke:#8bdcff!important;stroke-width:1.08!important;opacity:.9!important}

/* Mobile Summary cleanup: compact cards, no squeezed opening/details UI */
.summary-mobile-accordion,.mobile-review-strip,.mobile-board-controls,.mobile-tabs-card,.mobile-move-nav,.mobile-review-controls{display:none}
.summary-grid>.opening-summary-card,.summary-grid>.main-learning{min-width:0}
.summary-grid .opening-summary-detail,.summary-grid .opening-ideas,.summary-grid .diagnosis-details,.summary-grid .diagnosis-details-body,.summary-grid .diagnosis-facts{border:0;background:transparent;padding:0;border-radius:0}
.opening-summary-toggle,.diagnosis-toggle{display:inline-flex!important;width:auto!important;max-width:max-content;min-height:0!important;height:auto!important;align-self:start;justify-self:start;padding:6px 10px!important;line-height:1.1;white-space:nowrap;border-radius:999px}
.diagnosis-coach{margin:0;color:#cbd5e1;font-size:12px;line-height:1.4}
@media(max-width:720px){
  body.analysis-active .summary-grid{grid-template-columns:1fr!important}
  body.analysis-active .summary-grid>div{width:100%;min-width:0}
  .summary-grid>.opening-summary-card,.summary-grid>.main-learning{grid-column:1/-1}
  .category-counts{grid-template-columns:1fr 1fr!important}
  .category-counts .cat{min-width:0}
  .opening-summary-card b,.main-learning b,.main-learning strong{overflow-wrap:anywhere}
}
@media(max-width:430px){
  .summary-grid,.category-counts{grid-template-columns:1fr!important}
  .opening-summary-toggle,.diagnosis-toggle{font-size:11px;padding:6px 9px!important}
}

@media(max-width:900px){
  body.analysis-active header{position:relative!important;top:auto;z-index:1;padding:10px 12px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
  body.analysis-active header .top-title{min-width:0}
  body.analysis-active header h1{font-size:19px;line-height:1.05;margin:0 0 2px}
  body.analysis-active header #meta{display:block;max-width:100%;overflow:hidden;font-size:11px;line-height:1.25}
  body.analysis-active .matchup-header{display:grid;grid-template-columns:1fr auto 1fr;gap:6px;align-items:center}
  body.analysis-active .match-player{gap:6px}
  body.analysis-active .match-player img,body.analysis-active .match-player>i{width:28px;height:28px;border-radius:10px;font-size:10px}
  body.analysis-active .match-copy b{font-size:11px}
  body.analysis-active .match-copy small{font-size:10px}
  body.analysis-active .match-result{padding:4px 7px;font-size:10px}
  body.analysis-active .back-btn{padding:7px 10px;border-radius:999px;font-size:12px;white-space:nowrap}
  body.analysis-active main{grid-template-columns:1fr!important;padding:14px;gap:14px}
  body.analysis-active .mobile-tabs-card{order:1;display:flex}
  body.analysis-active .board-panel{order:2}
  body.analysis-active .side{order:3}
  body.analysis-active .side>.analysis-tabs{display:none}
  body.analysis-active .global-controls,
  body.analysis-active #tab-summary>.card>.panel-controls,
  body.analysis-active .summary-desktop{display:none!important}
  body.analysis-active .summary-mobile-accordion,
  body.analysis-active .mobile-board-controls,
  body.analysis-active .mobile-move-nav,
  body.analysis-active .mobile-review-controls{display:grid}
  body.analysis-active:not([data-active-tab="summary"]) .mobile-review-strip{display:none!important}
  body.analysis-active .board-panel{padding:12px}
  body.analysis-active .board-player{padding:5px 8px;margin-bottom:6px;border-radius:12px;font-size:12px;background:rgba(255,255,255,.035)}
  body.analysis-active .board-player b{font-size:12px;font-weight:650;line-height:1.15;overflow:hidden;text-overflow:ellipsis}
  body.analysis-active .board-player span{font-size:10px;line-height:1.15;color:var(--muted)}
  body.analysis-active .board-player.bottom{margin-top:6px}
  .mobile-board-controls{gap:7px;margin:8px 0 0;padding:8px;border:1px solid rgba(125,211,252,.16);border-radius:15px;background:linear-gradient(180deg,rgba(14,165,233,.08),rgba(255,255,255,.025))}
  .mobile-board-controls:has(.mobile-review-strip:empty){display:none!important}
  .mobile-tabs-card{gap:6px;margin:0;padding:5px;border:1px solid rgba(125,211,252,.16);border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));box-shadow:0 14px 34px rgba(0,0,0,.20)}
  .mobile-tabs-card button{flex:1;min-height:34px;padding:7px 6px;border-radius:12px;font-size:11px;box-shadow:none;background:transparent;border-color:transparent}
  .mobile-tabs-card button.active{background:rgba(125,211,252,.14);border-color:rgba(125,211,252,.26);color:#dff7ff}
  .mobile-move-nav{grid-template-columns:1fr 1fr 38px 1fr 1fr;gap:7px;margin:0 0 4px;padding:8px;border:1px solid rgba(125,211,252,.16);border-radius:15px;background:linear-gradient(180deg,rgba(14,165,233,.08),rgba(255,255,255,.025))}
  .mobile-move-nav button,.mobile-review-controls button{min-height:36px;padding:7px 8px;border-radius:12px;background:linear-gradient(135deg,rgba(14,165,233,.26),rgba(10,132,255,.16));border-color:rgba(125,211,252,.25);color:#dff7ff;box-shadow:none;font-size:13px}
  .mobile-review-strip{display:grid;gap:7px;margin-top:2px;border:1px solid rgba(255,255,255,.075);border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.022));padding:8px}
  .review-overview-head{display:flex;align-items:center;justify-content:flex-start;gap:8px;min-width:0}
  .review-overview-head span,.mobile-review-strip span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.06em}
  .review-overview-head b{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .review-overview-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .review-overview-stats div{min-width:0;padding:8px 9px;border:1px solid rgba(255,255,255,.075);border-radius:12px;background:rgba(255,255,255,.035)}
  .mobile-review-strip b{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .review-chip-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .review-chip{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:7px;min-height:38px;padding:7px 8px;border-radius:13px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09);box-shadow:none;color:#dbe3ee;font-size:11px;max-width:100%;text-align:left}
  .review-chip b{display:grid;place-items:center;width:24px;height:24px;border-radius:9px;font-size:11px;line-height:1;text-align:center;background:rgba(255,255,255,.08)}
  .review-chip span{min-width:0;font-size:12px;text-transform:none;letter-spacing:0;color:#dbe3ee;margin:0;white-space:normal;overflow:visible;text-overflow:clip}
  .review-chip em{font-style:normal;color:#e5edf7;font-weight:850;min-width:1ch;text-align:right;font-size:12px}
  .review-chip.disabled{opacity:.46;filter:saturate(.45);cursor:not-allowed;background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.06)}
  .review-chip.disabled b{background:rgba(148,163,184,.12)!important;color:#94a3b8!important;box-shadow:none!important}
  .review-chip.brilliant b{background:#7dd3fc;color:#04131f;box-shadow:0 0 12px rgba(125,211,252,.42)}
  .review-chip.beautiful b{background:#38bdf8;color:#04131f}
  .review-chip.top b{background:#22c55e;color:#031307}
  .review-chip.good b{background:#16a34a;color:white}
  .review-chip.ok b{background:rgba(255,255,255,.075);color:#aeb8c7}
  .review-chip.theory b{background:#8b5e34;color:#fff7ed}
  .review-chip.mistake b{background:var(--orange);color:#1f1200}
  .review-chip.blunder b{background:var(--red);color:white}
.mobile-review-controls{gap:0;margin:0;justify-items:center}
  .mobile-review-controls .variation-controls{margin-top:0;display:flex;justify-content:center;gap:6px}
  body.analysis-active .side{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
  body.analysis-active #eval{display:none}
  .summary-mobile-accordion{gap:8px}
  .summary-section{border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.035);overflow:hidden}
  .summary-section-toggle{width:100%;display:flex;justify-content:space-between;align-items:center;padding:11px 12px;border:0;border-radius:0;background:transparent;box-shadow:none;color:#e5edf7;text-align:left}
  .summary-section-toggle:hover{transform:none;background:rgba(255,255,255,.045)}
  .summary-section-toggle span{font-size:13px;font-weight:800}
  .summary-section-toggle b{transition:transform .18s ease}
  .summary-section.open .summary-section-toggle b{transform:rotate(180deg)}
  .summary-section-body{display:none;padding:0 12px 12px}
  .summary-section.open .summary-section-body{display:block}
  .summary-section-body .summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;margin-bottom:0}
  .summary-section-body .opening-summary-card,
  .summary-section-body .main-learning{border:0;background:transparent;padding:0}
  .mobile-review-strip .eval-graph{height:72px;margin:0;padding-top:16px;padding-bottom:8px;border-radius:12px}
  .mobile-review-strip .eval-current-label{top:4px;max-width:78%;font-size:9px;padding:4px 6px}
}
@media(max-width:480px){
  .summary-section-body .summary-grid{grid-template-columns:1fr!important}
  .mobile-review-controls .variation-controls{display:flex;justify-content:center}
}
.white-1e1d7{background:#d6c7ad!important;color:rgba(25,28,32,.50)!important}
.black-3c85d{background:#776b5e!important;color:rgba(246,243,235,.48)!important}
.arrow-line.best{stroke-width:5.6!important;opacity:.78!important;filter:drop-shadow(0 0 6px rgba(125,211,252,.30))!important}
.arrow-line.alt1{stroke-width:4.3!important;opacity:.48!important;filter:drop-shadow(0 0 5px rgba(125,211,252,.18))!important}
.arrow-line.alt2{stroke-width:3.7!important;opacity:.34!important;filter:drop-shadow(0 0 4px rgba(125,211,252,.14))!important}
.opening-cta.inline{margin-top:9px;padding:6px 10px;font-size:11px}
body.board-style-classic .white-1e1d7{background:#ead4a7!important;color:rgba(52,35,18,.58)!important}
body.board-style-classic .black-3c85d{background:#a06b3f!important;color:rgba(255,248,232,.60)!important}
body.board-style-classic .notation-322f9{font-weight:800;opacity:.68}

/* Graph hover scrub preview */
.eval-hover-tip{position:absolute;z-index:22;display:none;gap:2px;min-width:132px;max-width:210px;padding:8px 10px;border-radius:12px;background:rgba(8,11,17,.96);border:1px solid rgba(125,211,252,.24);box-shadow:0 14px 34px rgba(0,0,0,.34);color:#e5edf7;font-size:11px;line-height:1.2;transform:translate(-50%,-115%);pointer-events:none}
.eval-hover-tip b{font-size:11px;color:#f8fbff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.eval-hover-tip span{color:#9fb0c3;font-weight:700}
.eval-graph:hover .eval-playhead{width:12px;height:12px;box-shadow:0 0 0 4px rgba(125,211,252,.18),0 0 18px rgba(125,211,252,.52)}

/* Mistake learning variation flow */
.variation-controls{margin-top:12px;display:flex}
.variation-controls button,.variation-box button{background:rgba(125,211,252,.11);border-color:rgba(125,211,252,.25);color:#dff7ff;box-shadow:none}
.board-actions{display:grid;gap:8px}
.mobile-review-controls.board-actions{display:none}
.desktop-board-actions{display:none;margin:4px 0 8px;justify-items:center}
body.analysis-active .desktop-board-actions{display:grid}
.board-actions .variation-controls{margin:0;display:flex;justify-content:center;gap:8px}
.board-actions .variation-controls button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:34px;padding:8px 12px;border-radius:13px;font-size:12px;font-weight:780;white-space:nowrap;box-shadow:none}
.board-actions .variation-controls button[hidden]{display:none!important}
.board-actions .tryVariation,.board-actions .fixCurrentMistake{background:linear-gradient(135deg,rgba(245,158,11,.26),rgba(14,165,233,.18));border-color:rgba(251,191,36,.34);color:#fff7e6;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 24px rgba(245,158,11,.08)!important}
.board-actions .fixCurrentMistake{background:linear-gradient(135deg,rgba(251,191,36,.34),rgba(14,165,233,.20));border-color:rgba(251,191,36,.48);box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 12px 28px rgba(245,158,11,.12)!important}
.board-actions .arrowToggle{width:32px;height:32px;min-height:0;padding:0;border-radius:11px;font-size:11px;background:rgba(9,13,20,.58);border-color:rgba(125,211,252,.24);color:#cfefff}
.board-actions .btn-icon{display:inline-grid;place-items:center;width:17px;height:17px;border-radius:7px;background:rgba(251,191,36,.16);color:#fde68a;font-size:11px;line-height:1}
.board-actions .arrowToggle .btn-icon{background:rgba(125,211,252,.12);color:#bae6fd}
.board-actions .arrowToggle.off .btn-icon{background:rgba(255,255,255,.08);color:#aeb8c7}
.settingsGear{width:34px!important;min-width:34px;min-height:34px!important;height:34px;padding:0!important;border-radius:12px!important;background:rgba(9,13,20,.66)!important;border-color:rgba(125,211,252,.22)!important;color:#dff7ff!important;box-shadow:none!important;font-size:15px!important}
.settingsGear.open{background:rgba(125,211,252,.16)!important;border-color:rgba(125,211,252,.36)!important;box-shadow:0 0 18px rgba(125,211,252,.12)!important}
.review-settings-panel{margin:6px 0 10px;padding:9px 10px;border:1px solid rgba(125,211,252,.16);border-radius:14px;background:rgba(9,13,20,.72);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.review-settings-panel[hidden]{display:none!important}
.review-settings-panel label{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#dbeafe;font-size:12px;font-weight:750;cursor:pointer}
.review-settings-panel .sound-volume-row{cursor:default}
.soundVolumeSlider{width:132px;accent-color:#38bdf8}
.review-settings-panel label:focus-visible{outline:2px solid rgba(125,211,252,.45);outline-offset:3px;border-radius:10px}
.review-settings-panel label+label{margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.07)}
.review-settings-panel span{color:#dbeafe}
.review-settings-panel .kbd-hint{font-size:10px;font-weight:600;color:#7dd3fc;opacity:.7;letter-spacing:.02em}
.board-style-row select{min-width:150px;height:32px;padding:0 30px 0 10px;border:1px solid rgba(125,211,252,.20);border-radius:11px;background:rgba(9,13,20,.82);color:#dff7ff;font:inherit;font-size:12px;font-weight:750;outline:none}
.board-style-row select:focus{border-color:rgba(125,211,252,.48);box-shadow:0 0 0 3px rgba(125,211,252,.12)}
.settings-toggle{position:relative;width:42px!important;height:24px!important;min-height:0!important;padding:0!important;border-radius:999px!important;background:rgba(125,211,252,.18)!important;border-color:rgba(125,211,252,.28)!important;box-shadow:none!important}
.settings-toggle .toggle-knob{width:18px;height:18px;border-radius:999px;background:#dff7ff;box-shadow:0 2px 8px rgba(0,0,0,.28);transform:translateX(9px);transition:transform .16s ease,background .16s ease}
.settings-toggle.off{background:rgba(255,255,255,.07)!important;border-color:rgba(255,255,255,.12)!important}
.settings-toggle.off .toggle-knob{background:#94a3b8;transform:translateX(-9px)}
.free-analysis-panel{margin:10px 0 0;padding:11px;border:1px solid rgba(125,211,252,.22);border-radius:16px;background:linear-gradient(180deg,rgba(125,211,252,.10),rgba(255,255,255,.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 14px 30px rgba(0,0,0,.14);display:grid;gap:8px}
.side>.free-analysis-panel{margin:0;padding:10px 11px;align-self:start}
.free-analysis-panel[hidden]{display:none!important}
.free-analysis-head{display:grid;gap:2px}
.free-analysis-head b{color:#e8fbff;font-size:13px}
.free-analysis-head span,.free-analysis-result span{color:var(--muted);font-size:12px;line-height:1.35}
.free-analysis-result{display:grid;gap:3px;padding:8px;border-radius:12px;border:1px solid rgba(125,211,252,.15);background:rgba(9,13,20,.38)}
.free-analysis-result b{color:#dff7ff;font-size:12px}
.free-analysis-result .free-analysis-summary{color:#e8fbff;font-weight:700}
.free-analysis-result.muted{border-style:dashed}
.result-category{display:flex;align-items:center;gap:7px;color:#dff7ff;font-size:12px;font-weight:850;line-height:1.15}
.result-category .quality-mark.inline{position:static;right:auto;top:auto;z-index:auto;flex:0 0 auto;width:auto;min-width:22px;height:22px;padding:0 5px;border-radius:8px}
.result-category b{color:inherit;font-size:inherit}
.free-analysis-actions{display:flex;gap:8px;flex-wrap:wrap}
.free-analysis-actions button{min-height:32px;padding:7px 10px;border-radius:12px;background:rgba(125,211,252,.10);border-color:rgba(125,211,252,.22);color:#dff7ff;font-size:12px}
.free-analysis-branch{grid-column:1/-1;margin:4px 0 8px 38px;padding:9px 10px;border-left:2px solid rgba(125,211,252,.42);border-radius:0 12px 12px 0;background:rgba(125,211,252,.075)}
.free-analysis-branch>span{display:block;margin-bottom:6px;color:#9ddff2;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.free-analysis-branch>div{display:flex;flex-wrap:wrap;gap:7px}
.free-branch-move{display:inline-flex;align-items:center;gap:4px;padding:4px 7px;border:1px solid rgba(125,211,252,.18);border-radius:999px;background:rgba(255,255,255,.045);font-size:12px;color:#e5edf7}
.free-branch-move.active{border-color:rgba(56,189,248,.55);box-shadow:0 0 0 1px rgba(56,189,248,.16),0 0 18px rgba(56,189,248,.16)}
.free-branch-move em{font-style:normal;color:var(--muted);font-size:11px}
.move.free-analysis-start{border-color:rgba(125,211,252,.42)!important;background:rgba(125,211,252,.12)!important;box-shadow:0 0 0 1px rgba(125,211,252,.12),0 0 18px rgba(125,211,252,.12)!important}
.free-focus-pulse{animation:free-focus-pulse .9s ease-out}
@keyframes free-focus-pulse{0%{box-shadow:0 0 0 0 rgba(125,211,252,.38)}100%{box-shadow:0 0 0 10px rgba(125,211,252,0)}}
body.free-analysis-active .board-panel{position:relative;z-index:6;animation:board-focus-glow .7s ease-out;box-shadow:0 30px 90px rgba(0,0,0,.62),0 0 0 1px rgba(125,211,252,.26),0 0 44px rgba(125,211,252,.18)}
body.free-analysis-active .drawer-card,
body.free-analysis-active .analysis-tabs button:not([data-tab="analysis"]),
body.free-analysis-active #tab-coach,
body.free-analysis-active #tab-database{opacity:.32;filter:saturate(.75)}
body.free-analysis-active #tab-summary{display:none!important}
body.free-analysis-active #tab-analysis{display:block!important}
body.free-analysis-active #tab-analysis .card{border-color:rgba(125,211,252,.24);box-shadow:0 18px 48px rgba(0,0,0,.28),0 0 30px rgba(125,211,252,.10)}
body.free-analysis-active .analysis-tabs button[data-tab="analysis"]{background:rgba(125,211,252,.15);border-color:rgba(125,211,252,.34);color:#dff7ff}
body.free-analysis-active #enginePanel{display:none!important}
body.free-analysis-active #tab-analysis .move-list-title{margin-top:0!important}
body.free-analysis-active #tab-analysis .card{max-height:calc(100vh - 260px)}
body.free-analysis-active #moves{min-height:220px;flex:1 1 auto}
body.analysis-active #board,
body.analysis-active .board-b72b1,
body.analysis-active .square-55d63,
body.analysis-active .piece-417db,
body.learning-active #board,
body.learning-active .board-b72b1,
body.learning-active .square-55d63,
body.learning-active .piece-417db{touch-action:none;-ms-touch-action:none;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
body.free-analysis-active .board-wrap,
body.free-analysis-active .board-b72b1,
body.free-analysis-active #board{overflow:visible!important}
body.free-analysis-active .piece-417db,
body.free-analysis-active .ui-draggable-dragging{visibility:visible!important;opacity:1!important;z-index:90!important;pointer-events:auto}
body.analysis-active>img.piece-417db,
body.free-analysis-active>img.piece-417db,
body.analysis-active .ui-draggable-dragging,
body.free-analysis-active .ui-draggable-dragging{visibility:visible!important;display:block!important;opacity:1!important;z-index:9999!important;pointer-events:none!important;filter:drop-shadow(0 14px 22px rgba(0,0,0,.38));max-width:none!important}
body.analysis-active [data-analysis-release-ghost="1"],
body.learning-active [data-analysis-release-ghost="1"],
body.free-analysis-active [data-analysis-release-ghost="1"]{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important}
body.analysis-active #board img,body.learning-active #board img{max-width:none}
.analysis-custom-drag-piece{position:fixed!important;z-index:10000!important;pointer-events:none!important;max-width:none!important;touch-action:none!important;filter:drop-shadow(0 14px 22px rgba(0,0,0,.38));will-change:left,top}
.analysis-drag-source-hidden{opacity:.22!important}
.train-mistakes{margin-top:14px;padding:13px;border:1px solid rgba(251,191,36,.20);border-radius:18px;background:linear-gradient(180deg,rgba(251,191,36,.08),rgba(255,255,255,.035));box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 16px 34px rgba(0,0,0,.16)}
.train-mistakes>div:first-child{display:grid;gap:3px;margin-bottom:10px}
.train-mistakes b{color:#fff7e6;font-size:13px;letter-spacing:-.01em}
.train-mistakes span{color:var(--muted);font-size:12px;line-height:1.35}
.train-mistakes .training-controls{justify-content:flex-start;flex-wrap:wrap}
.train-mistakes .variation-panel{margin-top:0}
.mistake-notes-panel{grid-column:1/-1;margin:4px 0 0;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(5,8,13,.28);overflow:hidden}
.mistake-notes-panel summary{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:36px;padding:9px 11px;cursor:pointer;list-style:none;color:#f8fbff;font-size:12px;font-weight:800}
.mistake-notes-panel summary::-webkit-details-marker{display:none}
.mistake-notes-panel summary:after{content:"⌄";color:#9fb3c8;font-size:13px;transition:transform .18s ease}
.mistake-notes-panel[open] summary:after{transform:rotate(180deg)}
.mistake-notes-panel summary b{margin-left:auto;padding:3px 7px;border-radius:999px;background:rgba(125,211,252,.10);border:1px solid rgba(125,211,252,.16);color:#cfeeff;font-size:10px}
.mistake-note-list{display:grid!important;gap:8px!important;margin:0!important;padding:0 10px 10px}
.mistake-note-item{display:grid;gap:7px;padding:9px;border:1px solid rgba(255,255,255,.075);border-radius:12px;background:rgba(255,255,255,.04)}
.mistake-note-item>div{display:flex!important;align-items:center;justify-content:space-between;gap:8px!important;margin:0!important}
.mistake-note-item span{color:#e8eef7!important;font-size:12px}
.mistake-note-item b{color:#f7d99a!important;font-size:11px;text-transform:capitalize}
.mistake-note-item textarea{width:100%;min-height:54px;resize:vertical;border:1px solid rgba(255,255,255,.10);border-radius:11px;padding:9px 10px;background:rgba(255,255,255,.055);color:#f8fbff;font:13px/1.35 inherit;outline:none}
.mistake-note-item textarea:focus{border-color:rgba(125,211,252,.42);box-shadow:0 0 0 3px rgba(125,211,252,.10)}
.note-actions{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;margin:0!important}
.note-actions button{min-height:28px;padding:6px 10px;border-radius:10px;background:rgba(125,211,252,.12);border-color:rgba(125,211,252,.24);color:#dff7ff;font-size:11px;box-shadow:none}
.note-actions button:disabled{opacity:.48;cursor:not-allowed;transform:none}
.note-save-state{min-height:14px;color:#92e6bd!important;font-size:10px!important;text-align:left}
.train-mistakes:has(.correction-picker){grid-template-columns:minmax(180px,230px) minmax(0,1fr);align-items:start;gap:12px}
.train-mistakes:has(.correction-picker)>div:first-child{grid-column:1/-1;margin-bottom:0}
.train-mistakes:has(.correction-picker) .training-controls{grid-column:1}
.train-mistakes:has(.correction-picker) .variation-panel{grid-column:2}
.variation-panel{margin-top:10px}
.variation-box{display:grid;gap:6px;padding:12px;border:1px solid rgba(125,211,252,.18);border-radius:16px;background:rgba(255,255,255,.045);color:#dbeafe}
.variation-box span,.variation-box small{color:var(--muted);line-height:1.35}
.variation-box strong{width:max-content;padding:4px 8px;border-radius:999px;background:rgba(125,211,252,.13);border:1px solid rgba(125,211,252,.22);color:#dff7ff;font-size:11px;line-height:1}
.variation-box.success{border-color:rgba(125,211,252,.34);background:linear-gradient(180deg,rgba(125,211,252,.10),rgba(255,255,255,.045));animation:variation-panel-pulse 1.25s ease-out}
.learning-result-card{position:relative;gap:9px;border-color:rgba(125,211,252,.26);background:radial-gradient(circle at 12% 0,rgba(125,211,252,.18),transparent 34%),linear-gradient(180deg,rgba(9,18,32,.78),rgba(255,255,255,.045))}
.learning-result-card.success{border-color:rgba(52,211,153,.42);background:radial-gradient(circle at 14% 0,rgba(52,211,153,.22),transparent 34%),linear-gradient(180deg,rgba(14,165,233,.12),rgba(255,255,255,.045))}
.learning-result-card.miss{border-color:rgba(255,69,58,.30);background:radial-gradient(circle at 14% 0,rgba(255,69,58,.16),transparent 34%),linear-gradient(180deg,rgba(58,20,20,.36),rgba(255,255,255,.045))}
.learning-result-hero{display:grid!important;gap:3px!important;margin:0!important}.learning-result-hero b{font-size:20px;line-height:1.05;color:#f8fbff}.learning-result-hero span{color:#dbeafe!important}.learning-result-eval{font-size:12px;color:#9fe8ff!important}.learning-result-best,.learning-result-tried{font-size:12px}.learning-result-progress{position:relative;display:grid!important;grid-template-columns:1fr auto;gap:5px 8px!important;margin:0!important;padding:8px 9px 10px;border:1px solid rgba(251,191,36,.18);border-radius:13px;background:rgba(0,0,0,.16);overflow:hidden}.learning-result-progress span{position:relative;z-index:1;font-size:11px;color:#fff3cf!important;font-weight:850}.learning-result-progress b{font-size:15px;color:#fff}.learning-result-progress i{position:absolute;left:0;bottom:0;height:3px;border-radius:999px;background:linear-gradient(90deg,#22c55e,#fde68a);box-shadow:0 0 18px rgba(52,211,153,.28);transition:width .28s ease}.learning-result-actions{display:flex!important;gap:8px!important;margin-top:2px!important}.learning-result-actions .primary-action{border-color:rgba(52,211,153,.42);background:linear-gradient(180deg,rgba(52,211,153,.24),rgba(14,165,233,.16));color:#eafff7}
.arena-goal-progress{height:9px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.075);border:1px solid rgba(251,191,36,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.arena-goal-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,rgba(180,125,35,.92),rgba(251,191,36,.96),rgba(255,241,190,.92));box-shadow:0 0 18px rgba(251,191,36,.22)}
.arena-goal-stats{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important;margin:2px 0 4px!important}
.arena-goal-stats span{display:grid;gap:2px;padding:8px 9px;border-radius:12px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.075);font-size:11px;color:var(--muted)!important}
.arena-goal-stats b{color:#fff3cf;font-size:15px;line-height:1}
.blunder-rush-entry{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0;padding:13px;border:1px solid rgba(251,191,36,.28);border-radius:18px;background:radial-gradient(circle at 15% 0,rgba(255,214,102,.20),transparent 34%),linear-gradient(135deg,rgba(251,191,36,.14),rgba(125,211,252,.07));box-shadow:0 18px 48px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.07);overflow:hidden}
.blunder-rush-entry:before{content:"";position:absolute;inset:-1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);transform:translateX(-120%);animation:rush-sheen 3.2s ease-in-out infinite;pointer-events:none}
.blunder-rush-entry.compact{margin-top:10px;padding:10px}
.blunder-rush-entry div{position:relative;display:grid;gap:3px;margin:0!important}
.blunder-rush-entry span{color:#facc15!important;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.blunder-rush-entry b{color:#fff7d6;font-size:14px}
.blunder-rush-entry small{color:var(--muted);font-weight:700}
.blunder-rush-entry button{position:relative;white-space:nowrap;background:linear-gradient(135deg,#f59e0b,#facc15 52%,#7dd3fc);border-color:rgba(255,230,138,.50);color:#14110a;font-weight:950;box-shadow:0 10px 28px rgba(250,204,21,.22)}
.blunder-choice-box{gap:10px;padding:14px;background:linear-gradient(180deg,rgba(15,23,42,.72),rgba(15,23,42,.50));border-color:rgba(125,211,252,.18)}
.blunder-choice-box.compact{gap:8px;padding:12px;border-radius:16px}
.blunder-choice-box.compact .rush-title-row b{font-size:15px}.blunder-choice-box.compact .rush-prompt{font-size:12px;color:var(--muted)!important;font-weight:750}
.blunder-choice-grid{display:grid!important;grid-template-columns:1fr 1fr;gap:10px!important;margin:2px 0 0!important}
.blunder-choice-grid.two-option{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important}
.mistake-mode-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.blunder-choice-card{display:grid!important;text-align:left;gap:3px!important;margin:0!important;padding:12px!important;min-height:96px;border-radius:17px!important;background:rgba(255,255,255,.055)!important;border:1px solid rgba(255,255,255,.10)!important;color:#eaf4ff!important;box-shadow:none!important}
.blunder-choice-card span{color:#93c5fd!important;font-size:11px;font-weight:950;text-transform:uppercase;letter-spacing:.08em}.blunder-choice-card b{font-size:16px;color:#fff}.blunder-choice-card small{color:var(--muted);font-weight:800}.blunder-choice-card.rush{background:radial-gradient(circle at 100% 0,rgba(250,204,21,.22),transparent 45%),linear-gradient(145deg,rgba(251,191,36,.16),rgba(125,211,252,.08))!important;border-color:rgba(251,191,36,.30)!important}.blunder-choice-card.rush span{color:#facc15!important}
.blunder-choice-card.daily{background:radial-gradient(circle at 0 0,rgba(34,197,94,.20),transparent 42%),linear-gradient(145deg,rgba(34,197,94,.13),rgba(125,211,252,.07))!important;border-color:rgba(34,197,94,.30)!important}.blunder-choice-card.daily span{color:#86efac!important}.blunder-choice-card.recommended{box-shadow:0 0 0 1px rgba(34,197,94,.12),0 16px 36px rgba(34,197,94,.08)!important}.blunder-choice-card:disabled{opacity:.55}
.blunder-rush-box{position:relative;overflow:hidden;border-color:rgba(251,191,36,.30);background:radial-gradient(circle at 100% 0,rgba(250,204,21,.18),transparent 34%),linear-gradient(180deg,rgba(38,25,10,.74),rgba(10,14,22,.84));box-shadow:0 22px 60px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.07)}
.rush-flame{position:absolute;right:12px;top:10px;width:28px;height:28px;display:grid!important;place-items:center;margin:0!important;border-radius:999px;background:rgba(250,204,21,.12);filter:drop-shadow(0 0 14px rgba(250,204,21,.42));animation:rush-flame 1.25s ease-in-out infinite}
.blunder-rush-hud{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px!important;margin:0 34px 4px 0!important}
.blunder-rush-hud span{display:grid;gap:2px;padding:8px 9px;border-radius:12px;background:rgba(251,191,36,.09);border:1px solid rgba(251,191,36,.20);color:var(--muted)!important;font-size:11px!important}
.blunder-rush-hud b{color:#fff7d6;font-size:20px;line-height:1;font-variant-numeric:tabular-nums}
.blunder-rush-hud small{color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em}
.rush-timebar{height:6px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;border:1px solid rgba(255,255,255,.08);margin:0!important}
.rush-timebar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#22c55e,#facc15,#fb7185);box-shadow:0 0 18px rgba(250,204,21,.28);transition:width .35s ease}
.rush-title-row{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;margin:2px 0 0!important}
.rush-title-row b{font-size:17px;color:#fff7d6}.rush-title-row em{color:#facc15;font-size:11px;font-style:normal;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.rush-prompt{color:#f8e8b0!important;font-weight:800}.rush-actions button:first-child{background:rgba(255,255,255,.07);color:#dbeafe}.blunder-rush-box.success{border-color:rgba(34,197,94,.42);animation:rush-success .72s ease-out}.blunder-rush-box.error{border-color:rgba(255,69,58,.38);animation:rush-miss .46s ease-out}
@keyframes rush-sheen{0%,42%{transform:translateX(-120%)}70%,100%{transform:translateX(120%)}}@keyframes rush-flame{0%,100%{transform:scale(1) rotate(-4deg)}50%{transform:scale(1.12) rotate(5deg)}}@keyframes rush-success{0%{box-shadow:0 0 0 rgba(34,197,94,0)}42%{box-shadow:0 0 0 1px rgba(34,197,94,.28),0 0 38px rgba(34,197,94,.22)}100%{box-shadow:0 22px 60px rgba(0,0,0,.28)}}@keyframes rush-miss{20%,60%{transform:translateX(-2px)}40%,80%{transform:translateX(2px)}}
.refutation-box{display:grid!important;gap:4px!important;margin:4px 0 0!important;padding:10px;border-radius:13px;border:1px solid rgba(255,159,10,.22);background:linear-gradient(180deg,rgba(255,159,10,.09),rgba(255,255,255,.035))}
.refutation-box b{color:#ffe8bf;font-size:12px}
.refutation-box span{color:#dbe3ee!important;font-size:12px}
.variation-box div{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.variation-box.error{border-color:rgba(255,69,58,.28)}
.correction-focus .piece-417db{visibility:visible!important;opacity:1!important;z-index:80!important}
.correction-focus .board-b72b1,.correction-focus #board{overflow:visible!important}
.refutation-from,.refutation-to{box-shadow:inset 0 0 0 3px rgba(125,211,252,.38),inset 0 0 22px rgba(125,211,252,.20)!important}
.refutation-to{box-shadow:inset 0 0 0 3px rgba(255,199,89,.48),inset 0 0 24px rgba(255,199,89,.20)!important}
.learning-hint-source{box-shadow:inset 0 0 0 4px rgba(251,191,36,.76),inset 0 0 24px rgba(251,191,36,.24)!important}
.learning-feedback-good{animation:learning-good-square .42s ease-out}
.learning-feedback-bad{animation:learning-bad-square .62s ease-out}
.board-wrap.variation-success:after{content:"";position:absolute;inset:-8px;border-radius:24px;border:1px solid rgba(125,211,252,.42);box-shadow:0 0 34px rgba(125,211,252,.30);pointer-events:none;animation:variation-board-glow 1.25s ease-out}
@keyframes learning-good-square{0%{box-shadow:inset 0 0 0 0 rgba(251,191,36,0)}32%{box-shadow:inset 0 0 0 2px rgba(251,191,36,.42),inset 0 0 14px rgba(34,197,94,.16)}100%{box-shadow:inset 0 0 0 0 rgba(251,191,36,0)}}
@keyframes learning-bad-square{0%{box-shadow:inset 0 0 0 0 rgba(255,69,58,0);transform:translateX(0)}24%{box-shadow:inset 0 0 0 2px rgba(255,69,58,.46),inset 0 0 14px rgba(255,69,58,.18);transform:translateX(-1px)}48%{transform:translateX(1px)}100%{box-shadow:inset 0 0 0 0 rgba(255,69,58,0);transform:translateX(0)}}
@keyframes variation-board-glow{0%{opacity:0;transform:scale(.985)}18%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.025)}}
@keyframes variation-panel-pulse{0%{box-shadow:0 0 0 rgba(125,211,252,0)}35%{box-shadow:0 0 28px rgba(125,211,252,.18)}100%{box-shadow:0 0 0 rgba(125,211,252,0)}}
@media (prefers-reduced-motion:reduce){.learning-feedback-good,.learning-feedback-bad{animation:none}.learning-feedback-good{box-shadow:inset 0 0 0 2px rgba(251,191,36,.42)!important}.learning-feedback-bad{box-shadow:inset 0 0 0 2px rgba(255,69,58,.42)!important}.learning-result-progress i{transition:none}}
@media(max-width:700px){body.learning-active.learning-ready main{padding-bottom:calc(86px + env(safe-area-inset-bottom))}body.learning-active.learning-ready .learning-center-card{margin-top:0;padding:10px 12px;border-radius:18px}.learning-result-card{gap:7px;padding:10px}.learning-result-hero b{font-size:18px}.learning-result-progress{padding:7px 8px 9px}.learning-result-best,.learning-result-tried{display:none}.learning-result-actions{position:sticky;z-index:120;bottom:calc(10px + env(safe-area-inset-bottom));margin-top:8px;padding:9px;border:1px solid rgba(125,211,252,.20);border-radius:18px;background:rgba(8,13,22,.92);backdrop-filter:blur(16px);box-shadow:0 18px 50px rgba(0,0,0,.44)}.learning-result-actions button{flex:1;min-height:46px;justify-content:center}.learning-result-actions .primary-action{font-weight:950}}
.arrow-toggle-off,.arrowToggle.off,#arrowToggle.off{background:rgba(255,255,255,.055)!important;border-color:rgba(255,255,255,.10)!important;color:#9aa4b2!important}
.arrow-line.bad{stroke:#ff453a!important;stroke-width:5.2!important;opacity:.72!important;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 7px rgba(255,69,58,.30))!important}
.arrow-head.bad{fill:#ff453a!important;opacity:.82!important}
.variation-played{display:flex!important;align-items:center;gap:7px;width:max-content;max-width:100%;padding:6px 8px;border-radius:12px;background:rgba(255,69,58,.08);border:1px solid rgba(255,69,58,.16);color:#f3c5c1!important;font-size:12px}
.learning-note{width:100%;border:1px solid rgba(125,211,252,.16);border-radius:13px;background:rgba(125,211,252,.06);overflow:hidden}
.learning-note summary{padding:8px 10px;cursor:pointer;list-style:none;color:#dff7ff;font-size:12px;font-weight:800}
.learning-note summary::-webkit-details-marker{display:none}
.learning-note p{padding:0 10px 10px;color:#d6e1ee;font-size:12px;line-height:1.4}
.correction-picker{gap:9px}
.correction-list{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px!important;margin:2px 0 0!important}
.correction-item{justify-content:flex-start;text-align:left;gap:6px;width:100%;min-height:34px;padding:6px 8px;border-radius:11px;background:rgba(255,255,255,.045);box-shadow:none;color:#e5edf7}
.correction-item.mistake{border-color:rgba(255,159,10,.24)}
.correction-item.blunder{border-color:rgba(255,69,58,.26)}
.correction-item .move-icon{margin-left:0;flex:0 0 auto}
.correction-item span{color:#dbe3ee!important;line-height:1.18;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.square-55d63{position:relative!important}
.square-55d63>.piece-417db,.square-55d63>img,.square-55d63 .piece-417db{position:relative;z-index:5!important}
.board-touch-selected:before,.board-move-from:before,.board-move-to:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:rgba(255,255,255,.18);box-shadow:inset 0 0 0 2px rgba(255,255,255,.18),inset 0 0 15px rgba(255,255,255,.10)}
.board-touch-selected:before{background:rgba(255,255,255,.22);box-shadow:inset 0 0 0 2px rgba(255,255,255,.26),inset 0 0 18px rgba(255,255,255,.13)}
.board-move-to:before{background:rgba(255,255,255,.20)}
.board-highlight-brilliant:before{background:rgba(125,211,252,.26);box-shadow:inset 0 0 0 2px rgba(125,211,252,.34),inset 0 0 18px rgba(125,211,252,.16)}
.board-highlight-beautiful:before{background:rgba(96,165,250,.25);box-shadow:inset 0 0 0 2px rgba(96,165,250,.32),inset 0 0 18px rgba(96,165,250,.15)}
.board-highlight-top:before{background:rgba(52,211,153,.24);box-shadow:inset 0 0 0 2px rgba(52,211,153,.31),inset 0 0 18px rgba(52,211,153,.14)}
.board-highlight-good:before{background:rgba(34,197,94,.22);box-shadow:inset 0 0 0 2px rgba(34,197,94,.28),inset 0 0 18px rgba(34,197,94,.12)}
.board-highlight-ok:before{background:rgba(134,239,172,.20);box-shadow:inset 0 0 0 2px rgba(134,239,172,.25),inset 0 0 18px rgba(134,239,172,.10)}
.board-highlight-theory:before{background:rgba(255,255,255,.18);box-shadow:inset 0 0 0 2px rgba(255,255,255,.18),inset 0 0 15px rgba(255,255,255,.10)}
.board-highlight-mistake:before{background:rgba(255,159,10,.28);box-shadow:inset 0 0 0 2px rgba(255,159,10,.38),inset 0 0 19px rgba(255,159,10,.17)}
.board-highlight-blunder:before{background:rgba(255,69,58,.30);box-shadow:inset 0 0 0 2px rgba(255,69,58,.40),inset 0 0 20px rgba(255,69,58,.18)}
.variation-selected:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:rgba(255,255,255,.22);box-shadow:inset 0 0 0 2px rgba(255,255,255,.26),inset 0 0 18px rgba(255,255,255,.13)}
.variation-prev-move:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:rgba(255,255,255,.13);box-shadow:inset 0 0 0 2px rgba(255,255,255,.20),inset 0 0 16px rgba(255,255,255,.08)}
.variation-target:after,.legal-target-quiet:after,.legal-target-capture:after{content:"";position:absolute;left:50%;top:50%;width:22%;height:22%;min-width:10px;min-height:10px;max-width:18px;max-height:18px;transform:translate(-50%,-50%);pointer-events:none;z-index:2;border-radius:999px;background:rgba(15,23,42,.35);box-shadow:0 0 0 1px rgba(255,255,255,.08),0 2px 8px rgba(0,0,0,.16)}
.legal-target-capture:after,.variation-capture:after{width:72%;height:72%;max-width:none;max-height:none;background:rgba(15,23,42,.14);box-shadow:inset 0 0 0 5px rgba(15,23,42,.30),0 0 0 1px rgba(255,255,255,.08)}
.legal-move-layer{position:absolute;pointer-events:none;z-index:9;overflow:visible}

/* Analysis tab engine panel + categorized move list */
#enginePanel{display:grid;gap:10px;margin-bottom:16px}
.engine-head{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.engine-head div{padding:10px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.045)}
.engine-head span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em}.engine-head b{display:flex;gap:6px;align-items:center;margin-top:4px}
.engine-lines{display:grid;gap:7px}.engine-line{display:grid;grid-template-columns:76px 1fr;gap:4px 10px;padding:10px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.04)}
.engine-line.best{border-color:rgba(125,211,252,.28);background:rgba(125,211,252,.08)}.engine-line small{grid-column:2;color:var(--muted);line-height:1.3}.engine-line b{color:#8bdcff}.engine-line-pv{grid-column:2;color:#9fc6e0;font-size:12.5px;line-height:1.45}.engine-line.best .engine-line-pv{color:#cbe9ff}.engine-empty{color:var(--muted);padding:12px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.035)}
.move-list-title{margin-top:16px!important}.move{color:#d8dee8}.move.brilliant,.move.beautiful{color:#7dd3fc}.move.top,.move.good,.move.ok{color:#86efac}.move.theory{color:#d8b47a}.move.mistake{color:#ffb454}.move.blunder{color:#ff6b63}.move.active{box-shadow:inset 0 0 0 1px rgba(125,211,252,.28);background:rgba(125,211,252,.12)!important}
.move-icon{display:inline-grid;place-items:center;margin-left:4px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;font-size:10px;font-style:normal;font-weight:900;line-height:1;vertical-align:middle;background:rgba(255,255,255,.08);color:#e5edf7}.move-icon.brilliant{background:#7dd3fc;color:#04131f;box-shadow:0 0 12px rgba(125,211,252,.48)}.move-icon.beautiful{background:#38bdf8;color:#04131f}.move-icon.top,.move-icon.good{background:#22c55e;color:white}.move-icon.ok{background:#86efac;color:#063a18}.move-icon.theory{background:#9a6a40;color:#fff7ed}.move-icon.mistake{background:var(--orange);color:#1f1200}.move-icon.blunder{background:var(--red);color:white}
.summary-card>.panel-controls{display:none!important}
.global-controls{margin:0;display:grid;grid-template-columns:1fr 1fr 38px 1fr 1fr;align-items:center}
body.analysis-active #tab-analysis .variation-controls{display:none!important}
@media(max-width:850px){
  body.analysis-active .desktop-board-actions{display:none!important}
  body.analysis-active .mobile-review-controls .variation-controls{display:flex;justify-content:center;gap:6px}
  body.analysis-active .train-mistakes .tryVariation,
  body.analysis-active .train-mistakes .fixCurrentMistake{flex:1 1 145px}
  body.analysis-active .train-mistakes:has(.correction-picker){grid-template-columns:1fr}
  body.analysis-active .train-mistakes:has(.correction-picker) .training-controls,
  body.analysis-active .train-mistakes:has(.correction-picker) .variation-panel{grid-column:1}
  body.analysis-active .correction-list{grid-template-columns:1fr}
  body.analysis-active .mobile-review-controls .arrowToggle{flex:0 0 32px}
}

.main-learning b{display:block}
.main-learning small{display:block;margin-top:4px;color:var(--muted);font-size:11px;letter-spacing:.01em}
.main-learning em{display:block;margin-top:6px;color:#cbd5e1;font-style:normal;font-size:12px;line-height:1.35}

.main-learning strong{display:block;margin-top:2px;color:#e5edf7;font-size:13px}

/* Correction focus mode */
body.correction-focus .board-panel{position:relative;z-index:6;animation:board-focus-glow .7s ease-out;box-shadow:0 30px 90px rgba(0,0,0,.62),0 0 0 1px rgba(125,211,252,.26),0 0 44px rgba(125,211,252,.18)}
body.correction-focus .app header,
body.correction-focus .analysis-tabs,
body.correction-focus .drawer-card,
body.correction-focus .global-controls,
body.correction-focus .review-settings-panel,
body.correction-focus #tab-analysis,
body.correction-focus #tab-coach,
body.correction-focus #tab-database{opacity:.32;filter:saturate(.75)}
body.correction-focus #tab-summary>.card>h2,
body.correction-focus .summary-desktop>.summary-grid,
body.correction-focus .summary-desktop>.category-counts,
body.correction-focus .summary-desktop>.eval-graph,
body.correction-focus .summary-mobile-accordion .summary-section:not(:first-child){display:none!important}
body.correction-focus .summary-card{background:rgba(10,13,20,.80);border-color:rgba(251,191,36,.20)}
body.correction-focus .train-mistakes{position:relative;z-index:5;margin-top:0;border-color:rgba(251,191,36,.36);box-shadow:0 18px 44px rgba(0,0,0,.28),0 0 28px rgba(251,191,36,.10)}
body.correction-focus .train-mistakes>div:first-child,
body.correction-focus .train-mistakes .training-controls{display:none!important}
body.correction-focus .train-mistakes .variation-panel{grid-column:1/-1}
@keyframes board-focus-glow{0%{box-shadow:0 18px 60px rgba(0,0,0,.48),0 0 0 rgba(125,211,252,0)}45%{box-shadow:0 32px 92px rgba(0,0,0,.62),0 0 0 1px rgba(125,211,252,.30),0 0 54px rgba(125,211,252,.24)}100%{box-shadow:0 30px 90px rgba(0,0,0,.62),0 0 0 1px rgba(125,211,252,.26),0 0 44px rgba(125,211,252,.18)}}
@media(max-width:900px){
  body.correction-focus .side{padding-bottom:24px}
  body.correction-focus .summary-mobile-accordion .summary-section:first-child{display:block}
  body.correction-focus .summary-mobile-accordion .summary-section:first-child .summary-section-body{display:block}
}
.diagnosis-toggle{margin-top:10px;padding:6px 10px;border-radius:999px;background:rgba(125,211,252,.12);border-color:rgba(125,211,252,.24);color:#dff7ff;font-size:11px;box-shadow:none}
.diagnosis-details{display:none;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.08)}
.main-learning.details-open .diagnosis-details{display:block}
.diagnosis-details-body{display:grid;gap:8px}
.diagnosis-facts{display:grid;grid-template-columns:auto 1fr;gap:5px 10px;align-items:baseline}
.diagnosis-facts span{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.diagnosis-facts b{font-size:12px;color:#e5edf7}
.diagnosis-details ul,.coach-diagnosis ul{margin:0;padding-left:18px;color:#cbd5e1;font-size:12px;line-height:1.45}
.diagnosis-details li,.coach-diagnosis li{margin:3px 0}
.coach-diagnosis{display:grid;gap:10px}.coach-diagnosis div{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.07)}.coach-diagnosis div:last-child{border-bottom:0}.coach-diagnosis span{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}.coach-diagnosis b{display:block;color:#e5edf7;font-size:15px}.coach-diagnosis p{margin:0;color:#cbd5e1;line-height:1.45}
.coach-learning-panel{display:grid;gap:12px}
.coach-card{position:relative;padding:14px;border:1px solid rgba(125,211,252,.14);border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));box-shadow:inset 0 1px 0 rgba(255,255,255,.045)}
.coach-card small,.coach-chip small,.coach-ask small{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px;font-weight:850}
.coach-card b{color:#eef7ff;font-size:18px;line-height:1.2}
.coach-card p{margin:0;color:#d5deea;font-size:14px;line-height:1.45}
.coach-phase-card{display:flex;align-items:center;gap:11px;padding:12px 14px}
.phase-icon,.chip-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.phase-icon{width:34px;height:34px;border-radius:12px}
.phase-icon svg,.chip-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.coach-phase-card small{font-size:13px;color:#f8fbff;margin:0 0 3px}
.coach-phase-card p{font-size:13px;color:var(--muted);line-height:1.35}
.coach-current{display:grid;gap:11px}
.coach-move-title{display:flex;align-items:center;justify-content:space-between;gap:10px}
.coach-move-title>span:first-child{color:#f5fbff;font-weight:850;font-size:17px;line-height:1.2}
.coach-move-title .result-category b{font-size:13px}
.coach-lead{padding:10px 11px;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(255,255,255,.035)}
.coach-chip-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.coach-chip{display:grid;grid-template-columns:34px minmax(0,1fr);gap:9px;align-items:start;min-width:0;padding:11px;border:1px solid rgba(255,255,255,.09);border-radius:15px;background:rgba(255,255,255,.035)}
.chip-icon{width:34px;height:34px;border-radius:12px}
.coach-chip p{margin:0;color:#dbe4ef;font-size:13.5px;line-height:1.35}
.coach-opening-idea{gap:10px}
.coach-opening-copy{padding:10px 11px;border:1px solid rgba(251,191,36,.18);border-radius:12px;background:rgba(251,191,36,.055)}
.coach-opening-copy small{color:#fde68a;margin-bottom:5px}
.coach-opening-copy p{color:#f1e8d0;font-size:13.5px;line-height:1.42}
.chip-idea{border-color:rgba(251,191,36,.24);background:rgba(251,191,36,.065)}.chip-idea .chip-icon{color:#fde68a;background:rgba(251,191,36,.15);box-shadow:0 0 20px rgba(251,191,36,.10)}
.chip-plan{border-color:rgba(125,211,252,.22);background:rgba(125,211,252,.055)}.chip-plan .chip-icon{color:#bae6fd;background:rgba(125,211,252,.13)}
.chip-warning{border-color:rgba(251,146,60,.25);background:rgba(251,146,60,.065)}.chip-warning .chip-icon{color:#fed7aa;background:rgba(251,146,60,.14)}
.chip-motif{border-color:rgba(248,113,113,.23);background:rgba(248,113,113,.055)}.chip-motif .chip-icon{color:#fecaca;background:rgba(248,113,113,.13)}
.chip-thought{border-color:rgba(167,139,250,.24);background:rgba(167,139,250,.06)}.chip-thought .chip-icon{color:#ddd6fe;background:rgba(167,139,250,.14)}
.coach-ask{padding:13px 14px;border:1px solid rgba(167,139,250,.22);border-radius:16px;background:linear-gradient(180deg,rgba(167,139,250,.09),rgba(255,255,255,.025))}
.coach-ask b{display:block;color:#f1ecff;font-size:16px;line-height:1.35}
.coach-learn-current{width:max-content;min-height:0;padding:8px 12px;border-radius:999px;background:rgba(251,191,36,.18);border-color:rgba(251,191,36,.34);color:#fff7e6;font-size:12px;box-shadow:none}
.coach-phase-opening .coach-card{border-color:rgba(251,191,36,.32);background:linear-gradient(180deg,rgba(146,91,16,.18),rgba(255,255,255,.028));box-shadow:0 12px 34px rgba(251,191,36,.10),inset 0 1px 0 rgba(255,255,255,.06)}
.coach-phase-opening .phase-icon{background:rgba(251,191,36,.16);color:#fde68a;border-color:rgba(251,191,36,.24)}
.coach-phase-opening .coach-phase-card p{color:#d6b772}
.coach-phase-middlegame .coach-card{border-color:rgba(96,165,250,.22);background:linear-gradient(180deg,rgba(30,64,175,.10),rgba(255,255,255,.025))}
.coach-phase-middlegame .phase-icon{background:rgba(96,165,250,.13);color:#bfdbfe}
.coach-phase-endgame .coach-card{border-color:rgba(94,234,212,.28);background:linear-gradient(180deg,rgba(45,212,191,.11),rgba(139,92,246,.055));box-shadow:0 12px 34px rgba(45,212,191,.08),inset 0 1px 0 rgba(255,255,255,.055)}
.coach-phase-endgame .phase-icon{background:rgba(94,234,212,.14);color:#ccfbf1;border-color:rgba(94,234,212,.22)}
@media(max-width:720px){.coach-move-title{align-items:flex-start;flex-direction:column}.coach-chip-grid{grid-template-columns:1fr}.coach-chip p,.coach-opening-copy p{font-size:13px}}

/* Calmer review colors: Clean/Solid are neutral, not special highlights. */
.move.good,.move.ok{color:#d8dee8}
.move-icon.good,.move-icon.ok{background:rgba(255,255,255,.075);color:#aeb8c7;box-shadow:none}
.accuracy-balance.three span.strong{height:100%;background:rgba(34,197,94,.68);display:block;margin:0!important}
.accuracy-balance.three span.neutral{height:100%;background:rgba(148,163,184,.34);display:block;margin:0!important}

.opening-summary-card{display:grid;gap:5px}
.opening-summary-card small{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.opening-summary-toggle{width:max-content;margin-top:6px;padding:6px 10px;border-radius:999px;background:rgba(125,211,252,.12);border-color:rgba(125,211,252,.24);color:#dff7ff;font-size:11px;box-shadow:none}
.opening-summary-detail{display:none;margin-top:8px;color:#cbd5e1;font-size:12px;line-height:1.35}
.opening-summary-card.open .opening-summary-detail{display:grid;gap:8px}
.opening-summary-detail p{font-size:12px;line-height:1.35;color:#cbd5e1}

.move-table-head{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;margin:2px 0 10px;padding:9px 10px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.035);font-size:12px;color:#d8dee8}
.move-table-head span:last-child{text-align:right}.move-table-head b{color:var(--muted);font-size:11px;font-weight:800}.move-table-head em{font-style:normal;color:var(--muted)}
.move-table{display:grid;border:1px solid rgba(255,255,255,.08);border-radius:16px;overflow:hidden;background:rgba(255,255,255,.025)}
.move-row{display:grid;grid-template-columns:42px minmax(0,1fr) minmax(0,1fr);align-items:center;gap:8px;padding:6px 8px;border-bottom:1px solid rgba(255,255,255,.065)}
.move-row:last-child{border-bottom:0}.move-row .move-num{color:var(--muted);font-size:12px;font-weight:800;text-align:right}
.move-row>div{min-width:0}.move-row .move{width:100%;display:flex;justify-content:flex-start;align-items:center;gap:4px;padding:6px 8px;border-radius:10px;background:transparent;border:1px solid transparent;box-shadow:none;text-align:left;font-size:13px;line-height:1.1}
.move-row .move span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.move-row .move:hover{background:rgba(125,211,252,.08);border-color:rgba(125,211,252,.12);transform:none}.move-row .move.active{background:rgba(125,211,252,.13)!important;border-color:rgba(125,211,252,.30);color:#eaf6ff}
.move-row .move.empty{opacity:.35;cursor:default}

/* Contain Analysis move table scrolling so the board stays in view. */
body.analysis-active #tab-analysis .card{max-height:calc(100vh - 190px);display:flex;flex-direction:column;overflow:hidden}
body.analysis-active #tab-analysis #enginePanel,
body.analysis-active #tab-analysis .variation-controls,
body.analysis-active #tab-analysis .variation-panel,
body.analysis-active #tab-analysis .move-list-title{flex:0 0 auto}
body.analysis-active #moves{min-height:180px;overflow-y:auto;overscroll-behavior:contain;padding-right:4px}
body.analysis-active #moves .move-table-head{position:sticky;top:0;z-index:3;backdrop-filter:blur(14px);background:rgba(18,20,25,.94)}
body.analysis-active.free-analysis-active #tab-analysis .card{max-height:calc(100vh - 260px)}
body.analysis-active.free-analysis-active #moves{min-height:220px}

/* Recent games must stay isolated from analysis UI and fit mobile screens. */
body.games-active .global-controls,
body.games-active .tab-pane,
body.games-active .board-controls{display:none!important}
body.games-active .nav{display:flex!important}
body.games-active .app{margin-left:196px!important}
body.games-active .active-player{display:flex!important}
@media(max-width:850px){
 body.games-active{overflow-x:hidden;min-height:100dvh}
 body.games-active header{grid-template-columns:1fr;width:100%;max-width:100vw;position:relative;padding:12px}
 body.games-active .top-title{display:none}
 body.games-active .active-player{display:grid!important;grid-template-columns:1fr;width:100%;gap:10px;padding:10px}
 body.games-active .player-switcher-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;width:100%}
 body.games-active .player-switcher-actions .return-linked-player{grid-column:1/-1}
 body.games-active .player-switcher-actions button{width:100%}
 body.games-active .active-player span{font-size:10px;margin-bottom:1px}
 body.games-active .active-player b{font-size:15px;line-height:1.1}
 body.games-active .active-player small{font-size:11px}
 body.games-active .active-player .change-player{display:inline-flex;flex:0 0 auto;padding:7px 9px;border-radius:999px;font-size:11px;box-shadow:none;background:rgba(125,211,252,.11);border-color:rgba(125,211,252,.22);color:#dff7ff}
 body.games-active .top-search{display:none;grid-template-columns:1fr;width:100%;max-width:100%;min-width:0;margin-top:4px}
 body.games-active.mobile-search-open .top-search{display:grid}
 body.games-active #batchStatus{right:12px;bottom:2px;max-width:calc(100% - 24px)}
 body.games-active .top-search div,body.games-active .top-search input,body.games-active .top-search button{width:100%;max-width:100%;min-width:0}
 body.games-active main{width:100%;max-width:100vw;padding:12px 12px calc(112px + env(safe-area-inset-bottom,0px));overflow-x:hidden;overflow-y:visible}
 body.games-active .side,body.games-active .drawer-card{width:100%;max-width:100%;min-width:0;overflow:visible}
 body.games-active .drawer-card{padding:14px;border-radius:18px}
 body.games-active .drawer-card>h2{display:none}
 body.games-active #gamePicker{width:100%;max-width:100%;min-width:0;overflow:visible;padding-bottom:calc(72px + env(safe-area-inset-bottom,0px));gap:8px}
 body.games-active .gamepick.rich{grid-template-columns:1fr!important;width:100%;max-width:100%;min-width:0;padding:10px 11px;gap:7px;border-radius:16px;align-items:start}
 body.games-active .gamepick.rich>*{min-width:0;max-width:100%}
 body.games-active .clock{align-items:flex-start;font-size:18px;line-height:1}
 body.games-active .clock small{font-size:10px}
 body.games-active .players{gap:3px}
 body.games-active .players b{white-space:normal;overflow-wrap:anywhere}
 body.games-active .players em{font-size:12px}
 body.games-active .scores{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;text-align:left}
 body.games-active .acc,body.games-active .date{display:grid}
 body.games-active .acc{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;text-align:left}
 body.games-active .colorpill{justify-self:start;padding:5px 7px;font-size:11px}
 body.games-active .date{font-size:12px}
 body.games-active .card-cta{justify-self:stretch;width:100%;white-space:normal;max-width:100%;padding:9px 10px;border-radius:12px}
}
@media(max-width:1050px){body.games-active .app{margin-left:0!important}}
body.analysis-active #moves::-webkit-scrollbar{width:8px}
body.analysis-active #moves::-webkit-scrollbar-track{background:rgba(255,255,255,.035);border-radius:999px}
body.analysis-active #moves::-webkit-scrollbar-thumb{background:rgba(125,211,252,.28);border-radius:999px}
body.analysis-active #moves::-webkit-scrollbar-thumb:hover{background:rgba(125,211,252,.42)}

/* Recent game card polish: flags and accuracy as one compact metric. */
.flag{margin-right:4px}
.active-player-card{display:flex;align-items:center;gap:10px;min-width:0}
.active-player-card img,.active-player-card i{width:38px;height:38px;border-radius:13px;flex:0 0 auto;display:grid;place-items:center;background:linear-gradient(145deg,rgba(125,211,252,.18),rgba(255,255,255,.06));border:1px solid rgba(125,211,252,.20);box-shadow:0 10px 24px rgba(0,0,0,.22);object-fit:cover;color:#dff7ff;font-style:normal;font-weight:850;font-size:12px}
.active-player-card div{min-width:0}
.active-player-card p{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:2px}
.active-player-card strong,.active-player-card em{font-size:10px;line-height:1;padding:4px 6px;border-radius:999px;border:1px solid rgba(125,211,252,.18);background:rgba(125,211,252,.10);color:#dff7ff;font-style:normal;text-transform:uppercase;letter-spacing:.04em}
.active-player-card small{color:var(--muted)}
.player-switcher-card>div>span{display:block;margin-bottom:2px;color:#7dd3fc;font-size:10px;text-transform:uppercase;letter-spacing:.09em;font-weight:850}
.player-switcher-card b{font-size:16px;letter-spacing:-.02em;color:#f8fbff}
.player-switcher-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.player-switcher-actions button{min-height:34px;padding:8px 10px;border-radius:12px;font-size:11px;box-shadow:none;white-space:nowrap}
.player-switcher-actions .refresh-player-games{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.10);color:#dbe7f5}
.player-switcher-actions .change-player{background:rgba(125,211,252,.12);border-color:rgba(125,211,252,.24);color:#dff7ff}
.player-switcher-actions .return-linked-player{background:rgba(34,197,94,.11);border-color:rgba(34,197,94,.22);color:#bbf7d0}
.metric-pill{justify-self:center;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"icon copy" "bar bar";align-items:center;column-gap:8px;row-gap:6px;min-width:118px;max-width:148px;padding:7px 9px;border:1px solid rgba(125,211,252,.18);border-radius:14px;background:linear-gradient(135deg,rgba(125,211,252,.10),rgba(34,197,94,.045));box-shadow:inset 0 1px 0 rgba(255,255,255,.07);text-align:left}
.metric-pill{position:relative;overflow:hidden}
.metric-pill>*:not(.metric-fill){position:relative;z-index:1}
.metric-fill{position:absolute;left:0;top:0;bottom:0;border-radius:inherit;background:linear-gradient(90deg,rgba(14,165,233,.18),rgba(37,99,235,.50),rgba(125,211,252,.34));box-shadow:0 0 18px rgba(34,211,238,.22);z-index:0;pointer-events:none}
.metric-fill-active{width:var(--progress,8%);opacity:.82;transition:width .65s ease}
.metric-fill-queued{width:2%;opacity:.42}
.metric-loading{border-color:rgba(125,211,252,.32);background:rgba(14,165,233,.10)}
.metric-error{border-color:rgba(255,69,58,.30);background:rgba(255,69,58,.10);cursor:pointer}
.metric-icon{grid-area:icon;position:relative;width:20px;height:20px;border-radius:50%;border:1px solid rgba(125,211,252,.45);background:radial-gradient(circle at 50% 50%,rgba(125,211,252,.95) 0 2px,transparent 3px),rgba(125,211,252,.10);box-shadow:0 0 0 3px rgba(125,211,252,.055)}
.metric-icon:before,.metric-icon:after{content:"";position:absolute;background:rgba(125,211,252,.55);border-radius:999px}
.metric-icon:before{left:4px;right:4px;top:9px;height:1px}.metric-icon:after{top:4px;bottom:4px;left:9px;width:1px}
.metric-copy{grid-area:copy;min-width:0;display:grid;gap:1px}
.metric-copy small{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;line-height:1;white-space:nowrap}
.metric-copy b{font-size:15px;line-height:1;color:#e5f6ff;font-weight:850}
.metric-empty b{font-size:11px;line-height:1.15;color:#cbd5e1;font-weight:800}
.metric-bar{grid-area:bar;height:3px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.metric-bar:before{content:"";display:block;width:var(--score,0%);height:100%;border-radius:inherit;background:linear-gradient(90deg,#22d3ee,#22c55e)}
@media(max-width:850px){
 body.games-active .metric-pill{justify-self:start;width:auto;max-width:160px;padding:7px 8px}
 body.games-active .metric-pill b{font-size:14px}
}
@media(max-width:420px){
 body.games-active .metric-pill{max-width:100%;width:max-content}
}

/* Analysis loading progress with percentage and status. */
.progress{height:34px!important;bottom:-34px!important;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(9,13,20,.94)!important;box-shadow:0 12px 32px rgba(0,0,0,.26);overflow:hidden!important}
.progress-meta{height:30px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 12px;color:#dbeafe;font-size:12px;font-weight:760}
#progressText{color:#7dd3fc;font-variant-numeric:tabular-nums}
#progressStatus{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#cbd5e1;font-weight:650}
.progress #progressBar{position:absolute;left:0;right:auto;bottom:0;height:4px;background:linear-gradient(90deg,#0ea5e9,#22c55e);box-shadow:0 0 18px rgba(34,211,238,.28)}
@media(max-width:850px){
 .progress{left:12px!important;right:12px!important;bottom:-38px!important}
 .progress-meta{padding:0 10px;font-size:11px}
}

/* Recent Games card-attached analysis progress. */
.gamepick.rich{position:relative;overflow:hidden}
.gamepick.rich.analyzing{cursor:wait;opacity:1}
.gamepick.rich.analyzing .card-cta{position:relative;overflow:hidden;pointer-events:none;border-color:rgba(125,211,252,.32);background:rgba(14,165,233,.16);color:#e0f7ff;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.card-progress{position:absolute;inset:0;display:block;border-radius:inherit;z-index:1}
.card-progress-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,rgba(14,165,233,.42),rgba(34,197,94,.34));box-shadow:0 0 18px rgba(34,211,238,.20);transition:width .25s ease}
.gamepick.rich.analyzing .card-progress-fill{transform:none;animation:none}
.card-progress-label{position:relative;z-index:1;height:100%;display:flex;align-items:center;justify-content:center;gap:5px;padding:0 8px;font-size:11px;line-height:1;color:#dbeafe}
.card-progress-label b{color:#7dd3fc;font-variant-numeric:tabular-nums;font-size:11px}
.card-progress-label em{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-style:normal;color:#cbd5e1;font-weight:700}
.gamepick.rich.analysis-error .card-cta{pointer-events:auto;border-color:rgba(255,69,58,.34);background:rgba(255,69,58,.12)}
.gamepick.rich.analysis-error .card-progress-fill{width:100%!important;background:rgba(255,69,58,.22)}
.gamepick.rich.analysis-error .card-progress-label b{color:#fecaca}

/* Keep board annotations readable without covering pieces on narrow boards. */
@media(max-width:850px){
 .square-55d63{overflow:visible!important}
 .quality-mark,.badge,.goodmark,.bookmark{
  top:-3px;
  right:-3px;
  z-index:6;
  min-width:clamp(15px,4.8vw,20px);
  width:auto;
  height:clamp(15px,4.8vw,20px);
  padding:0 3px;
  border-radius:7px;
  font-size:clamp(8px,2.55vw,11px);
  line-height:1;
  box-shadow:0 3px 9px rgba(0,0,0,.42),0 0 8px rgba(255,255,255,.12);
  transform:translate(18%,-18%)!important;
 }
 .quality-mark.top{font-size:clamp(10px,2.9vw,12px)}
 .bookmark{font-size:clamp(9px,2.8vw,11px)}
}

/* Desktop Recent Games: explicit separated columns, mobile stack stays below 850px. */
@media(min-width:851px){
 body.games-active .gamepick.rich{
  grid-template-columns:76px minmax(260px,1fr) 96px 76px 148px 58px 150px!important;
  gap:14px;
  align-items:center;
  padding:15px 16px;
 }
 body.games-active .gamepick.rich>*{min-width:0}
 body.games-active .players{overflow:hidden}
 body.games-active .players b{display:block;min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 body.games-active .date{display:block;justify-self:start;width:96px;color:#c8d0dc;font-size:12px;line-height:1.15;text-align:left;white-space:normal}
 body.games-active .colorpill{justify-self:start;width:70px;padding:7px 8px;text-align:center}
 body.games-active .metric-pill{justify-self:start;width:142px;max-width:142px;min-width:0}
 body.games-active .notes-cell{justify-self:center;width:58px}
 body.games-active .card-cta{justify-self:end;width:144px;min-height:38px;padding:9px 12px;text-align:center}
 body.games-active .card-progress-label{font-size:10px;padding:0 7px}
 body.games-active .card-progress-label em{max-width:104px}
}

/* Engine arrows: SVG is positioned by JS to the exact rendered board rect. */
.board-wrap{overflow:visible}
#arrowLayer{position:absolute!important;right:auto!important;bottom:auto!important;pointer-events:none;z-index:8;overflow:visible}
.arrow-line{stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.arrow-head{fill:#7dd3fc}
.arrow-line.best{stroke:#7dd3fc!important;stroke-width:5.2!important;opacity:.88!important;filter:drop-shadow(0 0 7px rgba(125,211,252,.36))!important}
.arrow-line.missed-best{stroke:#7ed957!important;stroke-width:6.2!important;opacity:.80!important;filter:drop-shadow(0 0 8px rgba(126,217,87,.34))!important}
.arrow-head.missed-best{fill:#7ed957!important;opacity:.86!important}
.arrow-line.alt1{stroke:#38bdf8!important;stroke-width:3.8!important;opacity:.58!important;filter:drop-shadow(0 0 5px rgba(56,189,248,.22))!important}
.arrow-line.alt2{stroke:#38bdf8!important;stroke-width:3.2!important;opacity:.42!important;filter:drop-shadow(0 0 4px rgba(56,189,248,.16))!important}
@media(max-width:850px){
 .arrow-line.best{stroke-width:4.4!important;opacity:.90!important}
 .arrow-line.missed-best{stroke-width:5.4!important;opacity:.84!important}
 .arrow-line.alt1{stroke-width:3.3!important;opacity:.62!important}
 .arrow-line.alt2{stroke-width:2.8!important;opacity:.46!important}
}

/* Recent Games table layout with mobile card fallback. */
.player-overview{margin:0 0 14px;padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:24px;background:linear-gradient(145deg,rgba(28,34,45,.72),rgba(11,13,18,.58));box-shadow:0 24px 70px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:saturate(150%) blur(18px)}
.overview-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.overview-title>div{display:grid;gap:2px;min-width:0}
.overview-title b{font-size:16px;letter-spacing:-.02em;color:#f8fbff}
.overview-title span,.overview-grid span,.overview-grid small,.overview-empty{color:var(--muted);font-size:11px}
.overview-toggle{flex:0 0 auto;display:inline-flex;gap:7px;align-items:center;min-height:34px;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.10);box-shadow:none;color:#dbe7f5;font-size:11px;font-weight:800}
.overview-toggle:hover{transform:none;background:rgba(255,255,255,.085)}
.overview-toggle i{width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .18s ease}
.player-overview.expanded .overview-toggle i{transform:rotate(225deg) translate(-1px,-1px)}
@media(prefers-reduced-motion:reduce){.overview-toggle i{transition:none}}
.overview-compact{display:grid;grid-template-columns:minmax(70px,.7fr) minmax(70px,.7fr) minmax(0,1.6fr);gap:9px;margin-bottom:14px}
.overview-compact>div{min-width:0;padding:10px 11px;border-radius:16px;background:rgba(255,255,255,.042);box-shadow:inset 0 1px 0 rgba(255,255,255,.055)}
.overview-compact span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em}
.overview-compact b{display:block;margin-top:4px;color:#f8fbff;font-size:20px;line-height:1;letter-spacing:-.035em}
.overview-compact b.up{color:#86efac}.overview-compact b.down{color:#fca5a5}
.overview-compact small{display:block;margin-top:4px;color:#c7d2df;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.player-overview.collapsed{padding-bottom:14px}
.player-overview.collapsed .overview-title{margin-bottom:10px}
.player-overview.collapsed .overview-compact{margin-bottom:0}
.overview-grid{display:grid;grid-template-columns:minmax(280px,1fr) minmax(230px,.86fr);grid-template-areas:"trend side" "openings openings";gap:14px;align-items:stretch}
.overview-trend{grid-area:trend;min-width:0;padding:16px 16px 12px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}
.trend-head{display:grid;grid-template-columns:1fr auto auto auto;align-items:start;gap:9px;margin-bottom:4px}
.trend-head div{display:grid;gap:2px}
.trend-head span,.overview-openings>span,.overview-stats span{text-transform:uppercase;letter-spacing:.08em;font-size:10px}
.trend-head strong{font-size:34px;line-height:1;color:#fff;letter-spacing:-.04em}
.trend-head em{align-self:center;font-style:normal;font-size:12px;border-radius:999px;padding:4px 7px}
.trend-head em.up{color:#86efac;background:rgba(34,197,94,.12)}
.trend-head em.down{color:#fca5a5;background:rgba(248,113,113,.12)}
.trend-range-control{display:inline-flex!important;gap:3px!important;align-self:center;padding:3px;border-radius:999px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.075)}
.trend-range-control button{min-width:32px;padding:5px 7px;border-radius:999px;border:0;background:transparent;box-shadow:none;color:var(--muted);font-size:10px;font-weight:800}
.trend-range-control button:hover,.trend-range-control button.active{background:rgba(251,191,36,.16);color:#fff3cf;transform:none}
.spark-wrap{display:grid;grid-template-columns:34px minmax(0,1fr);gap:7px;align-items:stretch}
.spark-y{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;padding:6px 0 9px;color:rgba(154,164,178,.72);font-size:10px}
.rating-spark{width:100%;height:88px;display:block;overflow:visible}
.spark-axis{stroke:rgba(154,164,178,.24);stroke-width:1}
.rating-spark polyline{fill:none;stroke:#7dd3fc;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 9px rgba(125,211,252,.34))}
.spark-point-hit{fill:transparent;stroke:transparent;cursor:pointer;pointer-events:all}
.spark-point{fill:#e0f7ff;stroke:#082f49;stroke-width:1.3;filter:drop-shadow(0 0 5px rgba(125,211,252,.38));transition:r .16s ease,fill .16s ease,stroke .16s ease}
.spark-point-wrap:hover .spark-point,.spark-point-wrap:focus .spark-point,.spark-point-wrap.active .spark-point{r:4.7;fill:#fef3c7;stroke:#0f172a;filter:drop-shadow(0 0 9px rgba(251,191,36,.55))}
.trend-tooltip{position:absolute;z-index:8;display:grid;gap:3px;min-width:178px;max-width:min(240px,calc(100% - 16px));padding:10px 11px;border:1px solid rgba(125,211,252,.22);border-radius:13px;background:rgba(7,12,20,.94);box-shadow:0 18px 42px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(14px);pointer-events:none}
.trend-tooltip[hidden]{display:none}
.trend-tooltip b{color:#f8fbff;font-size:12px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.trend-tooltip span{color:#cbd5e1!important;font-size:11px!important;text-transform:none!important;letter-spacing:0!important}
.trend-tooltip small{color:#93c5fd!important;font-size:10.5px!important}
.spark-range{position:relative;height:18px;margin-left:41px;color:var(--muted);font-size:10px}
.spark-range span{position:absolute;top:0;transform:translateX(-50%);white-space:nowrap;color:#aeb8c7}
.spark-range span:first-child{transform:translateX(0)}
.spark-range span:last-child{transform:translateX(-100%);color:#e0f7ff}
.trend-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:9px}
.trend-summary div{min-width:0;padding:8px 9px;border:1px solid rgba(255,255,255,.075);border-radius:12px;background:rgba(255,255,255,.045)}
.trend-summary span{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.07em;white-space:nowrap}
.trend-summary b{display:block;margin-top:4px;color:#f8fbff;font-size:14px;line-height:1;white-space:nowrap}
.overview-insights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:9px}
.overview-insights div{min-width:0;padding:9px 10px;border:1px solid rgba(255,255,255,.075);border-radius:13px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.028))}
.overview-insights span{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.07em;white-space:nowrap}
.overview-insights b{display:block;margin-top:4px;color:#f8fbff;font-size:13px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.overview-insights small{display:block;margin-top:3px;color:#aeb8c7;font-size:10px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.overview-next-action{display:grid;width:100%;margin-top:9px;padding:10px 12px;border:1px solid rgba(125,211,252,.18);border-radius:14px;background:linear-gradient(135deg,rgba(14,165,233,.12),rgba(34,197,94,.06));box-shadow:inset 0 1px 0 rgba(255,255,255,.06);text-align:left;color:#e0f7ff}
.overview-next-action:hover{transform:none;border-color:rgba(125,211,252,.34);background:linear-gradient(135deg,rgba(14,165,233,.18),rgba(34,197,94,.09))}
.overview-next-action span{color:#7dd3fc!important;font-size:9px!important;text-transform:uppercase;letter-spacing:.08em}
.overview-next-action b{margin-top:2px;color:#f8fbff;font-size:13px;line-height:1.2}
.overview-next-action.complete{background:rgba(34,197,94,.08);border-color:rgba(34,197,94,.16);pointer-events:none}
.overview-side{grid-area:side;min-width:0}
.overview-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;height:100%}
.overview-stats>div{min-width:0;padding:13px;border-radius:18px;background:rgba(255,255,255,.045);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.overview-stats b{display:block;margin-top:7px;font-size:28px;line-height:1;color:#f4fff7;letter-spacing:-.04em}
.overview-stats small{display:block;margin-top:5px;color:var(--muted)}
.overview-color-stat small{line-height:1.25}
.overview-balance{grid-column:1/-1;display:grid;gap:7px;padding:10px 12px!important;border-color:rgba(125,211,252,.10)!important;background:linear-gradient(135deg,rgba(125,211,252,.055),rgba(255,255,255,.028))!important}
.color-balance-bars{display:grid;gap:5px}
.color-balance-bars span{display:block;height:5px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.color-balance-bars i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#e5edf7,#7dd3fc);box-shadow:0 0 10px rgba(125,211,252,.22)}
.color-balance-bars span:last-child i{background:linear-gradient(90deg,#94a3b8,#a78bfa);box-shadow:0 0 10px rgba(167,139,250,.22)}
.overview-form{grid-column:1/-1}
.overview-form div{display:flex;gap:5px;margin-top:8px}
.overview-form i{width:25px;height:25px;border-radius:999px;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:800}
.overview-form i.w{background:rgba(34,197,94,.14);color:#86efac}
.overview-form i.l{background:rgba(248,113,113,.14);color:#fca5a5}
.overview-form i.d{background:rgba(148,163,184,.14);color:#cbd5e1}
.overview-daily{grid-column:1/-1;border-color:rgba(34,197,94,.15)!important;background:linear-gradient(135deg,rgba(34,197,94,.08),rgba(125,211,252,.045))!important}
.overview-daily b{font-size:18px!important;color:#ecfdf5!important}
.overview-daily small{color:#bbf7d0!important}
.overview-openings{grid-area:openings;display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center;min-width:0;padding-top:2px}
.overview-openings>div{display:flex;gap:8px;min-width:0;overflow:hidden}
.opening-chip{display:inline-flex;min-width:0;max-width:32%;padding:6px 10px;border-radius:999px;background:rgba(125,211,252,.08);color:#dbeafe;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.opening-chip b{flex:0 0 auto;font-weight:750;color:#7dd3fc}
.recent-games-heading{display:flex;align-items:center;justify-content:space-between;margin:2px 2px 0}
.recent-games-heading h2{display:block;margin:0 0 2px;font-size:17px;letter-spacing:-.02em;color:#f8fbff}
.games-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 10px;color:var(--muted);font-size:12px}
.games-pager:last-child{margin:10px 0 0}
.games-pager div{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.games-pager button{min-height:30px;padding:6px 9px;border-radius:10px;font-size:11px;box-shadow:none}
.games-pager button.active{background:rgba(125,211,252,.18);border-color:rgba(125,211,252,.32);color:#e0f7ff}
.games-table-head{display:grid;grid-template-columns:minmax(260px,1fr) 90px 76px 70px 148px 58px 144px;gap:14px;align-items:center;padding:0 16px 7px;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.07em}
.timepill{display:flex;align-items:center;gap:7px;justify-self:start;min-width:0;padding:6px 8px;border:1px solid rgba(125,211,252,.16);border-radius:13px;background:rgba(125,211,252,.07)}
.timepill .time-icon{position:relative;width:18px;height:18px;border-radius:50%;border:1px solid rgba(125,211,252,.46);box-shadow:inset 0 0 0 2px rgba(125,211,252,.07)}
.timepill .time-icon:before{content:"";position:absolute;left:8px;top:4px;width:1px;height:5px;background:#7dd3fc;border-radius:999px;transform-origin:bottom}
.timepill .time-icon:after{content:"";position:absolute;left:8px;top:8px;width:5px;height:1px;background:#7dd3fc;border-radius:999px}
.timepill span{display:grid;gap:1px;min-width:0}
.timepill b{font-size:12px;color:#e5edf7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.timepill small{font-size:11px;color:var(--muted);white-space:nowrap}
.players .searched{color:#f8fbff}
.players .searched:after{content:"";display:inline-block;width:5px;height:5px;margin-left:6px;border-radius:999px;background:#7dd3fc;vertical-align:middle;box-shadow:0 0 8px rgba(125,211,252,.55)}
.game-opening{display:inline-flex;align-items:center;min-width:0;max-width:100%;width:max-content;margin-top:2px;padding:3px 7px;border:1px solid rgba(125,211,252,.14);border-radius:999px;background:rgba(125,211,252,.07);color:var(--muted);font-size:11px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.game-opening em{font-style:normal;color:rgba(148,163,184,.78)}
.game-row-block{display:grid;gap:6px}
.notes-cell{display:flex;justify-content:center;min-width:0;overflow:visible}
.notes-toggle{position:relative;display:inline-grid;place-items:center;width:34px;height:34px;border:1px solid rgba(255,255,255,.10);border-radius:12px;background:rgba(255,255,255,.045);color:#738196;box-shadow:inset 0 1px 0 rgba(255,255,255,.04);overflow:visible}
.notes-toggle.has-notes{border-color:rgba(52,211,153,.24);background:rgba(52,211,153,.09);color:#baf7d6}
.notes-toggle b{position:absolute;right:1px;top:1px;z-index:2;min-width:15px;height:15px;padding:0 4px;border-radius:999px;background:#22c55e;color:#051008;font-size:9px;line-height:15px;text-align:center;box-shadow:0 4px 12px rgba(34,197,94,.25)}
.mobile-note-chip{display:none}
.game-note-preview{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:start;margin-left:3px;padding:11px 12px;border:1px solid rgba(52,211,153,.16);border-radius:14px;background:rgba(6,12,10,.62)}
.game-note-preview div{display:grid;gap:7px}.game-note-preview p{display:grid;gap:2px;margin:0}.game-note-preview b{color:#baf7d6;font-size:11px}.game-note-preview span{color:#dbe7e2;font-size:12px;line-height:1.35}
.game-note-preview button{min-height:31px;padding:7px 10px;border-radius:10px;background:rgba(125,211,252,.12);border-color:rgba(125,211,252,.22);color:#dff7ff;font-size:11px;box-shadow:none}
.card-cta{display:inline-flex;align-items:center;justify-content:center}
.daily-training-card{position:relative;display:grid;gap:14px;margin:0 0 14px;padding:18px;border:1px solid rgba(125,211,252,.14);border-radius:24px;background:linear-gradient(145deg,rgba(14,25,38,.78),rgba(10,12,18,.64));box-shadow:0 24px 70px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.08);overflow:hidden}
.daily-training-card:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 10% 0%,rgba(125,211,252,.18),transparent 34%),radial-gradient(circle at 88% 8%,rgba(251,191,36,.12),transparent 30%)}
.daily-training-head,.daily-mission-grid,.daily-training-metrics,.daily-training-actions,.daily-training-summary{position:relative}
.daily-training-head{display:grid;gap:4px}.daily-training-head span{color:#93c5fd;text-transform:uppercase;letter-spacing:.11em;font-size:10px;font-weight:850}.daily-training-head b{font-size:22px;letter-spacing:-.03em;color:#f8fbff}.daily-training-head p{font-size:13px;line-height:1.35;color:#aeb8c7}
.daily-mission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.daily-mission{display:grid;gap:10px;min-width:0;padding:14px;border:1px solid rgba(255,255,255,.085);border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.035));box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.daily-mission.openings{border-color:rgba(251,191,36,.22);box-shadow:0 14px 34px rgba(251,191,36,.06),inset 0 1px 0 rgba(255,255,255,.08)}
.daily-mission.blunders{border-color:rgba(52,211,153,.2);box-shadow:0 14px 34px rgba(52,211,153,.055),inset 0 1px 0 rgba(255,255,255,.08)}
.daily-mission-copy{display:grid;grid-template-columns:1fr auto;gap:3px 10px;align-items:start}.daily-mission-copy span{color:#f8fbff;font-size:13px;font-weight:850}.daily-mission-copy b{grid-row:1/3;grid-column:2;color:#fff;font-size:24px;letter-spacing:-.04em;line-height:1}.daily-mission-copy small{color:var(--muted);font-size:11px}
.daily-mission-progress{height:5px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}.daily-mission-progress i{display:block;height:100%;border-radius:inherit;transition:width .35s ease}
.daily-mission.openings .daily-mission-progress i{background:linear-gradient(90deg,#f59e0b,#f8d77a);box-shadow:0 0 14px rgba(251,191,36,.34)}
.daily-mission.blunders .daily-mission-progress i{background:linear-gradient(90deg,#10b981,#8ff5c5);box-shadow:0 0 14px rgba(52,211,153,.28)}
.daily-mission.loading .daily-mission-progress i{background:linear-gradient(90deg,rgba(148,163,184,.25),rgba(255,255,255,.55),rgba(148,163,184,.25));animation:mission-loading 1.1s ease-in-out infinite}
.daily-mission button{position:relative;overflow:hidden;width:100%;border-radius:13px}.daily-mission.openings button{background:linear-gradient(135deg,#b7791f,#f0b429);border-color:rgba(251,191,36,.32);color:#171107}.daily-mission.blunders button{background:linear-gradient(135deg,#0a84ff,#0066d6);border-color:rgba(125,211,252,.34);color:#fff;box-shadow:0 12px 30px rgba(10,132,255,.2)}
.daily-mission.blunders.loading button{background:linear-gradient(90deg,#0a84ff,#0066d6) 0 0/0% 100% no-repeat,linear-gradient(135deg,rgba(10,132,255,.18),rgba(0,102,214,.34));animation:blunder-button-loading 1.2s ease-in-out infinite}
.daily-mission button:disabled{opacity:.62;cursor:not-allowed;transform:none}
@keyframes mission-loading{0%,100%{opacity:.45;transform:translateX(-8%)}50%{opacity:1;transform:translateX(8%)}}
@keyframes blunder-button-loading{0%{background-size:0% 100%,100% 100%}70%,100%{background-size:100% 100%,100% 100%}}
.daily-training-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.daily-training-metrics.compact{grid-template-columns:repeat(2,minmax(0,1fr))}
.daily-training-metrics div{min-width:0;padding:10px;border:1px solid rgba(255,255,255,.075);border-radius:14px;background:rgba(255,255,255,.045)}
.daily-training-metrics span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.daily-training-metrics b{display:block;margin-top:5px;color:#fff;font-size:20px;line-height:1}
.daily-training-actions{display:flex;gap:8px;flex-wrap:wrap}.daily-training-actions button:first-child{background:linear-gradient(135deg,#0a84ff,#0066d6);border-color:rgba(125,211,252,.34);color:#fff;box-shadow:0 12px 30px rgba(10,132,255,.24)}
.daily-training-summary{padding:9px 10px;border-radius:14px;background:rgba(34,197,94,.08);border:1px solid rgba(34,197,94,.16);color:#bbf7d0;font-size:12px}.daily-training-summary span{display:block;color:#86efac;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.daily-training-summary b{display:block;margin-top:2px;color:#ecfdf5}
.other-player-banner{position:relative;display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 14px;padding:16px 18px;border:1px solid rgba(251,191,36,.20);border-radius:22px;background:linear-gradient(145deg,rgba(40,30,12,.72),rgba(12,16,24,.72));box-shadow:0 18px 55px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.08)}
.other-player-banner span{display:block;color:#fbbf24;text-transform:uppercase;letter-spacing:.10em;font-size:10px;font-weight:850}.other-player-banner b{display:block;margin-top:3px;color:#fff;font-size:20px}.other-player-banner p{margin-top:4px;color:#cbd5e1;font-size:13px;line-height:1.35}.other-player-banner>div:last-child{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.other-player-banner button:first-child{background:linear-gradient(135deg,#0a84ff,#0066d6);border-color:rgba(125,211,252,.34);color:#fff}
.daily-session-head{display:grid;gap:3px;padding:11px 12px;border-radius:15px;background:linear-gradient(135deg,rgba(14,165,233,.13),rgba(251,191,36,.075));border:1px solid rgba(125,211,252,.18)}
.daily-session-head span{color:#93c5fd;text-transform:uppercase;letter-spacing:.11em;font-size:10px;font-weight:850}.daily-session-head b{color:#fff;font-size:19px;letter-spacing:-.02em}.daily-session-head small{color:#f8d98b;font-size:11px;font-weight:750}
.daily-session-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}.daily-session-summary div{padding:10px;border-radius:13px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.075)}.daily-session-summary b{display:block;color:#fff;font-size:20px}.daily-session-summary span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.06em}
body.games-active main,body.games-active .side,body.games-active .drawer-card,body.games-active #gamePicker{min-width:0;max-width:100%;box-sizing:border-box;overflow-x:hidden}
body.games-active .game-row-block{min-width:0;max-width:100%;overflow:hidden}
@media(max-width:700px){body.games-active .game-row-block{overflow:visible}}
@media(min-width:851px){
 body.games-active main{max-width:min(1120px,calc(100vw - 196px));width:100%;padding-left:24px;padding-right:24px}
 body.games-active .drawer-card{padding:18px;overflow:hidden}
 body.games-active #gamePicker{width:100%;gap:9px}
 body.games-active .games-table-head{
  grid-template-columns:minmax(0,1fr) 84px 70px 62px minmax(116px,132px) 56px 116px!important;
  gap:10px;
  padding:0 12px 7px;
 }
 body.games-active .gamepick.rich{
  width:100%;
  max-width:100%;
  min-width:0;
  grid-template-columns:minmax(0,1fr) 84px 70px 62px minmax(116px,132px) 56px 116px!important;
  gap:10px;
  padding:12px;
  border-radius:14px;
  box-shadow:none;
  overflow:hidden;
 }
 body.games-active .gamepick.rich>*{min-width:0;max-width:100%;overflow:hidden}
 body.games-active .players,.game-opening{min-width:0;max-width:100%;overflow:hidden}
 body.games-active .timepill{width:84px;max-width:84px;padding:6px 7px}
 body.games-active .game-result{width:70px;max-width:70px}
 body.games-active .colorpill{width:62px;max-width:62px;padding:7px 6px}
 body.games-active .metric-pill{width:100%;max-width:132px}
 body.games-active .notes-cell{width:56px;max-width:56px;justify-self:center;overflow:visible}
 body.games-active .notes-toggle{width:34px;height:34px;border-radius:11px;overflow:visible}
 body.games-active .card-cta{width:116px;max-width:116px;min-height:36px;padding:8px 9px;white-space:nowrap}
 body.games-active .gamepick.rich.win{box-shadow:inset 3px 0 0 var(--green)}
 body.games-active .gamepick.rich.loss{box-shadow:inset 3px 0 0 var(--red)}
 body.games-active .gamepick.rich.draw{box-shadow:inset 3px 0 0 rgba(148,163,184,.55)}
 body.games-active .game-result{justify-self:start;min-width:0}
 body.games-active .game-result b{font-size:13px;color:#e5edf7}
 body.games-active .gamepick.win .game-result b{color:#86efac}
 body.games-active .gamepick.loss .game-result b{color:#fca5a5}
 body.games-active .gamepick.draw .game-result b{color:#cbd5e1}
 body.games-active .game-result small{font-size:10px}
}
@media(max-width:700px){
 body.games-active .games-table-head{display:none}
 body.games-active .game-row-block{gap:8px;padding:9px 10px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.055);box-shadow:none;overflow:hidden}
 body.games-active .game-row-block.win{box-shadow:inset 3px 0 0 var(--green)}
 body.games-active .game-row-block.loss{box-shadow:inset 3px 0 0 var(--red)}
 body.games-active .game-row-block.draw{box-shadow:inset 3px 0 0 rgba(148,163,184,.55)}
 body.games-active .gamepick.rich{grid-template-columns:1fr auto!important;gap:7px 8px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
 body.games-active .players{grid-column:1/-1;gap:2px}
 body.games-active .players b{font-size:13px;line-height:1.18;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal}
 body.games-active .players em{font-size:11px}
 body.games-active .game-opening{margin-top:2px;max-width:100%;padding:2px 7px;font-size:10.5px}
 body.games-active .timepill{grid-column:1;grid-row:auto;display:flex;align-items:center;gap:7px;min-height:30px;width:auto;max-width:100%;padding:5px 7px;border-radius:11px}
 body.games-active .timepill .time-icon{display:none}
 body.games-active .timepill b{font-size:11px}
 body.games-active .timepill small{font-size:10px}
 body.games-active .game-result{grid-column:2;justify-self:end;align-self:center;display:grid;gap:1px;text-align:right}
 body.games-active .game-result b{font-size:12px;line-height:1;color:#e5edf7}
 body.games-active .game-result small{font-size:10px;color:var(--muted);white-space:nowrap}
 body.games-active .colorpill{grid-column:1;justify-self:start;align-self:center;padding:4px 7px;font-size:10.5px}
 body.games-active .notes-cell{display:none!important}
 body.games-active .mobile-note-chip{display:inline-flex;align-items:center;justify-self:start;width:max-content;max-width:100%;min-height:30px;margin:0;padding:6px 9px;border:1px solid rgba(52,211,153,.24);border-radius:999px;background:rgba(52,211,153,.10);color:#c8f7dc;font-size:11px;font-weight:850;line-height:1;box-shadow:inset 0 1px 0 rgba(255,255,255,.05);position:relative;z-index:3}
 body.games-active .acc.metric-pill{grid-column:1;justify-self:start;align-self:center;width:max-content;max-width:150px;min-width:0;padding:6px 8px;border-radius:12px}
 body.games-active .metric-icon{width:17px;height:17px}
 body.games-active .metric-copy small{font-size:8.5px}
 body.games-active .metric-copy b{font-size:13px}
 body.games-active .card-cta{grid-column:2;justify-self:end;align-self:center;width:auto;min-width:108px;min-height:34px;padding:8px 10px;border-radius:11px;font-size:12px;white-space:nowrap}
 body.games-active .game-note-preview{grid-template-columns:1fr;gap:9px;margin-left:0;padding:10px;border-radius:13px}
 body.games-active .game-note-preview p{gap:1px}
 body.games-active .game-note-preview span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px}
 body.games-active .game-note-preview button{justify-self:start;min-height:34px}
}
@media(max-width:850px){
 .player-overview{padding:14px;border-radius:20px}
 .daily-training-card,.other-player-banner{padding:14px;border-radius:20px;margin-bottom:12px}.games-active .daily-training-card{display:none}.daily-training-head b{font-size:20px}.daily-mission-grid{grid-template-columns:1fr}.daily-mission{padding:12px;border-radius:16px}.daily-training-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.daily-training-metrics div:last-child{grid-column:auto}.daily-training-actions{display:grid;grid-template-columns:1fr}.daily-training-actions button{width:100%}.other-player-banner{display:grid}.other-player-banner>div:last-child{display:grid;grid-template-columns:1fr}.other-player-banner button{width:100%}
 .daily-session-summary{grid-template-columns:1fr}
 .overview-title{margin-bottom:12px}
 .overview-compact{grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
 .overview-compact>div:last-child{grid-column:1/-1}
 .overview-toggle span{display:none}
 .overview-toggle{min-width:34px;width:34px;height:34px;padding:0}
 .overview-grid{display:grid;grid-template-columns:1fr;grid-template-areas:"trend" "side" "openings";gap:10px}
 .overview-trend{padding:14px}
 .trend-head{grid-template-columns:1fr auto;gap:8px}
 .trend-head em{grid-column:2}
 .trend-range-control{grid-column:1/-1;justify-self:start}
 .trend-head strong{font-size:28px}
 .spark-wrap{grid-template-columns:30px minmax(0,1fr)}
 .spark-y{font-size:9px}
 .rating-spark{height:70px}
 .spark-range{margin-left:37px;font-size:9px}
 .trend-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
 .overview-insights{grid-template-columns:1fr;gap:6px}
 .overview-insights div{padding:8px 9px}
 .overview-next-action{padding:9px 10px}
 .trend-tooltip{min-width:166px;padding:9px 10px}
 .overview-stats{grid-template-columns:1fr 1fr;gap:8px}
 .overview-stats>div{padding:11px;border-radius:15px}
 .overview-stats b{font-size:22px}
 .overview-form{grid-column:1/-1}
 .overview-openings{grid-template-columns:1fr;gap:7px}
 .overview-openings>div{flex-wrap:wrap;overflow:visible}
 .opening-chip{max-width:100%}
 .games-table-head{display:none}
 .games-pager{display:grid;gap:8px;margin-bottom:8px}
 .games-pager div{justify-content:flex-start}
 body.games-active .gamepick.rich{grid-template-columns:1fr!important}
 body.games-active .timepill{justify-self:start}
body.games-active .game-result{justify-self:start}
}
.summary-opening-label{color:var(--muted);font-size:12px;font-weight:650}
.summary-opening-label em{font-style:normal;color:rgba(148,163,184,.78)}

.opening-trainer-view{padding:28px;max-width:1400px;margin:0 auto}
.opening-trainer-grid{display:grid;grid-template-columns:minmax(320px,1fr) minmax(300px,420px);gap:18px;align-items:start}
.opening-trainer-view label{display:grid;gap:7px;color:var(--muted);font-size:13px}
.opening-trainer-view input,.opening-trainer-view select,.opening-trainer-view textarea{width:100%;border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--text);border-radius:14px;padding:11px 12px;font:inherit}
.trainer-grid{display:grid;grid-template-columns:1fr 170px;gap:12px;margin-bottom:12px}
.opening-import{display:grid;gap:12px}
.trainer-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
#repStatus,#trainerFeedback,#trainerLine,.muted{color:var(--muted)}
.trainer-stats{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.trainer-stats div{background:rgba(255,255,255,.045);border:1px solid var(--line);border-radius:16px;padding:14px}
.trainer-stats b{display:block;font-size:25px}
.trainer-stats span{color:var(--muted);font-size:13px}
.rep-list{display:grid;gap:10px}
.repertoire-menu{gap:14px}
.repertoire-home-card{grid-column:1/-1;max-width:none;padding:20px;background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.035));border-color:rgba(255,255,255,.10)}
.repertoire-home-head{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:10px}
.repertoire-home-head>div{display:grid;gap:5px;min-width:0}
.repertoire-home-head span{color:#8ec5ff;text-transform:uppercase;letter-spacing:.12em;font-size:11px;font-weight:800}
.repertoire-home-head b{color:#f7fbff;font-size:24px;letter-spacing:-.03em;line-height:1.08}
.rep-home-back{align-self:start;border-radius:12px;padding:9px 12px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);color:#dbeafe;font-weight:750;box-shadow:none}
.rep-home-back:hover{background:rgba(142,197,255,.12);border-color:rgba(142,197,255,.28)}
.repertoire-summary-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.repertoire-summary-strip div{min-width:0;padding:11px 12px;border:1px solid rgba(255,255,255,.09);border-radius:15px;background:rgba(255,255,255,.04)}
.repertoire-summary-strip b{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#fff;font-size:18px;letter-spacing:-.02em}
.repertoire-summary-strip span{display:block;margin-top:2px;color:var(--muted);font-size:11px}
.repertoire-summary-strip small{display:block;margin-top:2px;color:rgba(148,163,184,.78);font-size:9.5px;line-height:1.15}
.rep-dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.rep-dashboard-card{position:relative;display:grid!important;justify-items:stretch;text-align:left;gap:14px;min-height:190px;padding:18px;border-radius:22px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.035));box-shadow:0 20px 52px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.05);overflow:hidden}
.rep-mastery-fill{position:absolute;left:0;right:0;bottom:0;height:var(--mastery-fill,0%);min-height:calc(min(var(--mastery-fill,0%),1%) * 10);pointer-events:none;background:linear-gradient(180deg,rgba(45,212,191,.03),rgba(34,197,94,.13) 45%,rgba(22,163,74,.24));box-shadow:inset 0 1px 0 rgba(187,247,208,.18),0 -10px 28px rgba(45,212,191,.08);opacity:.92;filter:saturate(120%);animation:rep-mastery-rise .75s ease-out both}
.rep-mastery-fill:before{content:"";position:absolute;left:-8%;right:-8%;top:-12px;height:24px;background:radial-gradient(ellipse at 50% 100%,rgba(187,247,208,.20),transparent 64%);filter:blur(7px);opacity:.75}
.rep-dashboard-card:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 18% 16%,rgba(226,246,255,.18),transparent 31%),radial-gradient(circle at 84% 12%,rgba(125,211,252,.15),transparent 34%)}
.rep-dashboard-card.black:before{background:radial-gradient(circle at 18% 16%,rgba(167,139,250,.18),transparent 31%),radial-gradient(circle at 84% 12%,rgba(99,102,241,.16),transparent 34%)}
.rep-dashboard-card:hover{transform:translateY(-2px);border-color:rgba(125,211,252,.28);box-shadow:0 26px 64px rgba(0,0,0,.30),0 0 30px rgba(10,132,255,.10),inset 0 1px 0 rgba(255,255,255,.07)}
.rep-card-main{position:relative;display:grid;grid-template-columns:68px minmax(0,1fr);gap:14px;align-items:center;min-width:0}
.rep-card-badge{display:grid;place-items:center;width:68px;height:68px;min-width:68px;max-width:68px;aspect-ratio:1;border-radius:22px;padding:0;font-size:42px;line-height:1;font-family:Georgia,'Times New Roman',serif;font-style:normal;font-weight:700;color:#f8fbff;background:linear-gradient(145deg,rgba(255,255,255,.24),rgba(125,211,252,.09));border:1px solid rgba(226,246,255,.30);box-shadow:inset 0 1px 0 rgba(255,255,255,.34),inset 0 -12px 24px rgba(15,23,42,.18),0 16px 34px rgba(125,211,252,.12);text-shadow:0 1px 0 rgba(255,255,255,.22),0 8px 20px rgba(125,211,252,.20)}
.rep-dashboard-card.white .rep-card-badge{font-size:40px}
.rep-dashboard-card.black .rep-card-badge{color:#090d18;background:linear-gradient(145deg,rgba(226,232,240,.20),rgba(76,29,149,.18) 42%,rgba(15,23,42,.42));border-color:rgba(196,181,253,.30);box-shadow:inset 0 1px 0 rgba(255,255,255,.20),inset 0 -12px 24px rgba(0,0,0,.30),0 16px 34px rgba(99,102,241,.16);text-shadow:0 1px 0 rgba(255,255,255,.25),0 0 18px rgba(196,181,253,.28)}
.rep-card-copy{display:grid;gap:7px;min-width:0}
.rep-card-top{display:flex;align-items:center;gap:10px;color:#dbeafe;font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.rep-dashboard-card.white .rep-card-top{color:#e0f2fe}.rep-dashboard-card.black .rep-card-top{color:#ddd6fe}
.rep-card-copy>b{position:relative;color:#fff;font-size:21px;letter-spacing:-.025em;line-height:1.08}
.rep-card-copy small{position:relative;color:#a8b4c4;font-size:12px;min-height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rep-card-stats{position:relative;align-self:end;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;margin-top:4px}
.rep-card-stats span{padding:8px 9px;border-radius:12px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07);color:#aeb8c7;font-size:11px}
.rep-card-stats strong{display:block;color:#fff;font-size:15px}
@keyframes rep-mastery-rise{0%{height:0;opacity:.35}100%{height:var(--mastery-fill,0%);opacity:.92}}
@media(prefers-reduced-motion:reduce){.rep-mastery-fill{animation:none}}
@media(max-width:560px){.rep-card-main{grid-template-columns:58px minmax(0,1fr);gap:12px}.rep-card-badge{width:58px;height:58px;min-width:58px;max-width:58px;border-radius:19px;font-size:36px}.rep-dashboard-card.white .rep-card-badge{font-size:34px}.rep-card-copy>b{font-size:19px}.rep-card-stats{gap:7px}}
.color-detail-card{grid-column:1/-1;display:grid;gap:18px;min-width:0}
.color-detail-layout{display:grid;grid-template-columns:520px minmax(320px,1fr);gap:28px;align-items:start;min-width:0}
.color-detail-board-wrap{margin:0;max-width:520px;width:100%;min-width:0}
#colorDetailBoard{width:100%;border-radius:20px;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.42)}
.color-detail-actions{display:grid;gap:10px}
.color-detail-actions>button{justify-content:flex-start;padding:14px 16px}
#colorStartBuilder{position:relative;overflow:hidden;border-color:rgba(52,211,153,.34);background:linear-gradient(180deg,rgba(52,211,153,.18),rgba(14,165,233,.10));color:#eafff7;font-weight:900;box-shadow:0 14px 34px rgba(20,184,166,.12),inset 0 1px 0 rgba(255,255,255,.08)}
#colorStartBuilder:before{content:"+";display:grid;place-items:center;width:22px;height:22px;margin-right:8px;border-radius:999px;background:rgba(52,211,153,.20);border:1px solid rgba(187,247,208,.22);color:#bbf7d0;font-size:17px;line-height:1}
.color-rep-list{display:grid;gap:10px;margin-top:10px;padding:10px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.022))}
.color-empty-state{display:grid;gap:4px;padding:14px;border:1px dashed rgba(125,211,252,.22);border-radius:15px;background:rgba(14,165,233,.055)}
.color-empty-state b{color:#eef8ff;font-size:14px}
.color-empty-state span{color:var(--muted);font-size:12px}
.color-rep-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:1px 2px 4px}
.color-rep-list h3{margin:0;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:#dbeafe}
.color-rep-section-head span{color:var(--muted);font-size:11px;font-weight:750}
.color-rep-list button{justify-content:space-between;box-shadow:none;border-radius:14px}
.color-rep-list button.active{border-color:rgba(10,132,255,.35);background:rgba(10,132,255,.10)}
.color-rep-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
.color-rep-row>button:first-child{min-width:0;display:grid;justify-items:start;gap:3px;text-align:left;padding:13px 14px;background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.035));border-color:rgba(255,255,255,.10)}
.color-rep-row>button:first-child b{font-size:14px;color:#f7fbff;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.color-rep-row>button:first-child span{color:#9aa6b5;font-size:11px}
.color-rep-row.active>button:first-child{border-color:rgba(56,189,248,.35);background:linear-gradient(180deg,rgba(14,165,233,.12),rgba(255,255,255,.04));box-shadow:0 0 24px rgba(14,165,233,.08)}
.color-rep-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px}
.color-rep-edit{display:grid;gap:9px;padding:12px;border:1px solid rgba(125,211,252,.18);border-radius:15px;background:linear-gradient(180deg,rgba(14,165,233,.08),rgba(255,255,255,.032))}
.color-rep-edit label{display:grid;gap:6px}.color-rep-edit label span{color:#8ec5ff;font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.05em}
.color-rep-edit div{display:flex;gap:8px;flex-wrap:wrap}
.color-rep-edit button{padding:9px 12px}
.color-rep-edit .danger{margin-left:auto;border-color:rgba(248,113,113,.32);color:#fecaca;background:rgba(248,113,113,.08)}
.rep-section{border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.03);overflow:hidden}
.rep-section summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:13px 14px;list-style:none}
.rep-section summary::-webkit-details-marker{display:none}
.rep-section summary span{color:var(--muted);font-size:12px}
.rep-section-body{display:grid;padding:0 14px 12px}
.empty-rep{padding:10px 0}
.rep-item{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding-top:10px}
.rep-item:first-child{border-top:0;padding-top:0}
.rep-item span{display:block;color:var(--muted);font-size:13px;margin-top:2px}
.opening-dashboard h2{margin:0}
.opening-dashboard{grid-column:1/-1;max-width:860px;width:100%;justify-self:center}
.opening-menu-head{align-items:center}
.small-action{padding:8px 12px;border-radius:12px;font-size:13px;min-height:36px;box-shadow:none}
.small-action.danger{border-color:rgba(248,113,113,.30);color:#fecaca;background:rgba(248,113,113,.08)}
.small-action.danger:hover{border-color:rgba(248,113,113,.55);background:rgba(248,113,113,.14)}
.opening-flow-card{grid-column:1/-1;max-width:760px;width:100%;justify-self:center;display:grid;gap:16px}
.flow-head{display:flex;align-items:flex-start;gap:14px}
.flow-head h2{margin:0 0 4px}
.flow-head p{font-size:13px}
.detail-action-list{display:grid;gap:10px}
.detail-action-list button{justify-content:flex-start;text-align:left;padding:14px 16px}
.detail-line-list{display:grid;gap:10px;margin-top:4px}
.detail-line-list h3{margin:8px 0 0;font-size:15px}
.learning-overview{position:relative;display:grid;gap:10px;padding:12px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.035);overflow:visible}
.learning-overview-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.learning-overview-head h3{margin:0;font-size:15px}.learning-overview-head p{margin:2px 0 0;color:var(--muted);font-size:12px}.learning-overview-head small{display:block;margin-top:4px;color:#9fb7d4;font-size:11px;line-height:1.35}
.learning-overview-head button{padding:8px 12px;border-radius:10px}
.learning-overview-head>b{font-size:20px;color:#e7f8ff}
.mastery-bar,.practice-progress{height:7px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.mastery-bar i,.practice-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#38bdf8,#22c55e)}
.queue-status-summary{display:grid;gap:8px;padding:9px;border:1px solid rgba(255,255,255,.075);border-radius:13px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.022));box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.queue-segment-bar{display:flex;height:9px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.075);box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}
.queue-segment-bar i{display:block;height:100%;min-width:0}.queue-segment-bar i:empty{display:block}
.queue-segment-bar .new{background:linear-gradient(90deg,#38bdf8,#60a5fa);box-shadow:0 0 14px rgba(56,189,248,.22)}
.queue-segment-bar .learning{background:linear-gradient(90deg,#f59e0b,#fbbf24);box-shadow:0 0 14px rgba(251,191,36,.18)}
.queue-segment-bar .mastered{background:linear-gradient(90deg,#16a34a,#22c55e);box-shadow:0 0 14px rgba(34,197,94,.18)}
.queue-status-labels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.queue-status-labels span{display:flex;align-items:center;justify-content:space-between;gap:5px;min-width:0;padding:6px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.045);color:#cbd5e1;font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.03em;white-space:nowrap}
.queue-status-labels b{font-size:11px;color:#f8fafc}.queue-status-labels .new{color:#bfdbfe}.queue-status-labels .learning{color:#fde68a}.queue-status-labels .mastered{color:#bbf7d0}
.practice-menu-actions{position:relative;z-index:2;display:grid;gap:9px}
.practice-action-card{position:relative;z-index:1;display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:11px;align-items:center;text-align:left;width:100%;padding:11px 12px;border-radius:15px;background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.035));border-color:rgba(255,255,255,.10);box-shadow:0 12px 30px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.04);overflow:hidden;pointer-events:auto;cursor:pointer}
.practice-action-card:before{content:"";position:absolute;inset:0;border-radius:inherit;opacity:0;background:radial-gradient(circle at 16% 50%,var(--queue-glow,rgba(56,189,248,.18)),transparent 48%);transition:opacity .18s ease;pointer-events:none}
.practice-action-card:hover:not(:disabled){transform:translateY(-1px);border-color:var(--queue-border,rgba(255,255,255,.16));box-shadow:0 16px 36px rgba(0,0,0,.20),0 0 24px var(--queue-shadow,rgba(56,189,248,.10))}
.practice-action-card:hover:not(:disabled):before{opacity:1}.practice-action-card:active:not(:disabled){transform:translateY(0) scale(.992)}
.practice-action-card i{position:relative;width:30px;height:30px;border-radius:11px;display:grid;place-items:center;font-style:normal;font-size:14px;font-weight:900;background:rgba(255,255,255,.075);color:var(--queue-icon,#bae6fd);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.practice-action-card span{position:relative;display:grid;gap:2px;min-width:0}.practice-action-card b{font-size:13px;color:#f7fbff}.practice-action-card em{font-style:normal;color:var(--muted);font-size:11px;line-height:1.25;white-space:normal}.practice-action-card small{position:relative;justify-self:end;padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.065);color:#dbeafe;border:1px solid rgba(255,255,255,.10);font-size:11px;font-weight:850;white-space:nowrap}
.practice-action-card.recommended{--queue-icon:#fef3c7;--queue-glow:rgba(251,191,36,.20);--queue-border:rgba(251,191,36,.34);--queue-shadow:rgba(251,191,36,.13);background:linear-gradient(135deg,rgba(14,165,233,.13),rgba(251,191,36,.075) 52%,rgba(255,255,255,.04));border-color:rgba(125,211,252,.18)}
.practice-action-card.recommended small{color:#fde68a;border-color:rgba(251,191,36,.24);background:rgba(251,191,36,.10)}
.practice-action-card.due{--queue-icon:#fde68a;--queue-glow:rgba(245,158,11,.16);--queue-border:rgba(245,158,11,.28);--queue-shadow:rgba(245,158,11,.10)}
.practice-action-card.resume{--queue-icon:#bfdbfe;--queue-glow:rgba(96,165,250,.14);--queue-border:rgba(96,165,250,.24);--queue-shadow:rgba(96,165,250,.09)}
.practice-action-card:disabled{opacity:.55;cursor:not-allowed;transform:none;filter:saturate(.75);pointer-events:auto}.practice-action-card:disabled i,.practice-action-card:disabled small{opacity:.75}
.recommended-lines{display:grid;gap:6px}.recommended-lines>b{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.recommended-lines button{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;text-align:left;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.04);box-shadow:none}
.recommended-lines span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recommended-lines small{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:11px}
.line-group{border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025);overflow:hidden}
.line-group>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;padding:11px 12px;list-style:none}
.line-group>summary::-webkit-details-marker,.detail-line>summary::-webkit-details-marker{display:none}
.line-group>summary b{display:block;font-size:14px}.line-group>summary span{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.line-group-body{display:grid;gap:8px;padding:0 10px 10px}
.detail-line{border-top:1px solid var(--line);padding-top:8px}
.detail-line:first-child{border-top:0;padding-top:0}
.detail-line>summary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;cursor:pointer;list-style:none;padding:7px 0}
.detail-line>summary b{display:block;font-size:13px}.detail-line>summary span{display:block;color:var(--text);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.detail-line>summary small{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.detail-line-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}
.line-delete-button{padding:6px 9px;border-radius:9px;border-color:rgba(248,113,113,.28);background:rgba(248,113,113,.07);color:#fecaca;font-size:11px;box-shadow:none}
.line-delete-button:hover{border-color:rgba(248,113,113,.5);background:rgba(248,113,113,.12)}
.detail-line-full{display:grid;gap:8px;padding:8px 0 4px}.detail-line-full p{margin:0;color:var(--muted);font-size:12px;line-height:1.45}.line-mastery-note{display:inline-flex;width:max-content;max-width:100%;padding:5px 8px;border-radius:10px;background:rgba(125,211,252,.08);border:1px solid rgba(125,211,252,.14);color:#cfe8ff;font-size:11px;line-height:1.35}.detail-line-full div{display:flex;flex-wrap:wrap;gap:6px}.detail-line-full button,.detail-line.edit button{padding:7px 10px;border-radius:9px;font-size:12px;box-shadow:none}.detail-line-full .danger{border-color:rgba(248,113,113,.35);color:#fecaca;background:rgba(248,113,113,.08)}
.status-badge,.srs-badge{align-self:center;justify-self:end;display:inline-flex;align-items:center;gap:5px;min-height:24px;padding:4px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.12);font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.025em;color:var(--muted);background:rgba(255,255,255,.045);white-space:nowrap;box-shadow:0 0 0 1px rgba(255,255,255,.015),0 8px 22px rgba(0,0,0,.16);font-style:normal}
.status-badge span{width:15px;height:15px;border-radius:999px;display:grid;place-items:center;font-size:10px;line-height:1;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.status-badge b{font-size:10px;color:inherit}.status-badge--new,.srs-badge.new{color:#bfdbfe;background:rgba(59,130,246,.11);border-color:rgba(96,165,250,.28);box-shadow:0 0 18px rgba(59,130,246,.10)}.status-badge--ready{color:#bae6fd;background:rgba(14,165,233,.10);border-color:rgba(56,189,248,.26);box-shadow:0 0 18px rgba(56,189,248,.10)}.status-badge--due,.srs-badge.due{color:#fde68a;background:rgba(245,158,11,.11);border-color:rgba(245,158,11,.28);box-shadow:0 0 18px rgba(245,158,11,.12)}.status-badge--learning,.srs-badge.learning{color:#ddd6fe;background:rgba(139,92,246,.11);border-color:rgba(139,92,246,.25);box-shadow:0 0 18px rgba(139,92,246,.10)}.status-badge--hard,.srs-badge.hard{color:#fecaca;background:rgba(239,68,68,.10);border-color:rgba(248,113,113,.28);box-shadow:0 0 18px rgba(239,68,68,.11)}.status-badge--mastered,.srs-badge.mastered{color:#bbf7d0;background:rgba(34,197,94,.11);border-color:rgba(34,197,94,.28);box-shadow:0 0 18px rgba(34,197,94,.11)}
.detail-line.edit{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.035)}
.detail-line.edit b,.detail-line.edit span,.detail-line.edit small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis}
.detail-line.edit span{margin-top:4px;color:var(--text);font-size:13px;white-space:nowrap}
.detail-line.edit small{margin-top:4px;color:var(--muted);font-size:12px}
.detail-line.edit>div:last-child{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.detail-line.edit button{padding:8px 10px;border-radius:11px;font-size:12px}
.detail-line.edit{grid-template-columns:1fr}
.detail-line.edit div{display:flex;gap:8px;flex-wrap:wrap}
.dashboard-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}
.dashboard-head p{margin:4px 0 0;color:var(--muted);font-size:13px}
.daily-tasks{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);display:grid;gap:7px;color:var(--muted);font-size:13px}
.daily-tasks h3{margin:0;color:var(--text);font-size:14px}
.daily-tasks span{padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.035)}
.trainer-board-card{grid-column:1/-1;display:grid;gap:18px;align-items:start}
.trainer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.trainer-builder-layout{display:grid;grid-template-columns:520px minmax(420px,1fr);align-items:start;gap:32px}
.trainer-left-column{display:grid;gap:12px;align-content:start}
.trainer-board-toolbar{display:flex;justify-content:flex-start;align-items:center;gap:8px;flex-wrap:wrap;position:relative}
.trainer-board-toolbar button{padding:8px 12px;border-radius:12px;box-shadow:none}
.trainer-board-toolbar button:disabled{opacity:.45;cursor:not-allowed;transform:none}
.trainer-board-toolbar .mobile-builder-action{display:none}
.trainer-board-wrap{margin:0;max-width:520px;overflow:visible!important}
#trainerBoard{width:100%;max-width:560px;border-radius:20px;overflow:visible!important;box-shadow:0 24px 70px rgba(0,0,0,.55)}
#trainerLine{display:flex;align-items:center;justify-content:center;gap:4px 5px;flex-wrap:wrap;min-height:20px;color:var(--muted);font-size:13px;line-height:1.25;word-break:break-word}
#trainerLine.trainer-line-clickable{color:#dbeafe}
.trainer-line-move{display:inline-flex;align-items:center;justify-content:center;min-height:24px;padding:2px 6px;border:1px solid transparent;border-radius:8px;background:transparent;color:inherit;font:inherit;font-weight:800;line-height:1.1;box-shadow:none;cursor:pointer;touch-action:manipulation}
.trainer-line-move:hover,.trainer-line-move:focus-visible{border-color:rgba(125,211,252,.30);background:rgba(125,211,252,.10);color:#f8fafc;transform:none;outline:none}
.trainer-line-move.active{color:#bbf7d0;background:rgba(52,211,153,.08);border-color:rgba(52,211,153,.16)}
.trainer-line-move.pulse{animation:trainer-line-pulse .22s ease-out both}
@keyframes trainer-line-pulse{0%{box-shadow:0 0 0 0 rgba(125,211,252,.30)}100%{box-shadow:0 0 0 7px rgba(125,211,252,0)}}
.trainer-board-wrap .board-b72b1{overflow:visible!important}
body.opening-trainer-active>img.piece-417db{visibility:visible!important;opacity:1!important;z-index:9999!important;pointer-events:none!important;filter:drop-shadow(0 14px 22px rgba(0,0,0,.36))}
body.opening-trainer-active [data-trainer-release-ghost="1"]{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important}
body.opening-trainer-active #trainerBoard,body.opening-trainer-active #trainerBoard .board-b72b1,body.opening-trainer-active #trainerBoard .square-55d63{touch-action:none;-ms-touch-action:none;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.trainer-custom-drag-piece{position:fixed!important;z-index:10000!important;pointer-events:none!important;max-width:none!important;touch-action:none!important;filter:drop-shadow(0 14px 22px rgba(0,0,0,.38));will-change:left,top}
.trainer-drag-source-hidden{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
#trainerArrowLayer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hint-square{position:absolute;inset:8%;border:4px solid rgba(255,159,10,.95);border-radius:12px;pointer-events:none;z-index:7;box-shadow:0 0 18px rgba(255,159,10,.45)}
.trainer-move-flash{position:absolute;inset:9%;border-radius:12px;pointer-events:none;z-index:30;animation:trainer-flash .42s ease-out forwards}
.trainer-move-flash.ok{background:rgba(251,191,36,.08);box-shadow:inset 0 0 0 2px rgba(251,191,36,.34),inset 0 0 14px rgba(52,211,153,.10)}
.trainer-move-flash.bad{background:rgba(248,113,113,.12);box-shadow:inset 0 0 0 2px rgba(248,113,113,.42),inset 0 0 14px rgba(248,113,113,.14);animation-name:trainer-flash-bad;animation-duration:.62s}
@keyframes trainer-flash{0%{opacity:0}24%{opacity:1}100%{opacity:0}}
@keyframes trainer-flash-bad{0%{opacity:0;transform:translateX(0)}20%{opacity:1;transform:translateX(-1px)}42%{transform:translateX(1px)}100%{opacity:0;transform:translateX(0)}}
.line-complete-reward{display:grid;justify-items:center;gap:5px;padding:14px;border:1px solid rgba(52,211,153,.24);border-radius:16px;background:rgba(52,211,153,.075);box-shadow:0 0 18px rgba(52,211,153,.10);animation:line-complete-pulse .9s ease-out both;color:#dffaf0}
.line-complete-reward span{display:grid;place-items:center;width:26px;height:26px;border-radius:999px;background:rgba(52,211,153,.16);color:#34d399;font-weight:900;font-size:15px}
.line-complete-reward b{font-size:14px}.line-complete-reward small{color:var(--muted);font-size:12px}
.repair-complete-card{position:relative;overflow:hidden;display:grid;gap:16px;padding:18px;border:1px solid rgba(52,211,153,.34);border-radius:18px;background:radial-gradient(circle at 18% 0%,rgba(52,211,153,.18),transparent 34%),linear-gradient(180deg,rgba(20,184,166,.14),rgba(59,130,246,.065));box-shadow:0 0 38px rgba(20,184,166,.18),0 18px 44px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.09);animation:repair-complete-glow 1.15s ease-out both}
.repair-complete-card:before{content:"";position:absolute;inset:-1px;background:linear-gradient(120deg,transparent,rgba(125,211,252,.18),transparent);opacity:.7;transform:translateX(-70%);animation:repair-complete-sheen 1.4s ease-out .1s both;pointer-events:none}
.repair-complete-top{position:relative;z-index:1;display:flex;align-items:center;gap:10px}
.repair-complete-kicker{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border:1px solid rgba(125,211,252,.18);border-radius:999px;background:rgba(5,18,32,.42);color:#bff4ff;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.repair-complete-badge{display:grid;place-items:center;width:42px;height:42px;border-radius:999px;background:rgba(52,211,153,.18);border:1px solid rgba(52,211,153,.42);box-shadow:0 0 24px rgba(52,211,153,.24);color:#b7f7dc;font-size:22px;font-weight:950;animation:repair-check-pop .55s cubic-bezier(.2,1.45,.45,1) both}
.repair-complete-coach{position:relative;z-index:1}.repair-complete-coach p{max-width:46ch}
.repair-complete-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.repair-complete-summary div{position:relative;z-index:1;padding:10px;border:1px solid rgba(255,255,255,.10);border-radius:12px;background:rgba(0,0,0,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.045)}
.repair-complete-summary b{display:block;color:#e8fbff;font-size:18px}.repair-complete-summary span{display:block;margin-top:2px;color:var(--muted);font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.04em}
.repair-complete-next{position:relative;z-index:1;display:grid;gap:8px;padding:12px;border:1px solid rgba(125,211,252,.18);border-radius:14px;background:rgba(5,18,32,.38)}
.repair-complete-next span{color:#9fe8ff;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.repair-complete-next b{color:#eaf9ff;font-size:14px;line-height:1.35}.repair-complete-next .primary-action{justify-self:start;border-color:rgba(52,211,153,.38);background:linear-gradient(180deg,rgba(52,211,153,.24),rgba(14,165,233,.16));color:#eafff7}
.repair-complete-actions{position:relative;z-index:1;display:grid;gap:9px;margin-top:0}.repair-complete-secondary{display:flex;flex-wrap:wrap;gap:8px}.repair-complete-link{justify-self:start;padding:0;border:0;background:transparent;color:#9fe8ff;box-shadow:none;text-decoration:underline;text-underline-offset:3px}.repair-complete-link:hover{background:transparent;color:#dff7ff;transform:none}
@keyframes repair-complete-glow{0%{box-shadow:0 0 0 rgba(20,184,166,0),0 12px 32px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.09);transform:translateY(4px)}55%{box-shadow:0 0 48px rgba(52,211,153,.26),0 18px 44px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.09)}100%{box-shadow:0 0 38px rgba(20,184,166,.18),0 18px 44px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.09);transform:none}}
@keyframes repair-check-pop{0%{transform:scale(.72);opacity:.35}70%{transform:scale(1.08);opacity:1}100%{transform:scale(1);opacity:1}}
@keyframes repair-complete-sheen{0%{transform:translateX(-80%)}100%{transform:translateX(80%)}}
@keyframes line-complete-pulse{0%{opacity:0;transform:translateY(4px) scale(.98)}18%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.trainer-move-flash{animation:none;opacity:.75}}
@media(prefers-reduced-motion:reduce){.line-complete-reward,.repair-complete-card{animation:none}}
@media(max-width:560px){.repair-complete-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.repair-complete-card{padding:14px}}
@media(max-width:1050px){.opening-trainer-grid{grid-template-columns:1fr}.trainer-builder-layout,.color-detail-layout{grid-template-columns:minmax(0,1fr);gap:18px}.trainer-board-card{grid-row:auto}.trainer-stats{grid-template-columns:repeat(2,1fr)}.color-detail-actions{min-width:0}.color-detail-board-wrap{max-width:100%}}
@media(max-width:560px){.trainer-grid,.trainer-stats,.repertoire-summary-strip,.rep-dashboard-grid{grid-template-columns:1fr}.repertoire-home-card{padding:16px}.repertoire-home-head b{font-size:21px}.rep-dashboard-card{min-height:0}.trainer-head{display:grid}.color-rep-row{grid-template-columns:minmax(0,1fr) auto}.color-rep-actions{gap:6px}.color-rep-row .small-action{padding:7px 9px;font-size:12px}.learning-overview-head,.recommended-lines button{grid-template-columns:1fr}.practice-action-card{grid-template-columns:30px minmax(0,1fr);align-items:start}.practice-action-card small{grid-column:2;justify-self:start}.learning-overview-head{display:grid}.detail-line>summary{grid-template-columns:1fr}.detail-line-actions{justify-content:space-between}.srs-badge,.status-badge{justify-self:start}.detail-line-full div{justify-content:flex-start}}
@media(max-width:720px){body.opening-trainer-active header{display:none}.opening-trainer-view{padding:8px}.opening-trainer-grid{gap:8px}.trainer-board-card{gap:8px;padding:10px}.trainer-head{display:none}.trainer-builder-layout{gap:8px}.trainer-left-column{gap:5px}.trainer-board-toolbar button{padding:6px 10px;font-size:12px}.trainer-board-wrap{width:min(62vw,240px);max-width:240px;justify-self:center}.trainer-board-wrap #trainerBoard{max-width:240px}.trainer-board-wrap .board-b72b1{width:100%!important;height:auto!important}.trainer-board-wrap img{max-width:100%}#trainerFeedback,#trainerLine{min-height:0;font-size:12px;line-height:1.15}#trainerLine:empty{display:none}.line-builder-panel{min-height:0;padding:8px;gap:5px}.line-builder-head{gap:3px}.line-builder-panel h3{font-size:14px}.line-builder-head span{font-size:10px;text-align:left}.candidate-moves{gap:4px}.candidate-head,.candidate-moves button{grid-template-columns:minmax(0,1fr) 58px 62px;gap:5px}.candidate-moves.own-turn .candidate-head,.candidate-moves.own-turn button[data-uci]{grid-template-columns:minmax(0,1fr) 42px 46px 54px}.candidate-moves.opponent-turn .candidate-head,.candidate-moves.opponent-turn button[data-uci]{grid-template-columns:minmax(0,1fr) 42px 54px 56px}.candidate-moves button{padding:5px 6px}.candidate-main b{font-size:13px}.candidate-moves span,.candidate-moves small{font-size:9.5px}.candidate-moves strong,.candidate-moves i,.candidate-moves em{font-size:10px}.line-builder-actions{padding-top:5px;gap:6px}.line-builder-actions button{padding:8px 9px;font-size:12px}.rep-lines{display:none}}

.rep-item.active{border-color:rgba(10,132,255,.35);background:rgba(10,132,255,.08);border-radius:16px;padding:10px}
.rep-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.library-actions{margin-bottom:12px}
.rep-lines{margin-top:14px;display:grid;gap:8px;color:var(--muted)}
.rep-lines h3{margin:6px 0 2px;color:var(--text);font-size:15px}
.rep-line{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid var(--line)}
.rep-line:first-of-type{border-top:0}
.rep-line span{font-size:13px}

.line-builder-panel{min-height:520px;padding:12px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.052),rgba(255,255,255,.026));display:flex;flex-direction:column;gap:9px}
.line-builder-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.line-builder-panel h3{margin:0;font-size:16px}
.line-builder-head span{color:var(--muted);font-size:12px;text-align:right}
.trainer-board-card.learn-mode .trainer-board-toolbar,.trainer-board-card.learn-mode .rep-lines{display:none!important}
.trainer-board-card.learn-mode .trainer-builder-layout{grid-template-columns:minmax(360px,520px) minmax(320px,1fr)}
.trainer-board-card.learn-mode .candidate-moves{display:block}
.practice-card{display:grid;gap:14px;padding:14px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.04)}
.practice-moment{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 11px;border:1px solid rgba(125,211,252,.18);border-radius:14px;background:linear-gradient(135deg,rgba(125,211,252,.11),rgba(255,255,255,.035));box-shadow:0 14px 34px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.07);animation:practice-moment-pop .42s cubic-bezier(.2,1.25,.45,1) both}
.practice-moment span{display:grid;place-items:center;width:30px;height:30px;border-radius:999px;background:rgba(125,211,252,.16);color:#bff4ff;font-weight:950}.practice-moment b{display:block;color:#f7fbff;font-size:14px}.practice-moment small{display:block;color:#b9c8d8;font-size:11px;margin-top:1px}.practice-moment em{font-style:normal;color:#8ff0c1;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}
.practice-moment.correct{border-color:rgba(52,211,153,.30);background:linear-gradient(135deg,rgba(52,211,153,.16),rgba(14,165,233,.08));box-shadow:0 0 28px rgba(52,211,153,.14),0 14px 34px rgba(0,0,0,.16)}
.practice-moment.correct span{background:rgba(52,211,153,.18);color:#bbf7d0}.practice-moment.miss{border-color:rgba(251,191,36,.25);background:linear-gradient(135deg,rgba(251,191,36,.12),rgba(255,255,255,.035))}
@keyframes practice-moment-pop{0%{opacity:0;transform:translateY(4px) scale(.985)}100%{opacity:1;transform:none}}
#trainerBoard [class*="square-"]{touch-action:manipulation}
@keyframes trainer-tap-pop{0%{transform:scale(.985)}55%{transform:scale(1.015)}100%{transform:none}}
@keyframes trainer-destination-pop{0%{transform:scale(.98)}60%{transform:scale(1.02)}100%{transform:none}}
.practice-progress{position:relative}.practice-progress span{position:absolute;right:0;top:-18px;color:var(--muted);font-size:11px}
.practice-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.practice-stat-grid div{padding:10px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(0,0,0,.16)}
.practice-stat-grid b{display:block;font-size:22px}.practice-stat-grid span,.practice-current span,.practice-answer span,.practice-idea span{color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.practice-task-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.practice-task-head i{display:inline-flex;align-items:center;min-height:26px;padding:5px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.10);font-style:normal;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.04em;color:#dbeafe;background:rgba(255,255,255,.055)}
.practice-task-head span{min-width:0;color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.practice-task-head .new{color:#bfdbfe;background:rgba(59,130,246,.13);border-color:rgba(96,165,250,.30)}
.practice-task-head .review{color:#fde68a;background:rgba(245,158,11,.12);border-color:rgba(251,191,36,.28)}
.practice-task-head .hard{color:#fecaca;background:rgba(239,68,68,.12);border-color:rgba(248,113,113,.30)}
.practice-task-head .learning{color:#ddd6fe;background:rgba(139,92,246,.11);border-color:rgba(167,139,250,.24)}
.practice-task-head .mastered{color:#bbf7d0;background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.30)}
.practice-current{display:grid;gap:3px}.practice-current b{font-size:18px}.practice-current small{color:var(--muted);font-size:12px}
.practice-card p{font-size:13px;line-height:1.45}.practice-answer,.practice-idea{padding:11px;border:1px solid rgba(125,211,252,.20);border-radius:13px;background:rgba(14,116,144,.10)}
.practice-answer b{display:block;margin-top:3px;font-size:18px;color:#bfdbfe}.practice-answer small{display:block;margin-top:3px;color:var(--muted);font-size:11px;font-weight:750}.practice-answer.hidden-answer{border-color:rgba(255,255,255,.08);background:rgba(255,255,255,.035)}.practice-answer.hidden-answer b{color:var(--text)}
.practice-idea p{margin-top:4px;color:#dbeafe}
.practice-actions{display:flex;flex-wrap:wrap;gap:8px}.practice-actions button{padding:9px 11px;border-radius:10px;font-size:12px;box-shadow:none}
.practice-card.compact{gap:10px;padding:12px;border-radius:15px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.026))}
.practice-control-strip{display:grid;gap:9px}.practice-progress.compact{height:6px;margin:2px 0 0}.practice-progress.compact span{top:-15px;font-size:10px}.practice-main-prompt{display:grid;gap:2px;text-align:center;padding:2px 4px}.practice-main-prompt span{color:var(--muted);font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}.practice-main-prompt b{font-size:20px;line-height:1.15}.practice-main-prompt small{color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.practice-control-strip .practice-task-head{justify-content:center}.practice-control-strip .practice-task-head i{min-height:26px;padding:5px 10px}.practice-mini-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(108px,1fr));gap:8px;align-items:stretch}.practice-mini-actions button,.practice-mini-actions summary{width:100%;min-width:0;min-height:40px;display:flex;align-items:center;justify-content:center;text-align:center;padding:9px 10px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.055);color:var(--text);font-size:12px;font-weight:850;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:none;cursor:pointer}.practice-details{position:relative;display:block;width:100%;min-width:0}.practice-details summary{list-style:none}.practice-details summary::-webkit-details-marker{display:none}.practice-details[open] summary{border-color:rgba(125,211,252,.30);background:rgba(125,211,252,.10)}.practice-details>div{position:absolute;right:0;bottom:calc(100% + 7px);z-index:20;display:grid;gap:7px;min-width:210px;padding:10px;border:1px solid var(--line);border-radius:13px;background:rgba(13,16,23,.98);box-shadow:0 18px 48px rgba(0,0,0,.38)}.practice-details small{color:var(--muted);font-size:11px;line-height:1.25}.practice-details button{width:100%;min-height:34px}.practice-idea.compact{padding:9px 10px;border-radius:12px}.practice-idea.compact p{margin:3px 0 0;font-size:12px;line-height:1.35}
.trainer-board-wrap .arrow-line.guided{stroke:#38bdf8!important;stroke-width:6!important;opacity:.86!important;filter:drop-shadow(0 0 8px rgba(56,189,248,.38))!important}
.candidate-moves{display:grid;grid-template-columns:1fr;gap:5px;overflow-x:auto}
.candidate-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}
.candidate-toolbar details{position:relative}.candidate-toolbar summary,.candidate-toolbar select{min-height:32px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.06);color:var(--text);padding:6px 9px;font-size:12px;font-weight:750}.candidate-toolbar details>div{position:absolute;z-index:20;top:36px;left:0;display:grid;gap:6px;min-width:170px;padding:9px;border:1px solid var(--line);border-radius:12px;background:rgba(13,16,23,.96);box-shadow:0 18px 48px rgba(0,0,0,.34)}.candidate-toolbar label{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:12px;white-space:nowrap}
.candidate-head,.candidate-moves button,.candidate-moves.own-turn .candidate-head,.candidate-moves.own-turn button[data-uci],.candidate-moves.opponent-turn .candidate-head,.candidate-moves.opponent-turn button[data-uci]{display:grid;grid-template-columns:var(--candidate-cols,minmax(0,1fr) 58px 62px 74px 76px);align-items:center;gap:8px}
.candidate-head{color:var(--muted);font-size:10px;font-weight:750;text-transform:uppercase;letter-spacing:.02em;padding:0 8px}
.candidate-moves button{justify-items:stretch;text-align:left;padding:6px 8px;border-radius:9px;box-shadow:none}
.candidate-moves button{animation:candidate-row-in .18s ease-out both;animation-delay:var(--candidate-delay,0ms)}
.candidate-moves .practice-mini-actions button,.candidate-moves .practice-mini-actions summary{display:flex;grid-template-columns:none;align-items:center;justify-content:center;text-align:center;width:100%;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:9px 10px}
.candidate-moves em.pending,.candidate-moves strong.pending{color:#93a4b8}
.candidate-moves button.eval-updated strong{animation:candidate-eval-refined .75s ease-out both}
.candidate-main{display:grid;gap:1px;min-width:0}
.candidate-main b{font-size:14px;line-height:1.05}
.candidate-moves span{color:var(--muted);font-size:10.5px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.candidate-moves small{color:rgba(226,232,240,.68);font-size:10.5px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.candidate-moves strong,.candidate-moves i,.candidate-moves em{font-style:normal;font-size:12px;color:var(--text);justify-self:start}
.candidate-moves i{color:var(--muted)}
.candidate-moves i.covered{color:#34d399}.candidate-moves i.missing{color:#fbbf24}
.candidate-more{border-style:dashed;color:var(--muted);grid-template-columns:1fr!important}
.candidate-loading{padding:10px 8px;color:var(--muted);font-size:12px;border:1px dashed var(--line);border-radius:9px}
.candidate-loading.premium{position:relative;display:flex;align-items:center;gap:7px;overflow:hidden;min-height:42px;border-style:solid;background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.025));box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.candidate-loading.premium span{position:relative;z-index:1;color:rgba(226,232,240,.82);font-weight:750}
.candidate-loading.premium i{position:relative;z-index:1;width:5px;height:5px;border-radius:50%;background:#8ec5ff;opacity:.45;animation:candidate-dot 1.05s ease-in-out infinite}
.candidate-loading.premium i:nth-of-type(2){animation-delay:.15s}.candidate-loading.premium i:nth-of-type(3){animation-delay:.3s}
.candidate-loading-sweep{position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(142,197,255,.16),transparent);transform:translateX(-100%);animation:candidate-sweep 1.35s ease-in-out infinite}
.candidate-empty{padding:10px 8px;color:var(--muted);font-size:12px;border:1px dashed var(--line);border-radius:9px}
.line-builder-actions{margin-top:auto;padding-top:10px;border-top:1px solid var(--line)}
@keyframes candidate-row-in{0%{opacity:0;transform:translateY(3px)}100%{opacity:1;transform:translateY(0)}}
@keyframes candidate-eval-refined{0%{background:rgba(125,211,252,.22);box-shadow:0 0 0 0 rgba(125,211,252,.18)}100%{background:transparent;box-shadow:0 0 0 8px rgba(125,211,252,0)}}
@keyframes candidate-dot{0%,100%{transform:translateY(0);opacity:.35}50%{transform:translateY(-2px);opacity:.95}}
@keyframes candidate-sweep{0%{transform:translateX(-100%)}60%,100%{transform:translateX(100%)}}
@media(prefers-reduced-motion:reduce){.candidate-moves button,.candidate-loading.premium i,.candidate-loading-sweep{animation:none}}

.opening-import.collapsed .upload-body{display:none}
.upload-toggle{width:100%;justify-content:space-between}
.upload-toggle:after{content:"Upload details";color:var(--muted);font-size:12px}
.opening-import:not(.collapsed) .upload-toggle{margin-bottom:12px}
.trainer-board-card{order:1}
.opening-dashboard{order:2}
.opening-import{order:3}
.trainer-stats{order:4}
.candidate-moves em{color:#8ec5ff;font-style:normal;font-size:11px}
.legal-dot{background:rgba(255,255,255,.82);box-shadow:0 0 0 2px rgba(8,13,20,.38),0 0 14px rgba(255,255,255,.32)}
.legal-dot.capture{border-color:rgba(255,255,255,.86);background:rgba(255,255,255,.08)}
@media(max-width:720px){body.opening-trainer-active .trainer-board-card .rep-lines{display:none!important}}

@media(max-width:768px){
  body.opening-trainer-active .nav{display:none!important}
  body.opening-trainer-active .app{margin-left:0!important;min-height:100vh}
  body.opening-trainer-active header{display:none!important}
  body.opening-trainer-active{overflow-x:hidden}
  .opening-trainer-view{width:100%;padding:10px 10px 18px;max-width:none}
  .opening-trainer-grid{display:flex;flex-direction:column;gap:10px}
  .opening-trainer-view .card{border-radius:18px;box-shadow:0 14px 38px rgba(0,0,0,.30)}
  .opening-dashboard,.opening-flow-card,.color-detail-card,.trainer-board-card{width:100%;max-width:none;justify-self:stretch}
  .repertoire-home-card{padding:14px}
  .repertoire-home-head{grid-template-columns:1fr;gap:10px;align-items:start}
  .repertoire-home-head>div{display:grid;gap:6px}
  .repertoire-home-head span{display:block;font-size:10px;line-height:1;letter-spacing:.14em}
  .repertoire-home-head b{display:block;font-size:20px;line-height:1.16;max-width:320px}
  .rep-home-back{justify-self:start;margin-bottom:2px;padding:8px 11px;font-size:12px}
  .repertoire-summary-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .repertoire-summary-strip div{padding:9px 10px;border-radius:13px}.repertoire-summary-strip b{font-size:15px}.repertoire-summary-strip span{font-size:10px}
  .rep-dashboard-grid{grid-template-columns:1fr;gap:10px}
  .rep-dashboard-card{min-height:0;padding:14px;border-radius:17px;gap:8px}.rep-dashboard-card>b{font-size:18px}.rep-card-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.rep-card-stats span{padding:7px 6px;font-size:10px}.rep-card-stats strong{font-size:13px}
  .flow-head{gap:10px}.flow-head h2{font-size:19px}.flow-head p{font-size:12px}.flow-head button{min-height:38px;padding:8px 11px;border-radius:12px}
  .detail-action-list{gap:8px}.detail-action-list button{min-height:44px;padding:12px 13px;border-radius:13px}
  .learning-overview{padding:10px;border-radius:13px}.learning-overview-head{display:grid;grid-template-columns:1fr auto;align-items:start}.learning-overview-head h3{font-size:14px}.learning-overview-head p{font-size:11px;line-height:1.25}.learning-overview-head>b{font-size:17px}
  .practice-action-card{grid-template-columns:28px minmax(0,1fr) auto;padding:10px;border-radius:13px;gap:8px}.practice-action-card i{width:28px;height:28px;border-radius:10px}.practice-action-card b{font-size:12px}.practice-action-card em{font-size:10px}.practice-action-card small{font-size:10px;padding:4px 7px}
  .line-group>summary{padding:10px}.line-group>summary b{font-size:13px}.line-group>summary span{font-size:11px}.detail-line>summary{grid-template-columns:minmax(0,1fr) auto;padding:8px 0}.detail-line>summary b{font-size:12px}.detail-line>summary span,.detail-line>summary small{font-size:11px}.status-badge,.srs-badge{min-height:22px;padding:3px 6px;font-size:9px}.status-badge b{font-size:9px}
  .trainer-board-card{padding:10px;gap:10px}
  .trainer-head{display:none!important}
  .trainer-builder-layout,.trainer-board-card.learn-mode .trainer-builder-layout{display:flex;flex-direction:column;gap:10px}
  .trainer-left-column{order:1;gap:7px;width:100%}
  .trainer-board-card.learn-mode .trainer-left-column{order:1}
  .trainer-board-card.learn-mode .line-builder-panel{order:2}
  .line-builder-panel{order:2;width:100%;min-height:0;padding:10px;border-radius:15px;gap:8px}
  .trainer-board-toolbar{display:flex;order:4;justify-content:center;gap:7px;width:100%;padding:2px 0 calc(2px + env(safe-area-inset-bottom,0px))}
  .trainer-board-toolbar button{min-height:36px;padding:7px 10px;border-radius:999px;font-size:12px;box-shadow:none}
  .trainer-board-toolbar .mobile-builder-action{display:inline-flex}
  .trainer-board-toolbar .mobile-builder-action.primary{border-color:rgba(52,211,153,.30);background:rgba(52,211,153,.12);color:#dffaf0}
  .discovery-replies-control{order:1}
  .trainer-board-wrap{width:min(100%,calc(100vw - 20px));max-width:430px;margin:0 auto;justify-self:center}
  .trainer-board-wrap #trainerBoard,#trainerBoard{width:100%!important;max-width:430px!important;border-radius:16px}
  .trainer-board-wrap .board-b72b1{width:100%!important;height:auto!important}
  #trainerFeedback,#trainerLine{font-size:12px;line-height:1.25;text-align:center;min-height:0}
  #trainerLine:empty,#trainerFeedback:empty{display:none}
  .line-builder-head{display:grid;gap:2px;padding-bottom:7px}.line-builder-panel h3{font-size:15px;line-height:1.15}.line-builder-head span{font-size:10.5px;text-align:left}
  .practice-card{gap:10px;padding:11px;border-radius:14px}
  .practice-progress{height:6px}.practice-progress span{top:-16px;font-size:10px}
  .practice-stat-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.practice-stat-grid div{padding:8px 7px;border-radius:10px}.practice-stat-grid b{font-size:17px}.practice-stat-grid span,.practice-current span,.practice-answer span,.practice-idea span{font-size:9.5px}
  .practice-current b{font-size:15px;line-height:1.18}.practice-current small{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .practice-card p{font-size:12px;line-height:1.35}.practice-answer,.practice-idea{padding:9px;border-radius:11px}.practice-answer b{font-size:16px}
  body.learning-choice .blunder-choice-box.compact{padding:11px;border-radius:15px}
  body.learning-choice .blunder-choice-grid.two-option{grid-template-columns:1fr;gap:7px!important}
  body.learning-choice .blunder-choice-grid.two-option .blunder-choice-card{min-height:76px;padding:10px!important;border-radius:14px!important}
  body.learning-choice .blunder-choice-grid.two-option .blunder-choice-card b{font-size:16px;line-height:1.1}
  body.learning-choice .blunder-choice-grid.two-option .blunder-choice-card span{font-size:10px}
  .practice-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;padding-top:2px}.practice-actions button{min-height:40px;padding:8px 9px;border-radius:11px;font-size:11px}
  .practice-control-strip{gap:8px;padding:10px;border-radius:14px}
  .practice-main-prompt{padding:0}.practice-main-prompt span{font-size:10px}.practice-main-prompt b{font-size:18px}.practice-main-prompt small{font-size:10.5px}
  .practice-control-strip .practice-task-head{justify-content:center}.practice-control-strip .practice-task-head i{min-height:24px;padding:4px 9px;font-size:10px}
  .practice-mini-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.practice-mini-actions button,.practice-mini-actions summary{width:100%;min-height:40px;padding:8px 9px;border-radius:11px;font-size:11px;text-align:center;overflow:hidden;text-overflow:ellipsis}
  .practice-details>div{right:auto;left:50%;transform:translateX(-50%);bottom:calc(100% + 6px);min-width:min(250px,calc(100vw - 44px))}
  .candidate-moves{gap:5px}
  .candidate-toolbar{position:relative}.candidate-toolbar summary,.candidate-toolbar select{min-height:34px;font-size:11px}.candidate-toolbar details>div{left:auto;right:0}
  .candidate-head,.candidate-moves.own-turn .candidate-head,.candidate-moves.opponent-turn .candidate-head{display:grid!important;grid-template-columns:var(--candidate-cols,minmax(0,1fr) 42px 46px 58px);gap:6px;padding:0 9px 2px;color:rgba(148,163,184,.82);font-size:8.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
  .candidate-moves button,.candidate-moves.own-turn button[data-uci],.candidate-moves.opponent-turn button[data-uci]{grid-template-columns:var(--candidate-cols,minmax(0,1fr) 42px 46px 58px);gap:6px;min-height:42px;padding:8px 9px;border-radius:11px}
  .candidate-moves .practice-mini-actions button,.candidate-moves .practice-mini-actions summary{display:flex;grid-template-columns:none;align-items:center;justify-content:center;text-align:center;width:100%;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:8px 9px}
  .candidate-main b{font-size:13px}.candidate-moves span,.candidate-moves small{font-size:10.5px}.candidate-moves strong,.candidate-moves i,.candidate-moves em{font-size:11px}
  .line-builder-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.line-builder-actions button{min-height:40px;padding:8px 9px;border-radius:11px;font-size:11px}
  .opening-import,.trainer-stats{display:none}
}

@media(max-width:390px){
  .rep-card-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .practice-actions,.line-builder-actions{grid-template-columns:1fr}
  .trainer-board-wrap{max-width:calc(100vw - 20px)}
}
@media(max-width:560px){
  .color-rep-list{padding:9px;border-radius:16px}
  .color-rep-row{grid-template-columns:1fr}
  .color-rep-actions{justify-content:stretch}
  .color-rep-actions .small-action{width:100%;min-height:38px}
  .color-rep-edit div{display:grid;grid-template-columns:1fr 1fr;gap:7px}
  .color-rep-edit .danger{grid-column:1/-1;margin-left:0}
}

.auth-card{display:grid;gap:10px;max-width:620px;margin:14px auto 12px;padding:15px;border:1px solid rgba(255,255,255,.10);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.03));box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 14px 42px rgba(0,0,0,.16);text-align:left}
.auth-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.auth-head div:first-child{display:grid;gap:3px}
.auth-head span,.landing-divider span{color:#8ec5ff;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.auth-head b{font-size:16px;color:var(--text)}
.auth-card p{margin:0;color:#9aa6b5;font-size:13px;line-height:1.35}
.auth-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.auth-card input{width:100%;min-width:0;height:46px;border:1px solid rgba(255,255,255,.11);border-radius:16px;background:rgba(7,10,15,.58);padding:0 13px;color:var(--text);box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.auth-card input:focus{outline:none;border-color:rgba(10,132,255,.55);box-shadow:0 0 0 3px rgba(10,132,255,.16),inset 0 1px 0 rgba(255,255,255,.06)}
.auth-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.auth-actions button{height:44px;min-width:0;border-radius:16px;box-shadow:none}
.auth-benefits{display:none;flex-wrap:wrap;gap:7px}
.auth-benefits span{min-height:26px;padding:5px 9px;background:rgba(52,211,153,.075);border-color:rgba(52,211,153,.15);color:#dffaf0;font-size:11px}
.auth-card.logged-in-welcome{gap:8px;margin:14px auto 10px;padding:10px 12px;text-align:center;background:linear-gradient(180deg,rgba(10,132,255,.07),rgba(255,255,255,.03));border-color:rgba(125,211,252,.13);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 34px rgba(0,0,0,.14)}
.landing-card.logged-in-entry .auth-card.logged-in-welcome{max-width:360px;margin:0 auto 8px;padding:9px 10px;border-radius:18px}
.auth-card.logged-in-welcome .auth-head{display:none}
.auth-card.logged-in-welcome .auth-status{display:none}
.auth-card.logged-in-welcome .auth-head div:first-child{gap:2px}
.auth-card.logged-in-welcome .auth-head b{font-size:18px}
.auth-card.logged-in-welcome p{display:none;max-width:none;margin:0;color:#c7d2df;text-align:left}
.auth-card.logged-in-welcome .auth-actions{display:flex;justify-content:center;gap:8px}
.auth-card.logged-in-welcome .auth-actions button{width:auto;min-width:96px;height:38px;padding:0 14px;border-radius:999px;font-size:13px}
.auth-card.logged-in-welcome .manage-profile-btn{background:rgba(125,211,252,.10);border-color:rgba(125,211,252,.18);color:#dff7ff}
.linked-chess-profile{padding:12px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:rgba(8,12,18,.42);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.linked-chess-profile label{display:grid;gap:8px;margin:0}
.linked-chess-profile span{color:#dce7f5;font-size:12px;font-weight:800;letter-spacing:.03em}
.linked-chess-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center}
.linked-chess-row button{height:46px;border-radius:16px;padding:0 18px;background:linear-gradient(135deg,#0a84ff,#34c759);color:white;border:0;font-weight:800;box-shadow:0 12px 30px rgba(10,132,255,.2)}
.auth-primary{background:linear-gradient(135deg,#0a84ff,#0066d6);border-color:rgba(255,255,255,.14)}
.auth-secondary{background:rgba(255,255,255,.065);border-color:rgba(255,255,255,.12);color:#d8e2ef}
.auth-status{display:inline-flex;align-items:center;justify-content:center;max-width:230px;padding:7px 10px;border:1px solid rgba(255,255,255,.10);border-radius:999px;background:rgba(0,0,0,.22);color:#9aa6b5;font-size:11px;font-weight:750;line-height:1.1;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.auth-status:empty{display:none}
.auth-status[data-state="logged-in"]{color:#dffaf0;border-color:rgba(52,211,153,.25);background:rgba(52,211,153,.10)}
.auth-status[data-state="local"]{color:#c8d0dc}
.landing-divider{display:flex;align-items:center;gap:12px;max-width:620px;margin:2px auto 12px}
.landing-divider:before,.landing-divider:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent)}
.nav{background:linear-gradient(180deg,rgba(8,10,15,.94),rgba(5,6,9,.91));border-right-color:rgba(255,255,255,.075);box-shadow:inset -1px 0 0 rgba(255,255,255,.025)}
.nav nav{gap:3px;padding:3px 0}
.nav nav button{position:relative;min-height:38px;padding:9px 10px 9px 36px;border-radius:12px;background:transparent;border-color:transparent;box-shadow:none;color:#a7b2c2;font-size:12.5px;font-weight:680;letter-spacing:-.005em;transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease}
.nav nav button:hover{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.045);color:#dde8f6;transform:none;box-shadow:none}
.nav nav button:before{content:"";position:absolute;left:12px;top:50%;width:16px;height:16px;transform:translateY(-50%);opacity:.72;background:currentColor;filter:none;-webkit-mask:center/contain no-repeat;mask:center/contain no-repeat}
.nav nav button[data-view="past"]:before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 10.5 12 4l7.5 6.5'/%3E%3Cpath d='M6.5 9.5V20h11V9.5'/%3E%3Cpath d='M9.5 20v-5.2h5V20'/%3E%3Cpath d='M9 11.5h6'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 10.5 12 4l7.5 6.5'/%3E%3Cpath d='M6.5 9.5V20h11V9.5'/%3E%3Cpath d='M9.5 20v-5.2h5V20'/%3E%3Cpath d='M9 11.5h6'/%3E%3C/svg%3E")}
.nav nav button[data-view="discovery"]:before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='m14.6 9.4-2 5-5 2 2-5 5-2Z'/%3E%3Cpath d='M12 2.5v2M12 19.5v2M2.5 12h2M19.5 12h2'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='m14.6 9.4-2 5-5 2 2-5 5-2Z'/%3E%3Cpath d='M12 2.5v2M12 19.5v2M2.5 12h2M19.5 12h2'/%3E%3C/svg%3E")}
.nav nav button[data-view="learning"]:before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 3.5v3M12 17.5v3M3.5 12h3M17.5 12h3'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 3.5v3M12 17.5v3M3.5 12h3M17.5 12h3'/%3E%3C/svg%3E")}
.nav nav button[data-view="analysis"]:before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 19.5V5'/%3E%3Cpath d='M4.5 19.5h15'/%3E%3Cpath d='m8 15 3-4 3 2.5 4-6'/%3E%3Cpath d='M17.5 7.5h-4'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 19.5V5'/%3E%3Cpath d='M4.5 19.5h15'/%3E%3Cpath d='m8 15 3-4 3 2.5 4-6'/%3E%3Cpath d='M17.5 7.5h-4'/%3E%3C/svg%3E")}
.nav nav button[data-view="opening-trainer"]:before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 4.5h7a3 3 0 0 1 3 3v12a3 3 0 0 0-3-3h-7Z'/%3E%3Cpath d='M15.5 7.5h3a1 1 0 0 1 1 1v11a3 3 0 0 0-3-3h-1'/%3E%3Cpath d='M8.5 8.5h5M8.5 12h4'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 4.5h7a3 3 0 0 1 3 3v12a3 3 0 0 0-3-3h-7Z'/%3E%3Cpath d='M15.5 7.5h3a1 1 0 0 1 1 1v11a3 3 0 0 0-3-3h-1'/%3E%3Cpath d='M8.5 8.5h5M8.5 12h4'/%3E%3C/svg%3E")}
.nav nav button.active{background:linear-gradient(90deg,rgba(10,132,255,.16),rgba(125,211,252,.045) 72%,transparent);border-color:rgba(125,211,252,.13);box-shadow:inset 0 1px 0 rgba(255,255,255,.035);color:#f7fbff}
.nav nav button.active:before{opacity:1;color:#7cc7ff}
.nav nav button.active:after{content:"";position:absolute;left:0;top:9px;bottom:9px;width:2px;border-radius:999px;background:#0a84ff;box-shadow:0 0 10px rgba(10,132,255,.42)}
.nav nav button.guest-locked:after{content:"";position:absolute;right:11px;top:50%;left:auto;bottom:auto;width:6px;height:6px;border-radius:999px;background:rgba(251,191,36,.70);box-shadow:0 0 9px rgba(251,191,36,.15);transform:translateY(-50%)}
.nav nav button.guest-locked.active:after{right:11px;left:auto;top:50%;bottom:auto;width:6px;height:6px;background:rgba(251,191,36,.82)}
.nav-auth-state{margin-top:auto;color:var(--muted);line-height:1.35;display:grid;gap:9px}
.nav-daily-status{display:grid;gap:7px;padding:10px;border:1px solid rgba(125,211,252,.095);border-radius:14px;background:rgba(255,255,255,.026);box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.nav-daily-status small{color:#8fa2b7;font-size:10px;font-weight:780;text-transform:uppercase;letter-spacing:.085em}
.nav-daily-row{position:relative;display:grid;grid-template-columns:1fr auto;gap:4px 8px;align-items:center;overflow:hidden}
.nav-daily-status span{font-size:11px;color:#b7c3d2;font-weight:650}
.nav-daily-status b{font-size:11px;color:#eaf4ff;font-weight:760}
.nav-daily-status i{grid-column:1/3;height:2px;border-radius:999px;background:linear-gradient(90deg,#0a84ff,#7dd3fc);box-shadow:none}
.nav-daily-actions{display:grid;grid-template-columns:1fr;gap:6px}.nav-daily-actions button{min-height:32px;padding:5px 9px;border-radius:11px;background:linear-gradient(180deg,rgba(10,132,255,.20),rgba(125,211,252,.08));border-color:rgba(125,211,252,.20);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);color:#eaf6ff;font-size:11px;font-weight:820;letter-spacing:.01em}
.account-card{display:flex;align-items:center;justify-content:center;min-height:0;padding:7px 0 17px;border:0;border-radius:0;background:none!important;box-shadow:none!important;min-width:0;pointer-events:none}
.account-card img{display:block;width:76px;height:auto;object-fit:contain;flex:0 0 auto;clip-path:inset(0 0 13% 0);opacity:.9;filter:drop-shadow(0 10px 18px rgba(0,0,0,.34)) drop-shadow(0 0 8px rgba(10,132,255,.10))}
.mobile-app-nav,.mobile-more-sheet,.mobile-more-scrim{display:none}
@media(max-width:1050px){
  body:not(.landing-active){padding-bottom:env(safe-area-inset-bottom,0px)}
  body:not(.landing-active) .app{padding-bottom:0}
  .nav{position:sticky;top:0;z-index:48;width:100%;max-width:100vw;min-width:0;padding:4px 10px 4px;gap:3px;border-right:0;border-bottom:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg,rgba(9,11,16,.94),rgba(6,7,10,.88));box-shadow:0 12px 30px rgba(0,0,0,.18);overflow:visible;transition:padding .18s ease,transform .18s ease}
  body.analysis-active .nav,body.games-active .nav,body.learning-active .nav,body.discovery-active .nav,body.opening-trainer-active .nav{width:100%;padding:4px 10px 4px;gap:3px}
  .nav-auth-state{order:3;margin:0;display:block!important;color:var(--muted);line-height:1.2}
  .nav-auth-state .account-card{display:none!important}
  .nav-daily-status{display:grid;grid-template-columns:auto repeat(2,minmax(0,1fr));align-items:center;gap:6px 8px;padding:7px 8px;border-radius:16px;background:linear-gradient(180deg,rgba(10,132,255,.13),rgba(125,211,252,.055));border-color:rgba(125,211,252,.20);box-shadow:0 10px 24px rgba(10,132,255,.10),inset 0 1px 0 rgba(255,255,255,.08)}
  .nav-daily-status small{font-size:9px;line-height:1;letter-spacing:.09em;color:#a8c7e8;font-weight:900}
  .nav-daily-row{display:grid;grid-template-columns:1fr auto;gap:2px 5px;min-width:0}
  .nav-daily-status span,.nav-daily-status b{font-size:10px;line-height:1;white-space:nowrap}
  .nav-daily-status i{height:3px;box-shadow:0 0 10px rgba(10,132,255,.28)}
  .nav-daily-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:7px}
  .nav-daily-actions button{min-height:36px;padding:8px 8px;border-radius:12px;background:linear-gradient(180deg,rgba(10,132,255,.24),rgba(125,211,252,.10));border:1px solid rgba(125,211,252,.22);box-shadow:0 8px 20px rgba(10,132,255,.10),inset 0 1px 0 rgba(255,255,255,.10);font-size:11px;font-weight:850;color:#f2fbff}
  .brand-home{order:1;min-height:0;padding:0;justify-content:flex-start;text-align:left;background:transparent!important;transform:none!important;box-shadow:none!important;border:0}
  .brand-home>div{display:grid;grid-template-columns:30px auto;grid-template-rows:auto auto;align-items:center;justify-content:start;column-gap:8px;row-gap:1px;width:100%}
  .brand-home>div:before{content:"";grid-column:1;grid-row:1/3;width:26px;height:24px;background:url("assets/my-chesslab-knight-watermark.png") center/contain no-repeat;filter:drop-shadow(0 6px 12px rgba(0,0,0,.30)) drop-shadow(0 0 7px rgba(10,132,255,.12))}
  .brand .nav-wordmark{grid-column:2;grid-row:1;width:126px;margin:0}
  /* The tab bar right below already says "Main"; the subtitle only cost header height. */
  .brand-home small{display:none}
  .nav #homeBtn,.nav .navnote{display:none!important}
  .nav>nav:not(.mobile-app-nav){display:none!important}
  .nav>nav:not(.mobile-app-nav)::-webkit-scrollbar{display:none}
  .nav>nav:not(.mobile-app-nav) button{flex:0 0 max-content;min-width:max-content;min-height:36px;padding:5px 10px!important;display:flex;align-items:center;justify-content:center;border:0!important;border-radius:14px;background:rgba(255,255,255,.035)!important;box-shadow:none!important;color:rgba(255,255,255,.86)!important;font-size:11px!important;font-weight:820!important;line-height:1!important;transform:none;text-align:center;white-space:nowrap;overflow:visible}
  .nav>nav:not(.mobile-app-nav) button:before,.nav>nav:not(.mobile-app-nav) button:after{display:none!important}
  .nav>nav:not(.mobile-app-nav) button.active{background:linear-gradient(180deg,rgba(10,132,255,.30),rgba(125,211,252,.11))!important;color:#fff!important;box-shadow:0 0 0 1px rgba(125,211,252,.20),0 8px 20px rgba(10,132,255,.18),inset 0 1px 0 rgba(255,255,255,.10)!important}
  .mobile-app-nav{order:2;position:relative;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;width:100%;max-width:100%;min-width:0;margin-top:0;padding:4px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(14,17,24,.72);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 10px 26px rgba(0,0,0,.20);backdrop-filter:saturate(170%) blur(18px);transition:max-height .18s ease,opacity .18s ease,padding .18s ease,margin .18s ease,border-color .18s ease}
  .mobile-app-nav::-webkit-scrollbar{display:none}
  .mobile-app-nav button{min-width:0;min-height:36px;padding:5px 6px;display:flex;gap:4px;align-items:center;justify-content:center;border:0;border-radius:12px;background:rgba(255,255,255,.04);box-shadow:none;color:rgba(239,246,255,.88);font-size:12px;line-height:1;transform:none;white-space:nowrap;overflow:hidden}
  .mobile-app-nav button small{max-width:100%;overflow:hidden;text-overflow:ellipsis;color:inherit;font-size:10px;font-weight:800;letter-spacing:0;line-height:1.05}
  .mobile-app-nav button:not([data-mobile-more])>span[aria-hidden="true"]{display:none}
  .mobile-app-nav button:before,.mobile-app-nav button:after{display:none!important}
  .mobile-app-nav button.active{background:linear-gradient(180deg,rgba(10,132,255,.28),rgba(125,211,252,.10));color:rgba(255,255,255,.98);box-shadow:0 0 0 1px rgba(125,211,252,.18),0 8px 20px rgba(10,132,255,.18),inset 0 1px 0 rgba(255,255,255,.10)}
  .mobile-app-nav button[data-mobile-more]{position:absolute;right:0;top:-36px;width:42px;min-height:30px;padding:0;border:1px solid rgba(255,255,255,.10);border-radius:12px;background:rgba(255,255,255,.055);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
  .mobile-app-nav button[data-mobile-more] small{display:none}
  .mobile-app-nav button[data-mobile-more] span{font-size:12px;letter-spacing:-.08em}
  .mobile-app-nav button[data-mobile-more].active{border-color:rgba(125,211,252,.24)}
  body.mobile-nav-collapsed .mobile-app-nav,body.mobile-nav-collapsed .nav-auth-state{max-height:0;margin-top:-8px;padding-top:0;padding-bottom:0;opacity:0;overflow:hidden;border-color:transparent;pointer-events:none}
  .mobile-more-scrim{position:fixed;inset:0;z-index:80;display:block;background:rgba(0,0,0,.18)}
  .mobile-more-sheet{position:fixed;left:12px;right:12px;top:calc(74px + env(safe-area-inset-top,0px));z-index:91;display:grid;gap:8px;padding:10px;border:1px solid rgba(255,255,255,.12);border-radius:20px;background:rgba(13,15,21,.94);box-shadow:0 18px 44px rgba(0,0,0,.45);backdrop-filter:saturate(170%) blur(24px)}
  .mobile-more-sheet button{justify-content:flex-start;min-height:44px;border-radius:15px;background:rgba(255,255,255,.06);box-shadow:none;color:#edf5ff}
  .mobile-more-sheet[hidden],.mobile-more-scrim[hidden],body.landing-active .mobile-app-nav,body.landing-active .mobile-more-sheet,body.landing-active .mobile-more-scrim{display:none!important}
}
@media(max-width:640px){.auth-card{margin:16px 0 14px;padding:13px;border-radius:20px}.auth-head{display:grid}.auth-status{justify-self:start;max-width:100%}.auth-row,.auth-actions,.linked-chess-row{grid-template-columns:1fr}.auth-card input{height:44px}.auth-actions button,.linked-chess-row button{height:42px}.landing-divider{margin-top:0}.auth-card.logged-in-welcome{margin:8px 0 8px;padding:9px 10px}.auth-card.logged-in-welcome .auth-head{display:none}.auth-card.logged-in-welcome .auth-head b{font-size:16px}.auth-card.logged-in-welcome p{font-size:12px}.auth-card.logged-in-welcome .auth-actions{display:grid;grid-template-columns:1fr 1fr}.auth-card.logged-in-welcome .auth-actions button{width:100%;height:38px}.landing-card.logged-in-entry{padding:18px 14px 14px;text-align:center}.landing-card.logged-in-entry h1{font-size:30px;margin:0 auto 8px;text-align:center}.landing-card.logged-in-entry>p{margin:0 auto 12px;text-align:center}.landing-card.logged-in-entry .enter-lab-cta{height:52px;margin-bottom:9px}.landing-card.logged-in-entry .auth-card.logged-in-welcome{margin:0 auto 8px;padding:9px 10px}.analyze-other-toggle{width:100%;min-height:38px}}

@media(max-width:640px){
  .landing{position:relative;display:block;min-height:100vh;min-height:100dvh;overflow-x:hidden;overflow-y:auto;padding:14px 12px calc(80px + env(safe-area-inset-bottom,0px));-webkit-overflow-scrolling:touch}
  .landing-stage{min-height:auto;width:100%;gap:12px}
  .landing-brand{margin-bottom:6px}
  .landing-card{padding:18px 14px 16px;border-radius:22px;text-align:center}
  .landing h1{max-width:330px;font-size:30px;line-height:.98;letter-spacing:-.045em;margin:0 auto 8px;text-align:center}
  .landing p{max-width:330px;font-size:14px;line-height:1.35;margin:0 auto 12px;text-align:center}
  .landing-kicker{display:none;margin-bottom:10px}
  .landing-benefits{justify-content:center;gap:6px;margin:0 auto 8px}
  .landing-benefits span{min-height:26px;padding:5px 8px;font-size:10.5px}
  .landing-preview-grid{display:none;grid-template-columns:1fr;gap:7px;margin:0 0 10px}
  .landing-preview-grid div{padding:9px 10px;border-radius:15px}
  .landing-preview-grid b{font-size:13px}
  .landing-preview-grid span{font-size:11px}
  .auth-benefits{display:none;gap:6px}
  .auth-benefits span{font-size:10.5px}
  .auth-card{margin:10px 0 10px}
  .auth-head{gap:7px;text-align:center;justify-items:center;justify-content:center}
  .auth-head div:first-child{justify-items:center}
  .auth-status{justify-self:center;border-radius:12px;white-space:normal;text-align:center;justify-content:center}
  .auth-card p{text-align:center;margin-left:auto;margin-right:auto}
  .auth-actions{display:grid;gap:8px}
  .auth-actions button,.linked-chess-row button,.landing-search button{width:100%;min-height:44px}
  .auth-card input,.landing-search input{text-align:left}
  .linked-chess-profile label{gap:7px}
  .linked-chess-row{display:grid;gap:8px}
  .landing-divider{margin:8px auto 8px;justify-content:center}
  .landing-divider span{text-align:center}
  .landing-search{display:grid;gap:8px;margin-bottom:8px;padding:7px;border-radius:18px}
  .landing-search input{height:44px;font-size:16px;padding:0 10px}
  .landing small{display:block;font-size:11px;line-height:1.35}
}

body.discovery-active main{display:none}
.discovery-lab-view{padding:24px;max-width:1280px;margin:0 auto}
.discovery-lab-panel{display:grid;gap:16px}
.discovery-hero,.discovery-empty,.discovery-next,.discovery-summary,.discovery-card{border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.032));box-shadow:0 22px 62px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.07);border-radius:22px}
.discovery-hero{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start;padding:18px}
.discovery-hero button{box-shadow:none;border-radius:12px;padding:9px 12px}
.discovery-hero span{display:block;color:#7dd3fc;text-transform:uppercase;letter-spacing:.11em;font-size:11px;font-weight:900}
.discovery-hero b{display:block;margin-top:4px;color:#fff;font-size:28px;letter-spacing:-.04em;line-height:1.05}
.discovery-hero p,.discovery-empty p,.discovery-next p{margin-top:5px;font-size:13px;line-height:1.35;color:var(--muted)}
.discovery-player-search{display:grid;grid-template-columns:minmax(180px,320px) auto;gap:8px;margin-top:12px;max-width:470px}
.discovery-player-search input{height:38px;min-width:0;border:1px solid rgba(255,255,255,.11);border-radius:12px;background:rgba(7,10,15,.55);color:var(--text);padding:0 11px}
.discovery-player-search button{min-height:38px;padding:8px 12px;border-radius:12px;box-shadow:none}
.discovery-mode-badge,.discovery-temp-banner{display:inline-flex;align-items:center;gap:8px;margin-top:9px;padding:6px 9px;border:1px solid rgba(125,211,252,.16);border-radius:999px;background:rgba(125,211,252,.08);color:#dff7ff;font-size:11px;font-weight:850}
.discovery-temp-banner{border-color:rgba(251,191,36,.20);background:rgba(251,191,36,.08);color:#fde68a}
.discovery-temp-banner button{min-height:26px;padding:4px 8px;border-radius:999px;font-size:10px;box-shadow:none}
.discovery-search-error{color:#fecaca!important}
.discovery-source{display:grid;gap:6px;margin-top:10px;padding:10px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.035);max-width:560px}
.discovery-source b{font-size:12px;letter-spacing:0}.discovery-source small,.discovery-source span{color:var(--muted);font-size:11px;line-height:1.25}.discovery-source div{display:flex;gap:7px;flex-wrap:wrap}.discovery-source button{min-height:30px;padding:5px 9px;border-radius:10px;font-size:10px;box-shadow:none}.discovery-source button.active{border-color:rgba(125,211,252,.34);background:rgba(125,211,252,.14);color:#e0f7ff}
.discovery-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:12px}
.discovery-summary div{padding:12px;border-radius:15px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.075)}
.discovery-summary b{display:block;color:#fff;font-size:24px;line-height:1}.discovery-summary span{display:block;margin-top:4px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.discovery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.discovery-grid section{display:grid;gap:10px;min-width:0}
.discovery-grid h3{margin:0;color:#e8f4ff;font-size:15px;letter-spacing:-.01em}
.discovery-card{display:grid;gap:10px;padding:14px;min-width:0}
.discovery-card span{display:block;color:#93c5fd;text-transform:uppercase;letter-spacing:.08em;font-size:10px;font-weight:850}
.discovery-card b{display:block;margin-top:3px;color:#fff;font-size:17px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.discovery-card small{display:block;margin-top:4px;color:var(--muted);font-size:12px}
.discovery-mini-stats,.discovery-actions,.discovery-next div,.discovery-empty div{display:flex;gap:7px;flex-wrap:wrap}
.discovery-mini-stats i{font-style:normal;padding:5px 7px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#cbd5e1;font-size:11px;font-weight:800}.discovery-mini-stats .win{color:#bbf7d0}.discovery-mini-stats .loss{color:#fecaca}
.discovery-actions button,.discovery-next button,.discovery-empty button{min-height:34px;padding:7px 10px;border-radius:11px;font-size:11px;box-shadow:none}
.discovery-lines{display:grid;gap:5px}.discovery-lines em{font-style:normal;color:#dbeafe;font-size:12px;line-height:1.25;padding:7px 8px;border-radius:10px;background:rgba(125,211,252,.06);border:1px solid rgba(125,211,252,.12);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.discovery-empty,.discovery-next{padding:16px}.discovery-empty b,.discovery-next b{color:#fff;font-size:19px}
.discovery-workbench{display:grid;grid-template-columns:minmax(360px,580px) minmax(320px,1fr);gap:16px;align-items:start}
.discovery-board-card,.discovery-tree-panel{display:grid;gap:12px;padding:16px;border:1px solid rgba(255,255,255,.10);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));box-shadow:0 22px 62px rgba(0,0,0,.22)}
.discovery-board-card{position:sticky;top:18px}
.discovery-board-shell{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;align-items:stretch;justify-items:center;width:100%;max-width:522px;margin:0 auto}
.discovery-board-shell .discovery-evalbar{align-self:stretch;min-height:0;height:100%;width:14px;margin:0}
.discovery-eval-fill{position:absolute;left:0;right:0;bottom:0;height:var(--white-pct,50%);background:linear-gradient(180deg,#f4f7fb,#cbd5e1);border-radius:0 0 999px 999px;box-shadow:none;z-index:1;transition:height .22s ease}
.discovery-eval-number{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-90deg);z-index:4;padding:2px 6px;border-radius:999px;background:rgba(6,8,12,.78);border:1px solid rgba(255,255,255,.14);color:#f8fafc;font-size:10px;font-weight:800;letter-spacing:.02em;white-space:nowrap;box-shadow:0 4px 12px rgba(0,0,0,.24)}
.discovery-board-wrap{position:relative;width:100%;max-width:500px;margin:0 auto}
#discoveryBoard{width:100%;max-width:580px;aspect-ratio:1/1;min-height:280px;border-radius:18px;overflow:hidden;box-shadow:0 20px 58px rgba(0,0,0,.42);background:linear-gradient(135deg,rgba(125,211,252,.08),rgba(255,255,255,.035));touch-action:none}
#discoveryBoard .board-b72b1,#discoveryBoard .chessboard-63f37{width:100%!important;height:100%!important}
#discoveryBoard .piece-417db{visibility:visible!important;opacity:1!important;z-index:12!important}
#discoveryBoard .ui-draggable-dragging,
body.discovery-active>img.piece-417db,
body.discovery-active .ui-draggable-dragging,
body.discovery-active .dragging{visibility:visible!important;display:block!important;opacity:1!important;z-index:9999!important;pointer-events:none!important;filter:drop-shadow(0 14px 22px rgba(0,0,0,.38));max-width:none!important}
#discoveryBoard img{max-width:none}
#discoveryBoard .discovery-selected:before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:rgba(255,255,255,.22);box-shadow:inset 0 0 0 2px rgba(255,255,255,.26),inset 0 0 18px rgba(255,255,255,.13)}
#discoveryBoard .discovery-target:after{content:'';position:absolute;left:50%;top:50%;width:22%;height:22%;min-width:10px;min-height:10px;max-width:18px;max-height:18px;transform:translate(-50%,-50%);z-index:2;pointer-events:none;border-radius:999px;background:rgba(15,23,42,.35);box-shadow:0 0 0 1px rgba(255,255,255,.08),0 2px 8px rgba(0,0,0,.16)}
#discoveryBoard .discovery-target.discovery-capture:after{width:72%;height:72%;max-width:none;max-height:none;background:rgba(15,23,42,.14);box-shadow:inset 0 0 0 5px rgba(15,23,42,.30),0 0 0 1px rgba(255,255,255,.08)}
#discoveryArrowLayer{position:absolute;inset:0;width:100%;height:100%;z-index:8;pointer-events:none;overflow:visible}
.discovery-arrow{stroke-linecap:round;cursor:pointer;pointer-events:stroke;filter:drop-shadow(0 0 7px rgba(0,0,0,.45));transition:opacity .15s ease,stroke-width .15s ease}
.discovery-arrow:hover{opacity:.95}
.discovery-arrow.good{stroke:#22c55e}.discovery-arrow.attention{stroke:#f59e0b}.discovery-arrow.poor{stroke:#ef4444}.discovery-arrow.covered{stroke:#7dd3fc}
.discovery-arrow-head{fill:#7dd3fc;filter:drop-shadow(0 0 7px rgba(125,211,252,.38))}
.discovery-path{display:flex;gap:6px;flex-wrap:wrap}.discovery-path span{padding:5px 7px;border-radius:999px;background:rgba(125,211,252,.08);border:1px solid rgba(125,211,252,.14);color:#dbeafe;font-size:11px;font-weight:800}
.discovery-board-actions,.discovery-controls{display:flex;gap:8px;flex-wrap:wrap}.discovery-board-actions button,.discovery-controls button{min-height:34px;padding:7px 10px;border-radius:11px;font-size:11px;box-shadow:none}.discovery-board-info{display:grid;gap:8px;margin-top:2px}.discovery-board-info .discovery-source{margin-top:0;padding:9px 10px}.discovery-board-info .discovery-mode-badge{justify-self:start;margin-top:0}.discovery-board-info .discovery-temp-banner{margin-top:0;border-radius:14px}.discovery-controls .active{border-color:rgba(125,211,252,.34);background:rgba(125,211,252,.14);color:#e0f7ff}.discovery-mode-controls button[data-discovery-filter="all"]{opacity:.72}
.discovery-tree-panel h3{margin:0;color:#fff;font-size:18px;letter-spacing:-.02em}.discovery-moves{display:grid;gap:8px}
.discovery-unseen{margin:0;padding:9px 10px;border:1px solid rgba(251,191,36,.22);border-radius:12px;background:rgba(251,191,36,.08);color:#fde68a;font-size:12px;line-height:1.3}
.discovery-move{display:grid;grid-template-columns:minmax(52px,auto) 1fr auto;gap:9px;align-items:center;width:100%;padding:10px 11px;border-radius:14px;box-shadow:none;text-align:left}.discovery-move b{font-size:15px;color:#fff}.discovery-move span,.discovery-move small{color:var(--muted);font-size:11px}.discovery-move em{font-style:normal;font-size:12px;font-weight:900}.discovery-move small{grid-column:1/-1}
.discovery-move.good{border-color:rgba(34,197,94,.24);background:rgba(34,197,94,.08)}.discovery-move.good em{color:#bbf7d0}.discovery-move.attention{border-color:rgba(251,191,36,.25);background:rgba(251,191,36,.08)}.discovery-move.attention em{color:#fde68a}.discovery-move.poor{border-color:rgba(248,113,113,.28);background:rgba(248,113,113,.08)}.discovery-move.poor em{color:#fecaca}.discovery-move.covered{border-color:rgba(125,211,252,.30);background:linear-gradient(135deg,rgba(125,211,252,.12),rgba(251,191,36,.07))}.discovery-move.covered em{color:#bfdbfe}
.discovery-insights{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.discovery-insights div{padding:10px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04)}.discovery-insights span{display:block;color:#93c5fd;font-size:10px;text-transform:uppercase;letter-spacing:.07em;font-weight:850}.discovery-insights b{display:block;margin-top:4px;color:#fff;font-size:12px;line-height:1.2}
.discovery-replies-toggle{min-height:30px;padding:6px 10px!important;border-radius:999px!important;box-shadow:none!important;font-size:11px!important;background:rgba(125,211,252,.08)!important;border-color:rgba(125,211,252,.18)!important;color:#dff7ff!important}
.discovery-replies-toggle.active{background:rgba(10,132,255,.20)!important;border-color:rgba(125,211,252,.34)!important;color:#fff!important}
.discovery-replies-control{display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap}
.discovery-replies-legend{max-width:min(360px,100%);padding:5px 8px;border:1px solid rgba(125,211,252,.14);border-radius:999px;background:rgba(255,255,255,.045);color:rgba(226,232,240,.78);font-size:10.5px;font-weight:850;line-height:1.2;white-space:normal}
.discovery-replies-legend[hidden]{display:none}
.discovery-replies-status{margin:4px 0 6px;padding:7px 9px;border:1px solid rgba(125,211,252,.16);border-radius:12px;background:rgba(125,211,252,.07);color:#dbeafe;font-size:11px;font-weight:800}
.discovery-replies-status.warn{border-color:rgba(251,191,36,.20);background:rgba(251,191,36,.08);color:#fde68a}
.candidate-discovery-meta{border-color:rgba(125,211,252,.20)!important;background:rgba(125,211,252,.08)!important;color:#dff7ff!important}
.candidate-moves button.has-discovery-reply{border-color:rgba(125,211,252,.22);background:linear-gradient(180deg,rgba(125,211,252,.08),rgba(255,255,255,.035))}
.candidate-moves button.previewing{border-color:rgba(96,165,250,.42)!important;background:linear-gradient(180deg,rgba(96,165,250,.16),rgba(255,255,255,.045))!important}
#trainerBoard .preview-from::after,#trainerBoard .preview-to::after{content:'';position:absolute;inset:7%;border-radius:10px;border:2px solid rgba(96,165,250,.75);box-shadow:0 0 18px rgba(96,165,250,.22);pointer-events:none}
#trainerBoard .preview-from::after{background:rgba(96,165,250,.08)}
#trainerBoard .preview-to::after{background:rgba(52,211,153,.10);border-color:rgba(52,211,153,.75)}
.discovery-reply-arrow.good{stroke:#22c55e}.discovery-reply-arrow.attention{stroke:#f59e0b}.discovery-reply-arrow.poor{stroke:#ef4444}.discovery-reply-arrow.covered{stroke:#7dd3fc}
@media(max-width:850px){.discovery-lab-view{padding:14px 12px 110px}.discovery-grid,.discovery-summary{grid-template-columns:1fr}.discovery-hero{grid-template-columns:1fr}.discovery-hero b{font-size:24px}.discovery-player-search{grid-template-columns:1fr;width:100%;max-width:none}.discovery-temp-banner{display:flex;align-items:flex-start;border-radius:14px;flex-wrap:wrap}body.discovery-active .nav-daily-status,body.discovery-active #batchStatus{display:none!important}}
@media(max-width:850px){.discovery-workbench{grid-template-columns:1fr}.discovery-board-card{position:relative;top:auto;order:1;padding:10px}.discovery-tree-panel{order:2}.discovery-board-shell{max-width:calc(100vw - 44px);gap:7px}.discovery-board-wrap{max-width:calc(100vw - 66px)}#discoveryBoard{max-width:calc(100vw - 66px);min-height:0}.discovery-insights{grid-template-columns:1fr}.discovery-move{grid-template-columns:auto 1fr auto}.discovery-move small{grid-column:1/-1}}

/* Discovery Lab: full-history-first, cleaner information architecture. */
.discovery-hero{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-items:start;padding:14px 16px}
.discovery-hero b{font-size:25px}.discovery-hero p{max-width:740px}
.discovery-source{max-width:none;margin-top:12px;padding:12px;border-radius:16px;background:rgba(7,12,20,.62)}
.discovery-source b{display:block;margin:0;color:#fff;font-size:14px;line-height:1.2;letter-spacing:0}.discovery-source small{display:block;margin-top:4px;color:var(--muted);font-size:11px;line-height:1.35}
.discovery-status-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}
.discovery-source-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.discovery-source-actions button{min-height:32px;padding:6px 10px;border-radius:11px;font-size:11px}
.discovery-stat-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px}
.discovery-stat-strip div{padding:10px 12px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.04)}
.discovery-stat-strip b{display:block;margin:0;color:#fff;font-size:22px;line-height:1}.discovery-stat-strip span{display:block;margin-top:4px;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.06em;font-weight:850}
.discovery-choice{max-width:760px;margin:18px auto 0;padding:18px}.discovery-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}.discovery-choice-card{display:grid;justify-content:start;justify-items:flex-start;align-content:start;gap:5px;min-height:142px;padding:14px;border:1px solid rgba(255,255,255,.10);border-radius:18px;background:rgba(255,255,255,.045);box-shadow:none;text-align:left;color:#eaf4ff}.discovery-choice-card span{color:#93c5fd}.discovery-choice-card b{font-size:18px}.discovery-choice-card small{color:var(--muted);font-size:12px;line-height:1.35}.discovery-choice-card.own span,.discovery-choice-card.own b,.discovery-choice-card.own small{justify-self:start;text-align:left}.discovery-choice-card.own{background:radial-gradient(circle at 100% 0,rgba(125,211,252,.16),transparent 42%),rgba(255,255,255,.045)}.discovery-choice-card.scout{background:radial-gradient(circle at 100% 0,rgba(251,191,36,.16),transparent 42%),rgba(255,255,255,.045)}.discovery-choice-card.scout div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:6px;width:100%}.discovery-choice-card input{min-width:0;height:36px;border:1px solid rgba(255,255,255,.11);border-radius:11px;background:rgba(7,10,15,.55);color:var(--text);padding:0 10px}.discovery-choice-card button{min-height:36px;padding:7px 11px}
.discovery-workbench{grid-template-columns:minmax(320px,500px) minmax(360px,1fr);gap:14px}.discovery-board-wrap,#discoveryBoard{max-width:500px}.discovery-board-card,.discovery-tree-panel{padding:14px}.discovery-summary{display:none}
@media(max-width:850px){.discovery-status-row,.discovery-stat-strip,.discovery-choice-grid{grid-template-columns:1fr}.discovery-source-actions{justify-content:flex-start}.discovery-choice{margin-top:8px;padding:15px}.discovery-choice-card{min-height:0}.discovery-workbench{grid-template-columns:1fr}.discovery-board-shell{max-width:calc(100vw - 44px);gap:7px}.discovery-board-wrap,#discoveryBoard{max-width:calc(100vw - 66px)}}

/* ===== Daily Training panel: sharpened hierarchy + satisfying progress (2026-06) ===== */
/* Eyebrow now carries the task tag inline, so the prompt reads once as the hero. */
.practice-main-prompt .practice-eyebrow{display:inline-flex;align-items:center;gap:8px;justify-content:center;flex-wrap:wrap;color:var(--muted);font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.practice-tag{font-style:normal;font-size:9.5px;font-weight:900;text-transform:uppercase;letter-spacing:.04em;padding:2px 7px;border-radius:999px;border:1px solid rgba(255,255,255,.12);color:#dbeafe;background:rgba(255,255,255,.06);line-height:1.5}
.practice-tag.hard{color:#fecaca;background:rgba(239,68,68,.14);border-color:rgba(248,113,113,.32)}
.practice-tag.review{color:#fde68a;background:rgba(245,158,11,.12);border-color:rgba(251,191,36,.28)}
.practice-tag.new{color:#bfdbfe;background:rgba(59,130,246,.14);border-color:rgba(96,165,250,.30)}
.practice-tag.learning{color:#ddd6fe;background:rgba(139,92,246,.12);border-color:rgba(167,139,250,.26)}
.practice-tag.mastered{color:#bbf7d0;background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.30)}
/* Supportive coaching line under the hero — quiet, not a second headline. */
.practice-support{display:block;margin-top:5px;color:#aebccd;font-size:11.5px;line-height:1.35}
.practice-support em{font-style:normal;color:#8aa1b7;font-weight:800;font-size:10px;text-transform:uppercase;letter-spacing:.04em;opacity:.85}
/* Progress is the momentum anchor: visible count + springy fill + glow on a gain. */
.practice-progress-row{display:flex;align-items:center;gap:10px}
.practice-progress-row .practice-progress{flex:1 1 auto;margin:0}
.practice-progress-count{flex:0 0 auto;font-size:11px;font-weight:850;color:#cdd9e6;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.practice-progress i{transition:width .55s cubic-bezier(.2,1.3,.35,1)}
.practice-progress.bumped i{box-shadow:0 0 14px rgba(52,211,153,.7)}
.practice-progress.bumped{animation:practice-progress-glow .75s ease-out}
@keyframes practice-progress-glow{0%{filter:brightness(1.55)}100%{filter:brightness(1)}}
.practice-progress.done i{background:linear-gradient(90deg,#34d399,#22c55e);box-shadow:0 0 16px rgba(52,211,153,.55)}
/* Button hierarchy: Hint accented and wide, Sound a compact icon, Exit/Details quiet. */
.practice-mini-actions{display:flex!important;flex-wrap:wrap;gap:8px;align-items:stretch}
.practice-mini-actions .pa-hint{flex:1 1 130px;border-color:rgba(125,211,252,.42)!important;background:linear-gradient(180deg,rgba(125,211,252,.20),rgba(125,211,252,.08))!important;color:#e6f6ff!important}
.practice-mini-actions .pa-hint:hover{background:linear-gradient(180deg,rgba(125,211,252,.28),rgba(125,211,252,.13))!important}
.practice-mini-actions .pa-icon{flex:0 0 44px;width:44px;min-width:44px;padding:0!important;font-size:17px}
.practice-mini-actions .pa-quiet{flex:1 1 92px;color:var(--muted)}
.practice-mini-actions .pa-exit{flex:1 1 80px}
/* Calmer feedback accent — let the board hold the eye. */
.practice-moment em{color:#9fb4c8;opacity:.9}
/* Spring the success badge in — the little reward that makes a correct move feel good. */
.trainer-quality-mark{animation:trainer-quality-pop .36s cubic-bezier(.2,1.45,.4,1) both}
@keyframes trainer-quality-pop{0%{opacity:0;transform:scale(.7)}60%{opacity:1}100%{opacity:1;transform:scale(1)}}
/* Gentle "it's your move" breathing cue around the board, instead of redundant text. */
.trainer-board-wrap.your-turn{animation:trainer-your-turn 2.6s ease-in-out infinite}
@keyframes trainer-your-turn{0%,100%{box-shadow:0 0 0 0 rgba(125,211,252,0)}50%{box-shadow:0 0 0 3px rgba(125,211,252,.16)}}

/* ===== Main Lab: clearer hierarchy, more air, momentum (2026-06) ===== */
/* Lighter card edges + a touch more padding so the hero metrics can breathe. */
.player-overview,.daily-training-card{border-color:rgba(255,255,255,.055)}
.player-overview{padding:20px}
.daily-training-card{padding:20px;gap:16px}
/* Secondary analytics recede so the ELO hero (993 + curve) leads the eye. */
.trend-summary div,.overview-insights div{border-color:rgba(255,255,255,.05);background:rgba(255,255,255,.03)}
.trend-summary b{font-size:13px;color:#dfe9f3}
.overview-insights b{color:#e4edf6}
.trend-summary,.overview-insights{opacity:.92}
/* Next best action = the one bright primary CTA of the analytics card. */
.overview-next-action:not(.complete){border-color:rgba(125,211,252,.5);background:linear-gradient(135deg,rgba(56,189,248,.30),rgba(125,211,252,.14));box-shadow:0 10px 30px rgba(14,165,233,.18),inset 0 1px 0 rgba(255,255,255,.10);transition:transform .15s cubic-bezier(.2,1.2,.4,1),box-shadow .15s ease,background .15s ease}
.overview-next-action:not(.complete):hover{transform:translateY(-1px);box-shadow:0 14px 36px rgba(14,165,233,.26),inset 0 1px 0 rgba(255,255,255,.12);background:linear-gradient(135deg,rgba(56,189,248,.40),rgba(125,211,252,.18))}
.overview-next-action:not(.complete) b{color:#fff}
/* Streak = the hero of the daily loop: flame + amber glow, loss-aversion energy. */
.daily-training-metrics .streak-hero{position:relative;overflow:hidden}
.streak-hero.lit{border-color:rgba(251,191,36,.36)!important;background:linear-gradient(135deg,rgba(251,191,36,.16),rgba(255,255,255,.04))!important;box-shadow:0 0 24px rgba(251,146,60,.18)}
.streak-hero b{display:flex!important;align-items:center;gap:7px;font-size:26px!important}
.streak-hero.lit b{color:#ffe9c2!important}
.streak-flame{font-style:normal;font-size:20px;line-height:1;filter:drop-shadow(0 0 8px rgba(251,146,60,.6))}
.streak-hero.lit .streak-flame{animation:streak-flicker 2.2s ease-in-out infinite}
@keyframes streak-flicker{0%,100%{transform:scale(1) rotate(-1deg);filter:drop-shadow(0 0 7px rgba(251,146,60,.5))}50%{transform:scale(1.08) rotate(1deg);filter:drop-shadow(0 0 12px rgba(251,146,60,.85))}}
/* ELO curve: gradient area under the line + the line draws itself in on appear. */
.spark-area{fill:url(#sparkGrad);stroke:none}
.rating-spark polyline{animation:spark-draw 1.1s cubic-bezier(.45,.05,.2,1) both}
@keyframes spark-draw{0%{stroke-dasharray:1;stroke-dashoffset:1}100%{stroke-dasharray:1;stroke-dashoffset:0}}
/* The lab is working for you — let "Calculating…" pulse so it feels alive. */
.games-pager button.calc-live{color:#bfe9ff;border-color:rgba(125,211,252,.30);animation:calc-pulse 1.6s ease-in-out infinite}
@keyframes calc-pulse{0%,100%{box-shadow:0 0 0 0 rgba(125,211,252,0)}50%{box-shadow:0 0 12px 0 rgba(125,211,252,.28)}}

/* ===== Mistake Lab chooser: grounded header aligned with Discovery Lab (2026-06) ===== */
/* Eyebrow + clean white title + one descriptive line — same anatomy as .discovery-hero. */
.blunder-choice-box .choice-head{display:grid;gap:0;margin-bottom:2px}
.blunder-choice-box .choice-eyebrow{display:block;color:#7dd3fc;text-transform:uppercase;letter-spacing:.11em;font-size:11px;font-weight:900}
.blunder-choice-box .choice-head b{display:block;margin-top:4px;color:#fff;font-size:23px;letter-spacing:-.03em;line-height:1.06}
.blunder-choice-box .choice-head p{margin-top:5px;font-size:13px;line-height:1.35;color:var(--muted)}
.blunder-choice-box.compact .choice-head b{font-size:21px}
/* Balance the two paths like Discovery's own/scout: both get a subtle tint, neither
   over-glows. The eyebrow colour still codes the energy (cyan = calm, gold = sprint). */
.blunder-choice-card.free{background:radial-gradient(circle at 100% 0,rgba(125,211,252,.16),transparent 45%),rgba(255,255,255,.045)!important;border-color:rgba(125,211,252,.22)!important}
.blunder-choice-card.rush{background:radial-gradient(circle at 100% 0,rgba(251,191,36,.16),transparent 45%),rgba(255,255,255,.045)!important;border-color:rgba(251,191,36,.24)!important}

/* ===== "Add line to Repertoire Lab" — settings action + chooser modal (2026-06) ===== */
.review-settings-panel .repImportBtn{margin-top:9px;width:100%;min-height:38px;border:1px solid rgba(125,211,252,.34);border-radius:11px;background:linear-gradient(180deg,rgba(125,211,252,.16),rgba(125,211,252,.06));color:#e6f6ff;font-size:12px;font-weight:850;cursor:pointer}
.review-settings-panel .repImportBtn:hover{background:linear-gradient(180deg,rgba(125,211,252,.24),rgba(125,211,252,.10))}
.review-settings-panel .repImportBtn:disabled{opacity:.42;cursor:default}
.rep-import-modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:rgba(3,6,12,.66);backdrop-filter:blur(4px);padding:18px}
.rep-import-card{width:min(440px,94vw);max-height:84vh;overflow:auto;padding:18px;border:1px solid rgba(125,211,252,.18);border-radius:20px;background:linear-gradient(180deg,rgba(20,28,40,.98),rgba(12,16,24,.98));box-shadow:0 30px 80px rgba(0,0,0,.5)}
.rep-import-head span{color:#7dd3fc;text-transform:uppercase;letter-spacing:.11em;font-size:11px;font-weight:900}
.rep-import-head b{display:block;margin-top:4px;color:#fff;font-size:20px;letter-spacing:-.02em}
.rep-import-head p{margin-top:4px;color:var(--muted);font-size:12px}
.rep-import-line{margin:12px 0;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.05);color:#dbeafe;font-size:13px;line-height:1.5;font-variant-numeric:tabular-nums}
.rep-import-colors{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.rep-import-colors button{min-height:38px;border:1px solid rgba(255,255,255,.12);border-radius:11px;background:rgba(255,255,255,.04);color:#dbeafe;font-weight:800;cursor:pointer}
.rep-import-colors button.active{border-color:rgba(125,211,252,.5);background:linear-gradient(180deg,rgba(125,211,252,.20),rgba(125,211,252,.08));color:#fff}
.rep-import-list{display:grid;gap:8px;margin-bottom:12px}
.rep-import-pick{display:grid;gap:2px;text-align:left;padding:11px 12px;border:1px solid rgba(255,255,255,.10);border-radius:13px;background:rgba(255,255,255,.045);color:#eaf4ff;cursor:pointer}
.rep-import-pick:hover{border-color:rgba(125,211,252,.4);background:rgba(125,211,252,.08)}
.rep-import-pick b{font-size:14px}.rep-import-pick small{color:var(--muted);font-size:11px}
.rep-import-empty{color:var(--muted);font-size:12px;padding:6px 2px}
.rep-import-actions{display:grid;grid-template-columns:1fr auto;gap:8px}
.rep-import-create{min-height:42px;border:1px solid rgba(125,211,252,.42);border-radius:12px;background:linear-gradient(180deg,rgba(125,211,252,.20),rgba(125,211,252,.08));color:#fff;font-weight:850;cursor:pointer}
.rep-import-cancel{min-height:42px;padding:0 14px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:transparent;color:var(--muted);cursor:pointer}

/* Match Mistake Lab choice cards to Discovery's: top-left packed, same type scale.
   The cards are <button>s, and the global button rule sets justify-content:center /
   align-items:center — which centered the grid column. Override BOTH so content
   hugs the top-left exactly like Discovery's .discovery-choice-card. */
.blunder-choice-card{justify-content:start!important;justify-items:flex-start!important;align-content:start!important;align-items:start!important;text-align:left!important}
.blunder-choice-card b{font-size:18px;letter-spacing:-.04em}
.blunder-choice-card span{font-weight:900;letter-spacing:.11em}
/* Neutral container to match Discovery's hero (was blue-tinted). */
.blunder-choice-box{border-color:rgba(255,255,255,.10)!important;background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.032))!important}
/* The chooser already has its own framed box (.blunder-choice-box). Drop the outer
   panel's box in this state so there's ONE container like Discovery — no nested pill. */
body.learning-choice .learning-center-card{background:none!important;border:none!important;box-shadow:none!important;padding:0!important}

/* Self-set ELO goal: gold target line in the chart + a tappable goal row. */
.rating-spark .spark-goal{stroke:#facc15;stroke-width:1.5;stroke-dasharray:4 4;opacity:.9;fill:none}
.rating-spark .spark-goal-label{fill:#facc15;font-size:9px;font-weight:800;letter-spacing:-.01em}
.elo-goal-row{display:flex;align-items:center;gap:8px;width:100%;margin-top:9px;padding:9px 12px;border:1px solid rgba(250,204,21,.30);border-radius:13px;background:linear-gradient(180deg,rgba(250,204,21,.10),rgba(250,204,21,.03));color:#fde68a;cursor:pointer;text-align:left;box-shadow:none}
.elo-goal-row:hover{border-color:rgba(250,204,21,.45)}
.elo-goal-row>span{font-size:12px;font-weight:850;color:#facc15}
.elo-goal-row b{font-size:13px;color:#fff7d6;margin-left:auto}
.elo-goal-row.empty{border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.04)}
.elo-goal-row.empty>span{color:var(--muted)}.elo-goal-row.empty b{color:#dbeafe;margin-left:8px}
.elo-goal-row.reached{border-color:rgba(52,211,153,.42);background:linear-gradient(180deg,rgba(52,211,153,.12),rgba(52,211,153,.03))}.elo-goal-row.reached b{color:#bbf7d0}
.elo-goal-row.editing{cursor:default;background:rgba(255,255,255,.04)}
.elo-goal-row .eloGoalInput{flex:1;min-width:0;height:34px;border:1px solid rgba(255,255,255,.14);border-radius:10px;background:rgba(7,10,15,.6);color:#fff;padding:0 10px;font-weight:800;outline:none}
.elo-goal-row .eloGoalInput:focus{border-color:rgba(250,204,21,.5)}
.elo-goal-row button{min-height:34px;padding:0 12px;border-radius:10px;font-weight:850;font-size:12px;box-shadow:none}
.elo-goal-row [data-elo-goal-save]{border-color:rgba(250,204,21,.45);background:linear-gradient(180deg,rgba(250,204,21,.22),rgba(250,204,21,.08));color:#1f1500}
.elo-goal-row .elo-goal-clear{color:var(--muted);background:rgba(255,255,255,.04)}
/* Peak & low markers on the curve */
.rating-spark .spark-extreme{stroke:#0b1220;stroke-width:1}
.rating-spark .spark-extreme.peak{fill:#bbf7d0}
.rating-spark .spark-extreme.low{fill:#fca5a5}
.rating-spark .spark-peak-label{font-size:8.5px;font-weight:800;fill:#bbf7d0}
.rating-spark .spark-low-label{font-size:8.5px;font-weight:800;fill:#fca5a5}
/* Upgraded trend summary: 3 living tiles (pace · W/L bar · avg accuracy) */
.trend-summary.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.trend-summary .pace-tile small{display:block;margin-top:3px;color:var(--muted);font-size:10px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.trend-summary .pace-tile.up b{color:#bbf7d0}
.trend-summary .wl-tile{min-width:0}
.trend-summary .wl-bar{display:flex;height:7px;padding:0;border:0;border-radius:999px;overflow:hidden;margin:6px 0 4px;background:rgba(255,255,255,.06)}
.trend-summary .wl-bar i{display:block;height:100%}
.trend-summary .wl-bar .w{background:#34d399}.trend-summary .wl-bar .d{background:#94a3b8}.trend-summary .wl-bar .l{background:#f87171}
.trend-summary .wl-tile small{display:block;color:var(--muted);font-size:10px;white-space:nowrap}

/* Coach insight: slim default + expandable details, interactive proof line */
.coach-details{margin-top:10px;border-top:1px solid rgba(255,255,255,.08);padding-top:8px}
.coach-details>summary{list-style:none;cursor:pointer;color:#9fb6cf;font-size:12px;font-weight:800;display:inline-flex;align-items:center;gap:6px;padding:4px 0}
.coach-details>summary::-webkit-details-marker{display:none}
.coach-details>summary:before{content:"›";display:inline-block;transition:transform .15s ease;color:#7dd3fc;font-weight:900}
.coach-details[open]>summary:before{transform:rotate(90deg)}
.coach-details>summary:hover{color:#dbeafe}
.coach-details .coach-chip-grid{margin-top:8px}
.coach-line-chip .coach-line{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.coach-line-move{min-height:30px;padding:4px 10px;border:1px solid rgba(125,211,252,.22);border-radius:9px;background:rgba(125,211,252,.08);color:#dff2ff;font-weight:800;font-size:13px;cursor:pointer;box-shadow:none}
.coach-line-move:hover{transform:none;background:rgba(125,211,252,.16);border-color:rgba(125,211,252,.4)}
.coach-line-move.active{background:linear-gradient(180deg,rgba(125,211,252,.32),rgba(125,211,252,.14));border-color:rgba(125,211,252,.55);color:#fff}
.coach-line-reset{min-height:30px;padding:4px 9px;border:1px solid rgba(255,255,255,.12);border-radius:9px;background:rgba(255,255,255,.04);color:var(--muted);cursor:pointer;box-shadow:none}
.coach-line-reset:hover{transform:none;background:rgba(255,255,255,.08)}
.coach-line-hint{display:block;margin-top:6px;color:var(--muted);font-size:10.5px;font-style:normal}
.coach-positive .coach-lead{color:#dbeafe}
.coach-idea-note{margin:8px 0 0;color:var(--muted);font-size:13px;line-height:1.45}
.coach-idea-note small{display:inline-block;margin-right:6px;color:#7dd3fc;font-weight:800;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em}
/* On-demand AI analysis: clean trigger button + short loading line */
.coach-ai-gate{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.coach-ai-trigger{display:inline-flex;align-items:center;gap:8px;margin-top:8px;padding:11px 16px;border:1px solid rgba(125,211,252,.4);border-radius:12px;background:linear-gradient(180deg,rgba(125,211,252,.18),rgba(125,211,252,.07));color:#dff2ff;font-weight:800;font-size:14px;cursor:pointer;box-shadow:none}
.coach-ai-trigger:hover{transform:translateY(-1px);border-color:rgba(125,211,252,.65);background:linear-gradient(180deg,rgba(125,211,252,.28),rgba(125,211,252,.12))}
.coach-ai-trigger .btn-icon{color:#7dd3fc;font-size:15px}
.coach-ai-loading{display:flex;align-items:center;gap:10px;margin-top:8px;color:#bcd2e6}
.coach-ai-loading:after{content:"";flex:1 1 auto;min-width:60px;height:3px;border-radius:999px;background:linear-gradient(90deg,rgba(125,211,252,0),rgba(125,211,252,.75),rgba(125,211,252,0));background-size:200% 100%;animation:coachShimmer 1.1s linear infinite}
@keyframes coachShimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.coach-ai-error{margin-top:6px;color:#fca5a5}
.coach-motif-tag{display:inline-block;margin:6px 0 2px;padding:2px 10px;border-radius:999px;background:rgba(125,211,252,.14);border:1px solid rgba(125,211,252,.3);color:#bfe3ff;font-size:11px;font-weight:800;letter-spacing:.03em;text-transform:uppercase}
/* Missed Opportunity category (gold): the opponent erred and you did not punish it */
.cat.missed b{background:#ef6244;color:#fff}
.cat.missed.current,.review-chip.missed.current{border-color:rgba(239,98,68,.55);box-shadow:0 0 0 1px rgba(239,98,68,.18),0 0 26px rgba(239,98,68,.24)}
.move-icon.missed{background:#ef6244;color:#fff}
.mark.missed{background:rgba(239,98,68,.95);color:#fff}
.quality-mark.missed{background:linear-gradient(180deg,#f5805f,#ef5230);color:#fff;--quality-glow:rgba(239,98,68,.55)}
.engine-debug{margin-top:8px;padding:7px 9px;border-radius:9px;background:rgba(255,170,60,.1);border:1px solid rgba(255,170,60,.25);color:#f0c987;font-size:11px;line-height:1.5;font-variant-numeric:tabular-nums}
.engine-debug b{color:#fff}

/* ---- Daily goals: the satisfying "all complete" moment ------------------- */
/* Main hub card flips from cool blue (in progress) to a warm success aura. */
.daily-training-card.complete{border-color:rgba(52,211,153,.42);background:linear-gradient(150deg,rgba(13,32,30,.82),rgba(12,20,16,.66));box-shadow:0 26px 80px rgba(0,0,0,.28),0 0 0 1px rgba(52,211,153,.12),0 0 46px rgba(45,212,150,.16),inset 0 1px 0 rgba(255,255,255,.1)}
.daily-training-card.complete:before{background:radial-gradient(circle at 12% -4%,rgba(52,211,153,.26),transparent 38%),radial-gradient(circle at 90% 4%,rgba(251,191,36,.18),transparent 34%)}
/* one-time diagonal light sweep when the completed card appears */
.daily-training-card.complete:after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;opacity:0;background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.1) 50%,transparent 62%);background-size:240% 100%;background-position:120% 0}
.daily-training-card.complete .daily-training-head span{color:#6ee7b7}
.daily-training-card.complete .daily-training-head b{color:#ecfff7}
.daily-head-check{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;margin-right:6px;border-radius:50%;background:linear-gradient(135deg,#34d399,#10b981);color:#04130d;font-size:9px;font-weight:900;vertical-align:-1px;box-shadow:0 0 12px rgba(52,211,153,.6)}
/* per-mission "done" state + check badge */
.daily-mission.done{border-color:rgba(52,211,153,.4);background:linear-gradient(150deg,rgba(52,211,153,.14),rgba(255,255,255,.04))}
.daily-mission.openings.done{box-shadow:0 14px 34px rgba(52,211,153,.1),inset 0 1px 0 rgba(255,255,255,.1)}
.daily-mission-copy .mission-check{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:6px;border-radius:50%;background:linear-gradient(135deg,#34d399,#10b981);color:#04130d;font-size:10px;font-weight:900;vertical-align:-2px;box-shadow:0 0 12px rgba(52,211,153,.55)}
.daily-mission.done .daily-mission-progress i{background:linear-gradient(90deg,#10b981,#6ee7b7)!important;box-shadow:0 0 16px rgba(52,211,153,.45)!important}
/* Sidebar "Today" widget — same success language, tiny scale */
.nav-daily-status.complete{border-color:rgba(52,211,153,.34);background:linear-gradient(180deg,rgba(16,185,129,.14),rgba(52,211,153,.05));box-shadow:0 10px 26px rgba(16,185,129,.12),inset 0 1px 0 rgba(255,255,255,.08)}
.nav-daily-status.complete small{color:#6ee7b7}
.nav-daily-row.done b{color:#d1fae5}
.nav-daily-row.done>i{background:linear-gradient(90deg,#10b981,#6ee7b7)!important;box-shadow:0 0 8px rgba(52,211,153,.4)}
.nav-daily-status .nav-daily-check{display:inline-flex;align-items:center;justify-content:center;width:12px;height:12px;margin-left:4px;border-radius:50%;background:linear-gradient(135deg,#34d399,#10b981);color:#04130d;font-size:8px;font-weight:900;vertical-align:-1px;grid-column:auto}
@media (prefers-reduced-motion:no-preference){
  .daily-training-card.complete:after{animation:daily-complete-sheen 1.25s ease-out .05s 1 both}
  .daily-head-check,.daily-mission-copy .mission-check,.nav-daily-status .nav-daily-check{animation:daily-check-pop .42s cubic-bezier(.34,1.56,.64,1) both}
  .daily-training-card.complete .streak-flame{animation:streak-flicker 2.2s ease-in-out infinite}
}
@keyframes daily-complete-sheen{0%{background-position:120% 0;opacity:0}18%{opacity:1}100%{background-position:-40% 0;opacity:0}}
@keyframes daily-check-pop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.15)}100%{transform:scale(1);opacity:1}}

/* ---- Coach insight -> Blunder note (Stage-1 USP) ------------------------- */
.coach-motif-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:6px 0 2px}
.coach-motif-row .coach-motif-tag{margin:0}
.coach-save-note{margin-left:auto;display:inline-flex;align-items:center;gap:5px;padding:3px 11px;border-radius:999px;border:1px solid rgba(52,211,153,.34);background:linear-gradient(180deg,rgba(52,211,153,.16),rgba(16,185,129,.07));color:#9af2c9;font-size:11px;font-weight:850;letter-spacing:.02em;cursor:pointer;transition:transform .12s ease,background .15s ease,border-color .15s ease}
.coach-save-note:hover{background:linear-gradient(180deg,rgba(52,211,153,.26),rgba(16,185,129,.12));border-color:rgba(52,211,153,.5);transform:translateY(-1px)}
.coach-save-note:active{transform:translateY(0)}
.coach-save-note.saved{background:rgba(52,211,153,.12);border-color:rgba(52,211,153,.3);color:#6ee7b7;cursor:default}
.coach-save-note:disabled{cursor:default;opacity:.9}
/* the saved reason shown back in the Blunder notes panel — visible link to the coach */
.note-tags{display:flex;flex-wrap:wrap;gap:6px}
.note-tag{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;background:rgba(52,211,153,.13);border:1px solid rgba(52,211,153,.28);color:#a7f3d0;font-size:10px;font-weight:800;letter-spacing:.02em;text-transform:uppercase}

/* Mistake Lab "Preparing…" bar: animated indeterminate fill so it never looks frozen
   while the daily repair set is being assembled (the static width:33% looked stuck). */
@keyframes learning-indeterminate{0%{transform:translateX(-120%)}100%{transform:translateX(380%)}}
.loading-state .learning-progress i{width:28%!important;animation:learning-indeterminate 1.1s ease-in-out infinite}

/* Blunder-repair feedback card: keep the long "Why this still fails" text and the
   progress/streak row INSIDE the card. The refutation grid auto-column blew out to the
   full sentence width, pushing the whole card past the right edge on wide screens. */
.learning-result-card,.learning-result-card>*{min-width:0}
.learning-result-progress>*{min-width:0}
.learning-result-best,.learning-result-tried,.learning-result-hero span{overflow-wrap:anywhere}
/* Scoped to the Mistake Lab card — the variation-review box keeps its grid layout. */
.learning-result-card .refutation-box{display:block!important}
.learning-result-card .refutation-box>*+*{margin-top:4px}
.learning-result-card .refutation-box b,.learning-result-card .refutation-box strong,.learning-result-card .refutation-box span{display:block;width:100%;overflow-wrap:anywhere;word-break:break-word}

/* Analysis header: show the full player names (wrap to a second line instead of
   clipping "Marvin_Plays_…" with an ellipsis). */
body.analysis-active .match-copy b{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;line-height:1.15}

/* Coach tab: game briefing instead of the dead "No coach insight yet" state. */
.coach-intro{display:grid;gap:8px;justify-items:start}
.coach-intro span{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.coach-intro b{font-size:18px;letter-spacing:-.02em}
.coach-intro p{color:var(--muted);line-height:1.45;margin:0}
.coach-intro button{margin-top:4px;background:rgba(10,132,255,.16);border-color:rgba(10,132,255,.30);color:#8ec5ff}

/* Database tab: Lichess position explorer rows. */
.pos-explorer{margin-top:14px;display:grid;gap:8px}
.pos-explorer-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.pos-explorer-head span{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:#8ec5ff;font-weight:800}
.pos-explorer-head small{color:var(--muted)}
.pos-explorer-row{display:grid;grid-template-columns:52px 38px 1fr 70px;align-items:center;gap:10px;padding:7px 10px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.04)}
.pos-explorer-row b{font-size:14px}
.pos-explorer-row small{color:var(--muted);font-size:11px}
.pos-explorer-row em{font-style:normal;color:var(--muted);font-size:11px;text-align:right}
.pos-explorer-bar{display:flex;height:9px;border-radius:999px;overflow:hidden;border:1px solid rgba(255,255,255,.10);min-width:0}
.pos-explorer-bar .w{background:#e8eaee}
.pos-explorer-bar .d{background:#5c646f}
.pos-explorer-bar .b{background:#16181d}
.pos-explorer-note,.pos-explorer-empty,.pos-explorer-loading{color:var(--muted);font-size:12px}

/* Mistake Lab chooser: queue insights + next-position previews. */
.mistake-insights{margin-top:18px;display:grid;gap:14px;border-top:1px solid var(--line);padding-top:16px}
.mistake-insight-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.mistake-insight-stats>div{padding:12px 14px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.04);display:grid;gap:3px}
.mistake-insight-stats span{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.07em;font-weight:800}
.mistake-insight-stats b{font-size:15px;letter-spacing:-.01em}
.mistake-insight-stats small{color:var(--muted);font-size:11px}
.mistake-preview-row{display:flex;flex-wrap:wrap;gap:14px}
.mistake-preview{display:grid;gap:6px;justify-items:center;width:152px}
.mini-board{display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);width:150px;height:150px;border-radius:10px;overflow:hidden;border:1px solid var(--line)}
.mini-board i{display:flex;align-items:center;justify-content:center;font-style:normal;line-height:1}
.mini-board i.l{background:#e9dcc0}
.mini-board i.d{background:#a08a6e}
.mini-board i img{width:92%;height:92%;object-fit:contain;display:block}
.mistake-preview-loss{display:block;width:100%;height:6px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.mistake-preview-loss i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#ff9f0a,#ff453a)}
.mistake-preview small em{font-style:normal;color:#ff8a80;font-weight:800}
.mistake-preview small{color:var(--muted);font-size:11px;text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mistake-preview-note{color:var(--muted);font-size:11px}

/* Discovery chooser: most-played openings under the mode cards. */
.discovery-choice-insights{max-width:920px;margin:18px auto 0;display:grid;gap:12px}
.discovery-choice-insights-head{display:grid;gap:2px}
.discovery-choice-insights-head span{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:#8ec5ff;font-weight:800}
.discovery-choice-insights-head small{color:var(--muted)}
.discovery-insight-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.discovery-insight-card{padding:14px 16px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.045);display:grid;gap:6px}
.discovery-insight-card.leak{border-color:rgba(255,69,58,.35);background:rgba(255,69,58,.07)}
.discovery-insight-card b{font-size:14px;letter-spacing:-.01em}
.discovery-insight-card small{color:var(--muted);font-size:12px}
.discovery-score-bar{display:block;height:6px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.discovery-score-bar i{display:block;height:100%;background:linear-gradient(90deg,#ff453a,#ff9f0a 45%,#32d74b 75%)}

/* Repertoire Lab home: forecast + attention + recent activity under the color cards. */
.rep-home-extras{margin-top:14px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.rep-home-extras>*{min-width:0}
.rep-extra-card{min-width:0;padding:14px 16px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.045);display:grid;gap:8px;align-content:start}
.rep-extra-card>*{min-width:0}
.rep-trouble-list>div{min-width:0}
.rep-extra-card>span{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:#8ec5ff;font-weight:800}
.rep-extra-card small{color:var(--muted);font-size:11px}
.rep-forecast-bar{display:flex;height:10px;border-radius:999px;overflow:hidden;border:1px solid rgba(255,255,255,.10)}
.rep-forecast-bar .today{background:#ff9f0a}
.rep-forecast-bar .soon{background:#0a84ff}
.rep-forecast-bar .later{background:rgba(255,255,255,.16)}
.rep-trouble-list{display:grid;gap:7px}
.rep-trouble-list b{font-size:13px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rep-trouble-list small{color:var(--muted)}

/* Scoreboard mobile game tiles (after the legacy mobile grid block so the
   cascade favors these rules). Row 1: names | result | accuracy. Row 2: time
   meta left, compact CTA right. Color pill hidden — the dots carry that info. */
@media(max-width:700px){
 body.games-active .gamepick.rich{display:grid!important;grid-template-columns:minmax(0,1fr) auto auto;grid-template-rows:auto auto;gap:7px 10px;padding:2px 0!important;align-items:start}
 body.games-active .gamepick.rich .players{grid-column:1;grid-row:1;min-width:0;gap:3px}
 body.games-active .gamepick.rich .players b{font-size:13px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 body.games-active .gamepick.rich .players em{font-size:11px}
 body.games-active .gamepick.rich .players .game-opening{white-space:normal;overflow-wrap:anywhere;font-size:11px;line-height:1.35;margin-top:2px;color:var(--muted)}
 body.games-active .gamepick.rich .game-result{grid-column:2;grid-row:1;justify-self:end;align-self:start;display:grid;gap:1px;text-align:right}
 body.games-active .gamepick.rich .game-result b{font-size:15px}
 body.games-active .gamepick.rich .game-result small{font-size:10px;color:var(--muted)}
 body.games-active .gamepick.rich .acc.metric-pill{grid-column:3;grid-row:1;justify-self:end;align-self:start;display:block;width:auto;max-width:none;padding:5px 8px;border-radius:10px;text-align:center}
 body.games-active .gamepick.rich .acc .metric-icon,body.games-active .gamepick.rich .acc .metric-bar{display:none}
 body.games-active .gamepick.rich .acc .metric-copy{display:grid;gap:1px;justify-items:center}
 body.games-active .gamepick.rich .acc .metric-copy b{font-size:16px;line-height:1.1}
 body.games-active .gamepick.rich .acc .metric-copy small{font-size:8px;letter-spacing:.03em;white-space:normal;max-width:62px;line-height:1.25}
 body.games-active .gamepick.rich .colorpill{display:none}
 body.games-active .gamepick.rich .timepill{grid-column:1;grid-row:2;justify-self:start;align-self:center;width:auto;max-width:none;min-height:0;background:transparent;border:0;padding:0;gap:5px}
 body.games-active .gamepick.rich .timepill>span{display:flex;gap:5px;align-items:baseline}
 body.games-active .gamepick.rich .timepill b{font-size:11px;font-weight:650}
 body.games-active .gamepick.rich .timepill small{font-size:11px;color:var(--muted)}
 body.games-active .gamepick.rich .card-cta{grid-column:2/4;grid-row:2;justify-self:end;align-self:center;width:auto;max-width:none;min-width:0;min-height:0;padding:5px 12px;font-size:12px;border-radius:999px;white-space:nowrap}
}

/* Gold daily status bars: warm gradient + glow, smooth fill transition and a
   periodic shine sweep — the small dopamine moment for daily progress. */
.nav-daily-status i{height:3px;background:linear-gradient(90deg,#b7791f,#f0b429 55%,#ffd968);box-shadow:0 0 10px rgba(240,180,41,.40),0 0 2px rgba(255,217,104,.7);transition:width .6s cubic-bezier(.22,.61,.36,1);position:relative;overflow:hidden}
.nav-daily-status i:after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-130%);animation:gold-shine 3.4s ease-in-out infinite}
.nav-daily-row.done i{box-shadow:0 0 14px rgba(240,180,41,.6),0 0 4px rgba(255,217,104,.9)}
.nav-daily-check{color:#ffd968}
.nav-daily-status{border-color:rgba(240,180,41,.16)}
@keyframes gold-shine{0%,55%{transform:translateX(-130%)}85%,100%{transform:translateX(130%)}}
@media(max-width:1050px){
 .nav-daily-status{background:linear-gradient(180deg,rgba(240,180,41,.13),rgba(240,180,41,.045));border-color:rgba(240,180,41,.26);box-shadow:0 10px 24px rgba(240,180,41,.10),inset 0 1px 0 rgba(255,255,255,.08)}
}
@media(prefers-reduced-motion:reduce){.nav-daily-status i:after{animation:none}}

/* Loss report banner: the one-line verdict of the game. Red accent for the
   losing moment, green for how you won — with a jump straight to the move. */
.loss-report{position:relative;display:grid;gap:6px;justify-items:start;margin:14px 0;padding:14px 16px;border:1px solid var(--line);border-left:3px solid var(--red);border-radius:0 18px 18px 0;background:linear-gradient(135deg,rgba(255,69,58,.10),rgba(255,255,255,.035) 60%)}
.loss-report.win{border-left-color:var(--green);background:linear-gradient(135deg,rgba(50,215,75,.10),rgba(255,255,255,.035) 60%)}
.loss-report-eyebrow{font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.09em;color:#ff8a80}
.loss-report.win .loss-report-eyebrow{color:#7ee787}
.loss-report b{font-size:16px;letter-spacing:-.01em;line-height:1.25}
.loss-report p{margin:0;color:var(--muted);font-size:13px;line-height:1.45}
.loss-report-jump{margin-top:4px;padding:6px 12px;border-radius:999px;font-size:12px;background:rgba(255,255,255,.07)}
.summary-mobile-accordion .loss-report{margin:0 0 10px}

/* Blunder profile: the cross-game pattern overview at the top of the Mistake
   Lab chooser. Every row is a button — tap a pattern, train that pattern. */
.blunder-profile{display:grid;gap:12px;margin-top:14px;padding:14px 16px;border:1px solid rgba(240,180,41,.18);border-radius:18px;background:radial-gradient(circle at 0 0,rgba(240,180,41,.10),transparent 50%),rgba(255,255,255,.035)}
.profile-head{display:grid;gap:2px}
.profile-head span{font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.09em;color:#f0b429}
.profile-head b{font-size:16px;letter-spacing:-.01em}
.profile-head small{color:var(--muted);font-size:12px}
.profile-rows{display:grid;gap:6px}
.profile-row{display:grid;grid-template-columns:minmax(0,42%) minmax(0,1fr) auto auto;align-items:center;gap:10px;width:100%;padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.045);border:1px solid var(--line);box-shadow:none;text-align:left}
.profile-row:hover{border-color:rgba(240,180,41,.45);background:rgba(240,180,41,.08);transform:none}
.profile-label{font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.profile-bar{height:6px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.profile-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#b7791f,#f0b429 60%,#ffd968);box-shadow:0 0 8px rgba(240,180,41,.35)}
.profile-row b{font-size:13px;color:#ffd968}
.profile-row small{font-size:11px;color:var(--muted);min-width:32px;text-align:right}
.profile-phases{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.profile-phases>div{display:grid;gap:4px;padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.035)}
.profile-phases span{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}
.profile-phase-bar{height:5px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.profile-phase-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#0a84ff,#76b9ff)}
.profile-phases small{font-size:11px;color:#c8d0dc;font-weight:700}

/* Focus mode: active pattern chip + Lichess top-up inside the exercise intro. */
.learning-focus-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
.focus-chip{display:inline-flex;align-items:center;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:800;color:#ffd968;background:rgba(240,180,41,.12);border:1px solid rgba(240,180,41,.30)}
.learning-focus-row button{padding:6px 12px;border-radius:999px;font-size:12px}
#learningAddPuzzles{border-color:rgba(118,185,255,.35);background:rgba(10,132,255,.12);color:#bfdcff}
.move-icon.puzzle{background:rgba(10,132,255,.18);color:#bfdcff;font-style:normal}

/* Preview boards became buttons: keep the card look, add an explicit CTA so
   (especially on mobile) it's obvious the boards are tappable entry points. */
button.mistake-preview{appearance:none;padding:10px 10px 9px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.045);box-shadow:none;cursor:pointer;font:inherit;color:inherit}
button.mistake-preview:hover{transform:translateY(-1px);border-color:rgba(118,185,255,.45);background:rgba(10,132,255,.08)}
.mistake-preview-cta{display:inline-flex;align-items:center;justify-content:center;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:800;color:#bfdcff;background:rgba(10,132,255,.14);border:1px solid rgba(118,185,255,.30)}
@media(max-width:700px){
 .mistake-preview-row{gap:10px}
 .mistake-preview{width:calc(33.33% - 7px);min-width:96px}
 /* Blunder profile on small screens: tighter rows, label keeps room. */
 .blunder-profile{padding:12px}
 .profile-row{grid-template-columns:minmax(0,46%) minmax(0,1fr) auto auto;gap:7px;padding:8px}
 .profile-label{font-size:12px}
 .profile-phases{gap:6px}
 .profile-phases>div{padding:7px 8px}
}

/* ============ Lab identity nav ============
   Each lab owns a color: after a few days you navigate by color, not text.
   Inactive rows stay calm (dimmed tint), only the active one glows. */
.nav nav button[data-view="past"]{--lab:#dbe6f5}
.nav nav button[data-view="discovery"]{--lab:#2dd4bf}
.nav nav button[data-view="learning"]{--lab:#ff8a5c}
.nav nav button[data-view="analysis"]{--lab:#7cc7ff}
.nav nav button[data-view="opening-trainer"]{--lab:#f0b429}
.nav nav button{overflow:visible}
.nav nav button:before{color:var(--lab,#a7b2c2);opacity:.55;transition:opacity .16s ease,filter .2s ease}
.nav nav button:hover:before{opacity:.85}
.nav nav button:active{transform:scale(.97)}
.nav nav button.active{color:#f7fbff}
.nav nav button.active[data-view="past"]{background:linear-gradient(90deg,rgba(219,230,245,.13),transparent 78%);border-color:rgba(219,230,245,.16)}
.nav nav button.active[data-view="discovery"]{background:linear-gradient(90deg,rgba(45,212,191,.15),transparent 78%);border-color:rgba(45,212,191,.22)}
.nav nav button.active[data-view="learning"]{background:linear-gradient(90deg,rgba(255,138,92,.15),transparent 78%);border-color:rgba(255,138,92,.22)}
.nav nav button.active[data-view="analysis"]{background:linear-gradient(90deg,rgba(124,199,255,.15),transparent 78%);border-color:rgba(124,199,255,.22)}
.nav nav button.active[data-view="opening-trainer"]{background:linear-gradient(90deg,rgba(240,180,41,.15),transparent 78%);border-color:rgba(240,180,41,.24)}
.nav nav button.active:before{opacity:1;color:var(--lab);filter:drop-shadow(0 0 6px var(--lab))}
@media(prefers-reduced-motion:no-preference){
 .nav nav button.active:before{animation:nav-icon-pop .3s cubic-bezier(.34,1.56,.64,1)}
 .nav>nav button{animation:nav-item-in .4s ease backwards}
 .nav>nav button:nth-child(1){animation-delay:.03s}
 .nav>nav button:nth-child(2){animation-delay:.08s}
 .nav>nav button:nth-child(3){animation-delay:.13s}
 .nav>nav button:nth-child(4){animation-delay:.18s}
 .nav>nav button:nth-child(5){animation-delay:.23s}
}
@keyframes nav-icon-pop{0%{transform:translateY(-50%) scale(1)}45%{transform:translateY(-50%) scale(1.18)}100%{transform:translateY(-50%) scale(1)}}
@keyframes nav-item-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* Scoreboard badges on the lab tabs: open repairs / due opening lines. */
.nav-badge{position:absolute;right:10px;top:50%;transform:translateY(-50%);min-width:18px;height:18px;padding:0 5px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:850;letter-spacing:0;color:#0b1018;background:var(--lab,#7cc7ff);box-shadow:0 2px 8px rgba(0,0,0,.35)}

/* ============ TODAY card: the momentum heart ============ */
.nav-daily-status{gap:6px;padding:8px}
.nav-daily-status b{font-size:15px;letter-spacing:-.02em}
.nav-daily-status span{font-size:11px}
.nav-daily-status i{height:6px}
.nav-daily-check{display:inline-block;margin-left:4px}
@media(prefers-reduced-motion:no-preference){.nav-daily-check{animation:check-spring .35s cubic-bezier(.34,1.56,.64,1)}}
@keyframes check-spring{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
.nav-daily-streak{display:flex;align-items:center;gap:6px}
.nav-daily-streak i{font-style:normal;font-size:13px;line-height:1}
.nav-daily-streak b{font-size:11px;color:#ffd968;font-weight:850;letter-spacing:.01em}
/* One hero CTA; a finished mission steps back as a proud green check. */
.nav-daily-actions button.primary{background:linear-gradient(180deg,rgba(240,180,41,.30),rgba(240,180,41,.10));border-color:rgba(240,180,41,.42);color:#ffeec2;box-shadow:0 8px 22px rgba(240,180,41,.14),inset 0 1px 0 rgba(255,255,255,.12)}
.nav-daily-actions button.primary:hover{background:linear-gradient(180deg,rgba(240,180,41,.38),rgba(240,180,41,.14))}
.nav-daily-actions button.done{background:rgba(16,185,129,.07);border-color:rgba(52,211,153,.24);color:#86dcb8;box-shadow:none;font-weight:760}
.nav-daily-actions button.done i{font-style:normal;margin-left:4px;color:#34d399}
@media(max-width:1050px){
 .nav-daily-status b{font-size:12px}
 .nav-daily-status i{height:5px}
 .nav-daily-streak{grid-column:1/-1}
}

/* Progress track: the empty remainder of the bar stays visible — "1/10" must
   read as one lit segment on a long road, that gap is the pull. */
.nav-daily-row u.nav-track{grid-column:1/3;display:block;height:6px;border-radius:999px;background:rgba(255,255,255,.09);overflow:hidden;text-decoration:none}
.nav-daily-row u.nav-track i{display:block;height:100%!important;border-radius:999px}
.nav-daily-check{color:#34d399}
@media(max-width:1050px){.nav-daily-row u.nav-track{height:5px}}

/* Payoff moment: a finished bar flips from gold (in progress) to green (done). */
.nav-daily-row.done u.nav-track i{background:linear-gradient(90deg,#0f9d6c,#34d399 60%,#7ee7b8)!important;box-shadow:0 0 9px rgba(52,211,153,.4)!important}
.nav-daily-actions button.done i{font-family:inherit;font-variant-emoji:text}

/* The generic ".nav-daily-status i" bar rule must not hit glyph <i>s (check,
   flame, button tick) — neutralize them, then style the check as a real coin. */
.nav-daily-actions button i,.nav-daily-streak i{height:auto!important;width:auto!important;background:none!important;box-shadow:none!important;display:inline!important;border-radius:0!important}
.nav-daily-actions button.done i{color:#34d399!important}
.nav-daily-check{display:inline-flex!important;align-items:center;justify-content:center;width:15px;height:15px!important;border-radius:999px!important;background:linear-gradient(180deg,#34d399,#0f9d6c)!important;box-shadow:0 0 8px rgba(52,211,153,.45)!important;color:#06281b!important;font-size:10px;font-weight:900;vertical-align:middle}

/* Fix-up after live review: the active rail + mobile !important block were
   still hardcoded blue and swamped the lab identity colors. */
.nav nav button[data-view="past"]{--lab:#b9cdea}
.nav nav button.active:after{background:var(--lab,#0a84ff);box-shadow:0 0 10px var(--lab,#0a84ff)}
.nav nav button.active:before{filter:drop-shadow(0 0 3px var(--lab)) drop-shadow(0 0 9px var(--lab))}
.nav nav button.active[data-view="past"]{background:linear-gradient(90deg,rgba(185,205,234,.17),transparent 78%);border-color:rgba(185,205,234,.22)}
@media(max-width:1050px){
 .nav>nav:not(.mobile-app-nav) button.active[data-view="past"]{background:linear-gradient(180deg,rgba(185,205,234,.24),rgba(185,205,234,.07))!important;box-shadow:0 0 0 1px rgba(185,205,234,.22),inset 0 1px 0 rgba(255,255,255,.10)!important}
 .nav>nav:not(.mobile-app-nav) button.active[data-view="discovery"]{background:linear-gradient(180deg,rgba(45,212,191,.24),rgba(45,212,191,.07))!important;box-shadow:0 0 0 1px rgba(45,212,191,.24),inset 0 1px 0 rgba(255,255,255,.10)!important}
 .nav>nav:not(.mobile-app-nav) button.active[data-view="learning"]{background:linear-gradient(180deg,rgba(255,138,92,.24),rgba(255,138,92,.07))!important;box-shadow:0 0 0 1px rgba(255,138,92,.24),inset 0 1px 0 rgba(255,255,255,.10)!important}
 .nav>nav:not(.mobile-app-nav) button.active[data-view="analysis"]{background:linear-gradient(180deg,rgba(124,199,255,.24),rgba(124,199,255,.07))!important;box-shadow:0 0 0 1px rgba(124,199,255,.24),inset 0 1px 0 rgba(255,255,255,.10)!important}
 .nav>nav:not(.mobile-app-nav) button.active[data-view="opening-trainer"]{background:linear-gradient(180deg,rgba(240,180,41,.24),rgba(240,180,41,.07))!important;box-shadow:0 0 0 1px rgba(240,180,41,.24),inset 0 1px 0 rgba(255,255,255,.10)!important}
}

/* TODAY card moves up under the nav — momentum belongs in the first glance,
   not at the end of an empty hallway. The knight keeps the floor. */
.nav-auth-state{margin-top:6px;flex:1;display:flex;flex-direction:column;gap:9px;min-height:0}
.nav-auth-state .account-card{margin-top:auto}

/* Badges on the compact mobile strip too — it is a separate nav element. */
.mobile-app-nav button{overflow:visible!important;position:relative}
.mobile-app-nav .nav-badge{right:5px;top:3px;transform:none;min-width:15px;height:15px;padding:0 4px;font-size:9px;background:#ff8a5c}
.mobile-app-nav [data-mobile-view="opening-trainer"] .nav-badge{background:#f0b429}
.mobile-app-nav button .nav-badge{display:inline-flex!important}

/* Landing hero video: sits between the still image (below) and the fog +
   darkening layers (above), so the text treatment stays identical. Fades in
   once it actually plays; plays once and freezes on its final frame. */
.landing-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s ease}
.landing-video.on{opacity:1}
@media(prefers-reduced-motion:reduce){.landing-video{display:none}}

/* The gold-shine sweep belongs to progress bars only — never to the glyph
   icons (flame, check) that also live inside the TODAY card. */
.nav-daily-actions button i:after,.nav-daily-streak i:after,.nav-daily-check:after{content:none!important;animation:none!important}

/* Rating-pool selector sits next to the range control in the trend head. */
.trend-class-control{margin-right:6px}
.trend-class-control button{text-transform:none;letter-spacing:0}

/* "Lab analysis building" strip: a new profile sees WHY the Mistake Lab is
   still sparse and watches the material grow instead of staring at a void. */
.lab-build-banner{display:grid;gap:8px;margin-top:12px;padding:12px 14px;border:1px solid rgba(125,211,252,.22);border-radius:14px;background:linear-gradient(135deg,rgba(10,132,255,.10),rgba(255,255,255,.03) 60%)}
.lab-build-copy{display:grid;gap:2px}
.lab-build-copy span{font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.09em;color:#7cc7ff}
.lab-build-copy b{font-size:15px;letter-spacing:-.01em}
.lab-build-copy p{margin:0;color:var(--muted);font-size:12px;line-height:1.4}
.lab-build-bar{height:6px;border-radius:999px;background:rgba(255,255,255,.09);overflow:hidden}
.lab-build-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#0a84ff,#7dd3fc);box-shadow:0 0 8px rgba(10,132,255,.4);transition:width .6s ease}

/* ===== Logged-in welcome screen: one hero, live hook, calm secondary ===== */
/* P4 — the wordmark steps back so "Welcome back, <name>." is the first beat. */
body.lab-welcome .landing-brand .landing-wordmark{width:clamp(170px,15vw,210px);opacity:.7;transition:opacity .3s ease}
body.lab-welcome .landing-brand small{opacity:.62}

/* P3 — tighter, composed card; the hero can breathe without a tall void. */
body.lab-welcome:not(.lab-managing) .landing-card.logged-in-entry{padding:30px 38px 24px}
body.lab-welcome:not(.lab-managing) .landing-card.logged-in-entry h1{margin:0 auto 10px}

/* The biggest win — the status hook replaces the slogan when logged in. */
.landing-card.logged-in-entry>p.welcome-status{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;max-width:none;margin:0 auto 22px;font-size:15px;font-weight:600;color:#d7e2f0}
.welcome-status .ws-flame{display:inline-flex;align-items:center;gap:6px;color:#ffd968;font-weight:850;letter-spacing:.005em}
.welcome-status .ws-flame i{font-style:normal;line-height:1}
.welcome-status .ws-count{color:#ff9d6b;font-weight:850;font-variant-numeric:tabular-nums}
.welcome-status .ws-sep{opacity:.35;font-weight:400}
@media(prefers-reduced-motion:no-preference){
  .welcome-status .ws-flame i{display:inline-block;animation:ws-flame-pop .5s cubic-bezier(.34,1.56,.64,1)}
}
@keyframes ws-flame-pop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.18)}100%{transform:scale(1)}}

/* P2 — clean gold fill; blue lives in the GLOW, not the gradient. No mud. */
.landing-card.logged-in-entry .enter-lab-cta{
  margin:0 auto 12px;height:60px;font-size:17px;font-weight:850;color:#1c1406;letter-spacing:-.01em;
  background:linear-gradient(135deg,#b7791f,#f0b429 52%,#ffd968);
  border:1px solid rgba(255,224,140,.55);
  box-shadow:0 20px 52px rgba(10,132,255,.30),0 14px 40px rgba(240,180,41,.30),inset 0 1px 0 rgba(255,255,255,.5);
  position:relative;overflow:hidden;transition:transform .12s ease,box-shadow .2s ease;
}
.landing-card.logged-in-entry .enter-lab-cta:hover{transform:translateY(-1px);box-shadow:0 24px 60px rgba(10,132,255,.38),0 16px 46px rgba(240,180,41,.38),inset 0 1px 0 rgba(255,255,255,.55)}
.landing-card.logged-in-entry .enter-lab-cta:active{transform:scale(.985)}
.landing-card.logged-in-entry .enter-lab-cta:after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 32%,rgba(255,255,255,.5) 50%,transparent 68%);transform:translateX(-130%);pointer-events:none}
@media(prefers-reduced-motion:no-preference){
  .landing-card.logged-in-entry .enter-lab-cta:hover:after{animation:hero-shine 1.1s ease}
}
@keyframes hero-shine{to{transform:translateX(130%)}}

/* P1 — "Analyze another player" becomes a quiet second-tier outline button. */
body.lab-welcome:not(.lab-managing) #toggleOtherPlayer{display:block;width:100%;max-width:620px;margin:0 auto 16px;height:48px;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);color:#cdd8e6;font-size:14px;font-weight:700;box-shadow:none}
body.lab-welcome:not(.lab-managing) #toggleOtherPlayer:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.22);transform:none}

/* P1 — Manage / Logout shrink to calm text links under the fold. */
body.lab-welcome:not(.lab-managing) .auth-card.logged-in-welcome{margin:2px auto 0;padding:0;background:transparent;border:0;box-shadow:none}
body.lab-welcome:not(.lab-managing) .auth-card.logged-in-welcome .auth-actions{display:flex;justify-content:center;gap:4px}
body.lab-welcome:not(.lab-managing) .auth-card.logged-in-welcome .auth-actions button{min-width:0;width:auto;height:auto;padding:5px 10px;border:0;border-radius:8px;background:transparent;box-shadow:none;color:#8b97a7;font-size:12.5px;font-weight:650}
body.lab-welcome:not(.lab-managing) .auth-card.logged-in-welcome .auth-actions button:hover{color:#cdd8e6;background:rgba(255,255,255,.06);transform:none}

/* Calm stage behind the welcome/landing card: a wide soft dark halo hugs the
   card so the bright pieces at its left/right edges (knight, fallen queen)
   recede into shadow instead of crowding the text. No new asset needed. */
.landing-card{box-shadow:0 36px 110px rgba(0,0,0,.62),0 0 150px 105px rgba(3,4,6,.72),0 0 90px rgba(180,125,35,.06)}
/* Slightly deepen the center of the backdrop so the area around the card reads
   as a dark stage, while the far edges of the board stay cinematic. */
.landing:before{background:radial-gradient(ellipse 64% 60% at 50% 56%,rgba(3,4,6,.74),rgba(3,4,6,.34) 42%,transparent 70%),linear-gradient(180deg,rgba(0,0,0,.30),rgba(3,4,6,.62)),radial-gradient(circle at 50% 12%,rgba(180,125,35,.16),transparent 31%),radial-gradient(circle at 74% 0%,rgba(10,132,255,.17),transparent 34%),linear-gradient(90deg,rgba(0,0,0,.42),transparent 25%,transparent 75%,rgba(0,0,0,.44))}

/* Lighter, clearer sides: pull the dark halo in tight to the card and ease the
   left/right edge darkening so the hero pieces (knight, fallen queen) read
   clearly instead of sinking into shadow. Center stays calm for the text. */
.landing-card{box-shadow:0 36px 110px rgba(0,0,0,.6),0 0 80px 34px rgba(3,4,6,.5),0 0 90px rgba(180,125,35,.06)}
.landing:before{background:radial-gradient(ellipse 52% 52% at 50% 56%,rgba(3,4,6,.58),rgba(3,4,6,.2) 44%,transparent 72%),linear-gradient(180deg,rgba(0,0,0,.22),rgba(3,4,6,.5)),radial-gradient(circle at 50% 12%,rgba(180,125,35,.16),transparent 31%),radial-gradient(circle at 74% 0%,rgba(10,132,255,.15),transparent 34%),linear-gradient(90deg,rgba(0,0,0,.16),transparent 22%,transparent 78%,rgba(0,0,0,.17))}

/* Phones get the dedicated portrait composition (pieces top & bottom, calm
   middle) so nothing is cropped; the landscape still/loop would crop the hero
   pieces out of a tall viewport. */
@media(max-width:700px){
 .landing-bg:before{background:url("assets/landing-duel-still-portrait.jpg") center/cover no-repeat}
}