:root{--text:#4b5160;--text-h:#14161c;--text-muted:#7b8190;--bg:#f4f5f7;--panel-bg:#fff;--border:#e1e3e8;--accent:#2f6f4f;--accent-bg:#2f6f4f1a;--accent-rgb:47, 111, 79;--danger:#c23b3b;--success:#2f7a4f;--info:#2657a3;--info-bg:#d6e6fb;--info-rgb:38, 87, 163;--white-side:#3a7fc9;--white-side-bg:#e2eefb;--black-side:#1e3f70;--black-side-bg:#dde5f0;--tier-bronze:#a5651e;--tier-bronze-bg:#f3e3d0;--tier-silver:#6b7280;--tier-silver-bg:#e7e9ec;--tier-gold:#b8860b;--tier-gold-bg:#f8ecc7;--tier-diamond:#1f9ec9;--tier-diamond-bg:#d8f3fb;--shadow:#14161c14 0 4px 16px -4px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, "SF Mono", Consolas, monospace;font:15px/1.5 var(--sans);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root[data-theme=dark]{--text:#b8bcc6;--text-h:#f0f1f4;--text-muted:#888e9c;--bg:#14151a;--panel-bg:#1b1d24;--border:#2b2e38;--accent:#5cbf8a;--accent-bg:#5cbf8a1f;--accent-rgb:92, 191, 138;--danger:#e17070;--success:#5cbf8a;--info:#8fb8f4;--info-bg:#7aa7e842;--info-rgb:143, 184, 244;--white-side:#9ccbf5;--white-side-bg:#9ccbf529;--black-side:#5c86d6;--black-side-bg:#5c86d638;--tier-bronze:#d99a5c;--tier-bronze-bg:#d99a5c2e;--tier-silver:#b8bfc9;--tier-silver-bg:#b8bfc929;--tier-gold:#f0c948;--tier-gold-bg:#f0c94833;--tier-diamond:#6fe3ff;--tier-diamond-bg:#6fe3ff38;--shadow:#0006 0 4px 16px -4px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{min-height:100svh;margin:0}#root{min-height:100svh}h1,h2,h3{font-family:var(--sans);color:var(--text-h);margin:0;font-weight:600}p{margin:0}button{cursor:pointer;font-family:inherit}.skill-map{max-width:1100px;min-height:100svh;margin:0 auto;padding:24px}.skill-map .how-to-use{margin-bottom:20px}.skill-map-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:28px;display:flex}.skill-map-header h1{font-size:22px}.skill-map-subtitle{color:var(--text-muted);max-width:46ch;margin-top:6px;font-size:13px;line-height:1.5}.skill-map-rank{text-align:right;background:var(--panel-bg);border:1px solid var(--border);border-radius:10px;flex-shrink:0;padding:10px 16px}.skill-map-rank-title{color:var(--accent);font-size:15px;font-weight:700}.skill-map-rank-points{color:var(--text-muted);margin-top:2px;font-size:12px}.skill-map-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px;display:grid}.constellation-card{background:var(--panel-bg);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:12px;flex-direction:column;align-items:center;padding:18px 14px 20px;display:flex}.constellation-node{border:2px solid var(--border);background:var(--bg);width:40px;height:40px;color:var(--text-muted);font-family:var(--mono);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:11px;transition:border-color .15s,background-color .15s,box-shadow .15s;display:flex;position:relative}.constellation-capstone{cursor:default;font-size:16px}.constellation-node-bronze{border-color:var(--tier-bronze);background:var(--tier-bronze-bg);color:var(--tier-bronze);box-shadow:0 0 10px 1px rgba(var(--accent-rgb), .15)}.constellation-node-silver{border-color:var(--tier-silver);background:var(--tier-silver-bg);color:var(--tier-silver);box-shadow:0 0 12px 2px rgba(var(--accent-rgb), .2)}.constellation-node-gold{border-color:var(--tier-gold);background:var(--tier-gold-bg);color:var(--tier-gold);box-shadow:0 0 14px 3px #f0c94866}.constellation-node-diamond{border-color:var(--tier-diamond);background:var(--tier-diamond-bg);color:var(--tier-diamond);box-shadow:0 0 18px 4px #6fe3ff80}.constellation-node-badge{background:var(--panel-bg);border:1px solid;border-radius:999px;padding:0 4px;font-size:9px;font-weight:700;line-height:1.4;position:absolute;bottom:-6px;right:-8px}.constellation-connector{background:var(--border);width:1px;height:16px}.constellation-family{color:var(--text-h);text-align:center;margin:6px 0 16px;font-size:13px;font-weight:600}.constellation-lines{flex-wrap:wrap;justify-content:center;gap:16px;padding-top:16px;display:flex;position:relative}.constellation-lines:before{content:"";background:var(--border);height:1px;position:absolute;top:0;left:12%;right:12%}.constellation-node-wrap{flex-direction:column;align-items:center;width:64px;padding-top:12px;display:flex;position:relative}.constellation-node-wrap:before{content:"";background:var(--border);width:1px;height:12px;position:absolute;top:0;left:50%}.constellation-node-label{color:var(--text-muted);text-align:center;margin-top:6px;font-size:10.5px;line-height:1.3}.tour-overlay{z-index:200;position:fixed;inset:0}.tour-spotlight{border:2px solid var(--accent);pointer-events:none;border-radius:14px;transition:top .25s,left .25s,width .25s,height .25s;position:fixed;box-shadow:0 0 0 9999px #000000b8}.tour-tooltip{background:var(--panel-bg);border:1px solid var(--border);width:320px;max-width:calc(100vw - 32px);box-shadow:var(--shadow);border-radius:12px;padding:16px;transition:top .25s,bottom .25s,left .25s;position:fixed}.tour-step-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin-bottom:6px;font-size:11px}.tour-title{margin-bottom:8px;font-size:16px}.tour-body{color:var(--text);font-size:13px;line-height:1.5}.tour-actions{justify-content:space-between;align-items:center;margin-top:16px;display:flex}.tour-skip{color:var(--text-muted);background:0 0;border:none;padding:6px 4px;font-size:12.5px}.tour-skip:hover{color:var(--text-h)}.tour-next{background:var(--accent);color:var(--panel-bg);border:none;border-radius:8px;padding:8px 16px;font-size:13px;font-weight:700}.view-switcher{background:var(--panel-bg);border-bottom:1px solid var(--border);z-index:10;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 20px;display:flex;position:sticky;top:0}.view-switcher button{border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:8px;padding:6px 14px;font-size:13px;font-weight:600}.view-switcher button:hover{border-color:var(--accent)}.view-switcher button.view-switcher-active{background:var(--accent);color:var(--panel-bg);border-color:var(--accent)}.app-shell{grid-template-columns:300px minmax(0,1fr) 320px;align-items:start;gap:20px;min-height:100svh;padding:20px;display:grid}.how-to-use{background:var(--info-bg);border:1px solid var(--info);border-radius:10px;grid-column:1/-1;justify-content:space-between;align-items:center;gap:16px;padding:10px 14px;display:flex}.how-to-use-text{color:var(--text-h);font-size:13px;line-height:1.5}.how-to-use-dismiss{width:24px;height:24px;color:var(--info);background:0 0;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;font-size:18px;line-height:1;display:flex}.how-to-use-dismiss:hover{background:rgba(var(--info-rgb), .18)}.how-to-use-inline{grid-column:unset;background:0 0;border:none;border-radius:0;flex:260px;gap:10px;min-width:0;padding:0}.how-to-use-inline .how-to-use-text{color:var(--text-muted);font-size:12.5px}.how-to-use-inline .how-to-use-dismiss{color:var(--text-muted)}.how-to-use-inline .how-to-use-dismiss:hover{background:var(--accent-bg);color:var(--text-h)}.sidebar{background:var(--panel-bg);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:12px;flex-direction:column;gap:12px;max-height:calc(100svh - 40px);padding:16px;display:flex;position:sticky;top:20px}.sidebar-header-row{justify-content:space-between;align-items:center;gap:8px;display:flex}.sidebar-header h1{font-size:18px}.sidebar-subtitle{color:var(--text-muted);margin-top:4px;font-size:13px}.sidebar-header-toggles{flex-shrink:0;align-items:center;gap:6px;display:flex}.theme-toggle,.language-toggle{border:1px solid var(--border);background:var(--bg);width:30px;height:30px;color:var(--text-h);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.language-toggle{letter-spacing:.02em;font-size:11px;font-weight:700}.theme-toggle:hover,.language-toggle:hover{border-color:var(--accent);color:var(--accent)}.finder-trigger{border:1px solid var(--border);background:var(--accent-bg);width:100%;color:var(--accent);text-align:center;border-radius:8px;padding:9px 10px;font-size:13px;font-weight:600}.finder-trigger:hover{border-color:var(--accent)}.search-input{border:1px solid var(--border);background:var(--bg);width:100%;color:var(--text-h);border-radius:8px;padding:8px 10px;font-size:13px}.search-input:focus{outline:2px solid var(--accent);outline-offset:-1px}.opening-list{flex:1;overflow-y:auto}.opening-group-title{text-transform:uppercase;letter-spacing:.06em;color:var(--text-h);margin:14px 0 6px;padding-left:4px;font-size:11px}.opening-group:first-child .opening-group-title{margin-top:0}.opening-list ul{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex}.opening-item{width:100%;color:var(--text);text-align:left;background:0 0;border:none;border-radius:8px;align-items:center;gap:8px;padding:7px 8px;font-size:13px;display:flex}.opening-item:hover{background:var(--accent-bg)}.opening-item-active,.opening-item-active:hover{background:var(--accent);color:var(--panel-bg);font-weight:700}.opening-eco{font-family:var(--mono);color:var(--text-muted);min-width:28px;font-size:11px}.opening-item-active .opening-eco{color:var(--panel-bg);opacity:.85}.opening-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.opening-mastered{color:var(--success);font-size:12px}.opening-item-active .opening-mastered{color:var(--panel-bg)}.empty-state{color:var(--text-muted);padding:8px 4px;font-size:13px}.board-column{justify-content:center;align-items:flex-start;padding-top:8px;display:flex}.board-wrap{aspect-ratio:1;width:min(100%,640px);box-shadow:var(--shadow);border:1px solid var(--border);border-radius:8px;overflow:hidden}.board-shake{animation:.32s shake}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.info-panel{flex-direction:column;gap:14px;display:flex;position:sticky;top:20px}.info-card{background:var(--panel-bg);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:12px;padding:16px}.info-card h2{font-size:17px}.info-eco{font-family:var(--mono);color:var(--text-muted);margin-top:4px;font-size:12px}.opening-name-wrap{display:inline-block;position:relative}.opening-name-wrap h2{cursor:help;border-bottom:1px dashed var(--text-muted);width:fit-content}.opening-description-tooltip{background:var(--panel-bg);border:1px solid var(--border);width:max-content;max-width:260px;box-shadow:var(--shadow);color:var(--text);opacity:0;visibility:hidden;z-index:20;pointer-events:none;border-radius:8px;margin-top:8px;padding:10px 12px;font-size:12.5px;line-height:1.5;transition:opacity .15s,transform .15s,visibility .15s;position:absolute;top:100%;left:0;transform:translateY(-4px)}.opening-name-wrap:hover .opening-description-tooltip,.opening-name-wrap:focus-visible .opening-description-tooltip{opacity:1;visibility:visible;transform:translateY(0)}.move-purpose{background:var(--info-bg);border-left:4px solid var(--info);transition:background-color .6s,box-shadow .6s}.move-purpose .moves-title{color:var(--info);font-size:12.5px;font-weight:700}.move-purpose-flash{background:var(--accent-bg);border-left-color:var(--accent);transition:none}.move-purpose-text{color:var(--text-h);font-size:13.5px;font-weight:500;line-height:1.5}.move-purpose-attention{animation:3.2s ease-in-out infinite move-purpose-pulse}@keyframes move-purpose-pulse{0%,to{background-color:var(--info-bg);border-left-color:var(--info);box-shadow:var(--shadow), 0 0 0 0 rgba(var(--info-rgb), 0)}50%{background-color:rgba(var(--accent-rgb), .4);border-left-color:var(--accent);box-shadow:var(--shadow), 0 0 24px 6px rgba(var(--accent-rgb), .65)}}@media (prefers-reduced-motion:reduce){.move-purpose-attention{animation:none}}.control-row{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.control-row:last-of-type{margin-bottom:14px}.control-label{color:var(--text-muted);font-size:13px}.segmented{border:1px solid var(--border);border-radius:8px;display:flex;overflow:hidden}.segmented button{color:var(--text);background:0 0;border:none;padding:6px 12px;font-size:12px;transition:background-color .15s,color .15s}.segmented button+button{border-left:1px solid var(--border)}.segmented button.segmented-active{background:var(--accent);color:var(--panel-bg);font-weight:700}.segmented-active+button,button+.segmented-active{border-left-color:#0000}.button-row{gap:8px;display:flex}.button-row:not(:first-child){margin-top:12px}.secondary-button{border:1px solid var(--border);background:var(--bg);color:var(--text-h);border-radius:8px;flex:1;padding:8px;font-size:13px}.secondary-button:hover:not(:disabled){border-color:var(--accent)}.secondary-button:disabled{opacity:.45;cursor:not-allowed}.status-card{min-height:20px}.progress-track{background:var(--border);border-radius:3px;height:5px;overflow:hidden}.progress-fill{background:var(--accent);height:100%;transition:width .25s}.progress-label{color:var(--text-muted);margin:6px 0 10px;font-size:11px}.status-line{color:var(--text-h);font-size:13px}.status-done{color:var(--success);font-weight:600}.hint-line{color:var(--accent);margin-top:8px;font-size:12px}.hint-line-muted{color:var(--text-muted)}.extend-offer{border-top:1px dashed var(--border);margin-top:12px;padding-top:12px}.extend-offer-text{color:var(--text-muted);margin-bottom:8px;font-size:12px}.moves-title{text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin-bottom:8px;font-size:12px}.moves-list{font-family:var(--mono);color:var(--text);word-break:break-word;font-size:12.5px;line-height:1.7}.strategy-text{color:var(--text);font-size:13px;line-height:1.6}.strategy-card-white{background:var(--white-side-bg);border-left:4px solid var(--white-side)}.strategy-card-white .moves-title{color:var(--white-side)}.strategy-card-black{background:var(--black-side-bg);border-left:4px solid var(--black-side)}.strategy-card-black .moves-title{color:var(--black-side)}.finder-overlay{z-index:100;background:#00000080;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.finder-modal{background:var(--panel-bg);border:1px solid var(--border);width:min(480px,100%);max-height:80vh;box-shadow:var(--shadow);border-radius:12px;padding:22px;overflow-y:auto}.finder-header{justify-content:space-between;align-items:center;display:flex}.finder-close{width:28px;height:28px;color:var(--text-muted);background:0 0;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;font-size:20px;line-height:1;display:flex}.finder-close:hover{background:var(--accent-bg);color:var(--text-h)}.finder-step{text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin-top:16px;font-size:12px}.finder-question{margin-top:6px;margin-bottom:16px;font-size:18px}.finder-options{flex-direction:column;gap:8px;display:flex}.finder-option{text-align:left;border:1px solid var(--border);background:var(--bg);width:100%;color:var(--text-h);border-radius:8px;padding:12px 14px;font-size:14px}.finder-option:hover{border-color:var(--accent);background:var(--accent-bg)}.finder-back{border:1px solid var(--border);color:var(--text-muted);background:0 0;border-radius:8px;margin-top:18px;padding:8px 12px;font-size:13px}.finder-back:hover{color:var(--text-h);border-color:var(--accent)}.finder-results{flex-direction:column;gap:10px;margin:12px 0 0;padding:0;list-style:none;display:flex}.finder-result-card{border:1px solid var(--border);border-radius:10px;justify-content:space-between;align-items:center;gap:14px;padding:12px 14px;display:flex}.finder-result-card .secondary-button{flex:none}.finder-result-eco{font-family:var(--mono);color:var(--text-muted);font-size:11px}.finder-result-name{color:var(--text-h);margin-top:2px;font-size:14px;font-weight:600}.finder-result-desc{color:var(--text);margin-top:4px;font-size:12px;line-height:1.4}.finder-no-match{color:var(--text-muted);margin-top:12px;font-size:13px}@media (width<=1100px){.app-shell{grid-template-columns:240px minmax(0,1fr) 280px}}@media (width<=860px){.app-shell{grid-template-columns:1fr}.sidebar,.info-panel{max-height:none;position:static}.board-column{order:-1}.how-to-use{order:-2}}