:root{color:#e2e8f0;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#0b1220;font-family:Inter,Segoe UI,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}html,body,#root{height:100%;min-height:100%;margin:0}body{background:#0b1220;min-height:100vh}button,input,textarea,select{font:inherit}.app-shell{box-sizing:border-box;color:#ebf2ff;background:radial-gradient(circle at top,#5aa6ff2e,#0000 35%),linear-gradient(#0e1726 0%,#101a2d 100%);grid-template-columns:1.4fr .8fr;gap:2rem;min-height:100vh;padding:4rem 5vw;display:grid}.hero-panel,.status-panel{background:#0f172acc;border:1px solid #94a3b833;border-radius:24px;padding:2rem;box-shadow:0 20px 50px #0f172a73}.brand-row{gap:.75rem;margin-bottom:1.5rem;display:flex}.chip{color:#dbeafe;letter-spacing:.08em;text-transform:uppercase;background:#3b82f62e;border:1px solid #60a5fa80;border-radius:999px;align-items:center;padding:.45rem .8rem;font-size:.8rem;font-weight:700;display:inline-flex}.chip.muted{color:#cbd5e1;background:#94a3b81f;border-color:#94a3b840}.hero-panel h1{letter-spacing:-.06em;margin:0 0 1rem;font-size:clamp(2.5rem,4vw,4.5rem);line-height:1.05}.subtitle{color:#cbd5e1;max-width:38rem;margin-bottom:2rem;font-size:1.1rem}.cta-row{flex-wrap:wrap;gap:1rem;margin-bottom:1rem;display:flex}.progress-summary{grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;margin:1rem 0 1.5rem;display:grid}.summary-card,.status-card{background:#0f172ab8;border:1px solid #94a3b82e;border-radius:16px;padding:.85rem .9rem}.summary-card span,.status-card .label{letter-spacing:.08em;text-transform:uppercase;color:#93c5fd;margin-bottom:.4rem;font-size:.7rem;display:block}.summary-card strong,.status-card strong{color:#f8fafc;font-size:1.2rem}.status-card p{color:#cbd5e1;margin:.45rem 0 0;line-height:1.45}.auth-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;display:flex}.user-badge{color:#e2e8f0;background:#0f172ab3;border:1px solid #94a3b833;border-radius:999px;align-items:center;gap:.7rem;padding:.45rem .8rem;display:inline-flex}.avatar{object-fit:cover;border:1px solid #94a3b84d;border-radius:50%;width:1.8rem;height:1.8rem}.primary-button,.secondary-button{cursor:pointer;border:none;border-radius:12px;padding:.9rem 1.4rem;font-size:1rem;font-weight:700}.primary-button{color:#071521;background:linear-gradient(135deg,#60a5fa,#22c55e)}.secondary-button{color:#e2e8f0;background:0 0;border:1px solid #94a3b859}.opening-list{gap:1rem;margin-top:1rem;display:grid}.opening-card{width:100%;color:inherit;text-align:left;cursor:pointer;background:#0f172ab3;border:1px solid #94a3b829;border-radius:16px;padding:1rem 1.1rem;transition:border-color .2s,transform .2s,box-shadow .2s}.opening-card:hover,.opening-card.selected{border-color:#60a5fa80;transform:translateY(-1px);box-shadow:0 16px 30px #2563eb1f}.opening-header{justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:.75rem;display:flex}.eco-tag{letter-spacing:.08em;text-transform:uppercase;color:#bfdbfe;margin-bottom:.35rem;font-size:.72rem;display:inline-block}.opening-card h3,.detail-panel h3{margin:0;font-size:1.2rem}.difficulty-pill,.move-pill,.tag-pill{border-radius:999px;align-items:center;padding:.3rem .6rem;font-size:.72rem;font-weight:700;display:inline-flex}.difficulty-pill{color:#bbf7d0;background:#22c55e24;border:1px solid #22c55e59}.opening-card p,.detail-panel p{color:#cbd5e1;margin:0 0 .75rem}.moves-row,.tags-row{flex-wrap:wrap;gap:.5rem;display:flex}.moves-row{margin-bottom:.75rem}.move-pill{color:#dbeafe;background:#60a5fa1f;border:1px solid #60a5fa40}.move-pill.complete{color:#bbf7d0;background:#22c55e24;border-color:#22c55e59}.move-pill.current{color:#fde68a;background:#fbbf2429;border-color:#fbbf2461}.tag-pill{color:#e2e8f0;background:#94a3b81a;border:1px solid #94a3b840}.status-row{border-top:1px solid #94a3b82e;justify-content:space-between;align-items:center;gap:1rem;margin-top:1rem;padding-top:.8rem;display:flex}.status-label{color:#cbd5e1;letter-spacing:.08em;text-transform:uppercase;font-size:.72rem}.detail-panel{background:#0f172a94;border:1px solid #94a3b829;border-radius:16px;padding:1rem}.detail-header{margin-bottom:.8rem}.detail-section{gap:.55rem;margin-top:1rem;display:grid}.board-shell{gap:.9rem;margin-top:.25rem;display:grid}.board-meta{background:#0f172ab8;border:1px solid #94a3b82e;border-radius:16px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;padding:.85rem;display:flex}.board-meta strong{color:#f8fafc;font-size:1.02rem}.board-grid{aspect-ratio:1;border:1px solid #94a3b833;border-radius:18px;grid-template-columns:repeat(8,1fr);width:min(100%,38rem);display:grid;overflow:hidden;box-shadow:0 20px 40px #0f172a47}.board-square{cursor:pointer;width:100%;min-width:0;height:100%;min-height:0;font:inherit;aspect-ratio:1;border:0;place-items:center;padding:0;display:grid;position:relative;overflow:hidden}.board-square.light{background:#e8d9bf}.board-square.dark{background:#9d6b44}.board-square.selected{outline-offset:-3px;outline:3px solid #fbbf24e6}.square-label{color:#0f172a73;-webkit-user-select:none;user-select:none;font-size:.62rem;font-weight:700;position:absolute;top:.28rem;left:.32rem}.board-square.dark .square-label{color:#fff8f073}.piece{text-shadow:0 2px 6px #0000002e;pointer-events:none;font-size:clamp(1.8rem,4.8vw,2.6rem);line-height:1;position:relative;transform:translateZ(0)}.piece-w{color:#f8fafc}.piece-b{color:#111827}.move-trace{flex-wrap:wrap;gap:.5rem;display:flex}.practice-hint{margin-bottom:.2rem}.practice-feedback{color:#bfdbfe;margin:0}.label{letter-spacing:.08em;text-transform:uppercase;color:#93c5fd;font-size:.72rem;font-weight:700}.progress-actions{flex-wrap:wrap;gap:.5rem;display:flex}.progress-button{color:#e2e8f0;cursor:pointer;text-transform:capitalize;background:0 0;border:1px solid #94a3b840;border-radius:999px;padding:.45rem .75rem}.progress-button.active{color:#dbeafe;background:#60a5fa2e;border-color:#60a5fa8c}.secondary-button.small{padding:.6rem .9rem;font-size:.9rem}.margin-top{margin-top:1.2rem}.status-panel h2{margin-top:0;margin-bottom:1.25rem;font-size:1.2rem}.status-line{align-items:center;gap:.6rem;margin-bottom:1.2rem;font-size:1.2rem;display:flex}.dot{background:#22c55e;border-radius:50%;width:.7rem;height:.7rem;box-shadow:0 0 15px #22c55ee6}.status-list{gap:.9rem;margin:0;padding:0;list-style:none;display:grid}.status-list li{color:#cbd5e1;border-bottom:1px solid #94a3b82e;justify-content:space-between;gap:1rem;padding-bottom:.7rem;display:flex}.status-list strong{color:#f8fafc;text-align:right}.status{color:#dbeafe;margin:0}.status.error{color:#fca5a5}.status.loading{color:#cbd5e1}@media (width<=800px){.app-shell{grid-template-columns:1fr;padding:1.5rem}.progress-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-panel,.status-panel{padding:1.25rem}.board-grid{width:100%}}