*,:before,:after{box-sizing:border-box}:root{--sidebar-w:210px;--sidebar-collapsed-w:68px;--radius:14px;--font-ui:"Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;--font-cjk:"Noto Serif SC", "Songti SC", "SimSun", "Noto Serif CJK SC", serif;--font-calligraphy:"Ma Shan Zheng", "Noto Serif SC", serif;--anim-ms:.24s;--ease-out:cubic-bezier(.2, .8, .2, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1)}html,body{height:100%;margin:0}body{height:100vh;height:100dvh;font-family:var(--font-ui);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0}.icon,.chev,.ico{display:inline-flex}button:disabled{cursor:not-allowed;opacity:.5}input,select{font:inherit}a{color:inherit;text-decoration:none}h1,h2,h3,h4{margin:0;font-weight:600}p{margin:0}ul{margin:0;padding:0;list-style:none}#app{height:100vh;height:100dvh;height:var(--vvh,100dvh);display:flex}.content{background:radial-gradient(60% 80% at 20% 100%, color-mix(in srgb, var(--text) 9%, transparent), transparent 70%) bottom / 100% 46% no-repeat, radial-gradient(50% 70% at 70% 100%, color-mix(in srgb, var(--text) 7%, transparent), transparent 70%) bottom / 100% 46% no-repeat, radial-gradient(40% 60% at 95% 100%, color-mix(in srgb, var(--text) 6%, transparent), transparent 70%) bottom / 100% 46% no-repeat, radial-gradient(ellipse 80% 50% at 50% 110%, color-mix(in srgb, var(--brand) 14%, transparent), transparent 70%), linear-gradient(180deg, transparent 0%, color-mix(in srgb, var(--text) 4%, transparent) 100%), var(--bg);flex:1;min-width:0;height:100%;position:relative;overflow:auto}.sidebar{width:var(--sidebar-w);background:var(--brand);color:var(--brand-text);transition:width var(--anim-ms) var(--ease-out);z-index:5;flex-direction:column;flex:none;display:flex;overflow:hidden;box-shadow:4px 0 24px #0000001f}.sidebar.collapsed{width:var(--sidebar-collapsed-w)}.sidebar .logo{height:72px;font-family:var(--font-cjk);letter-spacing:.3px;white-space:nowrap;background:var(--brand-dark);cursor:pointer;align-items:center;gap:10px;padding:0 16px;font-size:20px;font-weight:900;display:flex}.sidebar .logo .seal{border-radius:50%;flex:none;width:36px;height:36px;box-shadow:0 2px 6px #00000040}.sidebar .logo .word{font-family:var(--font-ui);letter-spacing:-.2px;font-size:19px;font-weight:700}.sidebar .logo .word b{color:#ffd166;font-weight:800}.sidebar .logo .word small{opacity:.75;margin-left:1px;font-size:11px;font-weight:500}.sidebar nav{flex-direction:column;flex:1;padding-top:4px;display:flex}.sidebar .nav-item{white-space:nowrap;height:72px;color:var(--brand-text);align-items:center;gap:14px;padding:0 22px;font-size:15px;font-weight:600;transition:background .15s;display:flex;position:relative}.sidebar .nav-item:hover{background:#0000001f}.sidebar .nav-item.active{background:var(--brand-dark)}.sidebar .nav-item.active:before{content:"";background:var(--brand-text);border-radius:0 4px 4px 0;width:4px;position:absolute;top:14px;bottom:14px;left:0}.sidebar .nav-item .icon{flex:none;width:26px;height:26px}.sidebar .nav-item .chev{opacity:.8;width:14px;height:14px;margin-left:auto}.sidebar .bottom{flex-direction:column;padding:10px 0 14px;display:flex}.sidebar .bottom .nav-item{height:38px;font-size:13px;font-weight:500}.sidebar .bottom .nav-item .icon{width:20px;height:20px}.sidebar.collapsed .label,.sidebar.collapsed .chev,.sidebar.collapsed .logo .word{display:none}.sidebar.collapsed .nav-item{justify-content:center;padding:0 21px}.btn{background:var(--brand);height:48px;color:var(--brand-text);box-shadow:0 6px 16px color-mix(in srgb, var(--brand) 35%, transparent);transition:transform .12s var(--ease-out), box-shadow .12s, background .12s;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:0 22px;font-size:16px;font-weight:600;display:inline-flex}.btn:hover{box-shadow:0 10px 22px color-mix(in srgb, var(--brand) 40%, transparent);transform:translateY(-1px)}.btn:active{transform:translateY(1px)scale(.99)}.btn.outline{color:var(--brand);box-shadow:inset 0 0 0 2px var(--brand);background:0 0}.btn.outline:hover{background:color-mix(in srgb, var(--brand) 8%, transparent)}.btn.ghost{color:var(--text);box-shadow:none;background:0 0}.btn.ghost:hover{background:color-mix(in srgb, var(--text) 8%, transparent)}.btn.small{border-radius:8px;height:36px;padding:0 14px;font-size:14px}.btn.block{width:100%}.btn.danger{background:var(--danger)}.card{background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.page{max-width:1100px;margin:0 auto;padding:42px 48px;position:relative}.page-title{color:var(--brand);align-items:center;gap:14px;margin-bottom:26px;font-size:26px;font-weight:700;display:flex}.page-title .back{border-radius:50%;place-items:center;width:36px;height:36px;display:grid}.page-title .back:hover{background:color-mix(in srgb, var(--brand) 12%, transparent)}.muted{color:var(--text-muted)}.modal-backdrop{z-index:50;animation:fade-in .18s var(--ease-out);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#00000073;place-items:center;display:grid;position:fixed;inset:0}.modal{background:var(--bg-card);width:min(440px,92vw);color:var(--text);animation:pop-in .26s var(--ease-spring);text-align:center;border-radius:18px;padding:28px;box-shadow:0 30px 80px #00000059}.modal h2{margin-bottom:6px;font-size:24px}.modal .sub{color:var(--text-muted);margin-bottom:20px}.modal .actions{flex-direction:column;gap:10px;display:flex}.modal .trophy{animation:bounce-in .6s var(--ease-spring);margin-bottom:10px;font-size:56px;line-height:1}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes pop-in{0%{opacity:0;transform:scale(.85)translateY(10px)}to{opacity:1;transform:none}}@keyframes bounce-in{0%{transform:scale(.3)}60%{transform:scale(1.15)}to{transform:scale(1)}}@keyframes slide-up{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.toast-host{z-index:60;pointer-events:none;flex-direction:column;gap:8px;display:flex;position:fixed;top:16px;left:50%;transform:translate(-50%)}.toast{background:var(--text);color:var(--bg);animation:slide-up .2s var(--ease-out);border-radius:10px;padding:10px 16px;font-size:14px;font-weight:500;box-shadow:0 10px 30px #00000040}.switch{background:color-mix(in srgb, var(--text) 25%, transparent);border-radius:13px;flex:none;width:46px;height:26px;transition:background .15s;position:relative}.switch:after{content:"";width:20px;height:20px;transition:transform .18s var(--ease-out);background:#fff;border-radius:50%;position:absolute;top:3px;left:3px;box-shadow:0 2px 4px #0000004d}.switch.on{background:var(--accent)}.switch.on:after{transform:translate(20px)}.radio-row{gap:10px;display:flex}.radio-pill{border:2px solid var(--line);height:42px;color:var(--text-muted);border-radius:10px;flex:1;place-items:center;font-weight:600;transition:all .15s;display:grid}.radio-pill.on{border-color:var(--brand);color:var(--brand);background:color-mix(in srgb, var(--brand) 8%, transparent)}@media (max-width:860px){#app{flex-direction:column}.content{min-height:0;padding-bottom:calc(58px + env(safe-area-inset-bottom,0px));flex:1;order:0}.sidebar,.sidebar.collapsed{bottom:auto;left:0;right:0;top:calc(var(--vvtop,0px) + var(--vvh,100dvh) - 58px - env(safe-area-inset-bottom,0px));z-index:30;width:100%;height:calc(58px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);flex-direction:row;flex:none;order:1;align-items:stretch;transition:none;position:fixed;box-shadow:0 -4px 18px #00000026}.sidebar .logo{display:none}.sidebar nav{flex-direction:row;flex:1;padding:0}.sidebar .nav-item{flex-direction:column;flex:1;justify-content:center;gap:3px;height:58px;padding:0;font-size:10.5px;font-weight:500}.sidebar .nav-item .icon{width:22px;height:22px}.sidebar .nav-item .chev,.sidebar .lang-row,.sidebar .bottom .nav-item:not(.settings-link){display:none}.sidebar .nav-item.active:before{border-radius:0 0 4px 4px;width:auto;height:3px;inset:0 12% auto}.sidebar .bottom{flex-direction:row;padding:0}.sidebar .bottom .nav-item.settings-link{width:72px;height:58px;font-size:10.5px;display:flex}.sidebar .bottom .nav-item.settings-link .icon{width:22px;height:22px}.sidebar .label{display:inline}.page{padding:14px 12px 20px}.page-title{margin-bottom:14px;font-size:21px}.home-hero{padding:24px 14px 20px}.home-hero h2{font-size:26px}.lobby-grid{grid-template-columns:1fr;gap:10px}.lobby-card{padding:14px 16px}.theme-fab{bottom:calc(70px + env(safe-area-inset-bottom,0px));width:44px;height:44px;right:12px}.toast-host{top:10px}.sheet{bottom:calc(120px + env(safe-area-inset-bottom,0px))}}@media (prefers-reduced-motion:reduce){:root{--anim-ms:0s}*{transition-duration:.01ms!important;animation-duration:.01ms!important}}.board-frame{aspect-ratio:1000/1100;background:repeating-linear-gradient(94deg, transparent 0 18px, #00000009 18px 20px, transparent 20px 55px), repeating-linear-gradient(88deg, transparent 0 7px, #ffffff0f 7px 9px), linear-gradient(135deg, var(--board-wood-1), var(--board-wood-2));width:100%;box-shadow:0 0 0 7px color-mix(in srgb, var(--board-frame) 55%, transparent), var(--shadow), inset 0 2px 6px #ffffff59, inset 0 -4px 10px #0000001f;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none;overscroll-behavior:contain;border-radius:16px;padding:2.4%;position:relative}.board-frame .layer,.board-frame .piece,.board-frame .sq-mark,.board-frame .grid{touch-action:none;-webkit-user-select:none;-webkit-touch-callout:none}.board-frame .grid{width:100%;height:100%;display:block;position:absolute;inset:0}.board-frame .grid line,.board-frame .grid path,.board-frame .grid rect{stroke:var(--board-line);fill:none}.board-frame .grid .coord{fill:var(--board-text);font-family:var(--font-ui);opacity:.85;font-size:26px;font-weight:600}.board-frame .grid .river{fill:var(--board-text);font-family:var(--font-calligraphy);letter-spacing:14px;opacity:.9;font-size:58px}.board-frame .grid .brand-mark{fill:var(--board-text);font-family:var(--font-cjk);opacity:.55;font-size:30px;font-weight:700}.board-frame .layer{pointer-events:none;position:absolute;inset:0}.sq-mark{pointer-events:none;width:10%;height:9.0909%;position:absolute;transform:translate(-50%,-50%)}:root{--last-move:var(--accent)}.sq-mark.last-from:before,.sq-mark.last-to:before{content:none}.board-frame .arrows{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.lm-from{fill:var(--last-move);opacity:.55}.lm-from.fresh{animation:.22s fade-in}.lm-to{fill:none;stroke:var(--last-move);stroke-width:6px;stroke-linecap:round;stroke-linejoin:round;opacity:.95;filter:drop-shadow(0 1px 1px #00000040)}.lm-to.fresh{animation:lm-in .22s var(--ease-out)}@keyframes lm-in{0%{opacity:0}to{opacity:.95}}.sq-mark.selected:before{content:"";box-shadow:0 0 0 4px var(--highlight), 0 0 18px 4px color-mix(in srgb, var(--highlight) 70%, transparent);border-radius:50%;animation:1.2s ease-in-out infinite pulse-ring;position:absolute;inset:4%}.sq-mark.hint-dot:before{content:"";background:color-mix(in srgb, var(--accent) 80%, #fff);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 30%, transparent);animation:mark-in .16s var(--ease-out);border-radius:50%;position:absolute;inset:36%}.sq-mark.hint-capture:before{content:"";border:4px solid color-mix(in srgb, var(--danger) 80%, #fff);animation:mark-in .16s var(--ease-out);border-radius:50%;position:absolute;inset:6%}@keyframes mark-in{0%{opacity:0;scale:.6}to{opacity:1;scale:1}}.sq-mark.hint-dot,.sq-mark.hint-capture{pointer-events:auto;cursor:pointer}:root{--hint:#7b5be6}.sq-mark.engine-hint:before{content:"";border-radius:50%;position:absolute}.sq-mark.hint-from:before{box-shadow:0 0 0 4px var(--hint), 0 0 16px 4px color-mix(in srgb, var(--hint) 60%, transparent);animation:1.2s ease-in-out infinite pulse-ring;inset:2%}.sq-mark.hint-to:before{border:3px dashed var(--hint);animation:8s linear infinite spin;inset:10%}.hint-arrow{stroke:var(--hint);stroke-width:7px;stroke-linecap:round;opacity:.85;filter:drop-shadow(0 1px 2px #0000004d)}.hint-arrow-head{fill:var(--hint);opacity:.9}.sq-mark.check:before{content:"";border:3px solid color-mix(in srgb, var(--danger) 85%, #fff);background:radial-gradient(circle, color-mix(in srgb, var(--danger) 45%, transparent) 0%, transparent 70%);box-shadow:0 0 14px 2px color-mix(in srgb, var(--danger) 55%, transparent);border-radius:50%;animation:.7s ease-in-out infinite alternate check-pulse;position:absolute;inset:-8%}.board-frame.game-over .sq-mark.check:before{border-width:4px;animation:.9s ease-in-out infinite mate-pulse}.sq-mark.square-target{pointer-events:auto;cursor:pointer}@keyframes pulse-ring{0%,to{opacity:.85}50%{opacity:1;transform:scale(1.04)}}@keyframes check-pulse{0%{opacity:.4;transform:scale(.9)}to{opacity:1;transform:scale(1.15)}}@keyframes spin{to{transform:rotate(360deg)}}.piece{pointer-events:auto;cursor:grab;width:9.2%;height:8.3636%;transition:left var(--anim-ms) var(--ease-out), top var(--anim-ms) var(--ease-out), filter .15s, scale .15s var(--ease-out);will-change:left, top;filter:drop-shadow(0 3px 2px #00000059)drop-shadow(0 8px 6px #00000038);z-index:2;position:absolute;transform:translate(-50%,-50%)}.piece.red{--pc:var(--piece-red);--pc-text:var(--piece-red-text)}.piece.black{--pc:var(--piece-black);--pc-text:var(--piece-black-text)}.piece.lifted{z-index:5;filter:drop-shadow(0 8px 4px #00000059)drop-shadow(0 18px 14px #0000004d);cursor:grabbing;scale:1.12}.piece.moving{z-index:4;filter:drop-shadow(0 8px 4px #00000059)drop-shadow(0 16px 12px #00000047);scale:1.08}.piece.landed{animation:land .26s var(--ease-spring)}.piece.captured{animation:capture-out var(--anim-ms) var(--ease-out) forwards;pointer-events:none;z-index:1}.piece.dragging{transition:none}.piece.disabled{cursor:default}.piece svg{width:100%;height:100%;display:block}.piece .glyph{font-family:var(--font-cjk);font-weight:900}.piece.calligraphy .glyph{font-family:var(--font-calligraphy);font-weight:400}.piece.intl .glyph{font-family:var(--font-ui);font-weight:700}.piece.ghost{opacity:.4;pointer-events:none;z-index:3;transition:none}@keyframes land{0%{scale:1.1}55%{scale:.96}to{scale:1}}@keyframes capture-out{0%{opacity:1;scale:1}40%{opacity:.9;filter:brightness(1.3);scale:1.15}to{opacity:0;rotate:25deg;scale:.3}}.sq-mark.reject:before{content:"";border:3px solid color-mix(in srgb, var(--danger) 70%, transparent);border-radius:50%;animation:.32s ease-out forwards reject-fade;position:absolute;inset:6%}@keyframes reject-fade{0%{opacity:.9;transform:scale(.9)}to{opacity:0;transform:scale(1.15)}}.board-frame.game-over .piece{filter:saturate(.6)drop-shadow(0 3px 2px #0000004d)}.eval-bar{background:#2a2a2a;border-radius:7px;flex:none;width:14px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #0000004d}.eval-bar .red-fill{transition:height .4s var(--ease-out);background:#d12a1f;position:absolute;bottom:0;left:0;right:0}.eval-bar .label{text-align:center;color:#fff;font-size:9px;font-weight:700;position:absolute;left:0;right:0}.board-banner{pointer-events:none;z-index:6;place-items:center;display:grid;position:absolute;inset:0}.board-banner span{font-family:var(--font-cjk);color:#fff;text-shadow:0 2px 6px #00000073;border-radius:.3em;padding:.18em .6em;font-weight:900}.board-banner.check span{background:color-mix(in srgb, var(--danger) 85%, #000);animation:banner-check .9s var(--ease-out) forwards;font-size:clamp(22px,5vw,40px)}.board-banner.mate span{animation:banner-mate 1.6s var(--ease-spring) forwards;background:linear-gradient(135deg,#c9241b,#7a0f0f);border:3px solid #f2c94c;font-size:clamp(34px,9vw,72px);box-shadow:0 10px 40px #00000073,0 0 0 6px #f2c94c40}.board-banner.info span{animation:banner-check .9s var(--ease-out) forwards;background:#0009;font-size:clamp(22px,5vw,40px)}@keyframes banner-check{0%{opacity:0;transform:scale(.6)}20%{opacity:1;transform:scale(1.05)}70%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1)translateY(-10px)}}@keyframes banner-mate{0%{opacity:0;transform:scale(.3)rotate(-8deg)}25%{opacity:1;transform:scale(1.12)rotate(2deg)}40%{transform:scale(1)rotate(0)}85%{opacity:1}to{opacity:0;transform:scale(1.05)}}.board-frame.mate-flash .sq-mark.check:before{animation:.5s ease-in-out 3 mate-pulse}@keyframes mate-pulse{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.5)}}.board-countdown{z-index:7;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:none;background:#00000047;border-radius:16px;place-items:center;display:grid;position:absolute;inset:0}.board-countdown .num{color:#fff;text-shadow:0 6px 24px #00000080;font-size:clamp(64px,18vw,140px);font-weight:800;font-family:var(--font-ui);animation:count-pop 1s var(--ease-out)}.board-countdown .txt{text-align:center;color:#fff;text-shadow:0 2px 8px #0009;font-size:clamp(14px,3.5vw,20px);font-weight:600;position:absolute;bottom:14%;left:0;right:0}@keyframes count-pop{0%{opacity:0;transform:scale(1.6)}30%{opacity:1;transform:scale(1)}to{opacity:1}}.home-hero{max-width:980px;margin:0 auto;padding:60px 48px 30px}.home-hero h2{margin-bottom:8px;font-size:34px;font-weight:700;line-height:1.2}.home-hero h2 .brand{color:var(--brand)}.home-hero .tagline{color:var(--text-muted);margin-bottom:34px;font-size:16px}.lobby-grid{grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:18px;display:grid}.lobby-card{text-align:left;background:var(--bg-card);border:1px solid var(--line);transition:transform .16s var(--ease-out), box-shadow .16s, border-color .16s;animation:slide-up .4s var(--ease-out) both;border-radius:16px;align-items:center;gap:18px;padding:20px 22px;display:flex;box-shadow:0 4px 14px #0000000f}.lobby-card:hover{box-shadow:var(--shadow);border-color:color-mix(in srgb, var(--brand) 40%, var(--line));transform:translateY(-3px)}.lobby-card .ico{background:color-mix(in srgb, var(--brand) 12%, transparent);width:54px;height:54px;color:var(--brand);border-radius:14px;flex:none;place-items:center;font-size:28px;display:grid}.lobby-card .t{font-size:17px;font-weight:700}.lobby-card .d{color:var(--text-muted);margin-top:2px;font-size:13.5px}.lobby-card:nth-child(2){animation-delay:50ms}.lobby-card:nth-child(3){animation-delay:.1s}.lobby-card:nth-child(4){animation-delay:.15s}.lobby-card:nth-child(5){animation-delay:.2s}.lobby-card:nth-child(6){animation-delay:.25s}.theme-fab{background:var(--bg-card);border:1px solid var(--line);width:56px;height:56px;box-shadow:var(--shadow);z-index:20;border-radius:50%;place-items:center;font-size:24px;transition:transform .15s;display:grid;position:fixed;bottom:26px;right:26px}.theme-fab:hover{transform:rotate(20deg)scale(1.06)}.setup-card{text-align:center;width:min(520px,100%);animation:slide-up .3s var(--ease-out);margin:0 auto;padding:36px 44px 30px}.resume-card{text-align:left;cursor:pointer;border:2px solid color-mix(in srgb, var(--brand) 35%, var(--line));background:var(--bg-card);width:min(520px,100%);font:inherit;color:var(--text);align-items:center;gap:14px;margin:0 auto 14px;padding:14px 18px;display:flex}.resume-card:hover{border-color:var(--brand);box-shadow:var(--shadow)}.resume-card .ico{background:var(--brand);color:#fff;border-radius:50%;flex:none;place-items:center;width:40px;height:40px;font-size:16px;display:grid}.resume-card .txt{flex-direction:column;gap:2px;display:flex}.resume-card b{font-size:16px}.resume-card small{color:var(--text-muted);font-size:13px}.setup-card .avatar-big{background:color-mix(in srgb, var(--brand) 10%, var(--bg-card));border:2px solid var(--line);width:84px;height:84px;transition:transform .2s var(--ease-spring);border-radius:50%;place-items:center;margin:0 auto 10px;font-size:46px;display:grid}.setup-card h4{font-size:18px;font-weight:700}.setup-card h4 .lvl{color:var(--text-muted);font-size:15px;font-weight:400}.setup-card .desc{color:var(--text-muted);min-height:66px;margin:8px 0 22px;font-size:14.5px;line-height:1.55}.bot-grid{grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:22px;display:grid}.bot-grid button{aspect-ratio:1;background:var(--bg-panel);border:2px solid var(--line);transition:transform .14s var(--ease-out), border-color .14s, box-shadow .14s;border-radius:12px;place-items:center;font-size:30px;display:grid;position:relative}.bot-grid button:hover{transform:translateY(-2px)}.bot-grid button.on{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb, var(--brand) 25%, transparent)}.bot-grid button .n{color:var(--text-muted);font-size:10px;font-weight:700;position:absolute;bottom:3px;right:5px}.setup-card h3{text-align:left;color:var(--text-muted);text-transform:uppercase;letter-spacing:.6px;margin:14px 0 8px;font-size:14px}.setup-card .actions{flex-direction:column;gap:10px;margin-top:22px;display:flex}.game-layout{height:100%;min-height:0;display:flex}.game-main{flex-direction:column;flex:1;align-items:center;min-width:0;padding:0;display:flex}.board-stage{flex:1;justify-content:center;align-items:center;width:100%;min-height:0;padding:16px 20px;display:flex}.board-column{align-items:stretch;gap:12px;width:min(100%,90.9091vh - 100px);display:flex}.board-column .board-frame{flex:1}.game-footer{background:var(--bg-panel);border-top:1px solid var(--line);justify-content:space-around;align-items:center;width:100%;height:50px;margin-top:auto;display:flex}.game-footer button{color:var(--text-muted);border-radius:8px;align-items:center;gap:6px;padding:8px 12px;font-size:14px;font-weight:500;display:flex}.game-footer button:hover{background:color-mix(in srgb, var(--text) 7%, transparent);color:var(--text)}.game-footer button .ico,.sheet button .ico{flex:none;width:18px;height:18px}.game-side{background:var(--bg-panel);border-left:1px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);flex-direction:column;flex:none;width:400px;display:flex}.player-bar{border-bottom:1px solid var(--line);justify-content:flex-end;align-items:center;gap:12px;height:82px;padding:0 20px;display:flex}.player-bar.bottom{border-bottom:0;border-top:1px solid var(--line)}.player-bar .name{color:var(--brand-dark);text-align:right;font-size:17px;font-weight:700}html.dark .player-bar .name,html.dark .page-title{color:var(--text)}html.dark .home-hero h2 .brand{color:var(--accent)}.player-bar .sub{color:var(--text-muted);text-align:right;font-size:12px}.player-bar .avatar{background:var(--bg-card);border:2px solid var(--line);border-radius:50%;place-items:center;width:46px;height:46px;font-size:24px;display:grid;position:relative}.player-bar .avatar .dot{border:2px solid var(--bg-card);background:#4caf50;border-radius:50%;width:12px;height:12px;position:absolute;top:-2px;right:-2px}.player-bar .avatar.red-side{border-color:var(--piece-red)}.player-bar .avatar.black-side{border-color:var(--piece-black)}.player-bar .clock{font-variant-numeric:tabular-nums;background:var(--bg-card);border:1px solid var(--line);border-radius:8px;margin-right:auto;padding:4px 12px;font-size:20px;font-weight:700}.player-bar .clock.active{background:var(--brand);color:var(--brand-text);border-color:var(--brand)}.player-bar .clock.low{background:var(--danger);color:#fff;animation:.5s infinite alternate check-pulse}.player-bar .thinking{color:var(--text-muted);align-items:center;gap:4px;margin-right:auto;font-size:13px;display:flex}.player-bar .thinking i{background:var(--brand);border-radius:50%;width:6px;height:6px;animation:.9s ease-in-out infinite dots}.player-bar .thinking i:nth-child(2){animation-delay:.15s}.player-bar .thinking i:nth-child(3){animation-delay:.3s}@keyframes dots{0%,to{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}.moves-panel{flex-direction:column;flex:1;min-height:0;display:flex}.moves-list{flex:1;grid-template-columns:44px 1fr 1fr;align-content:start;gap:2px 6px;padding:10px 14px;font-size:14.5px;display:grid;overflow:auto}.moves-list .num{color:var(--text-muted);text-align:right;padding:5px 4px;font-size:13px}.moves-list .mv{cursor:pointer;border-radius:6px;align-items:center;gap:8px;padding:5px 10px;font-weight:500;transition:background .12s;display:flex}.moves-list .mv:hover{background:color-mix(in srgb, var(--text) 7%, transparent)}.moves-list .mv.current{background:var(--brand);color:var(--brand-text)}.moves-list .mv .cn{font-family:var(--font-cjk);opacity:.8;font-size:13px}.moves-list .empty{text-align:center;color:var(--text-muted);grid-column:1/-1;padding:40px 0;font-size:14px}.history-controls{background:color-mix(in srgb, var(--text) 10%, var(--bg-panel));justify-content:center;align-items:center;gap:6px;height:49px;display:flex}.history-controls button{width:40px;height:32px;color:var(--text-muted);border-radius:6px;place-items:center;font-size:16px;display:grid}.history-controls button:hover:not(:disabled){background:color-mix(in srgb, var(--text) 10%, transparent);color:var(--text)}.history-controls .counter{text-align:center;min-width:60px;font-weight:600}.engine-status{color:var(--text-muted);border-bottom:1px solid var(--line);flex-direction:column;gap:6px;padding:10px 16px;font-size:13px;display:flex}.engine-status .bar{background:color-mix(in srgb, var(--text) 10%, transparent);border-radius:3px;height:6px;overflow:hidden}.engine-status .bar i{background:var(--accent);width:0;height:100%;transition:width .2s;display:block}.engine-status.error{color:var(--danger)}.engine-status .invite{flex-wrap:wrap;align-items:center;gap:10px;margin-top:4px;display:flex}.engine-status .invite .code{letter-spacing:4px;color:var(--text);font-variant-numeric:tabular-nums;font-size:22px;font-weight:800}.engine-status .invite .ico{vertical-align:-2px;width:14px;height:14px;margin-right:4px}.analysis-panel{border-bottom:1px solid var(--line);padding:10px 16px;font-size:13px}.analysis-panel .score{font-size:18px;font-weight:700}.analysis-panel .pv{color:var(--text-muted);word-break:break-all;margin-top:4px;font-family:ui-monospace,monospace;font-size:12px}.capture-row{flex-wrap:wrap;justify-content:flex-end;gap:2px;min-height:18px;display:flex}.capture-row span{font-family:var(--font-cjk);color:#fff;border-radius:50%;place-items:center;width:18px;height:18px;font-size:13px;font-weight:700;display:grid}.capture-row span.red{background:var(--piece-red)}.capture-row span.black{background:var(--piece-black)}.focus-mode .sidebar,.focus-mode .game-side{display:none}.sheet{z-index:40;background:var(--bg-card);border:1px solid var(--line);box-shadow:var(--shadow);min-width:220px;animation:slide-up .18s var(--ease-out);border-radius:14px;flex-direction:column;padding:8px;display:flex;position:fixed;bottom:70px;left:50%;transform:translate(-50%)}.sheet button{text-align:left;border-radius:8px;align-items:center;gap:10px;padding:10px 14px;font-weight:500;display:flex}.sheet button:hover{background:color-mix(in srgb, var(--text) 7%, transparent)}.online-card{width:min(560px,100%);margin:0 auto;padding:32px 40px}.online-card h3{margin-bottom:8px;font-size:18px}.online-card .row{gap:10px;margin:10px 0 20px;display:flex}.online-card input{border:2px solid var(--line);background:var(--bg);height:48px;color:var(--text);letter-spacing:3px;text-transform:uppercase;border-radius:10px;flex:1;padding:0 14px;font-size:18px;font-weight:700}.online-card input:focus{border-color:var(--brand);outline:none}.code-badge{letter-spacing:8px;color:var(--brand);text-align:center;background:color-mix(in srgb, var(--brand) 8%, transparent);border-radius:12px;margin:12px 0;padding:12px;font-size:42px;font-weight:800}.time-grid{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.puzzle-list{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;display:grid}.puzzle-item{text-align:left;padding:18px;transition:transform .15s}.puzzle-item:hover{transform:translateY(-2px)}.puzzle-item .t{font-weight:700}.puzzle-item .d{color:var(--text-muted);font-size:13px}.puzzle-item .done{color:var(--accent);font-size:13px;font-weight:700}.lesson{margin-bottom:16px;padding:22px 26px}.lesson h3{align-items:center;gap:10px;margin-bottom:6px;font-size:18px;display:flex}.lesson p{color:var(--text-muted);font-size:14.5px;line-height:1.6}.lesson .mini{float:right;width:220px;margin:0 0 10px 18px}.settings-card{width:min(640px,100%);margin:0 auto;padding:10px 0}.setting-row{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;padding:16px 24px;display:flex}.setting-row:last-child{border-bottom:0}.setting-row .l{font-weight:600}.legal-intro{padding:14px 24px 6px;font-size:14px;line-height:1.55}a.legal-row{color:inherit;text-decoration:none}a.legal-row:hover{background:color-mix(in srgb, var(--text) 5%, transparent)}a.legal-row .arrow{color:var(--text-muted);font-size:18px}.setting-row .s{color:var(--text-muted);font-size:13px}.setting-row select,.setting-row input[type=text]{border:2px solid var(--line);background:var(--bg);height:38px;color:var(--text);border-radius:8px;padding:0 10px}.theme-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;padding:16px 24px;display:grid}.theme-tile{border:2px solid var(--line);text-align:left;border-radius:12px;padding:10px;transition:transform .14s,border-color .14s}.theme-tile:hover{transform:translateY(-2px)}.theme-tile.on{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb, var(--brand) 25%, transparent)}.puzzle-item .zh{color:var(--muted);font-size:12px;font-family:var(--font-cjk);margin-top:2px}.theme-tile .swatch{border-radius:8px;height:54px;margin-bottom:8px;display:flex;overflow:hidden}.theme-tile .swatch i{flex:1}.theme-tile .n{font-size:14px;font-weight:600}.theme-tile .d{color:var(--text-muted);font-size:11.5px}@media (max-width:1100px){.game-side{width:320px}}@media (max-width:860px){.game-layout{flex-direction:column;overflow:auto}.game-side{border-left:0;border-top:1px solid var(--line);width:100%}.board-column{width:100%}.moves-list{max-height:220px}.bot-grid{grid-template-columns:repeat(5,1fr);gap:8px}.setup-card{padding:24px 18px}}.recent{margin-top:36px}.recent h3{margin-bottom:12px;font-size:18px}.recent-row{background:var(--bg-card);border:1px solid var(--line);border-radius:10px;align-items:center;gap:14px;margin-bottom:8px;padding:10px 14px;font-size:14px;display:flex}.recent-row .who{flex:1;font-weight:600}.recent-row .badge{color:#fff;background:var(--text-muted);border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700}.recent-row .badge.win{background:var(--accent)}.recent-row .badge.loss{background:var(--danger)}.sidebar .lang-row{gap:10px}.sidebar .lang-select{color:var(--brand-text);background:#0003;border:1px solid #ffffff40;border-radius:6px;max-width:120px;height:28px;padding:0 6px;font-size:12px}.sidebar .lang-select option{color:#222}.sidebar.collapsed .lang-select{display:none}.opening-tag{color:var(--text-muted);border-bottom:1px solid var(--line);padding:6px 16px;font-size:12.5px;font-style:italic}.moves-list .ann{color:#fff;border-radius:6px;margin-left:auto;padding:1px 6px;font-size:11px;font-weight:800}.moves-list .ann.best{background:#2f8f5b}.moves-list .ann.good{background:#5aa96f}.moves-list .ann.inaccuracy{background:#d7a21e}.moves-list .ann.mistake{background:#e2652a}.moves-list .ann.blunder{background:#c9241b}.review-panel{border-bottom:1px solid var(--line);padding:12px 16px;font-size:13px}.review-panel .acc{gap:10px;margin:8px 0;display:flex}.review-panel .acc div{text-align:center;background:var(--bg-card);border:1px solid var(--line);border-radius:10px;flex:1;padding:8px}.review-panel .acc .v{font-size:22px;font-weight:800}.review-panel .acc .red .v{color:var(--piece-red)}.review-panel .acc .black .v{color:var(--text)}.review-panel .bar{background:color-mix(in srgb, var(--text) 10%, transparent);border-radius:3px;height:6px;margin-top:6px;overflow:hidden}.review-panel .bar i{background:var(--accent);height:100%;transition:width .15s;display:block}.eval-graph{background:var(--bg-card);border:1px solid var(--line);cursor:pointer;border-radius:8px;width:100%;height:90px;margin-top:8px;display:block}.eval-graph .red-area{fill:var(--piece-red);opacity:.55}.eval-graph .black-area{fill:var(--text);opacity:.35}.eval-graph .cursor{stroke:var(--accent);stroke-width:2px}.eval-graph .mid{stroke:var(--text-muted);stroke-width:1px;stroke-dasharray:3 3}.online-main{width:min(520px,100%);margin:0 auto}.tc-wrap{position:relative}.tc-card{border:1.5px solid var(--brand);background:var(--bg-card);text-align:left;border-radius:10px;align-items:center;gap:16px;width:100%;padding:16px 20px;display:flex}.tc-card .tc-ico{color:var(--brand);font-size:26px}.tc-card .tc-label{color:var(--brand-dark);font-size:18px;font-weight:700}.tc-card .tc-sub{color:var(--text-muted);font-size:13px}.tc-card .tc-chev{color:var(--brand);margin-left:auto;font-size:22px;line-height:1}html.dark .tc-card .tc-label{color:var(--text)}.tc-menu{z-index:10;background:var(--bg-card);border:1px solid var(--line);box-shadow:var(--shadow);animation:slide-up .15s var(--ease-out);border-radius:10px;grid-template-columns:1fr 1fr;gap:4px;padding:6px;display:grid;position:absolute;top:calc(100% + 6px);left:0;right:0}.tc-menu button{border-radius:8px;flex-direction:column;align-items:flex-start;padding:10px 12px;display:flex}.tc-menu button:hover{background:color-mix(in srgb, var(--brand) 8%, transparent)}.tc-menu button b{font-size:16px}.tc-menu button span{color:var(--text-muted);font-size:12px}.stats-row{justify-content:space-between;margin:10px 2px 12px;font-size:14.5px;display:flex}.stats-row .stat{align-items:center;gap:8px;font-weight:600;display:flex}.stats-row .dot-online{background:#33c35e;border-radius:50%;width:14px;height:14px;display:inline-block}.stats-row .dot-games{border:2px solid var(--brand);width:18px;height:18px;color:var(--brand);font-size:9px;font-style:normal;font-weight:700;font-family:var(--font-cjk);background:#f3dcb4;border-radius:50%;place-items:center;display:inline-grid}.btn.big{height:54px;font-size:18px}.btn.seeking{background:var(--text-muted)}.spinner{vertical-align:middle;border:2px solid #fff6;border-top-color:#fff;border-radius:50%;width:16px;height:16px;animation:.8s linear infinite spin;display:inline-block}.live-list{flex-direction:column;gap:8px;margin-top:8px;display:flex}.live-row{border:1px solid var(--line);border-radius:10px;align-items:center;gap:14px;padding:10px 12px;display:flex}.live-row .names{flex:1}.online-card .row{flex-wrap:wrap}.chat-page{height:100%;padding:30px}.chat-card{border:1.5px solid var(--brand);flex-direction:column;height:100%;min-height:500px;display:flex}.chat-head{border-bottom:1.5px solid var(--brand);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.chat-head h3{color:var(--brand);font-size:20px}.chat-list{flex-direction:column;flex:1;gap:10px;padding:16px 20px;display:flex;overflow:auto}.chat-line{align-items:flex-start;gap:10px;display:flex}.chat-line .bot-avatar{flex:none;width:32px;height:32px}.chat-line .bubble{background:var(--bg-card);border:1px solid var(--line);border-radius:12px;max-width:70%;padding:8px 12px}.chat-line.mine{flex-direction:row-reverse}.chat-line.mine .bubble{background:color-mix(in srgb, var(--brand) 10%, var(--bg-card))}.chat-line .meta{color:var(--text-muted);gap:8px;margin-bottom:2px;font-size:12px;display:flex}.chat-line .text{white-space:pre-wrap;word-break:break-word;font-size:14.5px}.chat-input{border-top:1px solid var(--line);gap:10px;padding:14px 20px;display:flex}.chat-input input{border:1.5px solid var(--brand);background:var(--bg);height:44px;color:var(--text);border-radius:22px;flex:1;padding:0 18px}.chat-input input:focus{box-shadow:0 0 0 3px color-mix(in srgb, var(--brand) 20%, transparent);outline:none}.pro-card{text-align:center;width:min(560px,100%);margin:0 auto;padding:32px 40px}.pro-hero p{color:var(--text-muted);margin-top:10px;font-size:15px}.pro-badge{color:#fff;letter-spacing:2px;background:linear-gradient(135deg,#f2b632,#e8832a);border-radius:999px;padding:6px 16px;font-size:14px;font-weight:800;display:inline-block}.pro-features{text-align:left;flex-direction:column;gap:8px;margin:22px auto;font-size:15px;display:flex}.pro-price{margin:10px 0 16px;font-size:30px}.pro-price b{font-weight:800}.pro-status{min-height:20px;margin:10px 0 14px}.pro-ok{color:var(--accent);font-size:18px;font-weight:700}.pro-restore{border-top:1px solid var(--line);margin-top:26px;padding-top:18px}.pro-restore .row{gap:10px;margin-top:8px;display:flex}.pro-restore input{border:2px solid var(--line);background:var(--bg);height:44px;color:var(--text);border-radius:10px;flex:1;padding:0 12px}.sidebar .pro-tag{color:#fff;background:linear-gradient(135deg,#f2b632,#e8832a);border-radius:999px;margin-left:auto;padding:2px 7px;font-size:10px;font-weight:800}.lobby-card.pro-card-home .ico{color:#fff;background:linear-gradient(135deg,#f2b632,#e8832a)}.bot-avatar{width:100%;height:100%;display:inline-block}.bot-grid button{padding:6px}.bot-grid button .bot-avatar{width:100%;height:100%}.setup-card .avatar-big{padding:4px;overflow:hidden}.player-bar .avatar{padding:0;overflow:hidden}.player-bar .avatar .bot-avatar{width:100%;height:100%}.settings-page{max-width:1100px}.settings-layout{align-items:flex-start;gap:18px;display:flex}.settings-tabs{flex-direction:column;flex:none;gap:4px;width:300px;padding:8px;display:flex}.settings-tab{text-align:left;color:var(--brand);border-radius:10px;padding:14px 20px;font-size:16px;font-weight:600}.settings-tab.on{background:color-mix(in srgb, var(--text) 6%, transparent)}html.dark .settings-tab{color:var(--text)}.settings-content{flex:1;min-width:0}.settings-content .settings-card{width:100%}.piece-styles{gap:8px;display:flex}.piece-style{border:2px solid #0000;border-radius:50%;width:46px;height:46px;padding:0}.piece-style.on{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb, var(--brand) 25%, transparent)}.piece-style svg{--pc:var(--piece-red);--pc-text:var(--piece-red-text);width:100%;height:100%}.theme-tile .board-swatch{border:3px solid;justify-content:center;align-items:center;gap:6px;height:72px;display:flex}.theme-tile .sw-piece{aspect-ratio:1;width:30px;min-width:30px;max-width:30px;height:30px;font-family:var(--font-cjk);border-radius:50%;flex:0 0 30px;place-items:center;font-size:15px;font-style:normal;font-weight:900;display:grid;box-shadow:0 2px 4px #0000004d}@media (max-width:860px){.settings-layout{flex-direction:column}.settings-tabs{flex-direction:row;width:100%}}.lesson-groups{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;display:grid}.lesson-group{text-align:left;align-items:flex-start;gap:14px;padding:18px;transition:transform .15s;display:flex}.lesson-group:hover{transform:translateY(-2px)}.lesson-group .ico{background:color-mix(in srgb, var(--brand) 12%, transparent);border-radius:12px;flex:none;place-items:center;width:48px;height:48px;font-size:24px;display:grid}.lesson-group .body{flex:1}.lesson-group .t{font-weight:700}.lesson-group .d{color:var(--text-muted);margin-top:2px;font-size:13px}.lesson-group .meta{color:var(--text-muted);flex-direction:column;align-items:flex-end;gap:4px;font-size:12px;display:flex}.lesson-group .lvl{background:color-mix(in srgb, var(--accent) 15%, transparent);color:var(--accent);border-radius:999px;padding:2px 8px;font-weight:700}.lesson-group .lvl.beginner{background:color-mix(in srgb, var(--brand) 12%, transparent);color:var(--brand)}.filter-row{align-items:center;gap:12px;margin-bottom:10px;display:flex}.filter-row .radio-row{flex:1;max-width:560px}.filter-row .radio-pill{height:36px;font-size:14px}.race-clock{font-variant-numeric:tabular-nums;color:var(--brand);margin-right:auto;font-size:26px;font-weight:800}.race-score{font-size:18px;font-weight:700}.watch-list{flex-direction:column;gap:10px;display:flex}.watch-row{text-align:left;justify-content:space-between;align-items:center;padding:12px 18px;transition:transform .15s;display:flex}.watch-row:hover{transform:translateY(-2px)}.watch-row .p{flex:1;align-items:center;gap:10px;display:flex}.watch-row .p.right{text-align:right;justify-content:flex-end}.watch-row .bot-avatar{width:40px;height:40px}.watch-row .mid{text-align:center;font-size:13px}.lb-table{overflow:hidden}.lb-row{border-bottom:1px solid var(--line);grid-template-columns:50px 1fr 80px 70px 110px;align-items:center;gap:10px;padding:10px 18px;font-size:14.5px;display:grid}.lb-row:last-child{border-bottom:0}.lb-row.head{text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);background:color-mix(in srgb, var(--text) 4%, transparent);font-size:12px}.lb-row.me{background:color-mix(in srgb, var(--brand) 10%, transparent);font-weight:600}.lb-row .who{align-items:center;gap:10px;display:flex}.lb-row .who .bot-avatar{width:28px;height:28px}.lb-row .rank{font-weight:700}.qipu-group{margin-bottom:26px}.qipu-group h3{color:var(--brand);margin-bottom:10px;font-size:17px}html.dark .qipu-group h3{color:var(--text)}.pager{justify-content:center;align-items:center;gap:16px;margin-top:18px;display:flex}.engine-status.turn-red,.engine-status.turn-black{color:var(--text);flex-direction:row;align-items:center;gap:10px;padding:12px 16px;font-size:15px;font-weight:600}.engine-status.turn-red:before,.engine-status.turn-black:before{content:"";border-radius:50%;flex:none;width:14px;height:14px;box-shadow:0 0 0 2px #00000026}.engine-status.turn-red:before{background:var(--piece-red)}.engine-status.turn-black:before{background:var(--piece-black)}@media (max-width:860px){.game-footer{flex-wrap:wrap;justify-content:center;gap:2px 4px;height:auto;min-height:50px;padding:4px 6px}.game-footer button{padding:6px 8px;font-size:13px}.game-layout{flex-direction:column;height:auto;min-height:0;overflow:visible}.game-main{flex:none;padding:0}.board-stage{padding:8px 8px 4px}.board-column{width:100%}.game-footer{margin-top:0}.game-side{border-left:0;border-top:1px solid var(--line);flex:none;width:100%}.player-bar{height:56px;padding:0 14px}.player-bar .name{font-size:15px}.player-bar .sub{font-size:11px}.player-bar .avatar{width:38px;height:38px;font-size:20px}.player-bar .clock{padding:3px 10px;font-size:17px}.moves-list{max-height:200px;font-size:13.5px}.engine-status{padding:8px 14px;font-size:12.5px}.eval-bar{width:10px}.settings-tabs{flex-direction:row}.settings-tab{padding:10px 14px;font-size:14px}.theme-grid{grid-template-columns:repeat(2,1fr);padding:12px}.bot-grid{gap:6px}.pro-card,.online-card,.setup-card{padding:20px 16px}.online-card .row{flex-direction:column}.chat-page{padding:10px}.lb-row{grid-template-columns:36px 1fr 64px 48px}.lb-row>:nth-child(5){display:none}.theme-fab{bottom:calc(70px + env(safe-area-inset-bottom,0px));width:44px;height:44px;right:12px}.sheet{bottom:calc(120px + env(safe-area-inset-bottom,0px))}}.credit-tag{background:#ffffff2e;border-radius:999px;margin-left:auto;padding:2px 8px;font-size:12px;font-weight:700}.sidebar.collapsed .credit-tag{display:none!important}.auth-tabs{justify-content:center;gap:8px;margin-bottom:6px;display:flex}.auth-tabs button{border:2px solid var(--line);background:var(--bg);color:var(--text);cursor:pointer;border-radius:999px;padding:8px 18px;font-weight:700}.auth-tabs button.on{border-color:var(--accent);color:var(--accent)}.auth-form{flex-direction:column;gap:10px;margin:14px 0;display:flex}.auth-form input{border:2px solid var(--line);background:var(--bg);height:44px;color:var(--text);border-radius:10px;padding:0 12px;font-size:15px}.auth-error{color:var(--danger);min-height:18px;font-size:14px}.credit-balance{margin:6px 0;font-size:40px;font-weight:800}.credit-balance small{color:var(--text-muted);margin-left:6px;font-size:16px;font-weight:600}.packs{grid-template-columns:repeat(3,1fr);gap:12px;margin:14px 0;display:grid}.pack{cursor:pointer;border:2px solid var(--line);background:linear-gradient(180deg, color-mix(in srgb, var(--bg) 70%, #fff), var(--bg));color:var(--text);transition:transform .16s var(--ease-out), box-shadow .16s, border-color .16s;border-radius:16px;flex-direction:column;align-items:center;gap:2px;padding:18px 10px 14px;display:flex;position:relative;box-shadow:0 6px 18px #00000014}.pack:hover{border-color:var(--accent);transform:translateY(-3px);box-shadow:0 12px 26px #00000024}.pack-medium{border-color:var(--accent);background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 14%, var(--bg)), var(--bg))}.pack-large{background:linear-gradient(180deg, color-mix(in srgb, #f2b632 16%, var(--bg)), var(--bg));border-color:#e2a62a}.pack b{font-size:30px;font-weight:800;line-height:1.1}.pack .unit{color:var(--text-muted);font-size:13px}.pack .hints{color:var(--text-muted);margin-top:2px;font-size:12px}.pack .price{margin-top:8px;font-size:18px;font-weight:700}.pack .cta{background:var(--accent);color:#fff;border-radius:999px;margin-top:10px;padding:7px 18px;font-size:13px;font-weight:700}.pack-large .cta{background:linear-gradient(135deg,#f2b632,#e8832a)}.pack .badge{letter-spacing:.3px;background:var(--accent);color:#fff;white-space:nowrap;border-radius:999px;padding:3px 10px;font-size:11px;font-style:normal;font-weight:800;position:absolute;top:-11px;left:50%;transform:translate(-50%)}.pack-large .badge{background:linear-gradient(135deg,#f2b632,#e8832a)}.ledger{text-align:left;margin-top:16px;font-size:14px}.ledger div{border-bottom:1px solid var(--line);justify-content:space-between;padding:6px 0;display:flex}.ledger .plus{color:var(--accent);font-weight:700}.ledger .minus{color:var(--text-muted)}@media (max-width:520px){.packs{grid-template-columns:1fr}}.google-btn{color:#333;border:2px solid var(--line);background:#fff;justify-content:center;align-items:center;gap:10px;margin-top:18px;text-decoration:none;display:flex}.google-btn:hover{border-color:#4285f4}.google-btn .g{color:#4285f4;font-size:18px;font-weight:900}.or-line{color:var(--text-muted);margin:10px 0 4px;font-size:13px}.online-card.guide h2{margin:0 0 8px;font-size:20px}.online-card.guide p{line-height:1.6}.guide-list{margin:12px 0}.guide-list dt{margin-top:10px;font-weight:700}.guide-list dd{color:var(--text-muted);margin:2px 0 0;line-height:1.55}.guide-list button.link{font:inherit;color:var(--accent);cursor:pointer;background:0 0;border:0;padding:0;font-weight:700}
