
:root,[data-theme=spaced]{--bg:#213C55;--hd:#172B3E;--hdb:#0F1E2C;--ink:#F4ECDC;--lt:#F4ECDC;--dk:#6E7F8F;--frame:#5B3A22;--acc:#E0B04A;--accd:#8A6416;--wp:#FFFDF6;--bp:#16283A;--pat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cg fill='%23F4ECDC' opacity='.05'%3E%3Crect x='20' y='30' width='56' height='14' rx='7'/%3E%3Crect x='20' y='50' width='56' height='4' rx='2'/%3E%3Crect x='20' y='60' width='56' height='4' rx='2'/%3E%3Cpath d='M118 100l6-18 6 18-6-5zM118 118l6 18 6-18-6 5zM115 103l-18 6 18 6-5-6zM133 103l18 6-18 6 5-6z'/%3E%3C/g%3E%3C/svg%3E")}
[data-theme=brakk]{--bg:#2F4A2E;--hd:#1f331f;--hdb:#142214;--ink:#F4E6C4;--lt:#F4E6C4;--dk:#5E7D4C;--frame:#4A3420;--acc:#E3AB2E;--accd:#7d5808;--wp:#FFFDF2;--bp:#132013;--pat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cg fill='%23F4E6C4' opacity='.05'%3E%3Cellipse cx='30' cy='42' rx='10' ry='15'/%3E%3Cellipse cx='20' cy='22' rx='7' ry='10' transform='rotate(-25 20 22)'/%3E%3Cellipse cx='40' cy='22' rx='7' ry='10' transform='rotate(25 40 22)'/%3E%3Cpath d='M70 100l8-14-2-10 6 6 10 1 9 6-2 4h-9l-4 9z'/%3E%3C/g%3E%3C/svg%3E")}
[data-theme=holma]{--bg:#3B2D63;--hd:#2A1F49;--hdb:#1A1230;--ink:#EDE6FA;--lt:#E6DDF5;--dk:#7A62B0;--frame:#2A1F49;--acc:#F2C14E;--accd:#8a6a14;--wp:#FFFFFF;--bp:#1A1230;--pat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cg fill='%23EDE6FA' opacity='.06'%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3Ccircle cx='100' cy='60' r='1.5'/%3E%3Ccircle cx='60' cy='110' r='2.5'/%3E%3Cpath d='M110 20a14 14 0 1 0 10 24a11 11 0 1 1-10-24z'/%3E%3C/g%3E%3C/svg%3E")}
[data-theme=madum]{--bg:#2E5A87;--hd:#1F4FA3;--hdb:#163a78;--ink:#EAF2F8;--lt:#EAF2F8;--dk:#4F7FAF;--frame:#1F3E66;--acc:#F2C14E;--accd:#8a6a14;--wp:#FFFFFF;--bp:#10243A;--pat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cg fill='none' stroke='%23EAF2F8' stroke-width='2' opacity='.07'%3E%3Crect x='4' y='4' width='72' height='72'/%3E%3Cpath d='M40 10l30 30-30 30-30-30z'/%3E%3Ccircle cx='40' cy='40' r='8'/%3E%3C/g%3E%3C/svg%3E")}
[data-theme=limestone]{--bg:#1C1C1C;--hd:#111;--hdb:#CF142B;--ink:#F4F4F4;--lt:#EDEDED;--dk:#1F1F1F;--frame:#0A0A0A;--acc:#CF142B;--accd:#7a0a18;--wp:#FFFFFF;--bp:#151515;--pat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-10 -10 20 20' width='90' height='90'%3E%3Cpath fill='%23fff' opacity='.04' d='M0 0L-4-9 0-6 4-9ZM0 0L-4 9 0 6 4 9ZM0 0L-9-4-6 0-9 4ZM0 0L9-4 6 0 9 4Z'/%3E%3C/svg%3E")}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{margin:0;font-family:"Trebuchet MS",Verdana,sans-serif;color:var(--ink);min-height:100vh;background-color:var(--bg);background-image:radial-gradient(ellipse at 50% 40%,#ffffff14,#0000 60%,#00000055),var(--pat);transition:background-color .3s}
header{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--hd);border-bottom:3px solid var(--hdb);flex-wrap:wrap;color:#fff}
.wm,.wm img{display:inline-block;height:30px;width:auto;line-height:0}
.title{font-size:20px;letter-spacing:1px;color:var(--acc)}header .sp{flex:1}
.sel{font-size:14px;display:flex;align-items:center;gap:6px}
select{font:15px "Trebuchet MS",sans-serif;padding:9px;border-radius:9px;border:2px solid #0002;min-height:44px;background:#fff8e6;color:#213C55}
button{font:bold 15px "Trebuchet MS",sans-serif;background:linear-gradient(#f8eed6,#dccfae);color:#213C55;border:0;border-radius:9px;padding:10px 16px;min-height:44px;box-shadow:0 4px 0 #9c9070;cursor:pointer;margin:3px;touch-action:manipulation;transition:transform .08s}
button:active{transform:translateY(3px);box-shadow:0 1px 0 #9c9070}button:disabled{opacity:.35;cursor:default;transform:none}
button.ic{width:44px;padding:0;font-size:20px;border-radius:50%}
button.ic[aria-pressed=true]{opacity:.55;text-decoration:line-through}
button.gold,button.pri{background:linear-gradient(#f0c35e,#C98E10);color:#1d2e1c;box-shadow:0 4px 0 #7d5808}
[data-theme=limestone] button.gold,[data-theme=limestone] button.pri{background:linear-gradient(#e2354a,#CF142B);color:#fff;box-shadow:0 4px 0 #7a0a18}
button.big{font-size:18px;padding:12px 24px;min-height:52px}
button.tog[aria-pressed=true]{background:linear-gradient(#f0c35e,#C98E10)}
main.game{display:grid;grid-template-columns:minmax(0,min(700px,calc(100vh - 230px))) 290px;gap:14px;justify-content:center;align-items:start;padding:12px;margin:auto;max-width:1300px}
@media(max-width:900px){main.game{grid-template-columns:minmax(0,1fr);padding:6px;gap:8px}}
#table{background:radial-gradient(ellipse at center,#ffffff10,#0000 70%);border-radius:24px;border:2px solid #ffffff1a;padding:10px 12px;box-shadow:inset 0 0 40px #0006}
@media(max-width:600px){#table{padding:6px;border-radius:16px}.title{display:none}.sel span{display:none}}
.boardrow{display:flex;gap:6px;align-items:stretch}.boardwrap{flex:1;min-width:0;position:relative}
.board{position:relative;touch-action:none;display:grid;grid-template-columns:repeat(8,1fr);width:100%;border:10px solid var(--frame);border-radius:12px;overflow:hidden;box-shadow:0 0 0 2px #ffffff22,0 6px 0 #0005,0 18px 30px #0008;user-select:none;
 background:var(--frame)}
.sq{position:relative;aspect-ratio:1;min-width:0;min-height:0;overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation}
.sq.l{background-color:var(--lt)}.sq.d{background-color:var(--dk)}
.sq.last::after{content:"";position:absolute;inset:0;background:var(--acc);opacity:.4}
.sq.sel::after{content:"";position:absolute;inset:0;background:var(--acc);opacity:.65}
.sq.chk{background-image:radial-gradient(circle,#E53E2E 0,#C0392B 40%,transparent 75%)!important}
.sq.chk .pc{animation:wob .5s ease-in-out 2}@keyframes wob{25%{transform:rotate(-8deg)}75%{transform:rotate(8deg)}}
.sq .dot{position:absolute;width:28%;height:28%;border-radius:50%;background:rgba(0,0,0,.28);z-index:2;animation:pip .18s ease-out}
.sq .ring{position:absolute;inset:5%;border-radius:50%;border:5px solid rgba(0,0,0,.3);z-index:2}
@keyframes pip{from{transform:scale(0)}}
.pc{position:relative;z-index:3;font-size:min(10vw,56px);line-height:1;font-family:"Segoe UI Symbol","DejaVu Sans","Noto Sans Symbols2",serif;transition:transform .12s}
.sq.sel .pc{transform:translateY(-6%) scale(1.08)}
.pc.w{color:var(--wp);-webkit-text-stroke:1.6px #111;paint-order:stroke fill;text-shadow:0 3px 0 rgba(0,0,0,.25)}
.pc.b{color:var(--bp);-webkit-text-stroke:1px rgba(255,255,255,.55);paint-order:stroke fill;text-shadow:0 3px 0 rgba(0,0,0,.25)}
.pc.land{animation:land .32s cubic-bezier(.3,1.6,.5,1)}@keyframes land{0%{transform:scale(1.18,.86)}60%{transform:scale(.95,1.06)}100%{transform:none}}
.co{position:absolute;font-size:10px;font-weight:bold;opacity:.7;z-index:1}.co.f{right:3px;bottom:1px}.co.r{left:3px;top:1px}
.sq.l .co{color:var(--dk)}.sq.d .co{color:var(--lt)}
.poof{position:absolute;z-index:8;pointer-events:none;width:12%;aspect-ratio:1;transform:translate(-50%,-50%)}
.poof i{position:absolute;left:50%;top:50%;width:22%;height:22%;border-radius:50%;background:var(--acc)}
.bubble{position:absolute;left:50%;top:50%;z-index:9;pointer-events:none;background:#fff8e6;color:#213C55;font:bold 17px "Trebuchet MS",sans-serif;padding:8px 16px;border-radius:14px;box-shadow:0 4px 0 #9c9070,0 8px 18px #0006;opacity:0;transform:translate(-50%,-50%) scale(.6);white-space:nowrap;max-width:92%;overflow:hidden;text-overflow:ellipsis}
.bubble.go{animation:bub 1.6s cubic-bezier(.2,.9,.3,1.2) both}@keyframes bub{0%{opacity:0;transform:translate(-50%,-40%) scale(.6)}15%{opacity:1;transform:translate(-50%,-50%) scale(1.05)}25%{transform:translate(-50%,-50%) scale(1)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-70%) scale(1)}}
.status{text-align:center;font-size:17px;font-weight:bold;margin:6px auto;padding:9px 14px;max-width:640px;min-height:44px;background:#0000003a;border-radius:12px;border-left:5px solid var(--acc)}
.status small{display:block;font-weight:normal;font-size:13px;opacity:.85;margin-top:2px}
.acts{display:flex;flex-wrap:wrap;justify-content:center}.acts button{min-width:76px}
.panel{background:#0000002e;border:1px solid #ffffff22;border-radius:12px;padding:10px;margin-bottom:10px}
.panel>b{color:var(--acc)}
.phead{display:flex;align-items:center;justify-content:space-between;gap:8px}.phead b{color:var(--acc)}
.nav{display:flex}.nav button{min-height:36px;min-width:38px;padding:2px 6px;margin:2px;box-shadow:0 3px 0 #9c9070}
.row{display:flex;flex-wrap:wrap;gap:2px;margin:6px 0}.small{font-size:12px;opacity:.8;margin:4px 0}
.moves{max-height:260px;overflow:auto;margin-top:8px;font:14px "Courier New",monospace;padding:0}
@media(max-width:900px){.moves{max-height:120px}}
.mrow{display:grid;grid-template-columns:34px 1fr 1fr;align-items:center;border-bottom:1px solid #ffffff12}.mn{opacity:.6;padding-left:4px}
button.mv{font:inherit;font-weight:bold;background:none;border:0;box-shadow:none;border-radius:6px;min-height:30px;padding:2px 6px;margin:1px;text-align:left;display:flex;align-items:center;gap:6px;color:var(--ink)}
button.mv.cur{background:var(--acc);color:#1d2e1c}
.rl{font-style:normal;font-size:11px;font-weight:bold;border-radius:5px;padding:1px 4px;color:#fff;font-family:"Trebuchet MS",sans-serif}
.rl.best{background:#2E7D32}.rl.good{background:#5B7F95}.rl.inaccuracy{background:#C99A06}.rl.mistake{background:#D9661F}.rl.blunder{background:#B71C1C}
.prog{height:8px;border-radius:4px;background:rgba(0,0,0,.25);overflow:hidden}.prog i{display:block;height:100%;width:0;background:var(--acc);transition:width .2s}
.rsum{width:100%;border-collapse:collapse;margin-top:8px;font-size:14px}.rsum td,.rsum th{padding:4px;text-align:left}.rsum td+td,.rsum th+th{text-align:center}
.pbar{display:flex;align-items:center;gap:10px;padding:6px 4px;min-height:52px}
.av{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:bold;font-size:18px;box-shadow:0 3px 0 #0005}
.av.w{background:var(--wp);color:#213C55}.av.b{background:var(--bp);color:#fff;border:2px solid #ffffff55}
.pbar.turn .av{box-shadow:0 0 0 3px var(--acc),0 0 16px var(--acc);animation:breathe 1.6s ease-in-out infinite}@keyframes breathe{50%{transform:scale(1.07)}}
.pinfo{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.pname{font-weight:bold;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.caps{display:flex;flex-wrap:wrap;align-items:center;min-height:20px}
.pc.cap{font-size:17px;margin-right:-3px;text-shadow:none}.pc.cap.svgp{width:19px;height:19px}.pc.cap.svgp svg{filter:none}
.diff{font-size:13px;font-weight:bold;margin-left:8px;opacity:.85}
.clk{font:bold 22px "Courier New",monospace;padding:6px 10px;border-radius:10px;background:#0000004d;color:var(--ink);min-width:92px;text-align:right}
.clk.on{background:linear-gradient(#f8eed6,#dccfae);color:#213C55;box-shadow:0 3px 0 #9c9070}.clk.low.on{background:linear-gradient(#f0c35e,#C98E10);animation:breathe 1s infinite}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0;text-align:left}.grid2 label{display:flex;flex-direction:column;gap:4px;font-size:14px;font-weight:bold}
.seg{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:10px 0}.seg input{position:absolute;opacity:0}
.seg span{display:block;padding:11px 16px;border-radius:10px;background:#fff8e6;box-shadow:0 4px 0 #b9ab85;font-weight:bold;cursor:pointer}
.seg input:checked+span{background:#213C55;color:#F4ECDC;box-shadow:0 4px 0 #0F1E2C}.seg input:focus-visible+span{outline:3px solid #C98E10}
.ov{position:fixed;inset:0;background:#0d1620cc;display:flex;align-items:center;justify-content:center;z-index:40;padding:14px;backdrop-filter:blur(3px)}
.ov .box{background:#F4ECDC;color:#213C55;border-radius:16px;padding:18px 20px;max-width:440px;width:100%;text-align:center;box-shadow:0 20px 50px #000a;max-height:92vh;overflow:auto;animation:pop .3s ease-out}
.ov .box.wide{max-width:600px}@keyframes pop{from{transform:scale(.9);opacity:0}}
.ov h2{margin:10px 0 6px;color:#213C55}.ov p{line-height:1.45}
.ov button:not(.gold):not(.pri){background:#fff8e6;box-shadow:0 4px 0 #b9ab85}.btns{margin-top:12px}
.key{display:inline-block;background:linear-gradient(#f8eed6,#dccfae);color:#213C55;font:bold 16px/1 "Courier New",monospace;letter-spacing:2px;padding:9px 26px;border-radius:8px;box-shadow:0 3px 0 #9c9070;user-select:none}
.ovi{display:flex;justify-content:center;gap:4px;margin-top:4px}.ovi .pc{font-size:64px;animation:hop 1s ease-in-out infinite}.ovi .pc.svgp{width:80px;height:80px}
@keyframes hop{50%{transform:translateY(-10px) rotate(-4deg)}}
.ovs{display:flex;justify-content:center;gap:10px;margin:8px 0;flex-wrap:wrap}.ovs div{background:#213C5512;border-radius:10px;padding:6px 12px;font-size:13px}.ovs b{display:block;font-size:20px}
.dots{margin-top:8px}.dots i{display:inline-block;width:9px;height:9px;border-radius:50%;background:#213C5544;margin:0 3px}.dots i.on{background:#213C55}
.tutfig{display:flex;justify-content:center;gap:10px;margin:12px 0;flex-wrap:wrap}.tutfig figure{margin:0;font-size:12px;font-weight:bold;width:72px}
.tutfig .tp{width:64px;height:64px;margin:auto;background:#6E7F8F;border-radius:12px;display:grid;place-items:center;box-shadow:0 3px 0 #0003}.tutfig .pc{font-size:48px}.tutfig .pc.svgp{width:54px;height:54px}
#promoBtns{display:flex;gap:8px;justify-content:center;margin-top:10px}#promoBtns button{width:70px;height:70px;padding:0;font-size:44px}
#promoBtns .pc.svgp{width:56px;height:56px}
.banner{position:fixed;left:50%;top:40%;z-index:70;font:900 60px/1 "Trebuchet MS",sans-serif;color:var(--acc);letter-spacing:3px;text-shadow:0 4px 0 #0F1E2C,0 0 30px #000;pointer-events:none;transform:translate(-50%,-50%);white-space:nowrap}
.banner.go{animation:ban 1.4s cubic-bezier(.2,.8,.3,1) both}@keyframes ban{0%{transform:translate(-50%,-50%) scale(.2) rotate(-10deg);opacity:0}25%{transform:translate(-50%,-50%) scale(1.15) rotate(3deg);opacity:1}75%{transform:translate(-50%,-50%) scale(1);opacity:1}100%{transform:translate(-50%,-50%) scale(1.3);opacity:0}}
@media(max-width:600px){.banner{font-size:40px}}
.conf{position:fixed;top:-12px;width:10px;height:14px;z-index:80;pointer-events:none;border-radius:2px}
.hidden{display:none!important}
.pc.svgp{-webkit-text-stroke:0;text-shadow:none;width:88%;height:88%;display:flex}.pc.svgp svg{width:100%;height:100%;filter:drop-shadow(0 3px 0 rgba(0,0,0,.3))}
[data-theme=limestone] .sq{background-size:82%;background-position:center;background-repeat:no-repeat}
[data-theme=limestone] .sq .dot{background:#CF142B;box-shadow:0 0 0 2px #fff}
[data-theme=limestone] .sq .ring{border-color:#CF142B;box-shadow:0 0 0 2px #fff,inset 0 0 0 2px #fff}
[data-theme=limestone] .sq.last::after{background:none;opacity:1;box-shadow:inset 0 0 0 4px #CF142B}
[data-theme=limestone] .sq.sel::after{background:none;opacity:1;box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 7px #CF142B}
[data-theme=limestone] .sq.chk{background-image:none!important;box-shadow:inset 0 0 0 4px #fff,inset 0 0 0 8px #CF142B}
[data-theme=limestone] .sq.l .co{color:#555}[data-theme=limestone] .sq.d .co{color:#ddd}
[data-theme=limestone] .rl.best{background:#111}[data-theme=limestone] .rl.good{background:#666}[data-theme=limestone] .rl.inaccuracy{background:#999}[data-theme=limestone] .rl.mistake{background:#CF142B;opacity:.75}[data-theme=limestone] .rl.blunder{background:#CF142B}
[data-theme=limestone] .poof i{background:#CF142B}
.vbtn{min-width:52px}
.evbar{position:relative;flex:none;width:20px;border-radius:6px;overflow:hidden;background:#222;border:2px solid var(--frame)}
.evfill{position:absolute;left:0;right:0;bottom:0;height:50%;background:#F4F4F4;transition:height .3s}
#evTxt{position:absolute;left:0;right:0;font:bold 8px sans-serif;text-align:center}#evTxt.lo{bottom:3px;color:#111}#evTxt.hi{top:3px;color:#fff}
@media(max-width:900px){.evbar{width:14px}}
.arrows{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:6;color:var(--acc);overflow:visible}
.arrows line{stroke:currentColor;stroke-width:.17;stroke-linecap:round;opacity:.85}.arrows line.hint{stroke-dasharray:.28 .2;opacity:1}
.sq.mk::before{content:"";position:absolute;inset:0;background:var(--acc);opacity:.5;z-index:1}
[data-theme=limestone] .sq.mk::before{background:none;opacity:1;box-shadow:inset 0 0 0 5px #CF142B,inset 0 0 0 9px rgba(207,20,43,.25)}
.sq.pm::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(45deg,rgba(0,0,0,.28) 0 6px,transparent 6px 12px);z-index:1}
.sq.hov{box-shadow:inset 0 0 0 4px rgba(255,255,255,.8)}.sq.ann{box-shadow:inset 0 0 0 4px var(--acc)}
.ghost{position:fixed;left:0;top:0;z-index:50;pointer-events:none;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 12px 6px rgba(0,0,0,.35))}
.ghost .pc{font-size:min(13vw,70px)}.ghost .pc.svgp{width:100%;height:100%}
.board3d{position:relative;width:100%;aspect-ratio:1/1;border-radius:16px;overflow:hidden;touch-action:none;background:radial-gradient(ellipse at 50% 60%,#ffffff18,#0000 70%)}
.board3d canvas{display:block;width:100%!important;height:100%!important;touch-action:none;cursor:grab}
.cam{position:absolute;top:8px;right:8px;min-height:36px;padding:4px 12px;font-size:13px;z-index:2}
@media(min-width:901px){.board3d{aspect-ratio:1/.92}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
[data-theme=limestone] .sq.l{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-10 -10 20 20'%3E%3Cpath transform='translate(.45 .45)' fill='%23FFFFFF' fill-opacity='1' d='M0 0L-4-9 0-6 4-9ZM0 0L-4 9 0 6 4 9ZM0 0L-9-4-6 0-9 4ZM0 0L9-4 6 0 9 4Z'/%3E%3Cpath transform='translate(-.45 -.45)' fill='%23000000' fill-opacity='0.28' d='M0 0L-4-9 0-6 4-9ZM0 0L-4 9 0 6 4 9ZM0 0L-9-4-6 0-9 4ZM0 0L9-4 6 0 9 4Z'/%3E%3Cpath fill='%23E6E6E6' fill-opacity='1' d='M0 0L-4-9 0-6 4-9ZM0 0L-4 9 0 6 4 9ZM0 0L-9-4-6 0-9 4ZM0 0L9-4 6 0 9 4Z'/%3E%3C/svg%3E")}
[data-theme=limestone] .sq.d{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-10 -10 20 20'%3E%3Cpath transform='translate(.45 .45)' fill='%23FFFFFF' fill-opacity='0.16' d='M0 0L-4-9 0-6 4-9ZM0 0L-4 9 0 6 4 9ZM0 0L-9-4-6 0-9 4ZM0 0L9-4 6 0 9 4Z'/%3E%3Cpath transform='translate(-.45 -.45)' fill='%23000000' fill-opacity='0.85' d='M0 0L-4-9 0-6 4-9ZM0 0L-4 9 0 6 4 9ZM0 0L-9-4-6 0-9 4ZM0 0L9-4 6 0 9 4Z'/%3E%3Cpath fill='%231F1F1F' fill-opacity='1' d='M0 0L-4-9 0-6 4-9ZM0 0L-4 9 0 6 4 9ZM0 0L-9-4-6 0-9 4ZM0 0L9-4 6 0 9 4Z'/%3E%3C/svg%3E")}
@media(max-width:600px){header{gap:4px;padding:6px 8px}header button{margin:2px;padding:8px 10px;font-size:14px}header button.ic{width:38px;min-height:38px;font-size:17px}.wm img{height:24px}header select{padding:6px;min-height:38px;font-size:14px}}

/* coach */
.coach{position:relative}.coach .chd{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.cav{width:52px;height:52px;flex:none;filter:drop-shadow(0 3px 0 rgba(0,0,0,.15))}.cav svg{width:100%;height:100%}
.cnm{flex:1;line-height:1.15}.cnm small{display:block;font-size:12px;opacity:.75;font-style:italic}
.coach select{font:inherit;font-size:13px;padding:4px 6px;border-radius:8px;border:2px solid var(--frame);background:#fffaf0}
.cmsg{position:relative;background:#fffaf0;color:#213C55;border:2px solid var(--frame);border-radius:14px;padding:10px 12px;font-size:14.5px;line-height:1.4;box-shadow:0 3px 0 rgba(0,0,0,.12)}
.cmsg:before{content:"";position:absolute;left:18px;top:-9px;width:14px;height:14px;background:#fffaf0;border-left:2px solid var(--frame);border-top:2px solid var(--frame);transform:rotate(45deg)}
.cmsg p{margin:4px 0 0}.cmsg.in{animation:cin .3s ease-out}@keyframes cin{from{transform:translateY(6px);opacity:0}to{transform:none;opacity:1}}
.cmsg.blunder{border-color:#C0392B}.cmsg.mistake{border-color:#D9822B}.cmsg.inaccuracy{border-color:#D4B23A}.cmsg.brilliant{border-color:#1A9FB5}.cmsg.great{border-color:#3C6FD1}
.rate{display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:2px 7px;border-radius:999px;color:#fff;background:#5E8C4A;margin-right:4px;vertical-align:1px}
.rate.brilliant{background:#1A9FB5}.rate.great{background:#3C6FD1}.rate.good{background:#5E8C4A}.rate.inaccuracy{background:#C9A227}.rate.mistake{background:#D9822B}.rate.blunder{background:#C0392B}
.cbtns{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.cbtns:empty{display:none}.cbtns button{font-size:13px;padding:6px 12px}
.chint{margin-top:8px;padding:8px 10px;border-radius:10px;background:rgba(224,176,74,.18);border:1.5px dashed #C9A227;font-size:13.5px}
.cthink{display:flex;gap:4px;padding:6px 4px 0}.cthink i{width:7px;height:7px;border-radius:50%;background:var(--acc);animation:dot 1s infinite}.cthink i:nth-child(2){animation-delay:.15s}.cthink i:nth-child(3){animation-delay:.3s}
@keyframes dot{50%{transform:translateY(-4px);opacity:.4}}
.csum{margin-top:10px;font-size:14px}.csum .acc{position:relative;display:flex;justify-content:space-between;padding:6px 10px;margin:6px 0;border-radius:10px;background:rgba(0,0,0,.06);overflow:hidden}
.csum .acc i{position:absolute;left:0;bottom:0;height:4px;background:#5E8C4A;border-radius:0 4px 4px 0}.csum .acc b{font-size:18px}
.csum .small{font-size:12.5px;opacity:.8;margin:8px 0 4px}.keys{display:flex;flex-direction:column;gap:6px}.km{text-align:left;font-size:13px;padding:6px 10px}
.tips{margin:0;padding-left:18px}.tips li{margin:3px 0}
.coach.off .cmsg,.coach.off .cbtns{opacity:.6}
svg .coach{stroke:#2E9E5B;opacity:.9}
@media(max-width:430px){header{flex-wrap:nowrap;gap:3px;padding:6px}header button{white-space:nowrap;margin:1px;padding:8px 8px;font-size:13.5px}header button.ic{width:34px;min-width:34px;min-height:36px;padding:0}.wm img{height:20px}header select{max-width:86px;padding:5px 4px}.vbtn,.lbtn{min-width:0}}
a.lsn{font:bold 15px "Trebuchet MS",sans-serif;background:linear-gradient(#f0c35e,#C98E10);color:#1d2e1c;box-shadow:0 4px 0 #7d5808;border-radius:9px;padding:10px 14px;min-height:44px;box-sizing:border-box;display:inline-flex;align-items:center;text-decoration:none;white-space:nowrap}
@media(max-width:430px){a.lsn.hl{display:none}a.lsn{padding:8px;font-size:13.5px;min-height:36px;margin:1px}}
