:root{--bg:#1f1f1f;--panel:#2a2a2a;--btn:#383838;--felt:#474747;--deep:#121212;--line:gray;--text:#f6f1e6;--soft:#e6e6e6;--muted:#cfcfcf;--dim:#a6a6a6;--orange:#f28c28;--orange-dark:#b8651a;--orange-tint:#3a2616;--orange-light:#ffc48a;--ink:#1b1a16;--red:#c8372d;--good:#5fd39a;--bad:#f2836b;--display:"Bricolage Grotesque", system-ui, sans-serif;--body:"DM Sans", system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0}body{background:var(--bg);color:var(--text);font-family:var(--body);border-top:6px solid var(--orange);min-height:100vh;font-size:17px;line-height:1.55}a{color:var(--text)}a:hover{color:var(--orange)}h1,h2,h3{font-family:var(--display);margin:0;line-height:1.1}p{margin:0}:focus-visible{outline:3px solid var(--orange);outline-offset:3px}.wrap{max-width:1140px;margin:0 auto;padding:0 24px 64px}.accent{color:var(--orange)}.muted{color:var(--muted)}.dim{color:var(--dim)}.eyebrow{letter-spacing:1.5px;text-transform:uppercase;color:var(--orange);font-size:14px;font-weight:700}.stack{flex-direction:column;gap:16px;display:flex}.row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;display:grid}.panel{background:var(--panel);border-radius:22px;padding:24px}.panel-orange{background:var(--orange-tint);border:1px solid var(--orange-dark);border-radius:22px;padding:24px}.header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;display:flex}.logo{font-family:var(--display);color:var(--text);align-items:center;gap:10px;font-size:24px;font-weight:800;text-decoration:none;display:flex}.logo:hover{color:var(--text)}.nav{flex-wrap:wrap;gap:24px;font-weight:500;display:flex}.nav a{border-bottom:3px solid #0000;padding-bottom:4px;text-decoration:none}.nav a.active{border-bottom-color:var(--orange)}.chip{background:var(--panel);border-radius:12px;padding:8px 14px;font-size:15px;font-weight:700}.btn{font:inherit;cursor:pointer;border:2px solid #0000;border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:14px 22px;font-weight:700;text-decoration:none;transition:transform 80ms,box-shadow 80ms;display:inline-flex}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--orange);color:var(--ink);box-shadow:0 4px 0 var(--orange-dark)}.btn-primary:hover{color:var(--ink)}.btn-primary:active:not(:disabled){box-shadow:0 1px 0 var(--orange-dark);transform:translateY(3px)}.btn-outline{border-color:var(--orange);color:var(--orange);background:0 0}.btn-ghost{border-color:var(--line);color:var(--text);background:0 0}.btn-lg{padding:18px 28px;font-size:18px}.choices{flex-direction:column;gap:10px;display:flex}.choice{text-align:left;width:100%;font:inherit;cursor:pointer;background:var(--btn);color:var(--text);border:2px solid var(--btn);box-shadow:0 3px 0 var(--deep);border-radius:14px;padding:14px 18px;font-size:17px;font-weight:700}.choice:hover:not(:disabled){border-color:var(--orange)}.choice.selected{background:var(--orange);border-color:var(--orange);color:var(--ink);box-shadow:0 3px 0 var(--orange-dark)}.choice:disabled{cursor:default}.choice.dimmed{opacity:.55}.feedback{background:var(--text);color:var(--ink);border-top:6px solid var(--good);border-radius:16px;flex-direction:column;gap:6px;padding:16px 18px;display:flex}.feedback strong{font-family:var(--display);font-size:19px}.feedback.correct{border-top-color:#e39b2d}.feedback.erreur{border-top-color:var(--red)}.verdict-excellent{color:#1c6e4a}.verdict-correct{color:#8a5300}.verdict-erreur{color:#a12a21}.cards{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.card{width:54px;height:76px;color:var(--ink);font-family:var(--display);background:#fffdf8;border-radius:9px;flex-direction:column;justify-content:space-between;padding:6px 8px;font-weight:700;display:flex;box-shadow:0 3px #0000004d}.card.red{color:var(--red)}.card .rank{font-size:20px;line-height:1}.card .suit{align-self:flex-end;font-size:26px;line-height:1}.card.small{width:40px;height:56px;padding:4px 6px}.card.small .rank{font-size:15px}.card.small .suit{font-size:19px}.table-felt{background:var(--felt);border:8px solid var(--orange);box-shadow:0 6px 0 var(--orange-dark);border-radius:140px;flex-direction:column;align-items:center;gap:12px;padding:28px 20px;display:flex}.pot{background:var(--deep);color:var(--orange);border-radius:999px;padding:4px 12px;font-size:14px;font-weight:700}.seat-label{background:var(--deep);border-radius:999px;padding:4px 12px;font-size:13px;font-weight:700}.seat-label.me{background:var(--orange);color:var(--ink)}.tag{background:var(--orange);color:var(--ink);border-radius:999px;padding:5px 10px;font-size:13px;font-weight:700;display:inline-block}.tag-outline{color:var(--orange);border:1px solid var(--orange);background:0 0}.tag-done{background:var(--good);color:#0f2e1f}.progress{background:var(--deep);border-radius:999px;height:10px;overflow:hidden}.progress>span{background:var(--orange);border-radius:999px;height:100%;transition:width .3s;display:block}.steps{gap:6px;display:grid}.steps span{background:var(--btn);border-radius:999px;height:8px}.steps span.on{background:var(--orange)}.demo-banner{background:var(--orange-tint);border:1px dashed var(--orange);color:var(--orange-light);border-radius:12px;padding:10px 14px;font-size:14px}.big-number{font-family:var(--display);color:var(--orange);font-size:44px;font-weight:800;line-height:1}.field{flex-direction:column;gap:6px;display:flex}.field label{font-size:15px;font-weight:700}.field input{border:2px solid var(--line);background:var(--panel);color:var(--text);font:inherit;border-radius:12px;padding:15px 16px}.field input:focus{border-color:var(--orange);outline:none}.error{color:var(--bad);font-weight:700}.success{color:var(--good);font-weight:700}.lesson-body p{color:var(--muted)}.lesson-body ul,.lesson-body ol{color:var(--muted);flex-direction:column;gap:6px;margin:0;padding-left:22px;display:flex}.lesson-body strong{color:var(--text)}.lesson-body table{border-collapse:collapse;width:100%;font-size:15px}.lesson-body th,.lesson-body td{text-align:left;border-bottom:1px solid var(--btn);vertical-align:top;padding:9px 10px}.lesson-body th{color:var(--orange);font-weight:700}.lesson-body td{color:var(--muted)}.table-scroll{overflow-x:auto}.lesson-body .feedback p,.lesson-body .feedback strong{color:var(--ink)}.feedback strong.verdict-excellent{color:#1c6e4a}.feedback strong.verdict-correct{color:#8a5300}.feedback strong.verdict-erreur{color:#a12a21}.range-grid{grid-template-columns:repeat(13,minmax(0,1fr));gap:2px;max-width:520px;display:grid}.range-cell{aspect-ratio:1;background:var(--deep);color:var(--dim);border-radius:4px;justify-content:center;align-items:center;font-size:11px;font-weight:700;display:flex}.range-cell.pair{outline:1px solid var(--btn);background:#1a1a1a}.range-cell.on{background:var(--orange);color:var(--ink);outline:none}@media (width<=640px){.range-cell{border-radius:3px;font-size:8px}}.footer{border-top:1px solid var(--line);color:var(--dim);flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:64px;padding-top:24px;font-size:14px;display:flex}@media (width<=640px){body{font-size:16px}.wrap{padding:0 16px 48px}.nav{gap:16px;font-size:15px}.table-felt{border-radius:70px;padding:22px 12px}.card{width:46px;height:66px}.big-number{font-size:36px}}@media (prefers-reduced-motion:reduce){.btn,.progress>span{transition:none}}.game-felt{background:var(--felt);border:10px solid var(--orange);box-shadow:0 8px 0 var(--orange-dark);border-radius:160px;flex-direction:column;justify-content:space-between;gap:18px;min-height:420px;padding:22px 20px;display:flex}.seat{flex-direction:column;align-items:center;gap:8px;display:flex}.bubble{background:var(--text);color:var(--ink);border-radius:14px 14px 14px 4px;padding:8px 12px;font-size:15px;font-weight:700}.card-back{background:repeating-linear-gradient(45deg, var(--orange) 0 6px, var(--orange-dark) 6px 12px);border:3px solid #fffdf8;border-radius:9px;width:54px;height:76px;box-shadow:0 3px #0000004d}.card-back.small{width:40px;height:56px}.card-slot{border:2px dashed var(--line);border-radius:9px;width:54px;height:76px}.action-bar{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;display:grid}.action-bar .choice{text-align:center}.action-bar .primary-action{border-color:var(--orange)}@media (width<=640px){.game-felt{border-width:8px;border-radius:60px;min-height:360px;padding:18px 10px}.card-slot,.card-back{width:46px;height:66px}.action-bar{grid-template-columns:repeat(2,minmax(0,1fr))}}
