:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;color:#e8eef8;background:#0b1220}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.4;cursor:not-allowed}.shell{max-width:1240px;margin:auto;padding:22px}.top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.brand{font-size:23px;font-weight:850;letter-spacing:-1px}.brand b{color:#55d9b4}.muted{color:#91a1ba}.tabs{display:flex;gap:7px;flex-wrap:wrap;margin:25px 0}.btn,.tab,select,input{background:#172337;color:#e8eef8;border:1px solid #304158;border-radius:11px;padding:11px 15px}.btn:hover,.tab:hover{border-color:#55d9b4}.primary,.active{background:#196c60!important;border-color:#39cda7!important;color:#fff}.panel{background:#111d30;border:1px solid #26374e;border-radius:18px;padding:20px;margin-bottom:16px}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.stat{background:#18283e;border-radius:12px;padding:15px}.stat strong{display:block;font-size:25px;margin-top:7px}.flex{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.between{justify-content:space-between}.row{display:flex;gap:14px;flex-wrap:wrap}.row>*{flex:1;min-width:150px}label{display:block;color:#9babc1;font-size:13px;margin-bottom:7px}select,input{width:100%}.table{min-height:340px;background:radial-gradient(ellipse at center,#163c3a,#10272e 75%);border:1px solid #245651;border-radius:22px;padding:24px;text-align:center}.cards{display:flex;justify-content:center;gap:7px;flex-wrap:wrap;min-height:100px;margin:12px 0 22px}.card{width:62px;height:90px;background:#f7f9fd;color:#162136;border-radius:8px;box-shadow:0 8px 20px #0005;display:flex;align-items:center;justify-content:center;font-size:23px;font-weight:800;animation:deal .3s ease-out}.red{color:#c83d56}.back{background:repeating-linear-gradient(45deg,#253f70,#253f70 7px,#426aa0 7px,#426aa0 12px);border:4px solid #eee;color:transparent}@keyframes deal{from{opacity:0;transform:translateY(-25px) rotate(-8deg)}to{opacity:1;transform:none}}.hand{padding:13px;border:1px solid #47706b;border-radius:13px;margin:10px 0;min-width:190px}.hand.current{border:2px solid #50d6b3;box-shadow:0 0 0 2px #50d6b322}.hand .cards{min-height:90px;margin:8px 0}.small{font-size:13px}.good{color:#5fe0b9}.bad{color:#ff8797}.notice{background:#20364c;border-left:3px solid #5fe0b9;padding:12px;border-radius:7px;margin:14px 0}.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.actions button{flex:1;min-width:95px}.pill{border-radius:30px;background:#223b49;padding:5px 10px;font-size:12px}.history{max-height:230px;overflow:auto}.history div{padding:7px;border-bottom:1px solid #26374e}.footer{text-align:center;color:#8293a9;padding:25px;font-size:12px}@media(max-width:700px){.shell{padding:12px}.grid{grid-template-columns:repeat(2,1fr)}.panel{padding:14px}.table{padding:12px}.card{width:46px;height:69px;font-size:19px}.row>*{min-width:120px}.brand{font-size:20px}}

