@import "https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@300;400;500;600;700;900&family=Noto+Sans+KR:wght@300;400;500;600;700&display=swap";:root{--c-espresso:#2d241e;--c-espresso-mid:#3d322a;--c-kaya:#d4a373;--c-kaya-br:#e9c46a;--c-jade:#527853;--c-jade-br:#8ea68e;--c-cream:#fefae0;--c-cream-dark:#faedcd;--c-gold:#bc6c25;--c-text-main:#2d241e;--c-text-muted:#6b5e55;--color-bg:var(--c-cream);--color-ink:var(--c-espresso);--color-board:#e9c46a;--color-board-line:#2d241eb3;--color-nav:var(--c-espresso);--color-nav-text:var(--c-cream);--color-panel:#faedcdd9;--color-panel-border:#bc6c2533;--color-panel-inner:#ffffff4d;--color-accent:var(--c-jade);--color-accent-dark:#3a5a40;--color-text:var(--c-text-main);--color-text-muted:var(--c-text-muted);--color-danger:#bc4749;--color-recommend:var(--c-jade);--side-panel-width:340px;--navbar-height:52px;--glass-bg:#faedcdb3;--glass-border:#bc6c2526;--glass-blur:blur(12px);--shadow-premium:0 10px 40px #2d241e26, 0 2px 10px #2d241e0d}@keyframes floatUpAndFade{0%{opacity:0;transform:translate(-50%,-10%)}20%{opacity:1;transform:translate(-50%,-50%)}80%{opacity:1;transform:translate(-50%,-120%)}to{opacity:0;transform:translate(-50%,-150%)}}[data-theme=dark]{--color-bg:#1a120b;--color-ink:var(--c-espresso);--color-board:#3d2b1f;--color-board-line:#e9c46a33;--color-nav:#120b06;--color-nav-text:var(--c-cream-dark);--color-panel:#1a120bd9;--color-panel-border:#e9c46a1a;--color-panel-inner:#0003;--color-accent:var(--c-jade-br);--color-accent-dark:var(--c-jade);--color-text:var(--c-cream-dark);--color-text-muted:#8e7d73;--glass-bg:#1a120bbf;--glass-border:#e9c46a1a}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--color-bg:var(--c-ink);--color-ink:var(--c-ink);--color-nav:#0a1008f7;--color-nav-text:var(--c-text-dark);--color-panel:#12190ef7;--color-panel-border:#5eac7826;--color-panel-inner:#00000040;--color-text:var(--c-text-dark);--color-text-muted:var(--c-text-sub)}}#shadow-canvas,#board-canvas,canvas.ShadowLayer,canvas.StoneLayer{top:0;left:0;position:absolute!important}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--color-bg);color:var(--color-text);font-family:Noto Sans KR,system-ui,sans-serif;overflow:hidden}.app-container{flex-direction:column;height:100vh;display:flex;overflow:hidden}.main-layout{flex-direction:row;flex:1;min-height:0;display:flex;position:relative;overflow:hidden}.side-panel-container{width:var(--side-panel-width)}.board-premium-frame{background:linear-gradient(135deg,#e3b448 0%,#d4a373 50%,#b88a5b 100%);border-bottom:8px solid #a67c52;border-right:4px solid #b88a5b;border-radius:8px;justify-content:center;align-items:center;padding:16px;display:flex;position:relative;box-shadow:0 10px 30px #2d241e4d,inset 0 1px 1px #fff6,inset 0 -2px 3px #0003}@media (width<=1024px){body{overflow:hidden auto}.app-container{width:100%;height:auto;min-height:100vh;overflow:hidden visible}.main-layout{flex-direction:column;width:100%;overflow:hidden visible}.side-panel-container{width:100%;height:auto;min-height:400px}.board-premium-frame{border-bottom:4px solid #a67c52;border-right:2px solid #b88a5b;border-radius:4px;padding:8px}}.lobby-container{background:var(--color-bg);flex-direction:row;height:100vh;display:flex;overflow:hidden}.lobby-sidebar{background:linear-gradient(180deg, var(--c-espresso-mid) 0%, var(--c-espresso) 100%);border-right:1px solid var(--glass-border);flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:32px;width:140px;padding:24px;display:flex;position:relative;overflow:hidden;box-shadow:10px 0 30px #2d241e1a}.lobby-content{font-family:var(--font-sans,"Noto Sans KR", system-ui);background:radial-gradient(circle at 10% 20%,#faedcd66 0%,#0000 40%);flex-direction:column;flex:1;justify-content:flex-start;align-items:flex-start;padding:60px 80px;display:flex;overflow-y:auto}.lobby-tabs{background:#2d241e0a;border-radius:12px;gap:12px;margin-bottom:40px;padding:6px;display:flex}.lobby-difficulty{border:1px solid var(--glass-border);background:#fff6;border-radius:12px;gap:10px;padding:8px;display:flex}@media (width<=1024px){.lobby-container{flex-direction:column;overflow-y:auto}.lobby-sidebar{display:none}.lobby-content{text-align:center;align-items:center;padding:32px 16px}.lobby-tabs,.lobby-difficulty{flex-wrap:wrap;justify-content:center}}.navbar-container{background:var(--glass-bg);height:var(--navbar-height);border-bottom:1px solid var(--glass-border);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--shadow-premium);z-index:100;flex-shrink:0;justify-content:space-between;align-items:center;padding:0 24px;display:flex;position:relative}.navbar-left{align-items:center;gap:32px;display:flex}.navbar-logo-btn{background:0 0;border:none;align-items:center;gap:12px;padding:0;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.navbar-logo-icon{background:linear-gradient(135deg, var(--c-gold), var(--c-espresso));color:#fff;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;font-size:18px;font-weight:900;display:flex;box-shadow:0 4px 12px #2d241e33}.navbar-logo-text{color:var(--c-espresso);letter-spacing:-.03em;font-family:Noto Serif KR,serif;font-size:20px;font-weight:900}.navbar-persona-info{align-items:center;gap:10px;display:flex}.navbar-persona-name{color:var(--c-jade-br);font-size:14px;font-weight:700}.navbar-persona-badge{color:var(--c-jade);background:#52a8822e;border:1px solid #52a88266;border-radius:20px;padding:2px 10px;font-size:11px;font-weight:700}.navbar-center{align-items:center;gap:10px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.navbar-turn-text{color:var(--c-text-main);letter-spacing:.04em;font-size:13px;font-weight:700}@media (width<=768px){.navbar-container{height:auto;min-height:var(--navbar-height);flex-wrap:wrap;justify-content:space-between;gap:12px;padding:8px 12px}.navbar-left{gap:16px;width:auto}.navbar-logo-text{display:none}.navbar-center{border-top:1px dashed var(--glass-border);order:3;justify-content:center;width:100%;padding-top:4px;position:static;transform:none}}button{cursor:pointer;font-family:inherit}.btn-recommend:active:not(:disabled){opacity:.85;transform:scale(.95)}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes tsumego-shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-6px)}80%{transform:translate(6px)}}@keyframes tsumego-correct-flash{0%{box-shadow:0 0 #4ade8099}50%{box-shadow:0 0 0 16px #4ade8000}to{box-shadow:0 0 #4ade8000}}@keyframes streak-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.3)}}.tsumego-shake{animation:.6s ease-in-out tsumego-shake}.tsumego-correct-glow{animation:1.2s ease-out tsumego-correct-flash}.streak-bounce{animation:.4s ease-in-out streak-bounce}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#7fcca233;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#7fcca266}[data-theme=dark] ::-webkit-scrollbar-thumb{background:#ffffff1a}[data-theme=dark] ::-webkit-scrollbar-thumb:hover{background:#fff3}