/* CountLab v2 — responsive visual system */
:root{color-scheme:dark;--surface:#111b2b;--line:#26364c;--accent:#56ddbb}body{background:radial-gradient(ellipse 90% 45% at 50% -10%,#163249 0%,#0b1220 75%);min-height:100vh}.shell{max-width:1320px;padding:clamp(12px,2.4vw,30px)}.top{padding:8px 0 16px;border-bottom:1px solid var(--line)}.brand{font-size:clamp(20px,2vw,27px)}.tabs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:18px 0 24px}.tab{padding:13px 6px;font-weight:650;font-size:clamp(11px,1.15vw,14px);white-space:normal;min-height:48px}.panel{background:linear-gradient(155deg,#142238,#101a2b);box-shadow:0 12px 35px #0002;border-color:var(--line);padding:clamp(16px,2vw,26px)}.panel h2{font-size:clamp(20px,2.3vw,28px);letter-spacing:-.6px;margin-top:0}.stat{background:#1a2a40;border:1px solid #2b4057;min-width:0}.stat strong{font-variant-numeric:tabular-nums}.table{background:radial-gradient(ellipse at 50% 50%,#164b47 0%,#102d34 75%);border:1px solid #2d6962;box-shadow:inset 0 0 60px #061a2644;padding:clamp(12px,2vw,28px)}.hand{background:#092d3080;flex:1 1 190px;max-width:290px}.cards{gap:clamp(3px,.65vw,9px)}.card{flex:0 0 auto}.btn,.tab,select,input{transition:border-color .18s,background .18s,transform .18s;outline-offset:3px}.btn:active,.tab:active{transform:scale(.98)}input:focus-visible,select:focus-visible,.btn:focus-visible,.tab:focus-visible{outline:2px solid var(--accent)}.actions{gap:10px}.actions button{min-height:46px}.signed-tools{display:flex;align-items:center;gap:10px;margin-top:8px}.sign-btn{min-width:80px;font-weight:800;font-size:18px;padding:8px 12px}#answer,#speedanswer{font-size:20px;font-variant-numeric:tabular-nums;min-height:50px}.notice{line-height:1.55}.footer{line-height:1.7}
@media(max-width:850px){.tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.table>.flex{gap:7px}.hand{min-width:155px}.hand .card{width:43px;height:62px;font-size:17px}}
@media(max-width:520px){.shell{padding:10px}.top{align-items:flex-start}.top>.flex{width:100%;justify-content:space-between}.brand .pill{font-size:9px;vertical-align:middle}.tabs{gap:5px;margin:12px 0}.tab{font-size:12px;padding:9px 4px;min-height:43px}.panel{padding:14px;border-radius:14px}.grid{gap:7px}.stat{padding:11px}.stat strong{font-size:21px}.row{gap:9px}.row>*{flex:1 1 100%;min-width:0}.table{border-radius:16px;padding:11px 7px;min-height:280px}.table>.flex{flex-direction:column;align-items:stretch}.hand{width:100%;max-width:none;min-width:0;margin:4px 0}.card{width:clamp(33px,10vw,45px);height:clamp(49px,14vw,66px);font-size:16px}.cards{gap:4px;min-height:65px;margin:10px 0}.hand .cards{min-height:65px}.actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.actions button{min-width:0;padding:10px 6px;font-size:13px}.actions button:only-child{grid-column:1/-1}.pill{padding:4px 7px}.footer{padding:20px 5px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* CountLab v3: responsive guided lessons */
.lesson-head,.lesson-controls{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}.lesson-head h2{margin:12px 0 0}.lesson-progress{height:5px;background:#26374e;border-radius:12px;overflow:hidden;margin:20px 0}.lesson-progress>div{height:100%;background:#55d9b4;transition:width .3s}.lesson-slide{position:relative;border:1px solid #2a415a;background:linear-gradient(135deg,#1a3044,#132338);border-radius:17px;padding:clamp(18px,4vw,38px);min-height:340px;animation:deal .22s ease-out}.lesson-number{color:#5fe0b9;font-size:13px;font-weight:800;letter-spacing:2px}.lesson-slide h3{font-size:clamp(22px,3vw,34px);margin:12px 0}.lesson-slide p{line-height:1.75;max-width:800px}.lesson-example{border-left:3px solid #55d9b4;background:#0b182899;padding:12px 18px;border-radius:7px;margin:24px 0}.lesson-example p{margin:8px 0}.lesson-controls{margin-top:20px}.lesson-dots{display:flex;justify-content:center;flex-wrap:wrap;gap:7px}.lesson-dot{height:10px;width:10px;border:0;padding:0;border-radius:100%;background:#496078}.lesson-dot.selected{background:#55d9b4;transform:scale(1.3)}@media(max-width:620px){.lesson-controls{display:grid;grid-template-columns:1fr 1fr}.lesson-controls>.lesson-dots{grid-row:1;grid-column:1/-1}.lesson-slide{min-height:0}.lesson-controls>.btn{min-height:44px;padding:10px 8px}}
