@font-face{font-family:"Noto Sans Arabic";font-style:normal;font-weight:100 900;font-display:swap;src:url("/theme/noto-sans-arabic.woff2") format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url("/theme/inter-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url("/theme/inter-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* MyClassKit · Games (teacher library + public player). Uses the MyClassKit dark palette. */
:root{
  --g-bg:#efe9dd;--g-card:#fbf8f1;--g-card2:#f6f1e7;--g-line:rgba(22,21,20,0.132);--g-line2:rgba(22,21,20,0.207);
  --g-ink:#161514;--g-soft:#8d8a83;--g-mute:#5a534b;--g-blue:#2f62d9;--g-mint:#1f8a5a;--g-amber:#f2b31d;--g-coral:#d8383b;--g-violet:#6b4fd8;--g-pink:#b0286c;
  --g-font:"Inter","Noto Sans Arabic","Noto Kufi Arabic",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--g-bg)!important;color:var(--g-ink);font:400 15px/1.5 var(--g-font);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
[hidden]{display:none!important}
.g-wrap{max-width:1320px;margin:0 auto;padding:28px 28px 60px}
.g-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin-bottom:22px}
.g-top h1{margin:0;font-size:26px;font-weight:650;letter-spacing:-.02em}
.g-top p{margin:3px 0 0;color:var(--g-mute);font-size:14px}
.g-actions{display:flex;flex-wrap:wrap;gap:8px}
.g-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:8px 16px;border:1px solid var(--g-line2);border-radius:999px;background:rgba(255,253,248,calc(0.26 * var(--wash-k,1)));color:var(--g-soft);font-weight:560;font-size:14px;text-decoration:none;white-space:nowrap;transition:background .15s,border-color .15s,color .15s}
.g-btn:hover{background:rgba(255,253,248,calc(0.54 * var(--wash-k,1)));color:var(--n-ink,#161514)}
.g-btn svg{width:17px;height:17px;flex:0 0 auto}
.g-btn.primary{background:var(--g-blue);border-color:var(--g-blue);color:#161514}
.g-btn.primary:hover{filter:brightness(1.07)}
.g-btn.mint{background:var(--g-mint);border-color:var(--g-mint);color:#161514}
.g-btn.danger{color:var(--g-coral);border-color:rgba(216,56,59,0.402)}
.g-btn.danger:hover{background:rgba(216,56,59,0.115)}
.g-btn.small{min-height:34px;padding:5px 12px;font-size:13px}
.g-btn[disabled]{opacity:.5;cursor:not-allowed}
.g-icon{display:inline-grid;place-items:center;width:38px;height:38px;border:0;border-radius:12px;background:transparent;color:var(--g-mute)}
.g-icon:hover{background:rgba(255,253,248,calc(0.54 * var(--wash-k,1)));color:var(--n-ink,#161514)}
.g-icon svg{width:19px;height:19px}
.g-tabs{display:flex;gap:6px;margin-bottom:18px}
.g-tabs button{padding:8px 16px;border:1px solid var(--g-line2);border-radius:999px;background:transparent;color:var(--g-soft);font-weight:600;font-size:14px}
.g-tabs button[aria-selected="true"]{background:var(--g-ink);border-color:var(--g-ink);color:var(--n-onink,#fffdf8)}
.g-search{flex:1 1 260px;max-width:360px;height:40px;padding:0 16px;border:1px solid var(--g-line2);border-radius:999px;background:rgba(255,253,248,calc(0.26 * var(--wash-k,1)));outline:none}
.g-search:focus{border-color:var(--g-blue)}
.g-empty{display:grid;justify-items:center;gap:10px;padding:56px 20px;border:1.5px dashed var(--g-line2);border-radius:24px;text-align:center;color:var(--g-mute)}
.g-empty b{color:var(--g-ink);font-size:18px}
.g-msg{min-height:20px;margin:8px 0;color:var(--g-mute);font-size:13px}
.g-msg.err{color:var(--g-coral)}

/* library cards */
.g-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.g-card{display:grid;grid-template-rows:auto 1fr auto;border:1px solid var(--g-line);border-radius:22px;background:var(--g-card);overflow:hidden;transition:transform .15s,border-color .15s}
.g-card:hover{transform:translateY(-2px);border-color:var(--g-line2)}
.g-cover{position:relative;display:grid;place-items:center;aspect-ratio:16/8;padding:16px;border:0;background:#2b2a28;color:#fffdf8;text-align:center;font-weight:700;font-size:20px;letter-spacing:-.01em;overflow:hidden}
.g-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.g-cover span{position:relative;text-shadow:none}
.g-cover-badge{font-style:normal;position:absolute;left:10px;top:10px;padding:3px 9px;border-radius:999px;background:rgba(var(--ink-rgb,22,21,20),0.455);color:var(--n-ink,#161514);font-size:11.5px;font-weight:600}
.g-card-body{padding:14px 16px 6px;display:grid;gap:4px;align-content:start}
.g-card-body h3{margin:0;font-size:16px;font-weight:600;line-height:1.3}
.g-meta{display:flex;flex-wrap:wrap;gap:10px;color:var(--g-mute);font-size:12.5px}
.g-meta span{display:inline-flex;align-items:center;gap:4px}
.g-meta svg{width:13px;height:13px}
.g-card-foot{display:flex;align-items:center;gap:6px;padding:10px 12px 12px}
.g-card-foot .g-btn{flex:1}

/* game page */
.g-game{display:grid;grid-template-columns:320px minmax(0,1fr);gap:20px;align-items:start}
.g-side{position:sticky;top:16px;border:1px solid var(--g-line);border-radius:22px;background:var(--g-card);overflow:hidden}
.g-code{padding:14px;background:#2b2a28;color:#fffdf8;text-align:center;font-weight:700;font-size:20px;letter-spacing:.02em}
.g-side-body{display:grid;gap:10px;padding:14px 16px 16px}
.g-side-body h2{margin:0;font-size:18px;font-weight:650;text-align:center}
.g-side-body p{margin:0;color:var(--g-mute);font-size:13.5px;text-align:center}
.g-side-body .g-meta{justify-content:center}
.g-mode{display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;border:0;border-radius:14px;color:var(--n-ink,#161514);font-weight:650;font-size:16px}
.g-mode svg{width:19px;height:19px}
.g-mode.play{background:#d8383b}.g-mode.study{background:#2b2a28}.g-mode.slides{background:#2b2a28}.g-mode.share{background:#2b2a28}
.g-mode:hover{filter:brightness(1.08)}
.g-side-tools{display:flex;justify-content:space-around;padding:4px;border-radius:14px;background:rgba(255,253,248,calc(0.33 * var(--wash-k,1)))}
.g-switch{display:inline-flex;align-items:center;gap:10px;justify-self:center;color:var(--g-mute);font-size:13px}
.g-switch{cursor:pointer}.g-switch input{width:18px;height:18px;margin:0;accent-color:var(--g-blue);cursor:pointer}
.g-qbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.g-qgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.g-q{position:relative;display:grid;grid-template-rows:1fr auto;min-height:150px;padding:14px 14px 10px;border:1px solid var(--g-line);border-radius:18px;background:var(--g-card);cursor:pointer;text-align:center}
.g-q:hover{border-color:rgba(47,98,217,0.517)}
.g-q-text{display:grid;align-content:start;gap:8px;font-weight:560;font-size:15.5px;line-height:1.4;word-break:break-word}
.g-q-text img{max-width:100%;max-height:96px;margin:0 auto;border-radius:10px;object-fit:cover}
.g-q-ans{color:var(--g-mint);font-size:13.5px;font-weight:500}
.g-q-foot{display:flex;align-items:center;justify-content:space-between;margin-top:8px;color:var(--g-amber);font-size:13px;font-weight:650}
.g-q-foot .mc{color:var(--g-violet);font-weight:600}
.g-q-num{position:absolute;left:10px;top:8px;color:var(--g-mute);font-size:11px;font-weight:600}
.g-q-menu{display:flex;gap:2px}
.g-q-menu button{width:30px;height:30px;border:0;border-radius:9px;background:transparent;color:var(--g-mute)}
.g-q-menu button:hover{background:rgba(255,253,248,calc(0.54 * var(--wash-k,1)));color:var(--n-ink,#161514)}
.g-q-menu svg{width:15px;height:15px}
.g-hide-ans .g-q-ans{display:none}

/* forms */
.g-panel{margin-bottom:18px;padding:20px;border:1px solid rgba(47,98,217,0.402);border-radius:22px;background:var(--g-card)}
.g-panel h2{margin:0 0 14px;font-size:18px;font-weight:650}
.g-form{display:grid;grid-template-columns:1fr 1fr;gap:14px 20px}
.g-field{display:grid;gap:6px;min-width:0}
.g-field.full{grid-column:1/-1}
.g-field>span{color:var(--g-soft);font-size:13.5px;font-weight:600}
.g-field small{color:var(--g-mute);font-size:12.5px}
.g-input{width:100%;min-height:44px;padding:10px 14px;border:1px solid var(--g-line2);border-radius:12px;background:rgba(255,253,248,calc(0.33 * var(--wash-k,1)));color:var(--g-ink);outline:none;color-scheme:light}
.g-input:focus{border-color:var(--g-blue);box-shadow:0 0 0 3px rgba(var(--ink-rgb,22,21,20),0.18)}
textarea.g-input{min-height:84px;resize:vertical;line-height:1.5}
.g-img-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.g-img-row .g-input{flex:1 1 200px}
.g-file{position:relative;overflow:hidden}
.g-file input{position:absolute;inset:0;opacity:0;cursor:pointer}
.g-img-prev{display:flex;align-items:center;gap:10px}
.g-img-prev img{width:72px;height:54px;border-radius:10px;object-fit:cover;border:1px solid var(--g-line2)}
.g-img-drop{border:1.5px dashed transparent;border-radius:14px;padding:2px;transition:border-color .15s,background .15s}
.g-img-drop.over{border-color:var(--g-mint);background:rgba(31,138,90,0.081)}
.g-radios{display:grid;gap:8px}
.g-radio{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--g-line);border-radius:14px;cursor:pointer}
.g-radio:has(input:checked){border-color:var(--g-blue);background:rgba(47,98,217,0.092)}
.g-radio input{accent-color:var(--g-blue);width:17px;height:17px;margin:0}
.g-radio b{font-weight:600}.g-radio em{color:var(--g-mute);font-style:normal;font-size:13.5px}
.g-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:16px}
.g-badge{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);font-size:12px;font-weight:700}
.g-choices{display:grid;gap:8px}
.g-choice{display:grid;grid-template-columns:28px 1fr;align-items:center;gap:8px}
.g-choice i{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:rgba(216,56,59,0.172);color:var(--g-coral);font-style:normal;font-weight:700;font-size:13px}
.g-choice.ok i{background:rgba(31,138,90,0.184);color:var(--g-mint)}
.g-tips{margin:12px 0 0;padding-left:20px;color:var(--g-mute);font-size:13.5px}
.g-tips li{margin:3px 0}
.g-delims{display:flex;flex-wrap:wrap;gap:8px}
.g-delims label{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border:1px solid var(--g-line);border-radius:999px;cursor:pointer}
.g-delims label:has(input:checked){border-color:var(--g-blue);background:rgba(47,98,217,0.092)}
.g-delims input[type=radio]{accent-color:var(--g-blue);margin:0}
.g-delims input[type=text]{width:46px;height:28px;padding:0 6px;border:1px solid var(--g-line2);border-radius:8px;background:rgba(255,253,248,calc(0.33 * var(--wash-k,1)));text-align:center}
.g-preview-list{display:grid;gap:6px;max-height:220px;overflow:auto;margin-top:10px;padding:10px;border-radius:14px;background:rgba(255,253,248,calc(0.26 * var(--wash-k,1)));font-size:13.5px}
.g-preview-list div{display:grid;grid-template-columns:28px 1fr 1fr;gap:10px}
.g-preview-list b{color:var(--g-mute);font-weight:600}
.g-preview-list span:last-child{color:var(--g-mint)}

/* modal */
.g-modal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:20px;background:rgba(22,21,20,0.504);backdrop-filter:blur(4px)}
.g-modal-box{width:min(520px,100%);max-height:100%;overflow:auto;padding:24px;border:1px solid var(--g-line2);border-radius:24px;background:var(--g-card);box-shadow:none}
.g-modal-box h2{margin:0 0 6px;font-size:20px}
.g-modal-box p{margin:0 0 14px;color:var(--g-mute)}
.g-share-code{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border:1px solid var(--g-line2);border-radius:14px;background:rgba(255,253,248,calc(0.26 * var(--wash-k,1)));margin-bottom:10px}
.g-share-code b{font-size:24px;letter-spacing:.08em}
.g-share-code code{font:500 13.5px ui-monospace,Menlo,monospace;color:var(--g-soft);word-break:break-all}
.g-qr{display:grid;place-items:center;margin:14px 0;padding:14px;border-radius:18px;background:var(--n-ink,#161514)}
.g-qr canvas,.g-qr img{width:200px;height:200px;image-rendering:pixelated}
.g-made{margin-top:28px;text-align:center;color:var(--g-mute);font-size:12.5px}
.g-made a{color:var(--g-blue);text-decoration:none}

/* ===== player ===== */
.p-root{position:fixed;inset:0;z-index:2147483100;display:grid;grid-template-rows:auto 1fr;background:var(--n-mid,#d1cbc1);color:var(--n-ink,#161514);overflow:hidden}
.p-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px}
.p-title{display:flex;align-items:center;gap:10px;min-width:0;font-weight:650;font-size:16px}
.p-title span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.p-title small{color:var(--g-mute);font-weight:500;font-size:13px;white-space:nowrap}
.p-bar-actions{display:flex;gap:6px}
.p-body{position:relative;min-height:0;overflow:auto;padding:4px 18px 18px}
.p-setup{display:grid;gap:18px;width:min(720px,100%);margin:3vh auto 0;padding:26px;border:1px solid var(--g-line2);border-radius:26px;background:var(--n-card,#fbf8f1)}
.p-setup h2{margin:0;font-size:24px;text-align:center}
.p-setup p{margin:0;color:var(--g-mute);text-align:center}
.p-count{display:flex;justify-content:center;gap:8px}
.p-count button{width:52px;height:52px;border:1px solid var(--g-line2);border-radius:16px;background:rgba(255,253,248,calc(0.33 * var(--wash-k,1)));font-size:20px;font-weight:700}
.p-count button[aria-pressed="true"]{background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8)}
.p-teams{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.p-teams input{width:100%;height:46px;padding:0 14px;border:2px solid var(--tc);border-radius:14px;background:rgba(255,253,248,calc(0.33 * var(--wash-k,1)));font-weight:600;outline:none}
.p-opts{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.p-opt{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--g-line2);border-radius:999px;color:var(--g-soft);font-size:14px;cursor:pointer}
.p-opt input{accent-color:var(--g-blue);margin:0}
.p-opt select{border:0;background:transparent;color:var(--n-ink,#161514);outline:none}
.p-opt select option{background:var(--n-card,#fbf8f1)}
.p-start{justify-self:center;min-width:220px;min-height:54px;border:0;border-radius:18px;background:#d8383b;color:#161514;font-size:19px;font-weight:700}
.p-start:hover{filter:brightness(1.08)}
.p-scores{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:2px 0 14px}
.p-team{display:flex;align-items:center;gap:12px;padding:8px 10px 8px 16px;border:2px solid transparent;border-radius:18px;background:rgba(255,253,248,calc(0.47 * var(--wash-k,1)));transition:transform .2s,border-color .2s,background .2s}
.p-team.turn{border-color:var(--tc);background:color-mix(in srgb,var(--tc) 22%,transparent);transform:translateY(-2px)}
.p-team b{font-size:15px;font-weight:650}
.p-team strong{min-width:52px;padding:6px 10px;border-radius:12px;background:var(--tc);color:#161514;text-align:center;font-size:20px;font-weight:800}
.p-team .adj{display:flex;flex-direction:column;gap:2px}
.p-team .adj button{width:22px;height:18px;padding:0;border:0;border-radius:6px;background:rgba(255,253,248,calc(0.75 * var(--wash-k,1)));color:var(--n-ink,#161514);font-size:12px;line-height:1}
.p-board{display:grid;grid-template-columns:repeat(var(--cols,6),minmax(0,1fr));gap:12px;width:min(1180px,100%);margin:0 auto}
.p-tile{aspect-ratio:4/3;display:grid;place-items:center;border:0;border-radius:20px;background:var(--bg);color:#161514;font-size:clamp(22px,4vw,46px);font-weight:800;box-shadow:inset 0 -6px 0 rgba(var(--ink-rgb,22,21,20),0.18);transition:transform .15s,filter .15s}
.p-tile:hover{transform:translateY(-3px) scale(1.02);filter:brightness(1.08)}
.p-tile.done{background:rgba(255,253,248,calc(0.47 * var(--wash-k,1)));color:rgba(var(--ink-rgb,22,21,20),0.55);box-shadow:none;cursor:default;transform:none;font-size:clamp(14px,1.6vw,18px);font-weight:600}
.p-end-row{display:flex;justify-content:center;margin-top:16px}
.p-q{position:absolute;inset:0;z-index:5;display:grid;place-items:center;padding:16px;background:rgba(22,21,20,0.574);backdrop-filter:blur(6px)}
.p-q-box{position:relative;display:grid;gap:16px;width:min(980px,100%);max-height:100%;overflow:auto;padding:30px clamp(18px,4vw,44px);border-radius:28px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);text-align:center;box-shadow:none;animation:pPop .28s cubic-bezier(.2,.9,.3,1.2)}
@keyframes pPop{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
.p-q-top{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--n-ink,#161514);font-weight:650}
.p-pts{padding:5px 14px;border-radius:999px;background:#f2b31d;color:#161514;font-weight:800}
.p-q-text{font-size:clamp(24px,3.4vw,42px);font-weight:700;line-height:1.25;word-break:break-word}
.p-q-img{max-width:100%;max-height:42vh;margin:0 auto;border-radius:18px;object-fit:contain}
.p-ans{padding:16px;border-radius:18px;background:var(--n-ink,#161514);color:var(--t-green,#1f8a5a);font-size:clamp(22px,3vw,36px);font-weight:750;animation:pPop .25s ease}
.p-mc{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.p-mc button{display:flex;align-items:center;gap:12px;min-height:64px;padding:12px 16px;border:1.5px solid var(--f-edge,rgba(22,21,20,.16));border-radius:18px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);text-align:left;font-size:clamp(17px,2vw,22px);font-weight:650}
.p-mc button i{display:grid;place-items:center;flex:0 0 auto;width:36px;height:36px;border-radius:12px;color:var(--n-ink,#161514);font-style:normal;font-weight:800}
.p-mc button:nth-child(1) i{background:#d8383b}.p-mc button:nth-child(2) i{background:#2b2a28}.p-mc button:nth-child(3) i{background:#f2b31d}.p-mc button:nth-child(4) i{background:#1f8a5a}.p-mc button:nth-child(5) i{background:#2b2a28}
.p-mc button:hover{border-color:#2f62d9}
.p-mc button.ok{border-color:#1f8a5a;background:var(--n-ink,#161514)}
.p-mc button.bad{border-color:#d8383b;background:var(--n-ink,#161514)}
.p-mc button[disabled]{cursor:default}
.p-q-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.p-q-actions button{min-width:150px;min-height:54px;padding:0 22px;border:0;border-radius:16px;font-size:18px;font-weight:750;color:var(--n-ink,#161514)}
.p-show{background:#2b2a28}.p-right{background:#1f8a5a}.p-wrong{background:#d8383b}.p-skip{background:var(--n-mid,#b9b4ab)}
.p-timer{height:8px;border-radius:99px;background:var(--n-ink,#161514);overflow:hidden}
.p-timer i{display:block;height:100%;background:#2b2a28;transition:width 1s linear}
.p-timer.low i{background:#d8383b}
.p-turn{color:var(--n-ink,#161514);font-size:15px;font-weight:600}
.p-turn b{color:var(--tc)}
.p-power{display:grid;justify-items:center;gap:10px;padding:10px 0}
.p-power-card{display:grid;place-items:center;width:min(320px,80vw);aspect-ratio:3/2;border-radius:24px;background:#2b2a28;color:#fffdf8;font-size:30px;font-weight:800;box-shadow:none;animation:pFlip .6s ease}
.p-power-card small{display:block;margin-top:6px;font-size:15px;font-weight:600;opacity:.9}
@keyframes pFlip{0%{transform:rotateY(90deg) scale(.8)}100%{transform:none}}
.p-end{display:grid;justify-items:center;gap:20px;padding-top:4vh}
.p-end h2{margin:0;font-size:34px}
.p-podium{display:flex;align-items:flex-end;justify-content:center;gap:12px}
.p-podium div{display:grid;justify-items:center;align-content:end;gap:6px;width:150px;padding:14px 8px;border-radius:18px 18px 0 0;background:var(--tc);color:#161514;font-weight:800}
.p-podium div b{font-size:16px}.p-podium div strong{font-size:28px}
.p-podium div span{font-size:30px}
.p-confetti{position:fixed;inset:0;pointer-events:none;z-index:200}
.p-card{display:grid;place-items:center;width:min(860px,100%);min-height:min(56vh,520px);margin:2vh auto 0;padding:30px;border-radius:28px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);text-align:center;cursor:pointer;box-shadow:none;transition:transform .35s;transform-style:preserve-3d}
.p-card.flip{background:var(--n-ink,#161514);color:var(--t-green,#1f8a5a)}
.p-card .p-q-text{font-size:clamp(24px,3.6vw,46px)}
.p-card small{display:block;margin-top:14px;color:var(--n-ink,#161514);font-size:14px;font-weight:600}
.p-study-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin-top:18px}
.p-study-bar .count{color:var(--g-mute);font-weight:600;min-width:90px;text-align:center}
.p-study-bar button{min-height:48px;padding:0 20px;border:0;border-radius:14px;font-size:16px;font-weight:700;color:var(--n-ink,#161514);background:rgba(255,253,248,calc(0.89 * var(--wash-k,1)))}
.p-study-bar .again{background:#d8383b}.p-study-bar .gotit{background:#1f8a5a}
.p-progress{width:min(860px,100%);height:6px;margin:0 auto 14px;border-radius:99px;background:rgba(255,253,248,calc(0.75 * var(--wash-k,1)));overflow:hidden}
.p-progress i{display:block;height:100%;background:var(--g-mint);transition:width .3s}
.p-slide{display:grid;place-items:center;align-content:center;gap:20px;min-height:100%;padding:2vh 4vw;text-align:center;cursor:pointer}
.p-slide .p-q-text{font-size:clamp(28px,5vw,64px);color:var(--n-ink,#161514)}
.p-slide .p-ans{max-width:900px}
.p-slide-num{color:var(--g-mute);font-weight:600}
@media (max-width:900px){.g-game{grid-template-columns:1fr}.g-side{position:static}.g-form{grid-template-columns:1fr}.p-mc{grid-template-columns:1fr}.p-board{--cols:4!important}}
@media (max-width:560px){.g-wrap{padding:18px 14px 50px}.p-board{--cols:3!important;gap:8px}.p-tile{border-radius:14px}.p-team{padding:6px 8px 6px 12px}.p-team strong{min-width:42px;font-size:17px}.p-q-actions button{min-width:120px}}

/* v51: play setup (how to play, 8 teams, grid size, options, power-ups, themes) */
.p-setup{width:min(820px,100%);gap:16px;margin-bottom:24px}
.p-setup section{display:grid;gap:12px;padding:16px 18px;border:1px solid var(--g-line);border-radius:20px;background:rgba(255,253,248,calc(0.225 * var(--wash-k,1)))}
.p-setup h3{margin:0;text-align:center;font-size:17px;font-weight:700}
.p-how h2{font-size:20px}
.p-how ol{display:grid;gap:8px;margin:0;padding:0;list-style:none;counter-reset:s;color:var(--g-soft);text-align:center}
.p-how li{counter-increment:s}
.p-how li::before{content:counter(s);display:inline-grid;place-items:center;width:22px;height:22px;margin-right:8px;border-radius:50%;background:rgba(47,98,217,0.207);color:var(--t-blue,#2550b8);font-size:12px;font-weight:700}
.p-how .k{display:inline-block;padding:1px 9px;border-radius:7px;color:var(--n-ink,#161514);font-size:13px}
.p-how .check{background:#2b2a28}.p-how .ok{background:#1f8a5a}.p-how .oops{background:#d8383b}
.p-count{flex-wrap:wrap}
.p-count button{width:48px;height:48px}
.p-count button.wide{width:auto;padding:0 14px;font-size:16px}
.p-count button[disabled]{opacity:.3;cursor:not-allowed}
.p-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.p-tabs button{min-height:46px;padding:0 22px;border:0;border-radius:14px;background:#d8383b;color:#161514;font-size:16px;font-weight:700;box-shadow:inset 0 -4px 0 rgba(var(--ink-rgb,22,21,20),0.18)}
.p-tabs button:nth-child(2){background:#2b2a28}.p-tabs button:nth-child(3){background:#2b2a28}
.p-tabs button[aria-pressed="true"]{outline:1.5px solid var(--f-edge,rgba(22,21,20,.16));outline-offset:2px}
.p-panel{display:grid;gap:8px}
.p-optlist,.p-powers{display:grid;gap:8px}
.p-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:10px 14px;border:1px solid var(--g-line);border-radius:16px;background:rgba(255,253,248,calc(0.33 * var(--wash-k,1)));cursor:pointer}
.p-optlist .p-row{grid-template-columns:1fr auto}
.p-row .ic{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:rgba(255,253,248,calc(0.54 * var(--wash-k,1)));font-size:26px;line-height:1}
.p-row b{display:flex;align-items:center;gap:8px;font-size:15.5px;font-weight:650}
.p-row small{display:block;color:var(--g-mute);font-size:13px}
.p-row select{min-height:38px;padding:0 10px;border:1px solid var(--g-line2);border-radius:10px;background:var(--n-card,#fbf8f1);color:var(--n-ink,#161514)}
.p-row .jr{padding:1px 8px;border-radius:999px;background:rgba(225,80,42,0.23);color:var(--t-verm,#b23a16);font-style:normal;font-size:11px;font-weight:700}
.p-row-all{border-color:rgba(242,179,29,0.402)}
.p-toggle{appearance:none;-webkit-appearance:none;position:relative;width:50px;height:28px;margin:0;border-radius:999px;background:var(--n-raise,#f5efe3);cursor:pointer;transition:background .15s}
.p-toggle::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--n-ink,#161514);transition:transform .15s}
.p-toggle:checked{background:#f2b31d}.p-toggle:checked::after{transform:translateX(22px)}
.p-themes{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.p-theme{display:grid;gap:8px;justify-items:center;padding:12px;border:2px solid var(--g-line);border-radius:16px;background:rgba(255,253,248,calc(0.26 * var(--wash-k,1)));color:var(--n-ink,#161514);font-weight:650}
.p-theme[aria-pressed="true"]{border-color:#8a5a00;background:rgba(242,179,29,0.092)}
.p-theme .sw{display:grid;grid-template-columns:repeat(4,22px);gap:4px}.p-theme .sw i{height:22px;border-radius:6px}
.p-power-card{gap:4px;aspect-ratio:auto;padding:22px 18px}
.p-power-card .ic{font-size:64px;line-height:1}
.p-power-card b{font-size:28px}
.p-power-card small{max-width:280px;text-align:center}
.p-power-pick{display:grid;gap:8px;justify-items:center}
.p-power-pick p{margin:0;color:var(--n-ink,#161514);font-weight:650}
.p-power-pick div{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.p-power-pick button{min-height:46px;padding:0 18px;border:2px solid var(--tc);border-radius:14px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);font-size:16px;font-weight:700}
.p-power-pick button:hover{background:color-mix(in srgb,var(--tc) 20%,var(--n-ink,#161514))}

/* v52 · motion and sound */
.p-grid-note{margin:10px 0 0;color:var(--n-mute,#5a534b);font-size:13px;text-align:center}
.p-tile{position:relative;transition:transform .18s cubic-bezier(.3,1.6,.5,1),filter .18s,box-shadow .18s}
.p-tile>span{display:block;pointer-events:none}
.p-tile:not(.done):hover{transform:translateY(-5px) rotate(-1.5deg) scale(1.04)}
.p-tile:not(.done):active,.p-tile.pressed{transform:scale(.92)!important}
.p-board.p-enter .p-tile{animation:pTileIn .5s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(var(--i) * 35ms)}
.p-board.dense .p-tile{aspect-ratio:16/10;font-size:clamp(20px,3vw,36px)}
.p-tile.flip-in{animation:pFlip .55s ease both}
.p-tile.was-power{font-size:clamp(26px,3.4vw,40px);color:var(--n-ink,#161514);opacity:.55}
@keyframes pTileIn{from{opacity:0;transform:translateY(24px) scale(.6) rotate(-6deg)}to{opacity:1;transform:none}}
@keyframes pFlip{0%{transform:rotateY(90deg)}100%{transform:rotateY(0)}}
.p-q{animation:pFade .2s ease both}
.p-q .p-q-box{animation:pPop .38s cubic-bezier(.3,1.5,.5,1) both}
.p-q.leaving{animation:pFade .18s ease reverse both}
.p-q.leaving .p-q-box{animation:pOut .18s ease both}
@keyframes pFade{from{opacity:0}to{opacity:1}}
@keyframes pPop{from{opacity:0;transform:translateY(30px) scale(.85)}to{opacity:1;transform:none}}
@keyframes pOut{to{opacity:0;transform:scale(.9)}}
.p-mc button{animation:pPop .35s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(120ms + var(--i,0) * 70ms);transition:transform .15s,border-color .15s,background .15s}
.p-mc button:not([disabled]):hover{transform:translateY(-2px)}
.p-mc button.ok{animation:pPulse .5s ease}
.p-mc button.bad{animation:pShake .45s ease}
.p-q-box.is-wrong{animation:pShake .45s ease}
.p-q-box.is-right .p-pts{animation:pPulse .6s ease}
.p-ans{animation:pPop .4s cubic-bezier(.3,1.5,.5,1) both}
@keyframes pShake{0%,100%{transform:none}20%{transform:translateX(-10px)}40%{transform:translateX(9px)}60%{transform:translateX(-6px)}80%{transform:translateX(4px)}}
@keyframes pPulse{0%{transform:scale(1)}40%{transform:scale(1.12)}100%{transform:scale(1)}}
.p-team{position:relative}
.p-team.turn{animation:pGlow 1.6s ease-in-out infinite}
@keyframes pGlow{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--tc) 45%,transparent)}50%{box-shadow:0 0 0 6px color-mix(in srgb,var(--tc) 0%,transparent)}}
.p-team.bump-up strong{animation:pBump .6s cubic-bezier(.3,1.6,.5,1)}
.p-team.bump-down strong{animation:pShake .45s ease}
@keyframes pBump{0%{transform:scale(1)}35%{transform:scale(1.35)}100%{transform:scale(1)}}
.p-delta{position:absolute;right:30px;top:-6px;font-style:normal;font-weight:800;font-size:18px;pointer-events:none;animation:pFloat 1.4s ease both}
.p-delta.up{color:var(--t-green,#1f8a5a)}.p-delta.down{color:var(--t-red,#b0242a)}
@keyframes pFloat{0%{opacity:0;transform:translateY(6px)}15%{opacity:1}100%{opacity:0;transform:translateY(-30px)}}
.p-power-box{width:min(560px,100%)}
.p-power.big .p-power-card{width:min(380px,82vw);padding:30px 20px}
.p-power.big .p-power-card .ic{font-size:96px}
.p-power-card.spinning{animation:pWobble .35s ease-in-out infinite}
.p-power-card.landed{animation:pLand .55s cubic-bezier(.3,1.7,.5,1) both}
.p-power-card.landed .ic{animation:pBump .6s cubic-bezier(.3,1.6,.5,1) .1s}
.p-power-card.is-good{background:#1f8a5a}
.p-power-card.is-bad{background:#d8383b}
.p-power-card.is-bad .ic{animation:pShake .5s ease}
.p-power-card.is-odd{background:#2b2a28}
.p-power-card{transition:background .4s}
@keyframes pWobble{0%,100%{transform:rotate(-4deg) scale(.97)}50%{transform:rotate(4deg) scale(1.03)}}
@keyframes pLand{0%{transform:scale(.6) rotate(-12deg)}100%{transform:none}}
.p-burst{position:fixed;z-index:2147483200;width:0;height:0;pointer-events:none}
.p-burst i{position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:3px;animation:pBurst .8s cubic-bezier(.2,.8,.3,1) both}
@keyframes pBurst{from{transform:translate(0,0) scale(1);opacity:1}to{transform:translate(var(--x),var(--y)) scale(.3) rotate(240deg);opacity:0}}
.p-podium div{animation:pRise .8s cubic-bezier(.3,1.4,.5,1) both;transform-origin:bottom}
.p-podium div:nth-child(2){animation-delay:.25s}.p-podium div:nth-child(1){animation-delay:.5s}.p-podium div:nth-child(3){animation-delay:.7s}
.p-end h2{animation:pPop .5s cubic-bezier(.3,1.5,.5,1) .9s both}
@keyframes pRise{from{transform:scaleY(0);opacity:0}to{transform:none;opacity:1}}
.p-setup section,.p-setup .p-tabs,.p-setup .p-start{animation:pPop .4s cubic-bezier(.3,1.4,.5,1) both}
.p-setup section:nth-child(2){animation-delay:.06s}.p-setup section:nth-child(3){animation-delay:.12s}.p-setup .p-tabs{animation-delay:.18s}.p-setup .p-start{animation-delay:.24s}
.p-start{transition:transform .15s}.p-start:hover{transform:translateY(-2px) scale(1.03)}
.p-bar-actions [data-a="sound"][aria-pressed="true"]{color:var(--t-red,#b0242a)}
@media (prefers-reduced-motion:reduce){.p-root *,.p-root *::before{animation:none!important;transition:none!important}}

/* v53 · scores stay on top, power-up card with drawn art, bold messages */
.p-scores{position:relative;z-index:8}
.p-q{position:fixed;left:0;right:0;bottom:0;top:120px;border-top-left-radius:22px;border-top-right-radius:22px}
.p-tile.done{background:rgba(255,253,248,calc(0.4 * var(--wash-k,1)))!important;color:rgba(var(--ink-rgb,22,21,20),0.55)!important;font-size:inherit!important;font-weight:800!important;opacity:1}
.p-board.dense .p-tile.done{font-size:clamp(20px,3vw,36px)!important}
.p-board:not(.dense) .p-tile.done{font-size:clamp(22px,4vw,46px)!important}
/* score motion */
.p-team{overflow:visible}
.p-team strong{display:inline-block;transition:background .3s}
.p-team.hit-up{animation:pHitUp .9s cubic-bezier(.3,1.6,.5,1)}
.p-team.hit-down{animation:pHitDown .7s ease}
.p-team.hit-up strong{animation:pScoreUp .9s cubic-bezier(.3,1.6,.5,1),pRingUp 1.2s ease}
.p-team.hit-down strong{animation:pScoreDown .7s ease,pRingDown 1.2s ease}
@keyframes pRingUp{0%{box-shadow:0 0 0 0 rgba(var(--ink-rgb,22,21,20),0.9)}100%{box-shadow:0 0 0 18px rgba(var(--ink-rgb,22,21,20),0)}}
@keyframes pRingDown{0%{box-shadow:0 0 0 0 rgba(var(--ink-rgb,22,21,20),0.9)}100%{box-shadow:0 0 0 18px rgba(var(--ink-rgb,22,21,20),0)}}
@keyframes pHitUp{0%{transform:none}30%{transform:translateY(-8px) scale(1.12)}100%{transform:none}}
@keyframes pHitDown{0%,100%{transform:none}20%{transform:translateX(-10px) rotate(-2deg)}40%{transform:translateX(9px) rotate(2deg)}60%{transform:translateX(-6px)}80%{transform:translateX(4px)}}
@keyframes pScoreUp{0%{transform:scale(1)}35%{transform:scale(1.6)}100%{transform:scale(1)}}
@keyframes pScoreDown{0%{transform:scale(1)}30%{transform:scale(.7)}100%{transform:scale(1)}}
.p-delta{position:absolute!important;left:50%!important;right:auto!important;top:calc(100% + 4px)!important;z-index:9;padding:4px 16px;border-radius:999px;color:var(--n-ink,#161514);font-size:30px!important;font-weight:900!important;font-style:normal;white-space:nowrap;box-shadow:none;animation:pDelta 2.5s ease both!important}
.p-delta.up{background:#1f8a5a;color:#161514!important}.p-delta.down{background:#d8383b;color:#161514!important}
@keyframes pDelta{0%{opacity:0;transform:translate(-50%,-14px) scale(.4)}12%{opacity:1;transform:translate(-50%,0) scale(1.25)}22%{transform:translate(-50%,0) scale(1)}75%{opacity:1;transform:translate(-50%,6px) scale(1)}100%{opacity:0;transform:translate(-50%,22px) scale(.9)}}
/* power-up card */
.p-pbox{display:grid;width:min(760px,100%);max-height:100%;overflow:auto;border-radius:26px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);box-shadow:none;animation:pPop .38s cubic-bezier(.3,1.5,.5,1) both}
.p-q.leaving .p-pbox{animation:pOut .18s ease both}
.p-phead{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;min-height:58px;padding:10px 18px;background:#2b2a28;color:#fffdf8;transition:background .35s}
.p-pbox.is-good .p-phead{background:#1f8a5a}
.p-pbox.is-bad .p-phead{background:#d8383b}
.p-pbox.is-odd .p-phead{background:#2b2a28}
.p-pteam{justify-self:start;padding:5px 14px;border-radius:999px;background:var(--n-ink,#161514);color:var(--tc);font-weight:850;font-size:16px;box-shadow:inset 0 0 0 2px var(--tc)}
.p-pname{font-size:clamp(22px,2.6vw,30px);font-weight:900;letter-spacing:.01em;text-shadow:none}
.p-pstage{display:grid;place-items:center;padding:22px 16px 6px}
.p-pimg{width:min(230px,52vw);aspect-ratio:1}
.p-pimg.rolling{animation:pWobble .3s ease-in-out infinite}
.p-pimg.landed{animation:pLand .6s cubic-bezier(.3,1.7,.5,1) both}
.p-art{display:grid;place-items:center;width:100%;height:100%;border-radius:22%;background:var(--art)}
.p-art svg{width:84%;height:84%;overflow:visible}
.p-pimg .p-art{box-shadow:inset 0 -6px 0 rgba(var(--ink-rgb,22,21,20),0.06)}
.p-pbox.is-good .p-pimg.landed .p-art svg{animation:pHop 1s ease-in-out .6s infinite}
.p-pbox.is-bad .p-pimg.landed .p-art svg{animation:pShake .5s ease .5s}
@keyframes pHop{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.p-pmsg{margin:14px 22px 0;padding:16px 18px;border-radius:18px;background:var(--n-ink,#161514);box-shadow:0 4px 0 var(--n-soft,#2e2a26);text-align:center;font-size:clamp(24px,3.4vw,40px);font-weight:700;line-height:1.25;color:var(--n-onink,#fffdf8);min-height:1.25em}
.p-pmsg b{font-weight:900;font-size:1.12em;padding:0 .08em}
.p-pmsg b.good{color:var(--t-green,#1f8a5a)}.p-pmsg b.bad{color:var(--t-red,#d8383b)}.p-pmsg b.mid{color:var(--t-violet,#6b4fd8)}
.p-pmsg .who{color:var(--tc);font-weight:900;filter:brightness(.8)}
.p-pmsg.done{animation:pPulse .6s ease}
.p-pbtns{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;padding:18px 18px 22px}
.p-plabel{flex-basis:100%;margin:0;color:var(--n-ink,#161514);font-weight:700;text-align:center}
.p-pill{min-width:72px;min-height:52px;padding:0 20px;border:0;border-radius:999px;background:#1f8a5a;color:#161514;font-size:22px;font-weight:900;box-shadow:0 4px 0 #1f8a5a;transition:transform .12s,box-shadow .12s;animation:pPop .35s cubic-bezier(.3,1.5,.5,1) both}
.p-pill:nth-child(2){animation-delay:.05s}.p-pill:nth-child(3){animation-delay:.1s}.p-pill:nth-child(4){animation-delay:.15s}.p-pill:nth-child(5){animation-delay:.2s}
.p-pill:hover{transform:translateY(-2px)}.p-pill:active{transform:translateY(3px);box-shadow:0 1px 0 #1f8a5a}
.p-pill.wide{min-width:170px}
.p-pill[disabled],.p-pteam-btn[disabled]{opacity:.55;transform:none}
.p-pteam-btn{min-height:52px;padding:0 22px;border:3px solid var(--tc);border-radius:16px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);font-size:20px;font-weight:850;box-shadow:0 4px 0 color-mix(in srgb,var(--tc) 70%,var(--n-page,#efe9dd));transition:transform .12s;animation:pPop .35s cubic-bezier(.3,1.5,.5,1) both}
.p-pteam-btn:hover{transform:translateY(-2px);background:color-mix(in srgb,var(--tc) 18%,var(--n-ink,#161514))}
/* setup list uses the same art */
.p-row .ic .p-art{width:44px;height:44px;border-radius:12px}
.p-row .ic:has(.p-art){background:none!important;padding:0!important}

/* v54 · the board always fits the screen (no scrolling) */
.p-body.p-playing{display:flex;flex-direction:column;overflow:hidden;padding-bottom:12px}
.p-playing .p-scores{flex:0 0 auto}
.p-playing .p-board{flex:1 1 auto;min-height:0;width:min(1500px,100%);grid-template-columns:repeat(var(--cols,4),minmax(0,1fr))!important;grid-template-rows:repeat(var(--rows,2),minmax(0,1fr))}
.p-playing .p-tile{aspect-ratio:auto!important;min-height:0;height:100%;font-size:var(--fs,40px)!important;line-height:1;border-radius:min(20px,calc(var(--fs,40px) * .45))}
.p-playing .p-tile.done{font-size:var(--fs,40px)!important}
.p-playing .p-end-row{flex:0 0 auto;margin-top:10px}
.p-playing .p-end-row .g-btn{min-height:34px;padding:0 14px;font-size:13px}

/* v56 · the team whose turn it is stands out */
.p-turn{display:inline-flex;align-items:center;gap:10px;font-size:clamp(16px,1.6vw,20px);font-weight:700;color:var(--n-ink,#161514)}
.p-turn b{display:inline-block;padding:8px 20px;border-radius:999px;background:var(--tc);color:#161514!important;font-size:clamp(22px,2.6vw,32px);font-weight:900;line-height:1.1;box-shadow:0 4px 0 color-mix(in srgb,var(--tc) 60%,var(--n-page,#efe9dd)),0 0 0 4px color-mix(in srgb,var(--tc) 30%,transparent);animation:pTurnIn .5s cubic-bezier(.3,1.6,.5,1) both}
@keyframes pTurnIn{from{transform:scale(.5) rotate(-6deg);opacity:0}to{transform:none;opacity:1}}
.p-pteam{padding:8px 18px;font-size:clamp(18px,2vw,24px);font-weight:900;background:var(--tc);color:#161514;box-shadow:0 3px 0 color-mix(in srgb,var(--tc) 60%,var(--n-page,#efe9dd)),0 0 0 3px var(--n-shadow,#161514)}
.p-turn{gap:4px}
.p-q-top .p-pts{padding:8px 18px;font-size:clamp(20px,2.2vw,28px);font-weight:900}

/* v57 · winner GIFs */
.p-tabs button[data-p="gifs"]{background:#2b2a28}
.p-gifs{display:grid;gap:12px}
.p-gifs-note{margin:0;color:var(--n-mute,#5a534b);font-size:14px;line-height:1.5}
.p-gifs-add{display:flex;flex-wrap:wrap;gap:8px}
.p-gifs-add input[type=url]{flex:1 1 260px;min-height:44px;padding:0 14px;border:1px solid var(--g-line,rgba(22,21,20,0.195));border-radius:12px;background:rgba(255,253,248,calc(0.4 * var(--wash-k,1)));color:inherit;font:inherit;outline:none}
.p-gifs-add input[type=url]:focus{border-color:#2f62d9}
.p-gbtn{display:inline-grid;place-items:center;min-height:44px;padding:0 18px;border:0;border-radius:12px;background:#2b2a28;color:#fffdf8;font-weight:750;cursor:pointer}
.p-gbtn.alt{background:#1f8a5a}
.p-gifs-msg{margin:0;min-height:1.2em;color:var(--t-must,#8a5a00);font-size:13px}
.p-gifs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
.p-gifs-empty{grid-column:1/-1;margin:0;color:var(--n-mute,#5a534b);font-size:14px}
.p-gif{position:relative;margin:0;aspect-ratio:4/3;border-radius:12px;overflow:hidden;background:rgba(255,253,248,calc(0.47 * var(--wash-k,1)))}
.p-gif img{width:100%;height:100%;object-fit:cover;display:block}
.p-gif.broken::after{content:"Link not working";position:absolute;inset:0;display:grid;place-items:center;color:var(--t-red,#b0242a);font-size:12px;font-weight:700}
.p-gif button{position:absolute;top:6px;right:6px;width:26px;height:26px;padding:0;border:0;border-radius:50%;background:rgba(var(--ink-rgb,22,21,20),0.525);color:var(--n-ink,#161514);font-size:13px;cursor:pointer}
.p-gif button:hover{background:#d8383b}
.p-end.has-gif{gap:14px}
.p-end.has-gif>h2{display:none}
.p-win{display:grid;justify-items:center;gap:0;animation:pPop .6s cubic-bezier(.3,1.5,.5,1) both}
.p-win-gif{max-width:min(720px,92vw);padding:10px;border-radius:24px;background:var(--n-ink,#161514);box-shadow:none}
.p-win-gif img{display:block;max-width:100%;max-height:min(40vh,420px);border-radius:16px;object-fit:contain}
.p-win-ribbon{position:relative;z-index:1;display:grid;justify-items:center;margin-top:-26px;padding:12px 46px 14px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);transform:rotate(-2deg);box-shadow:none;border-radius:8px;animation:pRibbon .7s cubic-bezier(.3,1.6,.5,1) .35s both}
.p-win-ribbon .crown{width:64px;height:40px;margin-top:-34px;animation:pHop 1.2s ease-in-out 1s infinite}
.p-win-ribbon .crown svg{width:100%;height:100%}
.p-win-ribbon b{font-size:clamp(30px,4.6vw,58px);font-weight:900;line-height:1.05;color:var(--tc,#161514);filter:brightness(.85);text-shadow:none}
@keyframes pRibbon{from{opacity:0;transform:rotate(-12deg) scale(.4)}to{opacity:1;transform:rotate(-2deg)}}
.p-end.has-gif .p-podium div{height:auto!important;min-height:0;padding:10px 8px;animation-delay:1s!important}
.p-end.has-gif .p-podium div span{font-size:22px}.p-end.has-gif .p-podium div strong{font-size:22px}

/* v62 · GIPHY search */
.g-giphy-btn{background:#1f8a5a !important;color:#161514!important;border:0!important;font-weight:800}
.g-giphy .g-modal-box{width:min(860px,100%);height:min(720px,100%);display:grid;grid-template-rows:auto 1fr auto;gap:12px;padding:18px}
.g-giphy-top{display:flex;gap:8px}
.g-giphy-top input{flex:1}
.g-giphy-grid{overflow:auto;columns:4 150px;column-gap:8px;padding-right:4px}
.g-giphy-item{display:block;width:100%;margin:0 0 8px;padding:0;border:2px solid transparent;border-radius:10px;overflow:hidden;background:rgba(255,253,248,calc(0.4 * var(--wash-k,1)));cursor:pointer;break-inside:avoid}
.g-giphy-item:hover,.g-giphy-item:focus-visible{border-color:#2f62d9;outline:none}
.g-giphy-item img{display:block;width:100%;height:auto}
.g-giphy-foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.g-giphy-by{margin-left:auto;padding:5px 12px;border-radius:999px;background:var(--n-page,#efe9dd);color:var(--n-ink,#161514);font-size:12px;letter-spacing:.02em}
.g-giphy-by b{font-weight:900;letter-spacing:.06em}
.g-gif-missing{min-height:60px;background:repeating-linear-gradient(45deg,rgba(255,253,248,calc(0.4 * var(--wash-k,1))) 0 8px,transparent 8px 16px)}

/* v65 · audience, class teams, new rules, question types, live ranking, bonus */
.p-aud h2{margin:0 0 14px;text-align:center}
.p-aud-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.p-aud-row button{display:grid;justify-items:center;gap:6px;padding:22px 16px;border:2px solid var(--g-line,rgba(22,21,20,0.17));border-radius:22px;background:rgba(255,253,248,calc(0.33 * var(--wash-k,1)));color:inherit;cursor:pointer;transition:transform .15s,border-color .15s,background .15s}
.p-aud-row button:hover{transform:translateY(-3px);border-color:#2f62d9}
.p-aud-row button[aria-pressed="true"]{border-color:#1f8a5a;background:rgba(31,138,90,0.115);box-shadow:0 0 0 4px rgba(var(--ink-rgb,22,21,20),0.15)}
.p-aud-row .em{font-size:44px;line-height:1}
.p-aud-row b{font-size:20px}
.p-aud-row small{color:var(--n-mute,#5a534b)}
.p-setup.chosen .p-aud{padding-bottom:6px}
.p-setup.chosen .p-aud-row button{padding:12px;grid-template-columns:auto 1fr;justify-items:start;text-align:left;column-gap:12px}
.p-setup.chosen .p-aud-row .em{grid-row:span 2;font-size:30px}
.p-rest{display:grid;gap:16px}
.p-src{display:flex;justify-content:center;gap:8px;margin-bottom:12px}
.p-src button,.p-methods button{min-height:40px;padding:0 16px;border:1px solid var(--g-line,rgba(22,21,20,0.195));border-radius:999px;background:rgba(255,253,248,calc(0.33 * var(--wash-k,1)));color:inherit;font-weight:700;cursor:pointer}
.p-src button[aria-pressed="true"],.p-methods button[aria-pressed="true"]{background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);border-color:var(--n-edge,#161514)}
.p-methods{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:12px 0}
.p-note{margin:10px 0 6px;color:var(--n-mute,#5a534b);font-size:13px;text-align:center}
.p-note.warn{color:var(--t-must,#8a5a00)}
.p-count.small button{width:40px;height:40px;font-size:16px}
.p-class-pick select{min-height:42px;padding:0 12px;border:1px solid var(--g-line,rgba(22,21,20,0.195));border-radius:12px;background:var(--n-card,#fbf8f1);color:inherit;font:inherit}
.p-class-teams{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin:12px 0}
.p-cteam{padding:10px 12px;border:2px solid var(--tc);border-radius:16px;background:color-mix(in srgb,var(--tc) 9%,transparent);animation:pPop .35s cubic-bezier(.3,1.5,.5,1) both}
.p-cteam b{display:block;margin-bottom:6px;color:var(--tc)}
.p-cteam ul{margin:0;padding:0;list-style:none;display:grid;gap:3px;font-size:13px}
.p-cteam li.f{color:var(--t-pink,#b0286c)}.p-cteam li.m{color:var(--t-blue,#2550b8)}
.p-team-area>.p-gbtn{display:flex;margin:0 auto}
/* scoreboard: rank, streak fire, leader */
.p-team .rank{font-style:normal;font-weight:900;font-size:13px;color:var(--n-mute,#5a534b);min-width:20px;text-align:center}
.p-team.lead .rank{font-size:18px}
.p-team.lead{box-shadow:0 0 0 2px #f2b31d}
.p-team .fire{font-weight:900;font-size:14px;color:var(--t-must,#8a5a00);animation:pFire .6s ease-in-out infinite alternate}
@keyframes pFire{from{transform:scale(1) rotate(-4deg)}to{transform:scale(1.18) rotate(4deg)}}
.p-scores.many .p-team{padding:4px 6px 4px 10px;gap:8px}
.p-scores.many .p-team strong{min-width:40px;font-size:16px;padding:4px 8px}
.p-scores.many .p-team b{font-size:13px}
/* question: who answers, banners, risk choice, scramble, type, true/false */
.p-who{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}
.p-who-btn{min-height:38px;padding:0 14px;border:0;border-radius:999px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);font-weight:800;cursor:pointer}
.p-who-btn:hover{background:var(--n-ink,#161514)}
.p-who-name{font-size:clamp(20px,2.4vw,28px);font-weight:900;color:var(--n-ink,#161514)}
.p-who-name.spinning{opacity:.65;filter:blur(.4px)}
.p-who-name.chosen{animation:pBump .6s cubic-bezier(.3,1.6,.5,1);color:var(--t-violet,#6b4fd8)}
.p-banner{justify-self:center;padding:8px 18px;border-radius:999px;font-weight:900;font-size:clamp(16px,1.8vw,22px);animation:pPop .45s cubic-bezier(.3,1.6,.5,1) both}
.p-banner.steal{background:var(--n-mid,#d1cbc1);color:var(--t-must,#8a5a00)}
.p-banner.fire{background:#e1502a;color:#161514}
.p-banner.gold{background:#f2b31d;color:#161514;box-shadow:none}
.p-banner.mystery{background:#2b2a28;color:#fffdf8}
.p-banner.risk{background:#d8383b;color:#161514}
.p-q-box.golden{box-shadow:0 0 0 4px #f2b31d}
.p-pts.gold{background:#f2b31d;color:#161514}
.p-pts.risk{background:#d8383b;color:#161514}
.p-risk{display:grid;gap:12px;justify-items:center}
.p-risk p{margin:0;font-size:clamp(20px,2.4vw,28px);font-weight:800}
.p-risk div{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;width:100%}
.p-risk button{display:grid;gap:4px;padding:18px;border:0;border-radius:18px;color:var(--n-ink,#161514);cursor:pointer;transition:transform .15s;animation:pPop .4s cubic-bezier(.3,1.5,.5,1) both}
.p-risk button:hover{transform:translateY(-3px) scale(1.02)}
.p-risk b{font-size:clamp(20px,2.4vw,28px);font-weight:900}
.p-risk small{opacity:.9}
.p-risk .safe{background:#1f8a5a}
.p-risk .riskb{background:#d8383b;animation-delay:.08s}
.p-q-text.small{font-size:clamp(16px,1.8vw,20px);color:var(--n-ink,#161514)}
.p-scramble{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.p-scramble span{display:grid;place-items:center;min-width:52px;height:60px;padding:0 10px;border-radius:14px;background:#2b2a28;color:#fffdf8;font-size:clamp(24px,3vw,36px);font-weight:900;text-transform:uppercase;box-shadow:inset 0 -5px 0 rgba(var(--ink-rgb,22,21,20),0.18);animation:pTileIn .5s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(var(--i) * 60ms)}
.p-scramble.words span{text-transform:none;font-size:clamp(18px,2.2vw,26px);background:#2b2a28}
.p-scramble span:nth-child(3n+2){background:#d8383b}.p-scramble span:nth-child(3n){background:#1f8a5a}
.p-type{display:grid;gap:8px;justify-items:center}
.p-type input{width:min(520px,100%);min-height:58px;padding:0 18px;border:1.5px solid var(--f-edge,rgba(22,21,20,.16));border-radius:16px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);font-size:clamp(20px,2.4vw,28px);font-weight:700;text-align:center;outline:none}
.p-type input:focus{border-color:#2f62d9}
.p-type-msg{margin:0;min-height:1.3em;font-size:20px;font-weight:900}
.p-type-msg.ok{color:var(--t-green,#1f8a5a)}.p-type-msg.bad{color:var(--t-red,#d8383b)}
.p-mc.tf{grid-template-columns:1fr 1fr}
.p-mc.tf button{justify-content:center;min-height:96px;font-size:clamp(24px,3vw,36px);font-weight:900}
.p-mc.tf button:first-child{background:var(--n-ink,#161514);border-color:#1f8a5a}.p-mc.tf button:last-child{background:var(--n-ink,#161514);border-color:#b0242a}
.p-mc.tf button i{display:none}
.p-timer.low{position:relative}
.p-timer.low::after{content:attr(data-left);position:absolute;right:0;top:-34px;font-size:30px;font-weight:900;color:var(--t-red,#d8383b);animation:pBump .5s ease infinite}
/* end: bonus question */
.p-bonus{display:grid;gap:8px;justify-items:center;max-width:640px;padding:16px 20px;border-radius:20px;background:rgba(255,253,248,calc(0.54 * var(--wash-k,1)));border:1px solid rgba(var(--ink-rgb,22,21,20),0.195);text-align:center;animation:pPop .5s cubic-bezier(.3,1.5,.5,1) 1.2s both}
.p-bonus p{margin:0;font-size:18px}
.p-bonus small{color:var(--n-mute,#5a534b);line-height:1.5}
.p-bonus div{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.p-bonus button{min-height:46px;padding:0 20px;border:0;border-radius:14px;color:var(--n-ink,#161514);font-weight:800;cursor:pointer}
/* adults: calmer motion and look */
.p-root.adult .p-tile:not(.done):hover{transform:translateY(-3px)}
.p-root.adult .p-power-card.spinning,.p-root.adult .p-pimg.rolling{animation-duration:.6s}
.p-root.adult .p-pbox.is-good .p-pimg.landed .p-art svg{animation:none}
.p-root.adult .p-team .fire{animation:none}
.p-root.adult .p-tile{box-shadow:inset 0 -3px 0 rgba(var(--ink-rgb,22,21,20),0.18)}
.p-end.adult-end h2{font-size:clamp(34px,5vw,56px);letter-spacing:-.01em}
.p-end.adult-end h2::before{content:"🏆";display:block;font-size:64px;margin-bottom:6px;animation:pPop .6s cubic-bezier(.3,1.5,.5,1) both}
/* teacher side: question types, AI maker, community stats */
.g-types{display:flex;flex-wrap:wrap;gap:6px}
.g-types button{min-height:36px;padding:0 14px;border:1px solid var(--g-line2,rgba(22,21,20,0.22));border-radius:999px;background:transparent;color:inherit;font-weight:650;cursor:pointer}
.g-types button[aria-checked="true"]{background:#2b2a28;border-color:#2f62d9;color:#fffdf8}
.g-type-help{color:var(--g-mute,#5a534b);font-size:12px}
.g-ai-btn{background:transparent !important;border-color:rgba(107,79,216,0.575)!important}
.g-ai-sub{margin:-4px 0 12px;color:var(--g-mute,#5a534b)}
.g-ai-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:12px 0}
.g-ai.busy [data-a="make"]{position:relative;color:transparent}
.g-ai.busy [data-a="make"]::after{content:"Writing…";position:absolute;inset:0;display:grid;place-items:center;color:var(--n-ink,#161514);animation:pFire .6s ease-in-out infinite alternate}
.g-ai-out{margin-top:14px;display:grid;gap:10px}
.g-ai-list{display:grid;gap:6px;max-height:420px;overflow:auto}
.g-ai-item{display:grid;grid-template-columns:auto 26px 1fr;gap:10px;align-items:start;padding:10px 12px;border:1px solid var(--g-line,rgba(22,21,20,0.145));border-radius:12px;background:rgba(255,253,248,calc(0.26 * var(--wash-k,1)));cursor:pointer}
.g-ai-item .n{color:var(--g-mute,#5a534b);font-size:12px;padding-top:2px}
.g-ai-item b{display:block;font-weight:650}
.g-ai-item em{display:block;margin-top:3px;color:var(--t-green,#1f8a5a);font-style:normal;font-size:13px}
.g-sorts{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.g-sorts button{min-height:34px;padding:0 14px;border:1px solid var(--g-line2,rgba(22,21,20,0.22));border-radius:999px;background:transparent;color:inherit;font-weight:650;cursor:pointer}
.g-sorts button[aria-pressed="true"]{background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8)}
.g-stats{display:flex;align-items:center;gap:12px;margin-top:8px;font-size:13px;color:var(--g-mute,#5a534b)}
.g-like{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border:1px solid var(--g-line2,rgba(22,21,20,0.22));border-radius:999px;background:transparent;color:inherit;font-weight:700;cursor:pointer}
.g-like span{font-size:16px;line-height:1}
.g-like[aria-pressed="true"]{color:var(--t-pink,#d43f86);border-color:rgba(212,63,134,0.575);background:rgba(212,63,134,0.115)}
.g-like.pop span{animation:pBump .5s cubic-bezier(.3,1.6,.5,1)}
.g-remix{display:block;margin-top:6px;color:var(--t-violet,#583cc0);font-size:12px}
.g-ai-item .w{display:block;margin-top:2px;color:var(--t-red,#b0242a);font-style:normal;font-size:13px}
.g-ai-item .w:empty{display:none}
.p-end.adult-end h2{text-align:center}

/* v66 · minimalist setup: colour tiles, stepper, filled team cards, line icons */
.tt-ic{display:inline-block;flex:0 0 auto;vertical-align:-.18em}
.p-setup.v2{gap:22px;padding:26px}
.p-setup.v2 .p-sec{display:grid;gap:14px;padding:0;border:0;background:none}
.p-setup.v2 .p-sec>h2{margin:0;font-size:15px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--t-blue,#2f62d9);text-align:left}
.p-setup.v2 .p-rest{gap:26px}
.p-opts{display:grid;gap:12px}
.p-opts.one{grid-template-columns:1fr}
.p-opts.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.p-opts.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.p-opts.four{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:640px){.p-opts.three,.p-opts.four{grid-template-columns:repeat(2,minmax(0,1fr))}.p-opts.two{grid-template-columns:1fr}}
.p-opt{position:relative;display:grid;align-content:start;justify-items:start;gap:6px;min-height:118px;padding:18px;border:0;border-radius:22px;background:var(--c1);color:#161514;text-align:left;cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(var(--ink-rgb,22,21,20),0.333);transition:transform .18s cubic-bezier(.3,1.5,.5,1),filter .2s,opacity .2s,box-shadow .2s;overflow:hidden}
.p-opt::before{content:"";position:absolute;right:-30px;bottom:-40px;width:130px;height:130px;border-radius:50%;background:rgba(255,253,248,calc(0.89 * var(--wash-k,1)));pointer-events:none}
.p-opt::after{content:"";position:absolute;right:18px;top:-24px;width:56px;height:56px;border-radius:50%;background:rgba(255,253,248,calc(0.61 * var(--wash-k,1)));pointer-events:none}
.p-opt:hover{transform:translateY(-3px)}
.p-opt .ico{display:grid;place-items:center;width:46px;height:46px;margin-bottom:6px;border-radius:15px;background:rgba(var(--ink-rgb,22,21,20),0.22)}
.p-opt b{position:relative;font-size:18px;font-weight:800;line-height:1.2}
.p-opt small{position:relative;font-size:13px;line-height:1.35;opacity:.88}
/* single choice: the chosen tile shines, the others step back */
.p-opts.choice .p-opt[aria-pressed="false"]{filter:saturate(.25) brightness(.62);box-shadow:none}
.p-opts.choice .p-opt[aria-pressed="false"]:hover{filter:saturate(.7) brightness(.85)}
.p-opts.choice .p-opt[aria-pressed="true"]{box-shadow:0 0 0 3px var(--n-shadow,#161514)}
.p-opts.choice .p-opt[aria-pressed="true"] .ico{background:var(--n-ink,#161514);color:var(--c2)}
.p-opts.small .p-opt{min-height:96px;padding:14px}
.p-opts.small .p-opt b{font-size:15px}
.p-opts.small .p-opt .ico{width:40px;height:40px;border-radius:13px}
.p-opt.num{justify-items:center;align-content:center;min-height:104px;text-align:center}
.p-opt.num b{font-size:40px;line-height:1;font-weight:900}
.p-opt.num small{text-transform:uppercase;letter-spacing:.12em;font-size:11px;font-weight:700}
.p-tabs2 .p-opt{min-height:100px}
/* toggles: on = full colour with a switch, off = dark */
.p-opts.toggles .p-opt{min-height:112px;padding-right:58px}
.p-opts.toggles .p-opt[aria-pressed="false"]{background:rgba(255,253,248,calc(0.4 * var(--wash-k,1)));box-shadow:inset 0 0 0 1px rgba(var(--ink-rgb,22,21,20),0.145);color:var(--n-soft,#2e2a26)}
.p-opts.toggles .p-opt[aria-pressed="false"] .ico{background:var(--c1);color:#161514}
.p-opts.toggles .p-opt[aria-pressed="false"]::before,.p-opts.toggles .p-opt[aria-pressed="false"]::after{opacity:0}
.p-opt .sw{position:absolute;top:18px;right:16px;width:38px;height:22px;border-radius:999px;background:rgba(var(--ink-rgb,22,21,20),0.18);transition:background .2s}
.p-opt .sw i{position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--n-ink,#161514);transition:transform .2s cubic-bezier(.3,1.5,.5,1)}
.p-opt[aria-pressed="true"] .sw{background:rgba(var(--ink-rgb,22,21,20),0.45)}
.p-opt[aria-pressed="true"] .sw i{transform:translateX(16px)}
.p-timerpick{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px;padding:12px 14px;border-radius:18px;background:rgba(255,253,248,calc(0.4 * var(--wash-k,1)))}
.p-timerpick .ico{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:#2b2a28;color:#fffdf8}
.p-timerpick b{font-size:16px}
.p-timerpick .seg{display:flex;flex-wrap:wrap;gap:6px;margin-left:auto}
.p-timerpick .seg button{min-width:58px;height:40px;padding:0 12px;border:0;border-radius:12px;background:rgba(255,253,248,calc(0.54 * var(--wash-k,1)));color:var(--n-soft,#2e2a26);font-weight:800;cursor:pointer}
.p-timerpick .seg button[aria-pressed="true"]{background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8)}
/* stepper */
.p-stepper{display:inline-flex;align-items:center;gap:8px;justify-self:center;padding:8px;border-radius:22px;background:rgba(255,253,248,calc(0.47 * var(--wash-k,1)))}
.p-stepper button{display:grid;place-items:center;width:52px;height:52px;border:0;border-radius:16px;background:#2b2a28;color:#fffdf8;cursor:pointer;transition:transform .12s}
.p-stepper button:active{transform:scale(.92)}
.p-stepper button:disabled{opacity:.3;cursor:default}
.p-stepper div{display:grid;justify-items:center;min-width:92px}
.p-stepper b{font-size:34px;font-weight:900;line-height:1}
.p-stepper small{color:var(--t-blue,#2f62d9);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.1em}
.p-steprow{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap}
.p-reshuffle{display:inline-flex;align-items:center;gap:8px;height:52px;padding:0 20px;border:0;border-radius:16px;background:rgba(255,253,248,calc(0.61 * var(--wash-k,1)));color:var(--n-ink,#161514);font-weight:800;cursor:pointer}
.p-reshuffle:hover{background:rgba(var(--ink-rgb,22,21,20),0.14)}
/* fun team names: filled pills */
.p-teams.v2{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.p-teams.v2 input{height:52px;border:0;border-radius:16px;background:var(--n-page,#efe9dd);color:var(--n-ink,#161514);font-size:16px;font-weight:800;text-shadow:none;padding:0 16px}
.p-teams.v2 input:focus{box-shadow:0 0 0 3px var(--n-shadow,#161514)}
/* class bar */
.p-classbar{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:18px;background:rgba(255,253,248,calc(0.4 * var(--wash-k,1)))}
.p-classbar .ico{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#2b2a28;color:#fffdf8}
.p-classbar .t{display:grid;gap:2px;flex:1}
.p-classbar small{color:var(--t-blue,#2f62d9);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.1em}
.p-classbar select{border:0;background:transparent;color:var(--n-ink,#161514);font:inherit;font-size:18px;font-weight:800;outline:none;cursor:pointer;padding:0}
.p-classbar select option{background:var(--n-card,#fbf8f1)}
.p-classbar .meta{color:var(--t-blue,#2f62d9);font-size:13px;font-weight:600}
/* class team cards: filled colour, white bold names */
.p-class-teams.v2{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.p-class-teams.v2 .p-cteam{position:relative;overflow:hidden;padding:0;border:0;border-radius:22px;background:var(--n-page,#efe9dd);box-shadow:none;animation:pPop .45s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(var(--i) * 60ms)}
.p-class-teams.v2 .p-cteam::after{content:"";position:absolute;right:-40px;top:-40px;width:120px;height:120px;border-radius:50%;background:rgba(255,253,248,calc(0.89 * var(--wash-k,1)))}
.p-class-teams.v2 .h{position:relative;display:flex;align-items:center;justify-content:space-between;padding:14px 16px 10px}
.p-class-teams.v2 .h b{color:var(--n-ink,#161514);font-size:19px;font-weight:900;margin:0;text-shadow:none}
.p-class-teams.v2 .h i{display:grid;place-items:center;min-width:30px;height:30px;padding:0 8px;border-radius:999px;background:var(--n-raise,#f5efe3);color:var(--n-ink,#161514);font-style:normal;font-weight:900;font-size:14px}
.p-class-teams.v2 ul{position:relative;display:grid;gap:6px;padding:4px 12px 14px;margin:0;list-style:none}
.p-class-teams.v2 li{padding:7px 12px;border-radius:12px;background:rgba(var(--ink-rgb,22,21,20),0.14);color:var(--n-ink,#161514)!important;font-size:15px;font-weight:800;letter-spacing:.01em;text-shadow:none}
/* how to play + start */
.p-howto{border-radius:18px;background:rgba(255,253,248,calc(0.33 * var(--wash-k,1)));padding:12px 16px}
.p-howto summary{display:flex;align-items:center;gap:8px;cursor:pointer;color:var(--n-soft,#2e2a26);font-weight:700;list-style:none}
.p-howto summary::-webkit-details-marker{display:none}
.p-howto ol{margin:10px 0 0;padding-left:20px;color:var(--n-mute,#5a534b);line-height:1.7}
.p-setup.v2 .p-start{display:inline-flex;align-items:center;justify-content:center;gap:10px;justify-self:center;min-width:260px;height:64px;border-radius:20px;font-size:21px;background:#e1502a;box-shadow:none}
/* game icons */
.p-team .rank .tt-ic{color:var(--t-must,#8a5a00);vertical-align:-3px}
.p-team .fire{display:inline-flex;align-items:center;gap:2px}
.p-team .fire .tt-ic{color:var(--t-verm,#e1502a)}
.p-pts{display:inline-flex;align-items:center;gap:4px}
.p-banner{display:inline-flex;align-items:center;gap:8px}
.p-who-btn{display:inline-flex;align-items:center;gap:6px}
.p-risk button{justify-items:center;text-align:center}
.p-risk .ico{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:rgba(var(--ink-rgb,22,21,20),0.22)}
.p-podium .medal{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:rgba(var(--ink-rgb,22,21,20),0.55);color:var(--n-ink,#161514);font-size:20px!important;font-weight:900;box-shadow:inset 0 -3px 0 rgba(var(--ink-rgb,22,21,20),0.12)}
.p-podium .medal.m1{background:#f2b31d}
.p-podium .medal.m2{background:var(--n-ink,#161514)}
.p-podium .medal.m3{background:#e1502a}
.p-end.adult-end h2::before{content:none}
.p-trophy{display:grid;place-items:center;width:110px;height:110px;border-radius:32px;background:#f2b31d;color:#161514;box-shadow:none;animation:pPop .6s cubic-bezier(.3,1.5,.5,1) both}
.p-row-all .ic{color:#fffdf8;background:#2b2a28 !important}
.g-btn .tt-ic,.g-panel h2 .tt-ic{margin-right:2px}

/* v67 · teams on the side, live ranking column */
@media (min-width:761px){
  .p-body.p-playing{display:grid!important;grid-template-columns:clamp(200px,19vw,270px) minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;column-gap:16px}
  .p-playing .p-scores.side{grid-column:1;grid-row:1 / span 2;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:flex-start;gap:10px;margin:0;padding:2px 2px 8px;overflow:auto}
  .p-playing .p-board{grid-column:2;grid-row:1}
  .p-playing .p-end-row{grid-column:2;grid-row:2}
  .p-scores.side .p-team{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;box-sizing:border-box;padding:12px 12px 12px 10px;border:0;border-radius:18px;
    background:var(--tc);box-shadow:inset 4px 0 0 var(--tc);transform:none}
  .p-scores.side .p-team.turn{background:var(--tc);box-shadow:inset 4px 0 0 var(--tc),0 0 0 2px var(--tc)}
  .p-scores.side .p-team.lead{box-shadow:inset 4px 0 0 var(--tc),0 0 0 2px #f2b31d}
  .p-scores.side .p-team.turn.lead{box-shadow:inset 4px 0 0 var(--tc),0 0 0 2px var(--tc),0 0 0 5px rgba(var(--ink-rgb,22,21,20),0.6)}
  .p-scores.side .rank{font-size:18px;font-weight:900;color:var(--n-soft,#2e2a26);text-align:center}
  .p-scores.side .rank .tt-ic{width:24px;height:24px}
  .p-scores.side .nm{display:grid;gap:2px;min-width:0}
  .p-scores.side .nm b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:800}
  .p-scores.side .fire{font-size:13px}
  .p-scores.side strong{min-width:58px;padding:8px 10px;border-radius:14px;font-size:24px;font-variant-numeric:tabular-nums}
  .p-scores.side .adj{position:absolute;right:-4px;top:50%;translate:0 -50%;opacity:0;transition:opacity .15s}
  .p-scores.side .p-team{position:relative}
  .p-scores.side .p-team:hover .adj{opacity:1}
  .p-scores.side .p-delta{left:auto!important;right:6px!important;top:-14px!important;font-size:22px!important;padding:2px 12px;animation:pDeltaSide 2.4s ease both!important}
  .p-scores.side.many .p-team{padding:8px 10px;gap:8px}
  .p-scores.side.many strong{font-size:18px;min-width:46px;padding:5px 8px}
  .p-scores.side.many .nm b{font-size:14px}
  .p-playing .p-q{border-radius:22px 0 0 0}
}
@keyframes pDeltaSide{0%{opacity:0;transform:translateY(10px) scale(.4)}12%{opacity:1;transform:translateY(0) scale(1.25)}22%{transform:scale(1)}75%{opacity:1;transform:translateY(-6px)}100%{opacity:0;transform:translateY(-22px) scale(.9)}}

/* v67 · leaderboards */
.p-lb{position:relative;display:flex;align-items:flex-end;justify-content:center;gap:14px;width:min(860px,100%);padding-top:10px}
.p-lb .pod{position:relative;display:grid;justify-items:center;gap:6px;width:min(240px,30vw);animation:pPop .6s cubic-bezier(.3,1.5,.5,1) both;animation-delay:var(--d)}
.p-lb .av{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--n-card,#fbf8f1);color:var(--n-ink,#161514);font-size:22px;font-weight:900;box-shadow:0 0 0 4px rgba(var(--ink-rgb,22,21,20),0.245)}
.p-lb .pod.p1 .av{width:84px;height:84px;font-size:28px}
.p-lb .nm{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--n-ink,#161514);font-size:20px;font-weight:900}
.p-lb .pod.p1 .nm{font-size:24px}
.p-lb .sc{display:inline-flex;align-items:baseline;gap:6px;padding:5px 14px;border-radius:999px;background:rgba(255,253,248,calc(0.75 * var(--wash-k,1)))}
.p-lb .sc strong{font-size:22px;font-weight:900;color:var(--n-ink,#161514);font-variant-numeric:tabular-nums}
.p-lb .sc small{color:var(--n-mute,#5a534b);font-size:12px}
/* teens & children: crowns, light rays, podium blocks */
.p-lb.crowns::before{content:"";position:absolute;left:50%;top:40%;width:900px;height:900px;translate:-50% -50%;background:repeating-conic-gradient(from 0deg,rgba(255,253,248,calc(0.54 * var(--wash-k,1))) 0deg 6deg,transparent 6deg 18deg);mask:radial-gradient(circle,#efe9dd 0,transparent 62%);-webkit-mask:radial-gradient(circle,#efe9dd 0,transparent 62%);animation:pSpin 40s linear infinite;pointer-events:none;z-index:-1}
@keyframes pSpin{to{rotate:360deg}}
.p-lb.crowns .top{width:84px;height:62px;animation:pCrown .7s cubic-bezier(.3,1.6,.5,1) both;animation-delay:calc(var(--d) + .35s);filter:none}
.p-lb.crowns .pod.p1 .top{width:118px;height:86px}
.p-lb.crowns .top svg{width:100%;height:100%}
@keyframes pCrown{from{opacity:0;transform:translateY(-60px) rotate(-14deg) scale(.6)}to{opacity:1;transform:none}}
.p-lb.crowns .block{position:relative;display:grid;place-items:center;width:100%;margin-top:6px;border-radius:16px 16px 0 0;background:var(--n-mid,#d1cbc1);box-shadow:inset 0 2px 0 rgba(var(--ink-rgb,22,21,20),0.17);transform-origin:bottom;animation:pRise .8s cubic-bezier(.3,1.4,.5,1) both;animation-delay:var(--d);overflow:hidden}
.p-lb.crowns .pod.p1 .block{height:170px;background:#2b2a28}
.p-lb.crowns .pod.p2 .block{height:120px}
.p-lb.crowns .pod.p3 .block,.p-lb.crowns .pod:not(.p1):not(.p2) .block{height:90px}
.p-lb.crowns .block em{font-style:normal;font-size:clamp(44px,6vw,76px);font-weight:900;color:rgba(var(--ink-rgb,22,21,20),0.55);letter-spacing:-.02em;line-height:1}
.p-lb.crowns .block em sup{font-size:.42em}
/* adults: spotlights with thin numbers */
.p-lb.spot{gap:0;align-items:flex-start}
.p-lb.spot .pod{width:min(250px,31vw);padding-bottom:0}
.p-lb.spot .pod.p1{margin-top:-24px}
.p-lb.spot .top{display:none}
.p-lb.spot .av{width:70px;height:70px}
.p-lb.spot .pod.p1 .av{width:86px;height:86px}
.p-lb.spot .sc{background:none;padding:0}
.p-lb.spot .block{display:grid;place-items:end center;width:100%;height:230px;margin-top:10px;clip-path:polygon(28% 0,72% 0,100% 100%,0 100%);background:var(--sp);animation:pBeam 1s ease both;animation-delay:var(--d)}
.p-lb.spot .pod.p1 .block{height:270px}
.p-lb.spot .pod.p1{--sp:#1f8a5a}.p-lb.spot .pod.p2{--sp:#2f62d9}.p-lb.spot .pod.p3{--sp:#f2b31d}.p-lb.spot .pod{--sp:#2f62d9}
.p-lb.spot .block em{margin-bottom:28px;font-style:normal;font-size:clamp(56px,8vw,96px);font-weight:200;color:var(--sp);line-height:1}
.p-lb.spot .block em sup{display:none}
@keyframes pBeam{from{opacity:0;transform:scaleY(.2);transform-origin:top}to{opacity:1;transform:none}}
.p-rest-list{display:grid;gap:6px;width:min(520px,100%)}
.p-rest-list div{display:grid;grid-template-columns:32px 36px 1fr auto;align-items:center;gap:10px;padding:8px 12px;border-radius:14px;background:rgba(255,253,248,calc(0.4 * var(--wash-k,1)))}
.p-rest-list i{font-style:normal;font-weight:900;color:var(--n-mute,#5a534b);text-align:center}
.p-rest-list .av{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--tc);color:#161514;font-size:13px;font-weight:900}
.p-rest-list b{color:var(--n-ink,#161514)}
.p-rest-list strong{color:var(--n-ink,#161514);font-weight:900}
.p-end{gap:16px}
.p-end>h2{font-size:clamp(28px,4vw,44px)}
.p-end.has-gif .p-lb{transform:scale(.82);transform-origin:top center;margin-bottom:-40px}
.p-win-gif img{max-height:min(30vh,320px)}
.p-end.adult-end .p-trophy{width:84px;height:84px;border-radius:26px}
.p-end.has-gif{gap:8px;padding-top:1vh}
.p-end.has-gif .p-win-gif{padding:6px;border-radius:18px}
.p-end.has-gif .p-win-gif img{max-height:min(22vh,220px)}
.p-end.has-gif .p-win-ribbon{margin-top:-18px;padding:8px 34px 10px}
.p-end.has-gif .p-win-ribbon .crown{display:none}
.p-end.has-gif .p-win-ribbon b{font-size:clamp(24px,3.4vw,40px)}
.p-end.has-gif .p-lb{transform:scale(.78);margin:-6px 0 -60px}
.p-end.has-gif .p-rest-list div{padding:5px 10px}

/* v69 · mascots */
.p-mascot{display:grid;place-items:center;width:100%;height:100%;border-radius:30%;background:var(--mbg)}
.p-mascot svg{width:88%;height:88%;overflow:visible}
.p-team .tmz{display:block;width:40px;height:40px;filter:none}
.p-scores.side.many .p-team .tmz{width:30px;height:30px}
.p-scores:not(.side) .p-team .tmz{width:30px;height:30px}
.p-team.hit-up .tmz{animation:pHop .5s ease 2}
.p-turn{align-items:center}
.p-turn .tmz{display:inline-block;width:46px;height:46px;margin-right:8px;vertical-align:middle;animation:pPop .5s cubic-bezier(.3,1.6,.5,1) both}
.p-lb .av.mav{background:none;box-shadow:none;width:84px;height:84px}
.p-lb .pod.p1 .av.mav{width:110px;height:110px}
.p-lb .av.mav .p-mascot{box-shadow:0 0 0 4px rgba(var(--ink-rgb,22,21,20),0.27)}
.p-rest-list .av.mav{background:none;width:40px;height:40px}
.p-end-row{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.p-end-row .g-btn{display:inline-flex;align-items:center;gap:6px}
.p-end-row .g-btn[disabled]{opacity:.35}
/* resume card */
.p-setup .p-resume,.p-resume{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;padding:18px;border-radius:22px;background:#2b2a28;color:#fffdf8;box-shadow:none;animation:pPop .5s cubic-bezier(.3,1.5,.5,1) both}
.p-resume .ico{display:grid;place-items:center;width:56px;height:56px;border-radius:18px;background:rgba(var(--ink-rgb,22,21,20),0.22)}
.p-resume b{font-size:19px;font-weight:900}
.p-resume small{display:block;opacity:.9;margin:2px 0 8px}
.p-resume .teams{display:flex;flex-wrap:wrap;gap:6px}
.p-resume .teams span{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 4px;border-radius:999px;background:var(--n-raise,#f5efe3);font-weight:800;font-size:13px}
.p-resume .teams i{display:block;width:26px;height:26px}
.p-resume .act{display:grid;gap:8px}
.p-resume .p-start{min-width:0!important;height:50px!important;font-size:17px!important;background:var(--n-ink,#161514)!important;color:var(--n-onink,#fffdf8)!important;box-shadow:none!important}
.p-resume .p-skip{border:0;border-radius:14px;min-height:40px;background:var(--n-raise,#f5efe3);color:var(--n-ink,#161514);font-weight:800;cursor:pointer}
@media (max-width:640px){.p-resume{grid-template-columns:1fr}.p-resume .ico{display:none}}
/* new question types */
.p-gap{display:inline-grid;place-items:center;min-width:3.4em;margin:0 .15em;padding:0 .3em;border-radius:12px;background:#f9e9c2;color:#8a5a00;box-shadow:inset 0 -3px 0 rgba(var(--ink-rgb,22,21,20),0.08)}
.p-gap.filled{background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);animation:pPop .4s cubic-bezier(.3,1.6,.5,1)}
.p-say{display:inline-flex;flex-direction:column;align-items:center;gap:6px;justify-self:center;padding:20px 30px;border:0;border-radius:24px;background:#2b2a28;color:#fffdf8;font-size:18px;cursor:pointer;box-shadow:none}
.p-say.pulse{animation:pPulse .6s ease}
.p-order,.p-match{display:grid;gap:14px}
.p-order .pool,.p-order .line{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;min-height:58px}
.p-order .line{padding:10px;border-radius:18px;background:var(--n-ink,#161514);border:2px dashed var(--n-edge,#161514)}
.p-order .chip,.p-match .mi{min-height:54px;padding:0 18px;border:0;border-radius:16px;background:#2b2a28;color:#fffdf8;font-size:clamp(17px,2vw,22px);font-weight:800;cursor:pointer;box-shadow:inset 0 -4px 0 rgba(var(--ink-rgb,22,21,20),0.18);animation:pTileIn .45s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(var(--i,0) * 60ms)}
.p-order .chip:nth-child(3n+2){background:#2b2a28}.p-order .chip:nth-child(3n){background:#d8383b}
.p-order .chip[disabled]{opacity:.25}
.p-order .chip.in{display:inline-flex;align-items:center;gap:8px;background:var(--n-card,#fbf8f1);cursor:default}
.p-order .chip.in i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#f2b31d;color:#161514;font-style:normal;font-size:15px}
.p-order.good .line{border-color:#1f8a5a;background:var(--n-ink,#161514)}.p-order.bad .line{border-color:#d8383b;background:var(--n-ink,#161514)}
.p-match{grid-template-columns:1fr 1fr;align-items:start}
.p-match .col{display:grid;gap:10px}
.p-match .r .mi{background:var(--n-card,#fbf8f1)}
.p-match .mi.sel{outline:4px solid #8a5a00;outline-offset:2px}
.p-match .mi.paired{background:var(--pc)}
.p-match.good .mi{outline:3px solid #1f8a5a}.p-match.bad .mi{outline:3px solid #d8383b}
.p-ans.list{display:grid;gap:6px;font-size:clamp(17px,2vw,24px)}
.p-mc.odd button i{background:var(--n-card,#fbf8f1)!important}

/* ===== Live (board) ===== */
.lv-root.lv-off .p-bar::after{content:"Reconnecting…";margin-left:12px;padding:4px 10px;border-radius:999px;background:#d8383b;font-size:12px;font-weight:800}
.lv-body{display:flex;flex-direction:column;min-height:0}
.lv-lobby{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:22px;width:min(1300px,100%);margin:0 auto;padding:10px 6px}
@media (max-width:900px){.lv-lobby{grid-template-columns:1fr}}
.lv-join{display:grid;justify-items:center;align-content:start;gap:16px;padding:26px;border-radius:30px;background:#2b2a28;box-shadow:none}
.lv-step{display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border-radius:999px;background:var(--n-raise,#f5efe3);font-size:clamp(16px,1.8vw,22px)}
.lv-pinwrap{display:grid;justify-items:center}
.lv-pinwrap small{text-transform:uppercase;letter-spacing:.2em;font-weight:800;opacity:.85}
.lv-pin{font-size:clamp(64px,9vw,128px);font-weight:900;letter-spacing:.06em;line-height:1;text-shadow:none}
.lv-qr{display:grid;place-items:center;padding:12px;border-radius:22px;background:var(--n-ink,#161514);min-width:120px;min-height:120px}
.lv-qr img{display:block;width:clamp(150px,18vw,230px);height:auto;image-rendering:pixelated}
.lv-side{display:grid;align-content:start;gap:14px}
.lv-count{font-size:22px;color:var(--n-soft,#2e2a26)}.lv-count b{font-size:40px;color:var(--n-ink,#161514);font-weight:900}
.lv-players{display:flex;flex-wrap:wrap;gap:10px;min-height:120px;max-height:42vh;overflow:auto;padding:4px}
.lv-empty{color:var(--t-blue,#2f62d9);margin:auto}
.lv-pl{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border:0;border-radius:999px;background:rgba(255,253,248,calc(0.61 * var(--wash-k,1)));color:var(--n-ink,#161514);font-weight:800;font-size:16px;cursor:pointer;animation:pPop .5s cubic-bezier(.3,1.7,.5,1) both}
.lv-pl .mz{display:block;width:38px;height:38px}
.lv-pl.new{animation:pLand .6s cubic-bezier(.3,1.7,.5,1) both;box-shadow:0 0 0 2px #f2b31d}
.lv-pl:hover{background:rgba(216,56,59,0.345)}
.lv-settings{display:grid;gap:10px}
.lv-set{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:18px;background:rgba(255,253,248,calc(0.4 * var(--wash-k,1)))}
.lv-set .ico{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#2b2a28}
.lv-set .seg{display:flex;gap:6px;margin-left:auto}
.lv-set .seg button{min-width:54px;height:38px;border:0;border-radius:12px;background:rgba(255,253,248,calc(0.54 * var(--wash-k,1)));color:var(--n-soft,#2e2a26);font-weight:800;cursor:pointer}
.lv-set .seg button[aria-pressed="true"]{background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8)}
.lv-tg .p-opt{min-height:96px}
.lv-start{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:64px;border:0;border-radius:20px;background:#1f8a5a;color:#161514;font-size:22px;font-weight:900;cursor:pointer;box-shadow:none}
.lv-start[disabled]{filter:grayscale(1);opacity:.5;cursor:default}
.lv-msg{color:var(--t-must,#8a5a00);margin:0;text-align:center}
.lv-q{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;gap:14px;height:100%;width:min(1300px,100%);margin:0 auto}
.lv-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.lv-n,.lv-ans{padding:8px 16px;border-radius:999px;background:rgba(255,253,248,calc(0.61 * var(--wash-k,1)));font-weight:800}
.lv-ans b{font-size:22px}
.lv-ring{position:relative;width:86px;height:86px}
.lv-ring svg{width:100%;height:100%;rotate:-90deg}
.lv-ring circle{fill:none;stroke:rgba(var(--ink-rgb,22,21,20),0.17);stroke-width:9}
.lv-ring .arc{stroke:var(--t-green,#1f8a5a);stroke-linecap:round;stroke-dasharray:276.5;transition:stroke-dashoffset .1s linear}
.lv-ring.low .arc{stroke:var(--t-red,#d8383b)}
.lv-ring b{position:absolute;inset:0;display:grid;place-items:center;font-size:32px;font-weight:900}
.lv-ring.low b{animation:pBump .5s ease infinite}
.lv-stage{display:grid;place-items:center;align-content:center;gap:14px;min-height:0;padding:18px;border-radius:26px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);text-align:center}
.lv-text{font-size:clamp(26px,3.6vw,48px);font-weight:800;line-height:1.2}
.lv-said{margin-top:10px;font-size:.8em;color:var(--t-violet,#6b4fd8)}
.lv-media img{max-height:34vh;max-width:100%;border-radius:18px}
.lv-opts{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lv-opts.chips{display:flex;flex-wrap:wrap;justify-content:center}
.lv-opts.pairs{grid-template-columns:1fr 1fr}
.lv-opts.pairs>div{display:grid;gap:8px}
.lv-opt{position:relative;display:flex;align-items:center;gap:14px;min-height:84px;padding:14px 18px;border-radius:20px;background:var(--c1);font-size:clamp(18px,2.2vw,28px);font-weight:800;overflow:hidden;box-shadow:inset 0 -5px 0 rgba(var(--ink-rgb,22,21,20),0.18);animation:pPop .4s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(var(--i) * 70ms)}
.lv-opt i{font-style:normal;font-size:1.2em;opacity:.9}
.lv-opt span{position:relative;z-index:1}
.lv-opt .bar{position:absolute;right:14px;top:50%;translate:0 -50%;font-style:normal}
.revealed .lv-opt.wrong{filter:saturate(.2) brightness(.55)}
.revealed .lv-opt.right{box-shadow:0 0 0 4px var(--n-shadow,#161514),inset 0 -5px 0 rgba(var(--ink-rgb,22,21,20),0.18)}
.revealed .lv-opt .bar::after{content:attr(data-n);display:grid;place-items:center;min-width:44px;height:44px;border-radius:14px;background:rgba(var(--ink-rgb,22,21,20),0.175);font-weight:900}
.revealed .lv-opt::before{content:"";position:absolute;left:0;bottom:0;height:6px;width:var(--w,0);background:rgba(var(--ink-rgb,22,21,20),0.7);transition:width .8s ease}
.lv-opt .bar[style]{}
.lv-chip{display:inline-grid;place-items:center;min-width:56px;min-height:58px;padding:0 16px;border-radius:16px;background:#2b2a28;font-size:clamp(20px,2.6vw,32px);font-weight:900;text-transform:uppercase;animation:pTileIn .45s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(var(--i,0) * 60ms)}
.lv-chip.wide{text-transform:none;font-size:clamp(17px,2vw,24px)}
.lv-chip.alt{background:#2b2a28}
.lv-chip:nth-child(3n+2){background:#d8383b}.lv-chip:nth-child(3n){background:#1f8a5a}
.lv-hint{display:flex;align-items:center;justify-content:center;gap:10px;grid-column:1/-1;margin:0;padding:18px;border-radius:20px;background:rgba(255,253,248,calc(0.47 * var(--wash-k,1)));font-size:clamp(18px,2vw,24px);font-weight:700}
.lv-answer{grid-column:1/-1}
.lv-split{display:flex;justify-content:center;gap:12px;grid-column:1/-1}
.lv-split span{padding:10px 20px;border-radius:16px;font-weight:800}.lv-split b{font-size:26px}
.lv-split .ok{background:rgba(31,138,90,0.287)}.lv-split .no{background:rgba(216,56,59,0.287)}
.lv-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:54px}
.lv-feed{position:relative;display:flex;align-items:center;gap:8px;flex:1;min-width:0;overflow:hidden}
.lv-blip{display:block;width:38px;height:38px;animation:pBlip 2.5s ease both}
@keyframes pBlip{0%{opacity:0;transform:translateY(20px) scale(.4)}15%{opacity:1;transform:none}80%{opacity:1}100%{opacity:0;transform:translateY(-30px)}}
.lv-toast{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border-radius:999px;background:#1f8a5a;font-weight:800;white-space:nowrap;animation:pPop .4s cubic-bezier(.3,1.6,.5,1) both}
.lv-toast.steal{background:#2b2a28}.lv-toast.lose{background:#d8383b}
.lv-toast .mz{display:block;width:30px;height:30px}
.lv-toast.out{opacity:0;transition:opacity .4s}
.lv-skip{white-space:nowrap}
.lv-next{display:inline-flex;align-items:center;gap:8px;height:56px;padding:0 26px;border:0;border-radius:18px;background:#e1502a;color:#161514;font-size:20px;font-weight:900;cursor:pointer}
.lv-board{display:grid;justify-items:center;gap:16px;width:min(760px,100%);margin:0 auto;padding-top:2vh}
.lv-board h2{margin:0;font-size:clamp(28px,4vw,44px)}
.lv-rows{display:grid;gap:10px;width:100%}
.lv-row{display:grid;grid-template-columns:40px 52px 1fr auto auto;align-items:center;gap:12px;padding:10px 16px;border-radius:20px;background:rgba(255,253,248,calc(0.54 * var(--wash-k,1)));font-size:20px;animation:pRow .6s cubic-bezier(.3,1.4,.5,1) both;animation-delay:calc(var(--i) * 90ms)}
.lv-row:first-child{background:transparent;box-shadow:inset 4px 0 0 #f2b31d}
.lv-row.up{animation:pRowUp .9s cubic-bezier(.3,1.4,.5,1) both;animation-delay:calc(var(--i) * 90ms + .2s)}
@keyframes pRow{from{opacity:0;transform:translateX(-40px)}to{opacity:1;transform:none}}
@keyframes pRowUp{from{opacity:.6;transform:translateY(var(--from,100%))}to{opacity:1;transform:none}}
.lv-row i{font-style:normal;font-weight:900;color:var(--n-soft,#2e2a26);text-align:center}
.lv-row .mz{display:block;width:52px;height:52px}
.lv-row b{font-weight:900}
.lv-row .st{display:inline-flex;align-items:center;gap:2px;color:var(--t-verm,#e1502a);font-weight:900;font-size:15px}
.lv-row strong{font-weight:900;font-variant-numeric:tabular-nums}
.lv-remote-modal .g-modal-box{display:grid;justify-items:center;text-align:center;gap:6px}
.lv-remote-modal h2{display:inline-flex;align-items:center;gap:8px}
.lv-rlink{font-size:12px;color:var(--t-blue,#2f62d9);word-break:break-all}
.lv-rstate{font-weight:800;color:var(--t-green,#1f8a5a)}
.g-mode.live{background:#1f8a5a !important;display:flex;align-items:center;justify-content:center;gap:8px}
.g-mode.live small{opacity:.85;font-weight:600;font-size:12px}

/* ===== phone pages (/join) ===== */
body.jn{margin:0;min-height:100vh;min-height:100dvh;background:var(--n-mid,#d1cbc1);color:var(--n-ink,#161514);font-family:var(--g-font,Inter,system-ui,sans-serif);-webkit-tap-highlight-color:transparent}
.jn-app{min-height:100vh;min-height:100dvh}
.jn-s{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh;box-sizing:border-box;padding:max(14px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom))}
.jn-start{align-items:center;justify-content:center;gap:16px;text-align:center}
.jn-logo{width:170px;height:40px;background:url("/theme/teachtally-logo-on-light.svg") center/contain no-repeat}
.jn-start h1{margin:0;font-size:32px}
.jn-start p{margin:0;color:var(--n-mute,#5a534b)}
.jn-form{display:grid;gap:10px;width:min(360px,100%)}
.jn-form input{height:64px;border:0;border-radius:18px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);font:900 26px/1 inherit;text-align:center;letter-spacing:.12em;outline:none}
.jn-form input[maxlength="18"]{letter-spacing:0;font-size:22px}
.jn-form button{height:60px;border:0;border-radius:18px;background:#1f8a5a;color:#161514;font:900 22px inherit;cursor:pointer}
.jn-msg{min-height:1.3em;color:var(--t-must,#8a5a00)!important}
.jn-net{position:fixed;left:50%;top:10px;translate:-50% 0;z-index:9;padding:6px 14px;border-radius:999px;background:#d8383b;font-weight:800;font-size:13px}
.jn-head{display:flex;align-items:center;gap:10px;padding:6px;border-radius:999px;background:rgba(255,253,248,calc(0.61 * var(--wash-k,1)))}
.jn-head .mz{display:block;width:40px;height:40px}
.jn-head .nm{flex:1;font-weight:900;font-size:17px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jn-head .sc{padding:6px 14px;border-radius:999px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);font-weight:900;font-variant-numeric:tabular-nums}
.jn-wait{flex:1;display:grid;justify-items:center;align-content:center;gap:10px;text-align:center}
.jn-wait .big{display:block;width:140px;height:140px;animation:pHop 1.4s ease-in-out infinite}
.jn-wait h2{margin:0;font-size:30px}
.jn-wait p{margin:0;color:var(--n-soft,#2e2a26)}
.jn-s.pop .jn-wait .big{animation:pLand .7s cubic-bezier(.3,1.7,.5,1) both,pHop 1.4s ease-in-out .7s infinite}
.jn-wait.ok h2{color:var(--t-green,#1f8a5a)}.jn-wait.no h2{color:var(--t-red,#b0242a)}
.jn-answer{padding:12px 18px;border-radius:16px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);font-size:22px;font-weight:900}
.jn-tbar{height:8px;margin:12px 0;border-radius:999px;background:rgba(255,253,248,calc(0.89 * var(--wash-k,1)));overflow:hidden}
.jn-tbar i{display:block;height:100%;width:100%;background:#1f8a5a;transition:width .1s linear}
.jn-tbar.low i{background:#d8383b}
.jn-q{flex:1;display:grid;grid-template-rows:auto auto 1fr;gap:10px}
.jn-q small{color:var(--n-mute,#5a534b);font-weight:700}
.jn-q h2{margin:0;font-size:22px;line-height:1.3}
.jn-body{display:grid;gap:10px;align-content:start}
.jn-body.sent{opacity:.6;pointer-events:none}
.jn-opts{grid-template-columns:1fr 1fr;align-content:stretch}
.jn-opts.two{grid-template-columns:1fr}
.jn-opts button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:min(22vh,150px);padding:12px;border:0;border-radius:20px;background:var(--c1);color:#161514;font-size:18px;font-weight:800;box-shadow:inset 0 -6px 0 rgba(var(--ink-rgb,22,21,20),0.18);cursor:pointer;transition:transform .1s}
.jn-opts button:active{transform:scale(.95)}
.jn-opts button i{font-style:normal;font-size:32px}
.jn-opts button.picked{box-shadow:0 0 0 4px var(--n-shadow,#161514)}
.jn-type{display:grid;gap:10px}
.jn-type input{height:62px;border:0;border-radius:18px;padding:0 16px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8);font:800 22px inherit;text-align:center;outline:none}
.jn-type button,.jn-ghost{height:56px;border:0;border-radius:18px;background:#2b2a28;color:#fffdf8;font:900 20px inherit;cursor:pointer}
.jn-ghost{background:rgba(255,253,248,calc(0.75 * var(--wash-k,1)));font-size:16px;height:46px}
.jn-letters{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.jn-letters span{display:grid;place-items:center;min-width:42px;height:48px;padding:0 8px;border-radius:12px;background:#2b2a28;font-size:22px;font-weight:900;text-transform:uppercase}
.jn-line,.jn-pool{display:flex;flex-wrap:wrap;gap:8px;min-height:48px}
.jn-line{padding:8px;border-radius:16px;border:2px dashed rgba(var(--ink-rgb,22,21,20),0.333)}
.jn-chip{min-height:50px;padding:0 14px;border:0;border-radius:14px;background:#2b2a28;color:#fffdf8;font-weight:800;font-size:17px;cursor:pointer}
.jn-chip.alt{background:#2b2a28}.jn-chip.in{display:inline-grid;place-items:center;background:var(--n-card,#fbf8f1);box-shadow:inset 0 0 0 2px rgba(var(--ink-rgb,22,21,20),0.27)}
.jn-chip.sel{outline:4px solid #8a5a00}.jn-chip[disabled]{opacity:.3}
.jn-match{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.jn-match>div{display:grid;gap:8px;align-content:start}
.jn-res{flex:1;display:grid;justify-items:center;align-content:center;gap:8px;text-align:center}
.jn-res .mark{display:grid;place-items:center;width:120px;height:120px;border-radius:50%;background:#1f8a5a;animation:pLand .6s cubic-bezier(.3,1.7,.5,1) both}
.jn-res.no .mark{background:#d8383b;animation:pShake .5s ease}
.jn-res h2{margin:0;font-size:34px}
.jn-res .pts{margin:0;font-size:26px;font-weight:900}
.jn-res .st{margin:0;display:inline-flex;align-items:center;gap:4px;color:var(--t-must,#8a5a00);font-weight:900}
.jn-s.good{background:transparent}
.jn-s.bad{background:transparent}
.jn-chests{display:grid;gap:10px;justify-items:center;margin-top:10px}
.jn-chests p{margin:0;font-weight:900;font-size:20px}
.jn-chests>div{display:flex;gap:12px}
.jn-chest{width:90px;height:76px;padding:6px;border:0;border-radius:18px;background:rgba(255,253,248,calc(0.61 * var(--wash-k,1)));cursor:pointer;animation:pPop .45s cubic-bezier(.3,1.6,.5,1) both,pHop 1.2s ease-in-out infinite;animation-delay:calc(var(--i) * 90ms),calc(var(--i) * 200ms + .5s)}
.jn-chest svg{width:100%;height:100%}
.jn-chest.open{animation:pChest .6s ease both;background:rgba(242,179,29,0.287)}
.jn-chest.fade{opacity:.25;animation:none}
@keyframes pChest{0%{transform:scale(1)}30%{transform:scale(1.25) rotate(-8deg)}60%{transform:scale(1.15) rotate(8deg)}100%{transform:scale(1.1)}}
.jn-prize{padding:10px 18px;border-radius:16px;background:#1f8a5a;font-size:22px;font-weight:900;animation:pPop .5s cubic-bezier(.3,1.7,.5,1) .5s both}
.jn-prize.steal{background:#2b2a28}.jn-prize.lose{background:#d8383b}.jn-prize.nothing{background:var(--n-mid,#d1cbc1)}
.jn-toast{position:fixed;left:50%;bottom:24px;translate:-50% 0;z-index:9;padding:12px 18px;border-radius:16px;background:#1f8a5a;font-weight:900;animation:pPop .4s cubic-bezier(.3,1.6,.5,1) both}
.jn-toast.bad{background:#d8383b}
.jn-final{flex:1;display:grid;justify-items:center;align-content:center;gap:10px;text-align:center}
.jn-final .medal{display:grid;place-items:center;width:78px;height:78px;border-radius:50%;font-size:36px;font-weight:900;color:var(--n-ink,#161514);background:var(--n-mute2,#8d8a83);animation:pLand .7s cubic-bezier(.3,1.7,.5,1) both}
.jn-final .medal.m1{background:#f2b31d}.jn-final .medal.m2{background:var(--n-ink,#161514)}.jn-final .medal.m3{background:#e1502a}
.jn-final .big{display:block;width:150px;height:150px;animation:pHop 1.2s ease-in-out infinite}
.jn-final h2{margin:0;font-size:32px}.jn-final p{margin:0;color:var(--n-soft,#2e2a26);font-size:18px}
/* remote */
.jn-remote{gap:12px}
.jn-rhead{display:flex;align-items:center;justify-content:space-between}
.jn-rhead b{display:inline-flex;align-items:center;gap:6px}
.jn-rhead .st{color:var(--n-mute,#5a534b);font-size:14px}
.jn-rteams{display:grid;gap:6px}
.jn-rteam{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:10px;padding:6px 12px 6px 6px;border-radius:14px;background:rgba(255,253,248,calc(0.47 * var(--wash-k,1)));box-shadow:inset 3px 0 0 var(--tc)}
.jn-rteam.turn{background:color-mix(in srgb,var(--tc) 30%,transparent)}
.jn-rteam .mz{display:block;width:32px;height:32px}
.jn-rteam strong{font-weight:900}
.jn-rmain{flex:1;display:grid;gap:12px;align-content:start}
.jn-rgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.jn-rgrid button{aspect-ratio:1.2;border:0;border-radius:14px;background:#2b2a28;color:#fffdf8;font-size:22px;font-weight:900;cursor:pointer}
.jn-rgrid button:nth-child(4n+2){background:#d8383b}.jn-rgrid button:nth-child(4n+3){background:#1f8a5a}.jn-rgrid button:nth-child(4n){background:#2b2a28}
.jn-rgrid button[disabled]{background:rgba(255,253,248,calc(0.47 * var(--wash-k,1)));color:rgba(var(--ink-rgb,22,21,20),0.55)}
.jn-rq{display:grid;gap:8px;padding:14px;border-radius:18px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8)}
.jn-rq small{color:var(--n-ink,#161514);font-weight:800}
.jn-rq h2{margin:0;font-size:19px}
.jn-rq .ans{display:grid;padding:10px 12px;border-radius:12px;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8)}
.jn-rq .ans span{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}
.jn-rq .ans b{font-size:18px}
.jn-rbtns{display:grid;gap:8px}
.jn-rbtns button{min-height:54px;border:0;border-radius:16px;background:rgba(255,253,248,calc(0.75 * var(--wash-k,1)));color:var(--n-ink,#161514);font-size:17px;font-weight:800;cursor:pointer;text-align:left;padding:0 16px}
.jn-rbtns button.ok{background:#1f8a5a;text-align:center;font-size:20px}.jn-rbtns button.no{background:#d8383b;text-align:center;font-size:20px}.jn-rbtns button.main{background:#2b2a28;text-align:center}
.jn-rbtns button.opt{background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8)}
.jn-rfoot{display:flex;gap:8px}
.jn-rfoot button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:48px;border:0;border-radius:14px;background:rgba(255,253,248,calc(0.75 * var(--wash-k,1)));color:var(--n-ink,#161514);font-weight:800;cursor:pointer}
.jn-rfoot .end{background:rgba(216,56,59,0.345)}
.jn-hint{color:var(--n-soft,#2e2a26);text-align:center}
.jn-remote .p-start{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:60px;border:0;border-radius:18px;background:#e1502a;color:#161514;font-size:20px;font-weight:900}
.lv-feed{overflow:visible;flex-wrap:wrap}
.revealed .lv-ring{opacity:.25}
.lv-opts>.p-ans{text-align:center}
.jn-revnote{margin:6px 0 0;color:var(--n-soft,#2e2a26);font-weight:800}
.p-setup .p-resume{border:0;background:#2b2a28}
.p-resume .teams i{width:30px;height:30px}

/* v70 · no mascots, arrows inside the team card, +points never cut off, remote above the game */
.p-ini{display:grid;place-items:center;width:100%;height:100%;border-radius:30%;background:var(--bc);color:var(--n-ink,#161514);font-weight:900;font-size:15px;letter-spacing:.02em}
.jn-head .p-ini{font-size:16px}
.lv-row .p-ini{font-size:20px}
@media (min-width:761px){
  .p-playing .p-scores.side{padding:24px 4px 8px}
  .p-scores.side .p-team{grid-template-columns:30px minmax(0,1fr) auto auto}
  .p-scores.side.many .p-team{grid-template-columns:24px minmax(0,1fr) auto auto}
  .p-scores.side .adj{position:static;translate:none;opacity:.35}
  .p-scores.side .p-team:hover .adj{opacity:1}
  .p-scores.side .adj button{width:22px;height:20px}
}
.g-modal.lv-remote-modal{z-index:2147483300}

/* v73 · question editor: colourful tiles, numbered steps, bold labels */
.g-panel.g-qed{padding:24px 26px;border:0;border-radius:26px;background:var(--n-raise,#f6f1e7);box-shadow:inset 0 0 0 1px rgba(var(--ink-rgb,22,21,20),0.22)}
.g-qed-head{display:flex;align-items:center;gap:14px;margin-bottom:6px}
.g-qed-head h2{margin:0!important;font-size:24px!important;font-weight:850!important;letter-spacing:-.02em}
.g-qed-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:15px;background:#2b2a28;color:#fffdf8;box-shadow:none}
.g-qed-step{display:flex;align-items:center;gap:10px;margin:22px 0 12px;font-size:15px;font-weight:850;letter-spacing:.02em;color:var(--n-ink,#161514)}
.g-qed-step b{display:grid;place-items:center;width:26px;height:26px;border-radius:9px;background:rgba(47,98,217,0.207);color:var(--t-blue,#2550b8);font-size:13px}
.g-qtiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(122px,1fr));gap:10px}
.g-qtiles button{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:12px;min-height:96px;padding:13px 14px;border:0;border-radius:18px;text-align:left;cursor:pointer;color:var(--n-ink,#161514);
  background:var(--n-card,#fbf8f1);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--qa) 30%,transparent);transition:transform .15s,box-shadow .15s,background .15s}
.g-qtiles button i{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:var(--qa);color:#161514;box-shadow:none}
.g-qtiles button span{font-size:15px;font-weight:850;line-height:1.15;letter-spacing:-.005em}
.g-qtiles button:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--qa) 60%,transparent)}
.g-qtiles button[aria-checked="true"]{background:var(--qa);box-shadow:0 0 0 3px var(--n-shadow,#161514);transform:translateY(-2px)}
.g-qtiles button[aria-checked="true"] i{background:var(--n-raise,#f5efe3);box-shadow:none}
.g-qtiles button[aria-checked="true"]::after{content:"";position:absolute;top:12px;right:12px;width:22px;height:22px;border-radius:50%;background:var(--n-ink,#161514) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b1630' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/14px no-repeat}
.g-qhelp{margin-top:12px;padding:11px 16px;border-radius:14px;background:rgba(47,98,217,0.115);color:var(--n-soft,#2e2a26);font-size:14px;font-weight:600}
.g-qhelp:empty{display:none}
.g-qed-qa{grid-template-columns:1fr 1fr!important;gap:14px!important}
.g-qed .g-field>span{font-size:13px;font-weight:800;color:var(--n-soft,#2e2a26);letter-spacing:.01em}
.g-qed textarea.g-input,.g-qed .g-choice .g-input{min-height:58px;padding:14px 16px;border:0;border-radius:16px;background:rgba(255,253,248,calc(0.47 * var(--wash-k,1)));box-shadow:inset 0 0 0 1.5px rgba(var(--ink-rgb,22,21,20),0.12);font-size:17px;font-weight:650;resize:vertical}
.g-qed textarea.g-input:focus,.g-qed .g-choice .g-input:focus{box-shadow:inset 0 0 0 2px #2f62d9;outline:none;background:rgba(47,98,217,0.092)}
.g-tftiles{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.g-tftiles[hidden]{display:none}
.g-tftiles button{display:flex;align-items:center;justify-content:center;gap:10px;min-height:58px;border:0;border-radius:16px;font-size:19px;font-weight:900;color:var(--n-ink,#161514);cursor:pointer;background:rgba(255,253,248,calc(0.47 * var(--wash-k,1)));box-shadow:inset 0 0 0 1.5px rgba(var(--ink-rgb,22,21,20),0.145)}
.g-tftiles button[data-v="True"][aria-checked="true"]{background:#1f8a5a;box-shadow:0 0 0 3px var(--n-shadow,#161514)}
.g-tftiles button[data-v="False"][aria-checked="true"]{background:#d8383b;box-shadow:0 0 0 3px var(--n-shadow,#161514)}
.g-qed .g-choices{margin-top:12px}
.g-ptiles{display:flex;flex-wrap:wrap;gap:8px}
.g-ptiles button{min-width:62px;height:48px;padding:0 16px;border:0;border-radius:14px;font-size:18px;font-weight:900;color:var(--t-must,#8a5a00);cursor:pointer;background:rgba(242,179,29,0.115);box-shadow:inset 0 0 0 1.5px rgba(var(--ink-rgb,22,21,20),0.25);font-variant-numeric:tabular-nums}
.g-ptiles button:hover{background:rgba(242,179,29,0.207)}
.g-ptiles button[aria-checked="true"]{background:#f2b31d;color:#161514;box-shadow:0 0 0 3px var(--n-shadow,#161514)}
.g-mtiles{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.g-mtiles button{display:flex;align-items:center;gap:10px;min-height:56px;padding:0 14px;border:0;border-radius:16px;cursor:pointer;color:var(--n-ink,#161514);font-size:15px;font-weight:800;text-align:left;background:color-mix(in srgb,var(--qc) 14%,var(--n-card,#fbf8f1));box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--qc) 35%,transparent)}
.g-mtiles button .tt-ic{flex:none;color:var(--qc)}
.g-mtiles button[aria-checked="true"]{background:var(--n-card,#fbf8f1);box-shadow:0 0 0 3px var(--n-shadow,#161514)}
.g-mtiles button[aria-checked="true"] .tt-ic{color:var(--n-ink,#161514)}
.g-qed-img{margin-top:12px;padding:14px;border-radius:18px;background:rgba(255,253,248,calc(0.33 * var(--wash-k,1)))}
.g-qed-foot{margin-top:24px;padding-top:18px;border-top:1px solid rgba(var(--ink-rgb,22,21,20),0.12);align-items:center}
.g-qed-save{min-height:52px!important;padding:0 26px!important;border:0!important;font-size:17px!important;font-weight:900!important;background:#2b2a28 !important;color:#fffdf8!important;box-shadow:none}
.g-qed-foot .g-btn[data-a="close"]{min-height:52px;padding:0 22px;font-weight:800}
@media (max-width:760px){.g-qed-qa{grid-template-columns:1fr!important}.g-mtiles{grid-template-columns:1fr 1fr}.g-qtiles{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}}
.g-ptiles button.rand{display:inline-flex;align-items:center;gap:8px;color:var(--n-soft,#2e2a26);background:rgba(107,79,216,0.138);box-shadow:inset 0 0 0 1.5px rgba(var(--ink-rgb,22,21,20),0.35)}
.g-ptiles button.rand:hover{background:rgba(107,79,216,0.23)}
.g-ptiles button.rand[aria-checked="true"]{background:#2b2a28;color:#fffdf8;box-shadow:0 0 0 3px var(--n-shadow,#161514)}

/* v77 · listening instruction (shown, never read aloud) */
.p-listen-note{margin:6px auto 0;max-width:640px;text-align:center;font-size:clamp(18px,2.2vw,26px);font-weight:800;color:var(--n-ink,#161514)}
.lv-q .p-listen-note{color:var(--n-soft,#2e2a26)}
.g-note{margin-bottom:12px}

/* v77 · community game preview */
.g-modal.g-modal-pv .g-modal-box{width:min(860px,100%);padding:0;border:0;border-radius:28px;background:var(--n-raise,#f6f1e7);box-shadow:inset 0 0 0 1px rgba(var(--ink-rgb,22,21,20),0.18);overflow:hidden;display:flex;flex-direction:column;max-height:min(92vh,1000px)}
.g-pv{display:flex;flex-direction:column;min-height:0;flex:1}
.g-pv-body{padding:22px 28px 8px;overflow:auto;min-height:0;flex:1}
.g-pv-hero{position:relative;flex:none;height:220px;display:grid;place-items:center;background:#2b2a28;overflow:hidden}
.g-pv-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.g-pv-hero::after{content:"";position:absolute;inset:0;background:var(--n-card,#fbf8f1)}
.g-pv-title-fallback{position:relative;z-index:1;padding:0 30px;font-size:34px;font-weight:900;letter-spacing:-.02em;text-align:center;color:var(--n-ink,#161514);text-shadow:none}
.g-pv-hero.has-img .g-pv-title-fallback{display:none}
.g-pv-x{position:absolute;z-index:2;top:14px;right:14px;display:grid;place-items:center;width:42px;height:42px;border:0;border-radius:50%;background:var(--n-raise,#f5efe3);color:var(--n-ink,#161514);cursor:pointer;backdrop-filter:blur(6px)}
.g-pv-x:hover{background:var(--n-raise,#f5efe3)}
.g-pv-chips{position:absolute;z-index:2;left:24px;bottom:14px;display:flex;flex-wrap:wrap;gap:8px}
.g-pv-chips span{padding:6px 14px;border-radius:999px;background:var(--n-raise,#f5efe3);backdrop-filter:blur(8px);font-size:13px;font-weight:800;color:var(--n-ink,#161514);box-shadow:inset 0 0 0 1px rgba(var(--ink-rgb,22,21,20),0.295)}
.g-pv-chips span:first-child{background:#2b2a28;color:#fffdf8;box-shadow:none}
.g-pv-body h2{margin:0;font-size:28px;font-weight:900;letter-spacing:-.025em;line-height:1.15;color:var(--n-ink,#161514)}
.g-pv-desc{margin:8px 0 2px;color:var(--n-soft,#2e2a26);font-size:15.5px;line-height:1.5}
.g-pv-desc:empty{display:none}
.g-pv-by{color:var(--g-mute);font-size:13px;font-weight:600}
.g-pv-modes{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:20px 0 6px}
.g-pv-mode{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center;text-align:left;padding:14px 16px;border:0;border-radius:20px;color:#161514;cursor:pointer;background:var(--qa);box-shadow:none;transition:transform .15s,box-shadow .15s}
.g-pv-mode:hover{transform:translateY(-2px);box-shadow:none}
.g-pv-mode i{grid-row:1 / span 2;display:grid;place-items:center;width:46px;height:46px;border-radius:15px;background:var(--n-raise,#f5efe3)}
.g-pv-mode b{font-size:18px;font-weight:900;line-height:1.1}
.g-pv-mode small{font-size:12.5px;font-weight:650;opacity:.9;line-height:1.25}
.g-pv-sec{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:22px 0 10px}
.g-pv-sec>b{font-size:15px;font-weight:850;color:var(--n-ink,#161514)}
.g-pv-sec:not(.g-pv-qhead){display:block}
.g-pv-sec:not(.g-pv-qhead)>b{display:block;margin-bottom:10px}
.g-pv-types{display:flex;flex-wrap:wrap;gap:8px}
.g-pv-type{display:inline-flex;align-items:center;gap:8px;padding:6px 8px 6px 6px;border-radius:12px;background:color-mix(in srgb,var(--qa) 15%,var(--n-card,#fbf8f1));box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--qa) 32%,transparent);font-size:13px;font-weight:800}
.g-pv-type i{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:var(--qa);color:#161514}
.g-pv-type b{min-width:22px;padding:1px 7px;border-radius:999px;background:rgba(255,253,248,calc(0.89 * var(--wash-k,1)));text-align:center;font-size:12px}
.g-pv-qhead .g-switch{justify-self:auto;font-weight:700}
.g-pv-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.g-pv-q{display:grid;grid-template-columns:34px minmax(0,1fr) minmax(0,.62fr);gap:14px;align-items:start;padding:12px 14px;border-radius:16px;background:rgba(255,253,248,calc(0.33 * var(--wash-k,1)));box-shadow:inset 3px 0 0 var(--qa)}
.g-pv-q .n{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:rgba(255,253,248,calc(0.54 * var(--wash-k,1)));font-size:13px;font-weight:850;color:var(--n-soft,#2e2a26)}
.g-pv-q .main{display:grid;gap:5px;min-width:0}
.g-pv-q .tchip{display:inline-flex;align-items:center;gap:6px;justify-self:start;padding:2px 9px 2px 3px;border-radius:999px;background:color-mix(in srgb,var(--qa) 18%,transparent);color:color-mix(in srgb,var(--qa) 80%,#161514);font-size:11.5px;font-weight:850;letter-spacing:.02em}
.g-pv-q .tchip i{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--qa);color:#161514}
.g-pv-q .qt{font-size:15.5px;font-weight:700;line-height:1.4;color:var(--n-ink,#161514);overflow-wrap:anywhere}
.g-pv-q .qt .gap{display:inline-block;width:64px;height:1.05em;margin:0 4px;vertical-align:-3px;border-radius:6px;background:color-mix(in srgb,var(--qa) 35%,transparent);box-shadow:inset 0 -2px 0 var(--qa)}
.g-pv-q .qt .say{display:inline-grid;place-items:center;width:22px;height:22px;margin-right:8px;border-radius:50%;background:var(--qa);color:#161514;vertical-align:-5px}
.g-pv-q .ex{font-size:13px;color:var(--g-mute);font-weight:600;line-height:1.4;overflow-wrap:anywhere}
.g-pv-q .ex:empty{display:none}
.g-pv-q .ans{align-self:center;padding:8px 12px;border-radius:12px;background:rgba(31,138,90,0.115);color:var(--t-green,#1f8a5a);font-size:14px;font-weight:800;line-height:1.35;white-space:pre-line;overflow-wrap:anywhere;transition:filter .2s,opacity .2s}
.g-pv-list.hide-ans .ans{filter:blur(7px);opacity:.55;user-select:none}
.g-pv-foot{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 28px;border-top:1px solid rgba(var(--ink-rgb,22,21,20),0.108);background:var(--n-raise,#f5efe3)}
.g-pv-foot .g-btn{min-height:46px;padding:0 20px;font-weight:850;border:0;background:#2b2a28;color:#fffdf8}
.g-pv-foot span{color:var(--g-mute);font-size:13px;font-weight:700}
.g-pv-foot span b{margin-left:6px;padding:5px 12px;border-radius:10px;background:rgba(255,253,248,calc(0.61 * var(--wash-k,1)));color:var(--n-ink,#161514);font-size:15px;letter-spacing:.12em}
@media (max-width:640px){.g-pv-hero{height:160px}.g-pv-body{padding:18px 16px 6px}.g-pv-foot{padding:12px 16px}.g-pv-q{grid-template-columns:30px minmax(0,1fr)}.g-pv-q .ans{grid-column:2}.g-pv-body h2{font-size:23px}}
@media (max-width:640px){.g-pv-title-fallback{display:none}}
.p-slide .p-mc button.ok{border-color:#1f8a5a;background:var(--n-ink,#161514);color:var(--n-onink,#fffdf8)}
.p-slide .p-mc button.dim{opacity:.38!important;animation:none}
.p-slide-keys{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;margin-top:6px;color:var(--n-mute,#5a534b);font-size:14px;font-weight:600}
.p-slide-keys kbd{display:inline-grid;place-items:center;min-width:26px;height:24px;margin-right:4px;padding:0 6px;border-radius:6px;background:rgba(255,253,248,calc(0.75 * var(--wash-k,1)));box-shadow:inset 0 -2px 0 rgba(var(--ink-rgb,22,21,20),0.25);font:700 13px/1 var(--g-font,Inter,sans-serif);color:var(--n-ink,#161514)}

/* v79 · even spacing in the team area: the same 14px gap above and below every part (stepper, names, methods) */
.p-setup.v2 .p-team-area{display:grid;gap:14px;align-content:start}
.p-setup.v2 .p-team-area>.p-stepper{justify-self:start}
.p-setup.v2 .p-team-area>*{margin-top:0;margin-bottom:0}

/* v79 · question cards: number, question, answer and footer on the same lines in every card */
.g-q{grid-template-rows:auto 1fr auto;gap:10px;padding:14px 16px 10px;text-align:left}
.g-q-num{position:static;justify-self:start;display:inline-grid;place-items:center;min-width:28px;height:24px;padding:0 8px;border-radius:8px;background:rgba(255,253,248,calc(0.54 * var(--wash-k,1)));color:var(--n-soft,#2e2a26);font-size:12px;font-weight:750}
.g-q-text{align-content:start;gap:6px}
.g-q-text img{margin:0}
.g-q-ans{font-size:14px;font-weight:650}
.g-q-foot{margin-top:0;padding-top:8px;border-top:1px solid var(--g-line)}

/* v80 · adults: power-ups as calm line icons on a solid tile */
.p-art.grown{background:var(--n-ink,#161514);box-shadow:inset 0 0 0 1px rgba(var(--ink-rgb,22,21,20),0.195)}
.p-art.grown svg{width:58%;height:58%}
.p-root.adult .p-pbox.is-good .p-pimg.landed .p-art svg,.p-root.adult .p-pbox.is-bad .p-pimg.landed .p-art svg{animation:none}

/* ======================================================================
   FLAT POSTER DESIGN (v81) · games library, editor, board, Live and phone pages.
   Cream base, flat colour blocks, ink outlines, black pills, hard shadows, heavy titles.
   ====================================================================== */
:root{
  --f-bg:#efe9dd;--f-paper:#fbf8f1;--f-paper2:#f5efe3;--f-ink:#161514;--f-soft:#3b3733;--f-mute:#6f685f;--f-line:rgba(22,21,20,.14);--f-line2:rgba(22,21,20,.28);
  --f-verm:#e1502a;--f-must:#f2b31d;--f-red:#d8383b;--f-teal:#1f5d58;--f-blue:#2f62d9;--f-green:#1f8a5a;--f-violet:#6b4fd8;--f-pink:#d43f86;
  --f-hard:4px 4px 0 var(--f-shadow,#161514);--f-hard-lg:7px 7px 0 var(--f-shadow,#161514);
  --g-bg:var(--f-bg);--g-card:var(--f-paper);--g-card2:var(--f-paper2);--g-line:var(--f-line);--g-line2:var(--f-line2);--g-ink:var(--f-ink);--g-soft:var(--f-soft);--g-mute:var(--f-mute);
  --g-blue:var(--f-blue);--g-mint:var(--f-green);--g-amber:var(--f-must);--g-coral:var(--f-red);--g-violet:var(--f-violet);--g-pink:var(--f-pink);
  color-scheme:light;
}
html,body{background:var(--f-bg)!important}
::selection{background:var(--f-must);color:var(--f-onfill,#161514)}
:focus-visible{outline:1.5px solid var(--f-edge,rgba(22,21,20,.16));outline-offset:2px}

/* ---------- library */
.g-top h1{font-size:clamp(30px,4vw,44px);font-weight:880;letter-spacing:-.05em;line-height:1}
.g-top p{color:var(--f-mute);font-size:14.5px}
.g-btn{border:1.5px solid var(--f-edge,rgba(22,21,20,.16));background:var(--f-paper);color:var(--f-ink);font-weight:680}
.g-btn:hover{background:var(--f-must);color:var(--f-onfill,#161514);filter:none}
.g-btn:active{transform:translate(1px,1px)}
.g-btn.primary{background:var(--f-ink);border-color:var(--f-ink);color:var(--f-paper)}
.g-btn.primary:hover{background:var(--f-verm);color:var(--f-onfill,#161514)}
.g-btn.mint{background:var(--f-green);border-color:var(--f-ink);color:#fffdf8}
.g-btn.mint:hover{background:#17744c;color:#fffdf8}
.g-btn.danger{background:var(--f-paper);border-color:var(--f-ink);color:var(--t-red,#b0242a)}
.g-btn.danger:hover{background:var(--f-red);color:#fffdf8}
.g-icon{color:var(--f-soft);border-radius:10px}
.g-icon:hover{background:var(--f-must);color:var(--f-onfill,#161514)}
.g-tabs{gap:8px}
.g-tabs button,.g-sorts button{border:1.5px solid var(--f-edge,rgba(22,21,20,.16));background:var(--f-paper);color:var(--f-ink);font-weight:680}
.g-tabs button:hover,.g-sorts button:hover{background:var(--f-must)}
.g-tabs button[aria-selected="true"],.g-sorts button[aria-pressed="true"],.g-sorts button[aria-selected="true"],.g-sorts button.on{background:var(--f-ink);border-color:var(--f-ink);color:var(--f-paper)}
.g-tabs button[aria-selected="true"]{transform:rotate(-2deg)}
.g-search,.g-input,.g-field input,.g-field select,.g-field textarea{border:2px solid rgba(var(--ink-rgb,22,21,20),0.22);background:var(--f-paper);color:var(--f-ink)}
.g-search:focus,.g-input:focus,.g-field input:focus,.g-field select:focus,.g-field textarea:focus{border-color:var(--f-ink);box-shadow:0 0 0 3px var(--f-must)}
.g-empty{border:2px dashed rgba(var(--ink-rgb,22,21,20),0.3);background:var(--f-paper2)}
.g-card{border:1.5px solid var(--f-edge,rgba(22,21,20,.16));border-radius:20px;background:var(--f-paper)}
.g-card:hover{transform:translate(-2px,-2px);border-color:var(--f-ink);box-shadow:var(--f-hard)}
.g-cover{background:var(--f-blue);color:#fffdf8;font-weight:850;letter-spacing:-.03em;border-bottom:1.5px solid var(--f-edge,rgba(22,21,20,.16))}
.g-cover-badge{background:var(--f-ink);color:var(--f-paper);font-weight:700;transform:rotate(-2deg)}
.g-card-body h3{font-weight:780;letter-spacing:-.02em;font-size:16.5px}
.g-meta{color:var(--f-mute)}
.g-like{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;background:var(--f-paper)!important;color:var(--f-ink)!important}
.g-like[aria-pressed="true"],.g-like.on{background:var(--f-pink)!important;color:#fffdf8!important}

/* ---------- game page side panel + question cards */
.g-side,.g-panel{border:1.5px solid var(--f-edge,rgba(22,21,20,.16));background:var(--f-paper);border-radius:22px}
.g-share-code{background:var(--f-must)!important;color:var(--f-onfill,#161514)!important;border-bottom:1.5px solid var(--f-edge,rgba(22,21,20,.16));font-weight:850!important;letter-spacing:-.02em}
.g-side h2,.g-side-body h2{font-weight:850;letter-spacing:-.04em}
.g-q{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;background:var(--f-paper)!important;border-radius:18px!important}
.g-q:hover{box-shadow:var(--f-hard)}
.g-q-num{background:var(--f-ink)!important;color:var(--f-paper)!important;font-weight:800!important}
.g-q-text{color:var(--f-ink);font-weight:650}
.g-q-ans{color:var(--t-green,#146e46)!important;font-weight:700}
.g-q-foot{border-top:1.5px dashed rgba(var(--ink-rgb,22,21,20),0.2)!important}
.g-modal{background:rgba(22,21,20,.45)!important}
.g-modal-box{background:var(--f-paper)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:var(--f-hard-lg)!important;color:var(--f-ink)}
.g-mode,.g-pv-mode{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;color:#fffdf8!important;box-shadow:none}
.g-mode:hover,.g-pv-mode:hover{transform:translate(-2px,-2px)!important;box-shadow:var(--f-hard)!important;filter:none!important}
.g-pv-hero{border-bottom:1.5px solid var(--f-edge,rgba(22,21,20,.16))}
.g-pv-chips span,.g-pv-type{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;background:var(--f-paper)!important;color:var(--f-ink)!important;font-weight:650}
.g-pv-q{border:1.5px solid rgba(var(--ink-rgb,22,21,20),0.22)!important;background:var(--f-paper)!important}
.g-switch{accent-color:var(--f-ink)}

/* ---------- player shell */
.p-root{background:var(--f-bg);color:var(--f-ink)}
.p-root.p-dark{color:var(--n-card,#fbf8f1)}
.p-bar{border-bottom:1.5px solid var(--f-edge,rgba(22,21,20,.16));background:var(--f-bg)}
.p-root.p-dark .p-bar{background:var(--n-ink,#161514);border-color:#3a3632}
.p-bar .g-icon{color:var(--f-ink)}
.p-root.p-dark .p-bar .g-icon,.p-root.p-dark .p-bar *{color:var(--n-card,#fbf8f1)}

/* setup: a paper sheet with flat colour tiles */
.p-setup,.p-setup.v2{background:var(--f-paper)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:var(--f-hard-lg);color:var(--f-ink)}
.p-setup.v2 .p-sec>h2,.p-setup h3{justify-self:start;display:inline-block;padding:5px 12px 4px;border-radius:999px;background:var(--f-ink);color:var(--f-paper)!important;font-size:11.5px!important;font-weight:780!important;letter-spacing:.14em;transform:rotate(-2deg)}
.p-opt{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;background:var(--c1)!important;color:#fffdf8!important;box-shadow:none!important;filter:none!important}
.p-opt[style*="#f2b31d"],.p-opt[style*="#e1502a;"]{color:var(--f-onfill,#161514)!important}
.p-opt::before{background:rgba(var(--ink-rgb,22,21,20),0.14)!important;right:-34px!important;bottom:-46px!important}
.p-opt::after{background:transparent!important;border:2px solid rgba(255,253,248,.55);border-radius:50%}
.p-opt .ico{background:var(--f-onfill,#161514)!important;color:var(--c1)!important;border-radius:12px!important}
.p-opt small{opacity:.92}
.p-opt:hover{transform:translate(-2px,-2px)!important;box-shadow:var(--f-hard)!important}
.p-opts.choice .p-opt[aria-pressed="false"]{background:var(--f-paper)!important;color:var(--f-ink)!important;filter:none!important;border-color:rgba(var(--ink-rgb,22,21,20),0.35)!important}
.p-opts.choice .p-opt[aria-pressed="false"]::before{background:color-mix(in srgb,var(--c1) 16%,transparent)!important}
.p-opts.choice .p-opt[aria-pressed="false"]::after{border-color:color-mix(in srgb,var(--c1) 40%,transparent)}
.p-opts.choice .p-opt[aria-pressed="false"]:hover{filter:none!important;border-color:var(--f-ink)!important}
.p-opts.choice .p-opt[aria-pressed="true"]{box-shadow:var(--f-hard)!important;transform:translate(-2px,-2px)}
.p-opts.choice .p-opt[aria-pressed="true"] .ico{background:var(--f-onfill,#161514)!important;color:var(--c1)!important}
.p-opts.toggles .p-opt[aria-pressed="false"]{background:var(--f-paper)!important;color:var(--f-ink)!important;box-shadow:none!important;border-color:rgba(var(--ink-rgb,22,21,20),0.35)!important}
.p-opts.toggles .p-opt[aria-pressed="false"] .ico{background:var(--c1)!important;color:#fffdf8!important}
.p-opt .sw{background:rgba(var(--ink-rgb,22,21,20),0.2)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))}
.p-opt .sw i{background:var(--f-paper)!important;top:1px!important;left:1px!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))}
.p-opt[aria-pressed="true"] .sw{background:var(--f-ink)!important}
.p-stepper{background:var(--f-paper2)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))}
.p-stepper button{background:var(--f-ink)!important;color:var(--f-paper)!important}
.p-stepper button:hover{background:var(--f-verm)!important;color:var(--f-onfill,#161514)!important}
.p-stepper small{color:var(--f-mute)!important}
.p-teams input,.p-team-area input{background:var(--f-paper)!important;border:2px solid var(--tc,var(--f-ink))!important;box-shadow:inset 6px 0 0 var(--tc,var(--f-ink));color:var(--f-ink)!important;font-weight:700}
.p-howto{background:var(--f-paper2)!important;border:2px dashed rgba(var(--ink-rgb,22,21,20),0.3)}
.p-howto summary{color:var(--f-ink)!important}
.p-start{background:var(--f-verm)!important;color:var(--f-onfill,#161514)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;border-radius:999px!important;box-shadow:var(--f-hard)!important;font-weight:820!important;filter:none!important}
.p-start:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--f-shadow,#161514)!important}
.p-start:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--f-shadow,#161514)!important}
.p-row{background:var(--f-paper)!important;border:1.5px solid rgba(var(--ink-rgb,22,21,20),0.22)!important}
.p-row:hover{border-color:var(--f-ink)!important}
.p-row .ic{background:var(--f-paper2)!important}
.p-row-all{border-color:var(--f-ink)!important;background:#fbefcf!important}
.p-theme{background:var(--f-paper)!important;border:2px solid rgba(var(--ink-rgb,22,21,20),0.22)!important;color:var(--f-ink)!important}
.p-theme[aria-pressed="true"]{border-color:var(--f-ink)!important;background:#fbefcf!important;box-shadow:var(--f-hard)}
.p-theme .sw i{border:1.5px solid var(--f-edge,rgba(22,21,20,.16));border-radius:5px}
.p-count button{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;background:var(--f-paper)!important}
.p-count button[aria-pressed="true"]{background:var(--f-ink)!important;color:var(--f-paper)!important}
.p-tabs button{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:none!important;color:#fffdf8!important}
.p-tabs button[aria-pressed="true"]{outline:0!important;box-shadow:var(--f-hard)!important}
.p-gbtn{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;background:var(--f-ink)!important;color:var(--f-paper)!important}
.p-gbtn:hover{background:var(--f-verm)!important;color:var(--f-onfill,#161514)!important}
.p-gbtn.alt{background:var(--f-green)!important;color:#fffdf8!important}

/* board */
.p-tile{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;color:var(--fg,#fffdf8)!important;box-shadow:0 6px 0 var(--f-shadow,#161514)!important;letter-spacing:-.04em;font-weight:880!important}
.p-tile:not(.done):hover{filter:none!important;box-shadow:0 9px 0 var(--f-shadow,#161514)!important}
.p-tile:not(.done):active,.p-tile.pressed{box-shadow:0 1px 0 var(--f-shadow,#161514)!important}
.p-tile.done{background:transparent!important;border:2.5px dashed rgba(var(--ink-rgb,22,21,20),0.28)!important;color:rgba(var(--ink-rgb,22,21,20),0.32)!important;box-shadow:none!important}
.p-root.p-dark .p-tile{border-color:#0b0a09!important;box-shadow:0 6px 0 #0b0a09!important;color:var(--n-card,#fbf8f1)!important}
.p-root.p-dark .p-tile.done{border-color:rgba(251,248,241,.2)!important;color:rgba(251,248,241,.3)!important;box-shadow:none!important}
.p-team{background:var(--f-paper)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;color:var(--f-ink)}
.p-team.turn{background:var(--tc)!important;color:var(--tfg,#fffdf8)!important;border-color:var(--f-ink)!important;box-shadow:var(--f-hard)!important;animation:none!important;transform:translate(-2px,-2px)}
.p-team.turn b,.p-team.turn .rank{color:var(--tfg,#fffdf8)!important}
.p-team strong{background:var(--tc)!important;color:var(--tfg,#fffdf8)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16));font-weight:880!important}
.p-team.turn strong{background:var(--f-paper)!important;color:var(--f-ink)!important}
.p-team .adj button{background:var(--f-paper2)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;color:var(--f-ink)!important}
.p-team.lead{box-shadow:var(--f-hard)!important}
.p-team.lead .rank::after{content:"";display:inline-block;width:8px;height:8px;margin-left:4px;border-radius:2px;background:var(--f-must);border:1.5px solid var(--f-edge,rgba(22,21,20,.16));transform:rotate(45deg) translateY(-2px)}
.p-root.p-dark .p-team{background:#24211e!important;border-color:#0b0a09!important;color:var(--n-card,#fbf8f1)}
.p-pill,.p-pbtns button,.p-classbar button{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;background:var(--f-paper)!important;color:var(--f-ink)!important;font-weight:650}
.p-turn{color:var(--f-ink)!important;font-weight:750}
.p-turn b{background:var(--tc)!important;color:var(--tfg,#fffdf8)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16));box-shadow:var(--f-hard)!important;transform:rotate(-2deg);font-weight:880!important;letter-spacing:-.03em}

/* question card: paper sheet, ink outline, hard shadow */
.p-q{background:rgba(22,21,20,.38)!important;backdrop-filter:none!important}
.p-q-box{background:var(--f-paper)!important;color:var(--f-ink)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:10px 10px 0 var(--f-shadow,#161514)!important}
.p-q-box.golden{background:#fff6dc!important;box-shadow:10px 10px 0 var(--f-must),0 0 0 4px var(--f-must)!important}
.p-q-top{color:var(--f-ink)!important}
.p-q-top .g-icon{color:var(--f-ink)!important}
.p-q-top .p-pts{background:var(--f-must)!important;color:var(--f-onfill,#161514)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16));border-radius:999px;transform:rotate(3deg)}
.p-pteam{background:var(--tc)!important;color:var(--tfg,#fffdf8)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;transform:rotate(-2deg)}
.p-q-text{color:var(--f-ink)!important;font-weight:820!important;letter-spacing:-.03em}
.p-mc button{background:var(--f-paper)!important;color:var(--f-ink)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important}
.p-mc button i{border:1.5px solid var(--f-edge,rgba(22,21,20,.16));color:var(--f-ink)!important}
.p-mc button:nth-child(1) i{background:var(--f-red)!important;color:#fffdf8!important}
.p-mc button:nth-child(2) i{background:var(--f-blue)!important;color:#fffdf8!important}
.p-mc button:nth-child(3) i{background:var(--f-must)!important}
.p-mc button:nth-child(4) i{background:var(--f-green)!important;color:#fffdf8!important}
.p-mc button:not([disabled]):hover{border-color:var(--f-ink)!important;box-shadow:var(--f-hard);transform:translate(-2px,-2px)}
.p-mc button.ok{background:var(--f-green)!important;color:#fffdf8!important}
.p-mc button.bad{background:var(--f-red)!important;color:#fffdf8!important}
.p-ans{background:var(--f-green)!important;color:#fffdf8!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16));box-shadow:var(--f-hard)}
.p-q-actions button{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:var(--f-hard)}
.p-q-actions button:hover{transform:translate(-1px,-1px)}
.p-listen-note{color:var(--f-soft)!important}
.p-power-card{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:var(--f-hard-lg)!important}
.p-power-pick button{background:var(--f-paper)!important;color:var(--f-ink)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:inset 6px 0 0 var(--tc)}
.p-power-pick button:hover{background:var(--tc)!important;color:var(--tfg,#fffdf8)!important}
.p-art{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))}
.p-banner{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:var(--f-hard)!important}

/* study + slideshow */
.p-card{background:var(--f-paper)!important;color:var(--f-ink)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:10px 10px 0 var(--f-shadow,#161514)!important}
.p-card.flip{background:var(--f-must)!important;color:var(--f-onfill,#161514)!important}
.p-card .p-q-text{color:var(--f-ink)!important}
.p-card small{color:var(--f-mute)!important}
.p-study-bar button{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;background:var(--f-paper)!important;color:var(--f-ink)!important;box-shadow:var(--f-hard)}
.p-study-bar .again{background:var(--f-red)!important;color:#fffdf8!important}
.p-study-bar .got,.p-study-bar button:nth-of-type(2){background:var(--f-green)!important;color:#fffdf8!important}
.p-progress{background:rgba(var(--ink-rgb,22,21,20),0.12)!important;border-radius:99px}
.p-progress i,.p-progress span{background:var(--f-ink)!important}
.p-slide .p-q-text{color:var(--f-ink)!important;font-weight:880!important;letter-spacing:-.045em}
.p-slide .p-mc button:not(.ok):not(.bad){background:var(--f-paper)!important;opacity:1}
.p-slide .p-mc button.dim{opacity:.38!important}
.p-slide-num{display:inline-block;padding:4px 12px;border-radius:999px;background:var(--f-ink);color:var(--f-paper)!important;font-size:12px;letter-spacing:.08em;transform:rotate(-2deg)}
.p-slide-keys kbd,.p-slide-keys b,.p-slide-keys i{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;background:var(--f-paper)!important;color:var(--f-ink)!important}

/* end screen */
.p-podium div{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;border-bottom:0!important;color:var(--tfg,#fffdf8)!important}
.p-win-ribbon{background:var(--f-ink)!important;color:var(--f-paper)!important;box-shadow:var(--f-hard)!important}
.p-win-ribbon b{color:var(--f-must)!important;filter:none!important}
.p-win-gif{background:var(--f-paper)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16));box-shadow:var(--f-hard-lg)!important}

/* ---------- Live host + phone join */
.lv-root,.jn-app{background:var(--f-bg)!important;color:var(--f-ink)}
.lv-join{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:var(--f-hard-lg)!important;color:#fffdf8}
.lv-pinwrap{padding:10px 26px 14px;border-radius:22px;background:var(--f-must)!important;color:var(--f-onfill,#161514)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:var(--f-hard)!important;transform:rotate(-1.5deg)}
.lv-pin{white-space:nowrap;color:var(--f-ink)!important;letter-spacing:.02em!important}
.lv-qr{background:#fff!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important}
.lv-chip,.lv-pl,.jn-chip{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;background:var(--f-paper)!important;color:var(--f-ink)!important}
.lv-opt,.jn-opts button{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:var(--f-hard)}
.lv-start{background:var(--f-verm)!important;color:var(--f-onfill,#161514)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:var(--f-hard)!important}
.lv-toast,.jn-toast{background:var(--f-ink)!important;color:var(--f-paper)!important;border:0!important}
.jn-form input{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;background:var(--f-paper)!important;color:var(--f-ink)!important}
.jn-rteam{border:2px solid var(--tc,var(--f-ink))!important;background:var(--f-paper)!important;color:var(--f-ink)!important}
.jn-rteam.turn{background:var(--tc)!important;color:#fffdf8!important;border-color:var(--f-ink)!important}

body.jn{background:var(--f-bg)!important;color:var(--f-ink)!important}
.jn-start h1{font-size:40px;font-weight:880;letter-spacing:-.05em}
.jn-start p{color:var(--f-mute)!important}
.jn-form input{height:66px;border-radius:18px;box-shadow:var(--f-hard)}
.jn-form input:focus{box-shadow:0 0 0 4px var(--f-must),var(--f-hard)}
.jn-form button{background:var(--f-ink)!important;color:var(--f-paper)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;border-radius:999px!important}
.jn-form button:active{background:var(--f-verm)!important;color:var(--f-onfill,#161514)!important}
.jn-head{background:var(--f-paper)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))}
.jn-net{background:var(--f-red)!important;color:#fffdf8!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))}
.p-root.p-dark .p-team .rank{color:rgba(251,248,241,.7)!important}
.lv-step{background:var(--f-paper)!important;color:var(--f-ink)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important}
.lv-stage{background:var(--f-paper)!important;color:var(--f-ink)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:10px 10px 0 var(--f-shadow,#161514)!important}
.lv-text{font-weight:850!important;letter-spacing:-.03em;color:var(--f-ink)!important}
.lv-opt,.jn-opts button{color:#fffdf8!important}
.lv-opt[style*="#f2b31d"],.jn-opts button[style*="#f2b31d"]{color:var(--f-onfill,#161514)!important}
.jn-opts button.picked{box-shadow:0 0 0 4px var(--f-must),var(--f-hard)!important}
.pl-hero h1{font-size:clamp(34px,6vw,56px)!important;font-weight:880!important;letter-spacing:-.05em!important}
.pl-form input{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;background:var(--f-paper)!important;box-shadow:var(--f-hard)}
.pl-form input:focus{border-color:var(--f-ink)!important;box-shadow:0 0 0 4px var(--f-must),var(--f-hard)}
.pl-form button{background:var(--f-ink)!important;color:var(--f-paper)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;border-radius:999px!important;box-shadow:var(--f-hard)}
.pl-form button:hover{background:var(--f-verm)!important;color:var(--f-onfill,#161514)!important}
a{color:inherit}

/* ===== v82 fixes: readable names, coloured team cards, order slots, preview cover ===== */
.g-pv-hero::after{display:none!important}
.g-pv-hero{background:var(--f-paper2)!important}
/* paused game: team names in their colour on paper pills */
.p-resume{background:var(--f-blue)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;color:#fffdf8!important}
.p-resume .ico{background:var(--f-ink)!important;color:var(--n-onink,#fffdf8)!important}
.p-resume .teams span{background:var(--f-paper)!important;color:var(--f-ink)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16));padding:3px 12px 3px 4px!important}
.p-resume .p-start{background:var(--f-ink)!important;color:var(--n-onink,#fffdf8)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important}
.p-resume .p-skip{background:var(--f-paper)!important;color:var(--f-ink)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important}
/* class teams: each team in its own colour */
.p-class-teams.v2 .p-cteam{background:var(--tc)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:var(--f-hard)!important}
.p-class-teams.v2 .p-cteam::after{background:rgba(255,253,248,calc(0.16 * var(--wash-k,1)))!important}
.p-class-teams.v2 .h b{color:var(--tfg,#fffdf8)!important}
.p-class-teams.v2 .h i{background:var(--f-ink)!important;color:var(--n-onink,#fffdf8)!important}
.p-class-teams.v2 li{background:var(--f-paper)!important;color:var(--f-ink)!important;border:1.5px solid rgba(var(--ink-rgb,22,21,20),0.25);font-weight:700!important}
.p-class-teams.v2 li.f{color:var(--t-pink,#b0286c)!important}
.p-cteam{border-color:var(--f-ink)!important}
/* put in order: paper slot line, coloured word chips */
.p-order .line{background:var(--f-paper2)!important;border:2.5px dashed rgba(var(--ink-rgb,22,21,20),0.4)!important}
.p-order.good .line{border:2.5px solid var(--f-green)!important;background:#e3f1e9!important}
.p-order.bad .line{border:2.5px solid var(--f-red)!important;background:#f8e1dd!important}
.p-order .chip,.p-match .mi{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:0 4px 0 var(--f-shadow,#161514)!important;color:#fffdf8!important}
.p-order .chip.in{background:var(--f-paper)!important;color:var(--f-ink)!important}
.p-order .chip.in i{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))}
.p-match .mi.on,.p-match .mi.sel{outline:3px solid var(--f-must);outline-offset:2px}
/* buttons inside the question card */
.p-q-box .p-gbtn,.p-q-box button.next,.p-q-box .p-next{background:var(--f-ink)!important;color:var(--n-onink,#fffdf8)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important}
.p-q-box .p-gbtn:hover{background:var(--f-verm)!important;color:var(--f-onfill,#161514)!important}
.p-who-btn{background:var(--f-ink)!important;color:var(--n-onink,#fffdf8)!important;border:0!important}
/* setup tiles: decorations quieter, icon chips solid */
.p-opt::after{border-color:rgba(255,253,248,.45)!important}
.p-opts.choice .p-opt[aria-pressed="false"] .ico,.p-opts.toggles .p-opt[aria-pressed="false"] .ico{background:var(--c1)!important;color:#fffdf8!important}
.p-reshuffle,.p-team-area .g-btn{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;background:var(--f-paper)!important;color:var(--f-ink)!important}
.p-classbar{background:var(--f-paper)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;border-radius:18px!important}
.p-classbar small,.p-classbar .lbl{color:var(--f-mute)!important}
/* leaderboard */
.p-lb .av{border:1.5px solid var(--f-edge,rgba(22,21,20,.16));box-shadow:none!important}
.p-lb .sc{background:var(--f-paper)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))}
.p-lb.crowns .block{border:1.5px solid var(--f-edge,rgba(22,21,20,.16));border-bottom:0;background:var(--f-paper2)!important;box-shadow:none!important}
.p-lb.crowns .pod.p1 .block{background:var(--f-must)!important}
.p-lb.crowns .pod.p2 .block{background:#d9e1f5!important}
.p-lb.crowns .pod.p3 .block{background:#f3d9cf!important}
.p-lb.crowns .block em{color:var(--f-ink)!important}
.p-lb.crowns::before{opacity:.5}
.p-end-row .g-btn,.p-end button{border:1.5px solid var(--f-edge,rgba(22,21,20,.16))}
.p-show{background:var(--f-ink)!important;color:var(--n-onink,#fffdf8)!important;border:1.5px solid var(--f-edge,rgba(22,21,20,.16))!important;box-shadow:var(--f-hard)!important}
.p-show:hover{background:var(--f-verm)!important;color:var(--f-onfill,#161514)!important}

/* ======================================================================
   DARK THEME (v82) · the same flat poster design on warm near-black.
   Surfaces lift with lightness, outlines turn cream, colour fills stay the same,
   coloured text and icons get lighter tones so they read on dark.
   ====================================================================== */
html[data-tgh-theme="dark"]{
  color-scheme:dark;
  --n-page:#141311;--n-card:#1e1c19;--n-raise:#282521;--n-zebra:#221f1c;--n-white:#2a2723;
  --n-ink:#efe9dd;--n-edge:#cfc7b9;--n-shadow:#000;--n-soft:#d6cfc3;--n-mute:#aca497;--n-mute2:#8f877c;--n-mid:#3d3934;--n-onink:#141311;
  --ink-rgb:239,233,221;--wash-k:.12;
  --t-red:#ff8a85;--t-verm:#ff9a74;--t-must:#f6c64f;--t-green:#6fd3a0;--t-teal:#6cc9bd;--t-blue:#93b2ff;--t-violet:#b9a6ff;--t-pink:#ff8fc6;
  --f-bg:#141311;--f-paper:#1e1c19;--f-paper2:#282521;--f-ink:#efe9dd;--f-soft:#d6cfc3;--f-mute:#aca497;--f-line:rgba(239,233,221,.14);--f-line2:rgba(239,233,221,.3);
  --f-onfill:#161514;--f-shadow:#000;--f-hard:4px 4px 0 #000;--f-hard-lg:7px 7px 0 #000;
  --tgh-bg:#141311!important;--tgh-card:#1e1c19!important;--tgh-card2:#282521!important;--tgh-row:#24211d!important;--tgh-row2:#1e1c19!important;--tgh-pop:#1e1c19!important;--tgh-logo:#1e1c19!important;
  --tgh-line:rgba(239,233,221,.14)!important;--tgh-line2:rgba(239,233,221,.26)!important;--tgh-ink:#efe9dd!important;--tgh-soft:#d6cfc3!important;--tgh-mute:#aca497!important;
  --tgh-acc:#ff9a74!important;--tgh-acc-soft:rgba(242,179,29,.22)!important;--tgh-acc-line:#cfc7b9!important;--tgh-red:#ff8a85!important;
  --tgh-girl:255,143,198!important;--tgh-boy:147,178,255!important;
  --g-bg:#141311;--g-card:#1e1c19;--g-card2:#282521;--g-line:rgba(239,233,221,.14);--g-line2:rgba(239,233,221,.3);--g-ink:#efe9dd;--g-soft:#d6cfc3;--g-mute:#aca497;
  --ink:#efe9dd!important;--muted:#aca497!important;--paper:#1e1c19!important;--canvas:#141311!important;--line:rgba(239,233,221,.14)!important;
  --navy:#282521!important;--navy-2:#282521!important;--glass:#1e1c19!important;--glass-strong:#282521!important;--dark-ink:#efe9dd!important;
  --rank-star:#efe9dd;--rank-shell:#aca497;--rank-ribbon:#8f877c;--rank-inner:#d6cfc3;
}
html[data-tgh-theme="dark"],html[data-tgh-theme="dark"] body,html[data-tgh-theme="dark"] body[data-page],html[data-tgh-theme="dark"] body.jn{background:#141311!important;color:#efe9dd!important}
html[data-tgh-theme="dark"] ::selection{background:#f2b31d;color:#161514}
html[data-tgh-theme="dark"] input::placeholder,html[data-tgh-theme="dark"] textarea::placeholder{color:#8f877c!important}
html[data-tgh-theme="dark"] select option{background:#1e1c19;color:#efe9dd}
html[data-tgh-theme="dark"] input[type=checkbox],html[data-tgh-theme="dark"] input[type=radio]{accent-color:#f2b31d}
/* hard shadows: black blocks read as depth on the dark page */
html[data-tgh-theme="dark"] .p-tile{box-shadow:0 6px 0 #000!important}
html[data-tgh-theme="dark"] .p-tile:not(.done):hover{box-shadow:0 9px 0 #000!important}
html[data-tgh-theme="dark"] .p-tile{border-color:#000!important}
html[data-tgh-theme="dark"] .p-tile.done{border-color:rgba(239,233,221,.18)!important;color:rgba(239,233,221,.3)!important}
/* logos */
html[data-tgh-theme="dark"] .tgh-side-word,html[data-tgh-theme="dark"] .jn-logo,html[data-tgh-theme="dark"] .pl-logo,
html[data-tgh-theme="dark"] .demo-bar .brand::before,html[data-tgh-theme="dark"] body[data-page="panel"] .gate .card::before,html[data-tgh-theme="dark"] body[data-page="schedule"] .gate .card::before{background-image:url("/theme/teachtally-logo-dark-v2.svg")!important}
/* the class chart canvas draws dark labels: flip it, colours keep their hue */
html[data-tgh-theme="dark"] #performanceChart{filter:invert(1) hue-rotate(180deg)}
/* white surfaces that must stay white: QR codes, paper previews */
html[data-tgh-theme="dark"] .lv-qr,html[data-tgh-theme="dark"] .g-qr,html[data-tgh-theme="dark"] .tgh-rb-pagewrap,html[data-tgh-theme="dark"] .tgh-rub-prev canvas{background:#fff!important}
/* tinted states that were light on cream */
html[data-tgh-theme="dark"] tbody tr:hover td,html[data-tgh-theme="dark"] tbody tr:hover .name-cell,html[data-tgh-theme="dark"] tbody tr:hover .total-cell,html[data-tgh-theme="dark"] tbody tr:hover .absence-cell{background:#2f2a1d!important}
html[data-tgh-theme="dark"] .seat.absent{background:#3a1f1c!important}
html[data-tgh-theme="dark"] .p-theme[aria-pressed="true"],html[data-tgh-theme="dark"] .p-row-all,html[data-tgh-theme="dark"] .sex-student-option:has(input:checked),html[data-tgh-theme="dark"] .add-lesson:hover{background:#3a3020!important}
html[data-tgh-theme="dark"] .p-q-box.golden{background:#2c2618!important}
html[data-tgh-theme="dark"] .p-order.good .line{background:#17291f!important}
html[data-tgh-theme="dark"] .p-order.bad .line{background:#301b19!important}
html[data-tgh-theme="dark"] .podium-person.rank-2{background:#232a3d!important}
html[data-tgh-theme="dark"] .podium-person.rank-3{background:#3a2621!important}
html[data-tgh-theme="dark"] .p-lb.crowns .pod.p2 .block{background:#232a3d!important}
html[data-tgh-theme="dark"] .p-lb.crowns .pod.p3 .block{background:#3a2621!important}
html[data-tgh-theme="dark"] .p-cteam li.f,html[data-tgh-theme="dark"] .p-class-teams.v2 li.f{color:#ff8fc6!important}
html[data-tgh-theme="dark"] tbody td.today,html[data-tgh-theme="dark"] td.today,html[data-tgh-theme="dark"] .today-col{background:#2f2a1d!important}
/* questions and answers on colour fills keep dark ink text */
html[data-tgh-theme="dark"] .p-opt[style*="#f2b31d"],html[data-tgh-theme="dark"] .lv-opt[style*="#f2b31d"],html[data-tgh-theme="dark"] .jn-opts button[style*="#f2b31d"]{color:#161514!important}
html[data-tgh-theme="dark"] .tgh-side-mark,html[data-tgh-theme="dark"] body[data-page="portal"] .mark::after{background-image:url("/theme/logo-mark-on-dark.svg")!important}

/* v82: text on colour tiles follows the tile colour (dark ink on mustard, cream on the rest) */
.p-opt{color:var(--fg,#fffdf8)!important}
.p-opts.choice .p-opt[aria-pressed="false"],.p-opts.toggles .p-opt[aria-pressed="false"]{color:var(--f-ink)!important}
.p-opt[style*="#f2b31d"] .ico,.p-opt .ico{color:var(--c1)!important}
.lv-pin,.lv-pinwrap,.lv-pinwrap small{color:var(--f-onfill,#161514)!important}
.p-q-top .p-pts,.p-banner.gold,.p-tile[style*="#f2b31d"]{color:var(--f-onfill,#161514)!important}
/* dark: text that sits on mustard / light fills stays ink */
html[data-tgh-theme="dark"] body[data-page="panel"] .card p.early-access,html[data-tgh-theme="dark"] .podium-person.rank-1,html[data-tgh-theme="dark"] .podium-person.rank-1 *,
html[data-tgh-theme="dark"] .timer-card.complete .timer-display,html[data-tgh-theme="dark"] .p-lb.crowns .pod.p1 .block em{color:#161514!important}
.g-pv-mode i{background:var(--f-onfill,#161514)!important;color:#fffdf8!important;border:0!important}

/* ===== v83: blue identity ===== */
:root{--b:#161514;--b-deep:#2e2a26;--b-tint:#ebe4d6;--b-on:#fbf8f1}
html[data-tgh-theme="dark"]{--b:#efe9dd;--b-deep:#ffffff;--b-tint:#2c2925;--b-on:#141311}
::selection{background:var(--b);color:var(--b-on,#fbf8f1)}
.g-btn.primary,.p-gbtn,.p-show,.p-q-box .p-gbtn,.jn-form button,.pl-form button,.p-resume .p-start,.p-stepper button{background:var(--b)!important;border-color:var(--n-edge,#161514)!important;color:var(--b-on,#fbf8f1)!important}
.g-btn.primary:hover,.p-gbtn:hover,.p-show:hover,.p-q-box .p-gbtn:hover,.pl-form button:hover,.p-stepper button:hover{background:var(--b-deep)!important;color:var(--b-on,#fbf8f1)!important}
.g-tabs button[aria-selected="true"],.g-sorts button[aria-pressed="true"],.g-sorts button[aria-selected="true"],.g-sorts button.on,.p-count button[aria-pressed="true"]{background:var(--b)!important;border-color:var(--b)!important;color:var(--b-on,#fbf8f1)!important}
.p-start,.lv-start{background:var(--b)!important;color:var(--b-on,#fbf8f1)!important}
.p-start:hover{background:var(--b-deep)!important}
.g-btn:not(.primary):not(.mint):not(.danger):hover,.g-tabs button:not([aria-selected="true"]):hover,.g-sorts button:hover,.g-icon:hover,.p-row:hover,.p-reshuffle:hover{background:var(--b-tint)!important;color:var(--n-ink,#161514)!important}
.g-share-code{background:var(--b)!important;color:var(--b-on,#fbf8f1)!important}
.pl-form input:focus,.jn-form input:focus,.g-search:focus,.g-input:focus,.g-field input:focus,.g-field select:focus,.g-field textarea:focus{box-shadow:0 0 0 3px var(--b)!important}
/* team names can be edited on the board */
.p-team b[contenteditable]{cursor:text;border-radius:6px;outline:0;padding:0 3px;margin:0 -3px}
.p-team b[contenteditable]:hover{background:rgba(var(--ink-rgb,22,21,20),.08)}
.p-team b[contenteditable]:focus{background:var(--n-card,#fff);color:var(--n-ink,#161514)!important;box-shadow:0 0 0 2px var(--b)}

/* ===== v84: calm palette for Games. Ink + paper for the interface; colour only on the board,
   the covers and on right/wrong feedback. ===== */
/* setup: neutral tiles, ink when chosen */
.p-opt,.p-opts.choice .p-opt[aria-pressed="false"],.p-opts.toggles .p-opt[aria-pressed="false"]{background:var(--n-card,#fbf8f1)!important;color:var(--n-ink,#161514)!important;border:2px solid rgba(var(--ink-rgb,22,21,20),.28)!important;box-shadow:none!important}
.p-opt::before,.p-opt::after{display:none!important}
.p-opt .ico,.p-opts.choice .p-opt[aria-pressed="false"] .ico,.p-opts.toggles .p-opt[aria-pressed="false"] .ico{background:var(--n-raise,#f5efe3)!important;color:var(--n-ink,#161514)!important;border:1.5px solid rgba(var(--ink-rgb,22,21,20),.2)}
.p-opt:hover{border-color:var(--n-edge,#161514)!important;transform:none!important;box-shadow:none!important}
.p-opts.choice .p-opt[aria-pressed="true"],.p-opts.toggles .p-opt[aria-pressed="true"],.p-opt[aria-pressed="true"]{background:var(--b)!important;color:var(--b-on,#fbf8f1)!important;border-color:var(--b)!important;box-shadow:none!important;transform:none!important}
.p-opts.choice .p-opt[aria-pressed="true"] .ico,.p-opt[aria-pressed="true"] .ico{background:var(--b-on,#fbf8f1)!important;color:var(--b)!important;border:0}
.p-opt[aria-pressed="true"] small{opacity:.8}
.p-opt[aria-pressed="true"] .sw{background:var(--b-on,#fbf8f1)!important;border-color:var(--b-on,#fbf8f1)!important}
.p-opt[aria-pressed="true"] .sw i{background:var(--b)!important;border-color:var(--b)!important}
.p-setup.v2 .p-sec>h2,.p-setup h3{transform:none!important}
.p-tabs button{background:var(--n-card,#fbf8f1)!important;color:var(--n-ink,#161514)!important}
.p-tabs button[aria-pressed="true"]{background:var(--b)!important;color:var(--b-on,#fbf8f1)!important}
.p-theme[aria-pressed="true"]{background:var(--b-tint)!important}
.p-resume{background:var(--n-card,#fbf8f1)!important;color:var(--n-ink,#161514)!important}
.p-resume .ico{background:var(--b)!important;color:var(--b-on,#fbf8f1)!important}
/* question card: neutral answer chips */
.p-mc button:nth-child(n) i{background:var(--n-raise,#f5efe3)!important;color:var(--n-ink,#161514)!important;border:1.5px solid rgba(var(--ink-rgb,22,21,20),.3)!important}
.p-mc button.ok i,.p-mc button.bad i{background:rgba(255,255,255,.2)!important;color:#fff!important;border-color:transparent!important}
.p-mc button.ok{background:var(--q-good,#2f7d57)!important}.p-mc button.bad{background:var(--q-bad,#c2412f)!important}
.p-ans{background:var(--q-good,#2f7d57)!important}
.p-order .chip,.p-order .chip:nth-child(3n+2),.p-match .mi{background:var(--b)!important;color:var(--b-on,#fbf8f1)!important;box-shadow:0 3px 0 rgba(var(--ink-rgb,22,21,20),.35)!important;border-color:var(--b)!important}
.p-q-top .p-pts{background:var(--n-raise,#f5efe3)!important;transform:none!important}
.p-banner{background:var(--b)!important;color:var(--b-on,#fbf8f1)!important}
.p-turn b{transform:none!important}
.p-pteam{transform:none!important}
/* library + preview */
.g-cover{background:var(--n-raise,#f5efe3)!important;color:var(--n-ink,#161514)!important}
.g-cover-badge{transform:none!important}
.g-tabs button[aria-selected="true"]{transform:none!important}
.g-mode,.g-pv-mode,.g-mode.live{background:var(--n-card,#fbf8f1)!important;color:var(--n-ink,#161514)!important;border:2px solid rgba(var(--ink-rgb,22,21,20),.28)!important}
.g-mode:hover,.g-pv-mode:hover{border-color:var(--n-edge,#161514)!important;background:var(--b-tint)!important;box-shadow:none!important;transform:none!important}
.g-pv-mode i{background:var(--b)!important;color:var(--b-on,#fbf8f1)!important}
.g-pv-mode small,.g-mode small{color:var(--n-mute,#6f685f)!important}
.g-pv-type i,.g-pv-chips span i,.g-qtiles button i{background:var(--n-raise,#f5efe3)!important;color:var(--n-ink,#161514)!important}
.g-btn.mint{background:var(--b)!important;color:var(--b-on,#fbf8f1)!important;border-color:var(--b)!important}
.g-remix,.g-pv-foot .g-btn{background:var(--b)!important;color:var(--b-on,#fbf8f1)!important}
/* Live */
.lv-join{background:var(--b)!important;color:var(--b-on,#fbf8f1)!important;box-shadow:none!important}
.lv-pinwrap{background:var(--b-on,#fbf8f1)!important;color:var(--b)!important;transform:none!important;box-shadow:none!important;border-color:var(--b-on,#fbf8f1)!important}
.lv-pin,.lv-pinwrap small{color:var(--b)!important}
.lv-step{background:transparent!important;color:var(--b-on,#fbf8f1)!important;border-color:color-mix(in srgb,var(--b-on,#fbf8f1) 40%,transparent)!important}
html[data-tgh-theme="dark"] .lv-pin,html[data-tgh-theme="dark"] .lv-pinwrap small{color:#efe9dd!important}
html[data-tgh-theme="dark"] .p-opt[style*="#f2b31d"],html[data-tgh-theme="dark"] .p-opts.toggles .p-opt[aria-pressed="false"]{color:var(--n-ink)!important}
.g-share-code{background:var(--b)!important;color:var(--b-on,#fbf8f1)!important}
:root{--t-blue:#3b3733;--t-violet:#3b3733;--t-pink:#3b3733;--t-teal:#3b3733}html[data-tgh-theme="dark"]{--t-blue:#d6cfc3;--t-violet:#d6cfc3;--t-pink:#d6cfc3;--t-teal:#d6cfc3}input[type=checkbox],input[type=radio]{accent-color:var(--n-ink,#161514)!important}
.p-banner,.p-banner *,.p-banner.gold{color:var(--b-on,#fbf8f1)!important}
.g-pv-q{border-left-color:rgba(var(--ink-rgb,22,21,20),.35)!important}
.g-pv-q .g-pv-tag,.g-pv-q em,.g-pv-q .tag{background:var(--n-raise,#f5efe3)!important;color:var(--n-soft,#3b3733)!important}
.g-pv-q .g-pv-tag i,.g-pv-q em i,.g-pv-q .tag i{background:var(--n-ink,#161514)!important}
.p-study-bar .again{background:var(--q-bad,#c2412f)!important}.p-study-bar .got,.p-study-bar button:nth-of-type(2){background:var(--q-good,#2f7d57)!important}
:root{--q-good:#2f7d57;--q-bad:#c2412f}
.g-wrap [style*="--qa"],.g-modal-box [style*="--qa"],.g-pv-q,.g-qtiles button,.g-pv-type{--qa:#6f685f!important;--qb:#8d857a!important}
.g-pv-q .tchip i,.g-pv-type i,.g-qtiles button i{color:#fbf8f1!important}
.g-pv-q .tchip{background:var(--n-raise,#f5efe3)!important;color:var(--n-soft,#3b3733)!important}
/* ===== v85: bright pastel palette (sky, mint, sun, coral + lilac, rose). Soft outlines, no hard shadows. ===== */
:root{
  --p-sky:#2f62d9;--p-mint:#36a874;--p-sun:#f5c244;--p-coral:#ee6a45;--p-lilac:#8b7bd8;--p-rose:#e47aa2;--p-teal:#2fa5a0;--p-peach:#f6a26b;
  --p-sky-t:#e2f0fb;--p-mint-t:#dff4e9;--p-sun-t:#fdf0cc;--p-coral-t:#fde2d9;--p-lilac-t:#ece9fa;--p-rose-t:#fce4ec;
  --f-edge:rgba(22,21,20,.14);--n-edge:rgba(22,21,20,.16);--n-shadow:transparent;--f-shadow:transparent;--f-hard:0 0 0 transparent;--f-hard-lg:0 10px 30px rgba(22,21,20,.10);
  --b:var(--p-sky);--b-deep:#4596d6;--b-tint:var(--p-sky-t);--b-on:#161514;
}
html[data-tgh-theme="dark"]{
  --p-sky-t:#2a2622;--p-mint-t:#18302a;--p-sun-t:#332b16;--p-coral-t:#38211b;--p-lilac-t:#2c2630;--p-rose-t:#36222b;
  --f-edge:rgba(239,233,221,.14);--n-edge:rgba(239,233,221,.16);--n-shadow:transparent;--f-shadow:transparent;--f-hard:0 0 0 transparent;--f-hard-lg:0 10px 30px rgba(0,0,0,.4);
  --b:var(--p-sky);--b-deep:#7bbcef;--b-tint:#1c2b38;--b-on:#141311;
}
::selection{background:var(--p-sky)!important;color:#161514!important}
/* v85 games: pastel tiles */
.g-cover{background:var(--p-sky-t)!important}
.p-opt{--pc:var(--p-sky)}
.p-opt[data-aud="young"],.p-opt[data-src="fun"],.p-opt[data-m="random"]{--pc:var(--p-coral)}
.p-opt[data-aud="adult"],.p-opt[data-src="class"],.p-opt[data-m="mixed"]{--pc:var(--p-lilac)}
.p-opt[data-p="options"],.p-opt[data-m="rows"]{--pc:var(--p-sun)}
.p-opt[data-p="powers"],.p-opt[data-m="tables"]{--pc:var(--p-mint)}
.p-opt[data-p="themes"]{--pc:var(--p-sky)}
.p-opts .p-opt:nth-child(4n+1){--pc:var(--p-sky)}.p-opts .p-opt:nth-child(4n+2){--pc:var(--p-mint)}.p-opts .p-opt:nth-child(4n+3){--pc:var(--p-sun)}.p-opts .p-opt:nth-child(4n+4){--pc:var(--p-coral)}
.p-opt,.p-opts.choice .p-opt[aria-pressed="false"],.p-opts.toggles .p-opt[aria-pressed="false"]{background:color-mix(in srgb,var(--pc) 12%,var(--n-card,#fbf8f1))!important;border:1.5px solid color-mix(in srgb,var(--pc) 35%,transparent)!important;color:var(--n-ink,#161514)!important}
.p-opt .ico,.p-opts.choice .p-opt[aria-pressed="false"] .ico,.p-opts.toggles .p-opt[aria-pressed="false"] .ico{background:var(--pc)!important;color:#fff!important;border:0!important}
.p-opts.choice .p-opt[aria-pressed="true"],.p-opts.toggles .p-opt[aria-pressed="true"],.p-opt[aria-pressed="true"]{background:var(--pc)!important;border-color:var(--pc)!important;color:#161514!important}
.p-opts.choice .p-opt[aria-pressed="true"] .ico,.p-opt[aria-pressed="true"] .ico{background:rgba(255,255,255,.85)!important;color:#161514!important}
.p-opt[aria-pressed="true"] .sw{background:rgba(255,255,255,.85)!important;border-color:transparent!important}
.p-opt[aria-pressed="true"] .sw i{background:#161514!important}
.p-setup.v2 .p-sec>h2,.p-setup h3,.p-slide-num{background:var(--p-sun-t)!important;color:var(--n-ink,#161514)!important}
.p-tile{border:0!important;box-shadow:0 5px 0 rgba(22,21,20,.12)!important;color:var(--fg,#fff)!important}
.p-tile:not(.done):hover{box-shadow:0 8px 0 rgba(22,21,20,.12)!important}
.p-tile.done{border:2px dashed rgba(var(--ink-rgb,22,21,20),.16)!important;box-shadow:none!important}
html[data-tgh-theme="dark"] .p-tile{box-shadow:0 5px 0 rgba(0,0,0,.4)!important}
.p-team{border:1.5px solid color-mix(in srgb,var(--tc) 40%,transparent)!important;background:color-mix(in srgb,var(--tc) 10%,var(--n-card,#fbf8f1))!important}
.p-team.turn{box-shadow:none!important;transform:none!important}
.p-team strong{border:0!important}
.p-mc button{border:1.5px solid rgba(var(--ink-rgb,22,21,20),.16)!important}
.p-mc button:nth-child(1) i{background:var(--p-coral)!important;color:#fff!important;border:0!important}.p-mc button:nth-child(2) i{background:var(--p-sky)!important;color:#fff!important;border:0!important}
.p-mc button:nth-child(3) i{background:var(--p-sun)!important;color:#161514!important;border:0!important}.p-mc button:nth-child(4) i{background:var(--p-mint)!important;color:#fff!important;border:0!important}
.p-mc button.ok{background:var(--p-mint)!important;color:#161514!important}.p-mc button.bad{background:var(--p-coral)!important;color:#161514!important}
.p-ans{background:var(--p-mint)!important;color:#161514!important;border:0!important;box-shadow:none!important}
.p-order .chip,.p-order .chip:nth-child(3n+2),.p-match .mi{background:var(--p-sky)!important;color:#161514!important;border:0!important;box-shadow:0 3px 0 rgba(22,21,20,.12)!important}
.p-order .chip:nth-child(3n+2){background:var(--p-lilac)!important}.p-order .chip:nth-child(3n){background:var(--p-mint)!important}
.p-q-box{border:1.5px solid var(--f-edge)!important;box-shadow:0 20px 60px rgba(22,21,20,.18)!important}
.p-q-top .p-pts{background:var(--p-sun)!important;color:#161514!important;border:0!important}
.p-banner{background:var(--p-lilac)!important;color:#161514!important;border:0!important}
.p-banner *,.p-banner.gold{color:#161514!important}
.p-card{border:1.5px solid var(--f-edge)!important;box-shadow:0 16px 40px rgba(22,21,20,.08)!important}
.p-card.flip{background:var(--p-sun-t)!important}
.p-study-bar .again{background:var(--p-coral)!important;color:#161514!important}.p-study-bar .got,.p-study-bar button:nth-of-type(2){background:var(--p-mint)!important;color:#161514!important}
.g-mode,.g-pv-mode,.g-mode.live{border:1.5px solid transparent!important}
.g-pv-mode:nth-child(1),.g-mode.play{background:var(--p-coral-t)!important}.g-pv-mode:nth-child(2),.g-mode.live{background:var(--p-mint-t)!important}
.g-pv-mode:nth-child(3),.g-mode.study{background:var(--p-sky-t)!important}.g-pv-mode:nth-child(4),.g-mode.slides{background:var(--p-lilac-t)!important}
.g-pv-mode:nth-child(1) i{background:var(--p-coral)!important}.g-pv-mode:nth-child(2) i{background:var(--p-mint)!important}.g-pv-mode:nth-child(3) i{background:var(--p-sky)!important}.g-pv-mode:nth-child(4) i{background:var(--p-lilac)!important}
.g-pv-mode i{color:#fff!important}
.lv-join{background:var(--p-sky)!important;color:#161514!important;border:0!important}
.lv-pinwrap{background:#fff!important;color:#161514!important;border:0!important}
.lv-pin,.lv-pinwrap small,html[data-tgh-theme="dark"] .lv-pin,html[data-tgh-theme="dark"] .lv-pinwrap small{color:#161514!important}
.lv-step{background:rgba(255,255,255,.85)!important;color:#161514!important;border:0!important}
.p-resume{background:var(--p-sky-t)!important}
.p-resume .ico{background:var(--p-sky)!important;color:#161514!important}
.g-share-code{background:var(--p-sun)!important;color:#161514!important}
.p-cteam,.p-class-teams.v2 .p-cteam{background:color-mix(in srgb,var(--tc) 22%,var(--n-card,#fbf8f1))!important;border:1.5px solid color-mix(in srgb,var(--tc) 50%,transparent)!important;box-shadow:none!important}
.p-class-teams.v2 .h b{color:var(--n-ink,#161514)!important}
.p-class-teams.v2 .h i{background:var(--tc)!important;color:#fff!important}

/* ===== v86: no black blocks next to the pastel colours ===== */
.g-cover-badge,.g-badge,.g-q-num,.jn-head .sc{background:rgba(255,255,255,.92)!important;color:#161514!important;border:1px solid rgba(22,21,20,.08)}
.g-cover-badge{left:auto!important;right:10px!important}
html[data-tgh-theme="dark"] .g-q-num,html[data-tgh-theme="dark"] .jn-head .sc{background:var(--n-raise)!important;color:var(--n-ink)!important}
.p-src button[aria-pressed="true"],.p-methods button[aria-pressed="true"],.p-timerpick .seg button[aria-pressed="true"],.lv-set .seg button[aria-pressed="true"],.p-count button[aria-pressed="true"],.g-sorts button[aria-pressed="true"],.g-tabs button[aria-selected="true"]{background:var(--p-sky)!important;color:#161514!important;border-color:var(--p-sky)!important}
.p-toggle::after,.p-opt .sw i,.tgh-switch::after{background:#fff!important}
.p-timer{background:rgba(var(--ink-rgb,22,21,20),.08)!important}.p-timer i{background:var(--p-sky)!important}
.p-progress i,.p-progress span{background:var(--p-sky)!important}
.p-power-pick button,.p-who-btn,.p-pteam-btn{background:var(--n-card,#fbf8f1)!important;color:var(--n-ink,#161514)!important;border:1.5px solid var(--f-edge)!important}
.p-power-pick button:hover,.p-who-btn:hover,.p-pteam-btn:hover{background:var(--p-sky-t)!important}
.p-win-ribbon{background:var(--p-sun)!important;color:#161514!important}.p-win-ribbon b{color:#161514!important}
.lv-toast,.jn-toast{background:var(--n-card,#fbf8f1)!important;color:var(--n-ink,#161514)!important;border:1.5px solid var(--f-edge)!important;box-shadow:0 10px 30px rgba(22,21,20,.12)!important}
.p-gap.filled{background:var(--p-sky-t)!important;color:var(--n-ink,#161514)!important}
.jn-rbtns button.opt{background:var(--n-card)!important;color:var(--n-ink)!important}
.p-podium .medal.m2,.jn-final .medal.m2{background:#cfd6df!important}
/* each game card gets its own Play colour (the cover colours, softened) */
.g-grid .g-card .g-btn.primary{border-color:transparent!important;color:#161514!important}
.g-grid .g-card:nth-child(6n+1) .g-btn.primary{background:var(--p-sky)!important}
.g-grid .g-card:nth-child(6n+2) .g-btn.primary{background:var(--p-sun)!important}
.g-grid .g-card:nth-child(6n+3) .g-btn.primary{background:var(--p-mint)!important}
.g-grid .g-card:nth-child(6n+4) .g-btn.primary{background:var(--p-coral)!important}
.g-grid .g-card:nth-child(6n+5) .g-btn.primary{background:var(--p-lilac)!important}
.g-grid .g-card:nth-child(6n+6) .g-btn.primary{background:var(--p-rose)!important}
.g-grid .g-card .g-btn.primary:hover{filter:brightness(.95)!important}
.g-card{border:1.5px solid var(--f-edge)!important}
.g-card:hover{box-shadow:0 12px 30px rgba(22,21,20,.08)!important;transform:translateY(-2px)!important}
/* v86: cover tint matches its Play colour; in dark a soft mix, never navy */
.g-grid .g-card:nth-child(6n+1) .g-cover{background:var(--p-sky-t)!important}
html[data-tgh-theme="dark"] .g-grid .g-card:nth-child(6n+1) .g-cover{background:var(--p-sky)!important;color:#fff!important}
.g-grid .g-card:nth-child(6n+2) .g-cover{background:var(--p-sun-t)!important}
html[data-tgh-theme="dark"] .g-grid .g-card:nth-child(6n+2) .g-cover{background:var(--p-sun)!important;color:#161514!important}
.g-grid .g-card:nth-child(6n+3) .g-cover{background:var(--p-mint-t)!important}
html[data-tgh-theme="dark"] .g-grid .g-card:nth-child(6n+3) .g-cover{background:var(--p-mint)!important;color:#fff!important}
.g-grid .g-card:nth-child(6n+4) .g-cover{background:var(--p-coral-t)!important}
html[data-tgh-theme="dark"] .g-grid .g-card:nth-child(6n+4) .g-cover{background:var(--p-coral)!important;color:#fff!important}
.g-grid .g-card:nth-child(6n+5) .g-cover{background:var(--p-lilac-t)!important}
html[data-tgh-theme="dark"] .g-grid .g-card:nth-child(6n+5) .g-cover{background:var(--p-lilac)!important;color:#fff!important}
.g-grid .g-card:nth-child(6n+6) .g-cover{background:var(--p-rose-t)!important}
html[data-tgh-theme="dark"] .g-grid .g-card:nth-child(6n+6) .g-cover{background:var(--p-rose)!important;color:#fff!important}
html[data-tgh-theme="dark"] .g-cover-badge{background:rgba(255,255,255,.9)!important}
.lv-set .ico{background:var(--p-sky-t)!important;color:#161514!important}
html[data-tgh-theme="dark"] .lv-set .ico{background:var(--n-raise)!important;color:var(--n-ink)!important}
.lv-start:disabled,.lv-go:disabled{background:var(--n-raise)!important;color:var(--n-mute)!important;border-color:transparent!important}
/* v86 dark: no navy surfaces (blue mixed into black). Neutral warm greys + clear pastel accents */
html[data-tgh-theme="dark"] thead th,html[data-tgh-theme="dark"] thead tr:nth-child(2) th,html[data-tgh-theme="dark"] thead tr:nth-child(3) th,html[data-tgh-theme="dark"] thead .name-head,html[data-tgh-theme="dark"] thead .total-head,html[data-tgh-theme="dark"] thead .absence-head{background:#2a2723!important;color:var(--n-ink)!important}
html[data-tgh-theme="dark"] thead tr:first-child th{background:#322e29!important}
html[data-tgh-theme="dark"] .podium-person.rank-2,html[data-tgh-theme="dark"] .p-lb.crowns .pod.p2 .block{background:#2c2a27!important}
html[data-tgh-theme="dark"] .p-opt,html[data-tgh-theme="dark"] .p-opts.choice .p-opt[aria-pressed="false"],html[data-tgh-theme="dark"] .p-opts.toggles .p-opt[aria-pressed="false"]{background:#24211d!important}
@media (min-width:821px){
html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"],html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"]:hover{background:var(--c)!important;border-color:var(--c)!important;color:#161514!important}
html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"] .tgh-ni,html[data-tgh-theme="dark"] .tgh-side .tgh-side-item[aria-current="page"] *{color:#161514!important}
html[data-tgh-theme="dark"] .tgh-side .tgh-side-item:hover{background:rgba(239,233,221,.07)!important}
}
html[data-tgh-theme="dark"] .p-team{background:#24211d!important}
/* ===== v87: deeper blue with white text; white text on coloured fills (black only on soft fills); tilts and button shadows back ===== */
:root,html[data-tgh-theme="dark"]{--b:#2f62d9;--b-deep:#244fb8;--b-on:#ffffff;
  --f-hard:3px 3px 0 rgba(22,21,20,.85);--f-hard-lg:6px 6px 0 rgba(22,21,20,.85);--btn-sh:0 2px 0 rgba(22,21,20,.16);--btn-sh-h:3px 4px 0 rgba(22,21,20,.85)}
html[data-tgh-theme="dark"]{--b-tint:#2a2622;--f-hard:3px 3px 0 #000;--f-hard-lg:6px 6px 0 #000;--btn-sh:0 2px 0 #000;--btn-sh-h:3px 4px 0 #000}
/* blue = the deep blue, always with white text */
.p-src button[aria-pressed="true"],.p-methods button[aria-pressed="true"],.p-timerpick .seg button[aria-pressed="true"],.lv-set .seg button[aria-pressed="true"],.p-count button[aria-pressed="true"],.g-sorts button[aria-pressed="true"],.g-tabs button[aria-selected="true"],
body[data-page="offline"] button{background:var(--b)!important;border-color:var(--b)!important;color:#fff!important}
.p-progress i,.p-progress span,.p-timer i{background:var(--b)!important}
/* game cards: white on strong colours, black on the soft sun colour */
.g-grid .g-card .g-btn.primary{color:#fff!important}
.g-grid .g-card:nth-child(6n+1) .g-btn.primary{background:var(--b)!important}
.g-grid .g-card:nth-child(6n+2) .g-btn.primary{color:#161514!important}
html[data-tgh-theme="dark"] .g-grid .g-card .g-cover{color:#fff!important}
html[data-tgh-theme="dark"] .g-grid .g-card:nth-child(6n+1) .g-cover{background:var(--b)!important}
html[data-tgh-theme="dark"] .g-grid .g-card:nth-child(6n+2) .g-cover{color:#161514!important}
/* tilted labels, like the poster style */
.brand-kicker,.eyebrow,.onboarding-kicker{transform:rotate(-2deg)!important}
.class-tabs button[aria-selected="true"]{transform:rotate(-2deg)!important}
.g-tabs button[aria-selected="true"]{transform:rotate(-2deg)!important}
.g-cover-badge{transform:rotate(-3deg)!important}
.p-setup.v2 .p-sec>h2,.p-setup h3{transform:rotate(-2deg)}
.p-turn b,.p-pteam{transform:rotate(-2deg)}
.g-head h1,.p-q-top .p-pts{transform:rotate(-1deg)}
/* button shadows, stronger on hover */
.action-button,.structure-button,.onboarding-button,.text-button,.g-btn,.p-start,.lv-start,.lv-next,.p-skip,.p-show,.jn-chip,.current-week,#currentWeek,#saveLesson,.tgh-btn,.p-pill,.g-mode,body[data-page="panel"] #googleSignIn,.tgh-tool-btn{box-shadow:var(--btn-sh)!important;transition:transform .14s ease,box-shadow .14s ease,background .14s ease!important}
.action-button:not(:disabled):hover,.structure-button:hover,.onboarding-button:hover,.text-button:hover,.g-btn:not(:disabled):hover,.p-start:not(:disabled):hover,.lv-start:not(:disabled):hover,.lv-next:hover,.p-skip:hover,.p-show:hover,.jn-chip:hover,.current-week:hover,#currentWeek:hover,#saveLesson:hover,.tgh-btn:hover,.p-pill:hover,.g-mode:hover,body[data-page="panel"] #googleSignIn:hover,.tgh-tool-btn:hover{transform:translate(-2px,-2px)!important;box-shadow:var(--btn-sh-h)!important}
.action-button:active,.g-btn:active,.p-start:active{transform:translate(0,0)!important;box-shadow:var(--btn-sh)!important}
.g-grid .g-card .g-btn.primary:hover{filter:none!important}
/* v87: selected setup tiles — white text, black only on the soft sun tile */
.p-opts.choice .p-opt[aria-pressed="true"],.p-opts.toggles .p-opt[aria-pressed="true"],.p-opt[aria-pressed="true"]{color:#fff!important}
.p-opts .p-opt:nth-child(4n+3)[aria-pressed="true"],.p-opt[data-p="options"][aria-pressed="true"],.p-opt[data-m="rows"][aria-pressed="true"]{color:#161514!important}
.p-opt[aria-pressed="true"] small,.p-opt[aria-pressed="true"] span,.p-opt[aria-pressed="true"] b,.p-opt[aria-pressed="true"] em{color:inherit!important}
.p-team.turn,html[data-tgh-theme="dark"] .p-team.turn{background:var(--tc)!important;border-color:var(--tc)!important}
.p-team.turn,.p-team.turn b,.p-team.turn .rank,.p-team.turn [contenteditable],.p-team.turn span{color:var(--tfg,#fff)!important}
.p-team.turn strong,html[data-tgh-theme="dark"] .p-team.turn strong{background:#fff!important;color:#161514!important}
/* v87b: everything filled with the blue gets white text */
#applyBulk,#applyBulk:hover,.actions .primary,.actions .primary:hover,.auth-tabs button[aria-selected="true"],.button.primary,.button.primary:hover,.class-tabs button[aria-selected="true"],.demo-nav button[aria-current="page"],.g-btn.mint,.g-btn.primary,.g-btn.primary:hover,.g-grid .g-card:nth-child(6n+1) .g-btn.primary,.g-pv-foot .g-btn,.g-pv-mode i,.g-pv-mode:nth-child(3) i,.g-remix,.g-share-code,.g-sorts button.on,.g-sorts button[aria-pressed="true"],.g-sorts button[aria-selected="true"],.g-tabs button[aria-selected="true"],.jn-form button,.lv-join,.lv-set .seg button[aria-pressed="true"],.lv-start,.onboarding-button.primary,.onboarding-button.primary:hover,.p-banner,.p-count button[aria-pressed="true"],.p-gbtn,.p-gbtn:hover,.p-mc button:nth-child(2) i,.p-methods button[aria-pressed="true"],.p-q-box .p-gbtn,.p-q-box .p-gbtn:hover,.p-resume .ico,.p-resume .p-start,.p-show,.p-show:hover,.p-src button[aria-pressed="true"],.p-start,.p-start:hover,.p-stepper button,.p-stepper button:hover,.p-tabs button[aria-pressed="true"],.p-timerpick .seg button[aria-pressed="true"],.pl-form button,.pl-form button:hover,.schedule-actions .primary,.schedule-actions .primary:hover,.segmented button[aria-selected="true"],.semester-switch button.active,.semester-switch button[aria-pressed="true"],.semester-switch button[aria-selected="true"],.settings-actions .primary,.settings-actions .primary:hover,.sex-assignment-actions .primary,.sex-assignment-actions .primary:hover,.sex-choice button[aria-pressed="true"],.spin-wheel,.spin-wheel:hover,.submit,.submit:hover,.timer-presets button[aria-pressed="true"],.tour-card .primary,.tour-card .primary:hover,body[data-page="migration"] button:not(.tgh-theme-btn),body[data-page="offline"] button,body[data-page="panel"] #authSubmit,body[data-page="panel"] #authSubmit:hover,body[data-page="panel"] .auth-tabs button:first-child[aria-selected="true"],body[data-page="panel"] .auth-tabs button:last-child[aria-selected="true"],body[data-page="panel"] .card:has([data-auth-mode="signup"][aria-selected="true"]) #authSubmit,body[data-page="portal"] #submit,body[data-page="portal"] #submit:hover,body[data-page="portal"] .access .eyebrow,body[data-page="portal"] .segmented button[aria-selected="true"],body[data-page="portal"] .submit,button.primary,button.primary:hover,html.tgh-phone .tgh-view-switch button[aria-selected="true"],nav a[aria-current="page"],#applyBulk *,#applyBulk:hover *,.actions .primary *,.actions .primary:hover *,.auth-tabs button[aria-selected="true"] *,.button.primary *,.button.primary:hover *,.class-tabs button[aria-selected="true"] *,.demo-nav button[aria-current="page"] *,.g-btn.mint *,.g-btn.primary *,.g-btn.primary:hover *,.g-grid .g-card:nth-child(6n+1) .g-btn.primary *,.g-pv-foot .g-btn *,.g-pv-mode i *,.g-pv-mode:nth-child(3) i *,.g-remix *,.g-share-code *,.g-sorts button.on *,.g-sorts button[aria-pressed="true"] *,.g-sorts button[aria-selected="true"] *,.g-tabs button[aria-selected="true"] *,.jn-form button *,.lv-join *,.lv-set .seg button[aria-pressed="true"] *,.lv-start *,.onboarding-button.primary *,.onboarding-button.primary:hover *,.p-banner *,.p-count button[aria-pressed="true"] *,.p-gbtn *,.p-gbtn:hover *,.p-mc button:nth-child(2) i *,.p-methods button[aria-pressed="true"] *,.p-q-box .p-gbtn *,.p-q-box .p-gbtn:hover *,.p-resume .ico *,.p-resume .p-start *,.p-show *,.p-show:hover *,.p-src button[aria-pressed="true"] *,.p-start *,.p-start:hover *,.p-stepper button *,.p-stepper button:hover *,.p-tabs button[aria-pressed="true"] *,.p-timerpick .seg button[aria-pressed="true"] *,.pl-form button *,.pl-form button:hover *,.schedule-actions .primary *,.schedule-actions .primary:hover *,.segmented button[aria-selected="true"] *,.semester-switch button.active *,.semester-switch button[aria-pressed="true"] *,.semester-switch button[aria-selected="true"] *,.settings-actions .primary *,.settings-actions .primary:hover *,.sex-assignment-actions .primary *,.sex-assignment-actions .primary:hover *,.sex-choice button[aria-pressed="true"] *,.spin-wheel *,.spin-wheel:hover *,.submit *,.submit:hover *,.timer-presets button[aria-pressed="true"] *,.tour-card .primary *,.tour-card .primary:hover *,body[data-page="migration"] button:not(.tgh-theme-btn) *,body[data-page="offline"] button *,body[data-page="panel"] #authSubmit *,body[data-page="panel"] #authSubmit:hover *,body[data-page="panel"] .auth-tabs button:first-child[aria-selected="true"] *,body[data-page="panel"] .auth-tabs button:last-child[aria-selected="true"] *,body[data-page="panel"] .card:has([data-auth-mode="signup"][aria-selected="true"]) #authSubmit *,body[data-page="portal"] #submit *,body[data-page="portal"] #submit:hover *,body[data-page="portal"] .access .eyebrow *,body[data-page="portal"] .segmented button[aria-selected="true"] *,body[data-page="portal"] .submit *,button.primary *,button.primary:hover *,html.tgh-phone .tgh-view-switch button[aria-selected="true"] *,nav a[aria-current="page"] *{color:#fff!important}
/* v89: one Play colour for every game — the deep blue with white text */
.g-grid .g-card:nth-child(n) .g-btn.primary,.g-grid .g-card:nth-child(n) .g-btn.primary *{background:var(--b)!important;color:#fff!important;border-color:var(--b)!important}
.g-grid .g-card:nth-child(n) .g-btn.primary *{background:transparent!important}
.g-grid .g-card:nth-child(n) .g-btn.primary:hover{background:var(--b-deep)!important}
/* v92 matching: white tiles with black text; a matched pair shares one colour */
.p-match .mi,.p-match .r .mi{background:#fffdf8!important;color:#161514!important;border:1.5px solid rgba(22,21,20,.18)!important;box-shadow:0 3px 0 rgba(22,21,20,.12)!important;outline:0!important}
.p-match .mi:hover{border-color:var(--b)!important}
.p-match .mi.sel{border:3px solid var(--b)!important;box-shadow:0 0 0 4px rgba(47,98,217,.18)!important}
.p-match .mi.paired{background:var(--pc)!important;color:var(--pfg,#fff)!important;border-color:var(--pc)!important}
.p-match.good .mi{box-shadow:0 0 0 3px #36a874!important}.p-match.bad .mi{box-shadow:0 0 0 3px #d8383b!important}
html[data-tgh-theme="dark"] .p-match .mi:not(.paired){background:#2a2723!important;color:#efe9dd!important;border-color:rgba(239,233,221,.2)!important}
/* v93: paused boards, one row per class */
.p-resume.p-resume-list{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}
.p-resume-list .hd{display:flex;align-items:center;gap:14px}
.p-resume-list .hd small{margin:2px 0 0!important}
.p-resume-list .rows{display:grid;gap:10px}
.p-resume-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px;padding:14px 16px;border-radius:16px;background:var(--n-card,#fbf8f1);border:1.5px solid rgba(47,98,217,.22)}
.p-resume-row .cl{display:flex;align-items:center;gap:8px}
.p-resume-row .cl .tag{padding:2px 8px;border-radius:999px;background:#2f62d9;color:#fff;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;transform:rotate(-2deg)}
.p-resume-row .cl b{font-size:19px;font-weight:900}
.p-resume-row small{display:block;margin:2px 0!important;opacity:1!important;color:var(--n-mute,#5a534b)}
.p-resume-row .ls{color:var(--n-ink,#161514)!important;font-weight:700}
.p-resume-row .teams{margin-top:6px}
.p-resume-row .act{display:grid;gap:8px}
.p-resume-row .p-start{background:var(--b)!important;color:#fff!important}
html[data-tgh-theme="dark"] .p-resume-row{background:#24211d;border-color:rgba(143,176,255,.3)}
@media (max-width:640px){.p-resume-row{grid-template-columns:1fr}}
.p-resume .teams span{font-size:14px!important;padding:4px 12px 4px 6px!important;gap:6px!important}
.p-resume .teams i{width:14px!important;height:14px!important;border-radius:50%!important;background:var(--tc)!important;flex:none}
/* v94: the same "lift + shadow" on hover for everything you can click (buttons, seats, tabs, cards, tiles) */
:is(button,.seat:not(.empty),.tray-student,.g-card,.lesson,.p-opt,.class-tabs button,.semester-switch button,.tgh-card,.insight,.chip-button,a.button,[role="button"]):not(:disabled):not(.tgh-side-item):not(.tgh-suggest):not(.tgh-suggest-item):not(.minus):not(.plus):not(.g-icon):not(.editor-close):not(.close-note):not(.p-tile):not(.p-match .mi):not(.tgh-theme-btn):not([aria-label="Close"]){transition:translate .14s ease,box-shadow .14s ease,background .14s ease!important}
:is(button,.seat:not(.empty),.tray-student,.g-card,.lesson,.p-opt,.class-tabs button,.semester-switch button,.tgh-card,.chip-button,a.button,[role="button"]):not(:disabled):not(.tgh-side-item):not(.tgh-suggest):not(.tgh-suggest-item):not(.minus):not(.plus):not(.g-icon):not(.editor-close):not(.close-note):not(.p-tile):not(.tgh-theme-btn):not([aria-label="Close"]):not([aria-selected="true"]):not([aria-pressed="true"]):hover{translate:-2px -2px;box-shadow:var(--btn-sh-h,3px 4px 0 rgba(22,21,20,.85))!important}
.p-match .mi:not(.paired):hover{translate:-2px -2px;box-shadow:3px 4px 0 rgba(22,21,20,.85)!important}
/* the earlier button rule used transform; use translate so tilted labels keep their tilt */
.action-button:not(:disabled):hover,.structure-button:hover,.onboarding-button:hover,.text-button:hover,.g-btn:not(:disabled):hover,.p-start:not(:disabled):hover,.lv-start:not(:disabled):hover,.lv-next:hover,.p-skip:hover,.p-show:hover,.jn-chip:hover,.current-week:hover,#currentWeek:hover,#saveLesson:hover,.tgh-btn:hover,.p-pill:hover,.g-mode:hover,body[data-page="panel"] #googleSignIn:hover,.tgh-tool-btn:hover{transform:none!important;translate:-2px -2px}
.seat:not(.empty):hover{z-index:2}
/* match pairs editor: left = right on one row */
.g-choice.g-pair{grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr)}
.g-choice.g-pair i{background:rgba(47,98,217,0.12);color:#2f62d9}
@media (max-width:560px){.g-choice.g-pair{grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr);gap:6px}.g-choice.g-pair i{width:22px}}
/* review mode button */
.g-mode.review{background:var(--p-sun-t)!important}
.g-mode.review small{font-weight:600;font-size:12px}
.g-pv-mode:nth-child(5){background:var(--p-sun-t)!important}.g-pv-mode:nth-child(5) i{background:var(--p-sun)!important;color:#161514!important}
/* editor: multiple correct answers */
.g-mcrow .g-mark{display:grid;place-items:center;width:28px;height:28px;padding:0;border:0;border-radius:9px;background:rgba(216,56,59,0.172);color:var(--g-coral,#d8383b);font-weight:800;font-size:13px;cursor:pointer;transition:transform .15s}
.g-mcrow .g-mark:hover{transform:scale(1.12)}
.g-mcrow.right .g-mark{background:rgba(31,138,90,0.184);color:var(--g-mint,#1f8a5a)}
.g-mcrow.right .g-input{box-shadow:inset 0 0 0 2px rgba(31,138,90,.55)!important}
.g-mc-tip{margin:2px 0 0;font-size:13px;color:var(--n-mute,#6f685f)}
/* shared answer widgets */
.p-w{display:grid;gap:14px;width:100%;justify-items:stretch}
.p-w .p-mc{width:100%}
.p-w-acts{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.p-w-acts:empty{display:none}
.p-multi-hint{margin:0;justify-self:center;padding:6px 14px;border-radius:999px;background:var(--p-sun-t,#fdf1c9);color:#161514;font-weight:750;font-size:15px;transform:rotate(-1deg)}
.p-mc.multi button.picked{background:var(--p-sky-t,#dce8fb)!important;box-shadow:inset 0 0 0 3px #2f62d9!important;transform:translateY(-2px)}
.p-mc button.dim{opacity:.42}
.p-match .mi{cursor:pointer;transition:transform .15s}
.p-match .mi:not(.paired):hover{transform:translateY(-2px)}
.p-match .mi.sel{outline:4px solid #2f62d9!important;outline-offset:2px}
.p-match .mi.paired{background:var(--pc)!important;color:var(--pfg,#fffdf8)!important}
.p-match .mi.ok{box-shadow:inset 0 0 0 3px #1f8a5a,0 4px 0 #1f8a5a!important}
.p-match .mi.bad{box-shadow:inset 0 0 0 3px #d8383b,0 4px 0 #d8383b!important}
.p-match.good .mi,.p-match.bad .mi{outline:0}
.p-order .line .chip.ok{box-shadow:inset 0 0 0 3px #1f8a5a!important}.p-order .line .chip.bad{box-shadow:inset 0 0 0 3px #d8383b!important}
.p-ans.lines{white-space:pre-line;line-height:1.5}
.p-ans.soft{background:var(--p-sky-t,#dce8fb)!important;letter-spacing:.06em}
.p-slide .p-w{margin-top:4px}
/* self-paced review */
.p-rv{display:grid;gap:18px;width:min(900px,100%);margin:1vh auto 0;padding:clamp(20px,3vw,34px);border-radius:28px;background:var(--n-card,#fbf8f1);color:var(--n-ink,#161514);border:1.5px solid rgba(var(--ink-rgb,22,21,20),.14);box-shadow:0 18px 40px rgba(22,21,20,.10);text-align:center;transition:box-shadow .2s}
.p-rv .p-q-text{color:var(--n-ink,#161514)}
.p-rv.good{box-shadow:0 0 0 4px rgba(31,138,90,.35),0 18px 40px rgba(22,21,20,.10);animation:pRvOk .4s ease}
.p-rv.bad{box-shadow:0 0 0 4px rgba(216,56,59,.35),0 18px 40px rgba(22,21,20,.10);animation:pRvNo .4s ease}
@keyframes pRvOk{50%{transform:scale(1.012)}}
@keyframes pRvNo{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.p-rv-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.p-rv-score{padding:4px 12px;border-radius:999px;background:var(--p-mint-t,#dff3e7);font-weight:750;font-size:13px;transform:rotate(1.5deg)}
.p-rv-foot{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.p-rv-end{text-align:left}
.p-rv-big{display:flex;align-items:center;gap:clamp(16px,3vw,30px);flex-wrap:wrap}
.p-rv-big .ring{position:relative;width:132px;height:132px;flex:none}
.p-rv-big svg{width:100%;height:100%;transform:rotate(-90deg)}
.p-rv-big circle{fill:none;stroke:rgba(var(--ink-rgb,22,21,20),.1);stroke-width:12}
.p-rv-big circle.arc{stroke:var(--p-mint,#36a874);stroke-linecap:round;stroke-dasharray:0 326.7;transition:stroke-dasharray 1s ease}
.p-rv-end.b-good .p-rv-big circle.arc{stroke:var(--p-sun,#f5c244)}.p-rv-end.b-low .p-rv-big circle.arc{stroke:var(--p-coral,#ee6a45)}
.p-rv-big .ring b{position:absolute;inset:0;display:grid;place-items:center;font-size:32px;font-weight:900}
.p-rv-big h2{margin:0 0 4px;font-size:clamp(24px,3vw,32px)}
.p-rv-big p{margin:0;color:var(--n-mute,#6f685f);font-weight:650}
.p-rv-h{margin:6px 0 0;font-size:18px}
.p-rv-list{display:grid;gap:12px;margin:0;padding:0;list-style:none;counter-reset:rv}
.p-rv-list li{counter-increment:rv;position:relative;display:grid;gap:8px;padding:14px 16px 14px 52px;border-radius:18px;background:var(--p-rose-t,#fbe3ea);box-shadow:0 6px 14px rgba(22,21,20,.06);transform:rotate(-.4deg)}
.p-rv-list li:nth-child(even){background:var(--p-sky-t,#dce8fb);transform:rotate(.4deg)}
.p-rv-list li::before{content:counter(rv);position:absolute;left:14px;top:14px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#2f62d9;color:#fff;font-weight:800;font-size:14px}
.p-rv-list .qq{font-weight:750}
.p-rv-list .you,.p-rv-list .ok{display:grid;gap:2px;font-size:14.5px}
.p-rv-list span{font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--n-mute,#6f685f)}
.p-rv-list .you b{color:#b0242a;font-weight:700}.p-rv-list .ok b{color:#1f6f4a;font-weight:700;white-space:pre-line}
.p-rv-acts{display:flex;flex-wrap:wrap;gap:10px}
.p-rv-acts .p-show{display:inline-flex;align-items:center;gap:8px}
@media (max-width:560px){.p-rv-list li{padding-left:46px}.p-rv-big .ring{width:104px;height:104px}}
.p-rv-acts .p-show,.p-rv-acts .p-skip,.p-rv-foot .p-show,.p-rv-foot .p-skip,.p-w-acts .p-show,.p-w-acts .p-skip{min-height:48px;padding:0 22px;border-radius:14px;font-weight:750;font-size:16px;cursor:pointer}
.p-rv-acts .p-skip,.p-rv-foot .p-skip,.p-w-acts .p-skip{background:var(--n-card,#fbf8f1)!important;color:var(--n-ink,#161514)!important;border:1.5px solid rgba(var(--ink-rgb,22,21,20),.2)!important}
.p-mc button.dim{opacity:.42!important}
.p-rv .p-ans{font-size:clamp(18px,2.2vw,24px)!important;padding:12px 18px!important;border-radius:18px}
/* review: navigation, skip for later, question map */
.p-mc button.picked{background:var(--p-sky-t,#dce8fb)!important;box-shadow:inset 0 0 0 3px #2f62d9!important;transform:translateY(-2px)}
.p-rv-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.p-rv-nav .p-show,.p-rv-nav .p-skip{min-height:48px;padding:0 22px;border-radius:14px;font-weight:750;font-size:16px;cursor:pointer}
.p-rv-nav .p-skip{background:var(--n-card,#fbf8f1)!important;color:var(--n-ink,#161514)!important;border:1.5px solid rgba(var(--ink-rgb,22,21,20),.2)!important}
.p-rv-nav .p-skip[data-n="skip"]{background:var(--p-sun-t,#fdf1c9)!important}
.p-rv-nav button:disabled{opacity:.4;cursor:default}
.p-rv-finish{justify-self:center;border:0;background:none;color:#2f62d9;font:inherit;font-weight:750;font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.p-rv-map{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;width:min(900px,100%);max-height:104px;overflow:auto;margin:14px auto 0;padding:4px}
.p-rv-map button{width:32px;height:32px;padding:0;border:1.5px solid rgba(var(--ink-rgb,22,21,20),.18);border-radius:10px;background:var(--n-card,#fbf8f1);color:var(--n-ink,#161514);font:inherit;font-size:12.5px;font-weight:750;cursor:pointer;transition:transform .15s}
.p-rv-map button:hover{transform:translateY(-2px)}
.p-rv-map button.done{background:var(--p-mint-t,#dff3e7);border-color:var(--p-mint,#36a874)}
.p-rv-map button.skip{background:var(--p-sun-t,#fdf1c9);border-color:var(--p-sun,#f5c244)}
.p-rv-map button.here{background:#2f62d9;border-color:#2f62d9;color:#fff}
.p-rv-open{width:100%;min-height:120px;padding:14px 16px;border:0;border-radius:16px;background:var(--n-raise,#f5efe3);box-shadow:inset 0 0 0 1.5px rgba(var(--ink-rgb,22,21,20),.14);color:var(--n-ink,#161514);font:inherit;font-size:17px;resize:vertical}
.p-rv-open:focus{outline:none;box-shadow:inset 0 0 0 2px #2f62d9}
.p-rv-note{margin:0;color:var(--n-mute,#6f685f);font-size:14px;font-weight:600}
.p-rv-ask{display:grid;gap:10px;justify-items:center;padding:10px 0}
.p-rv-ask h2{margin:0;font-size:clamp(22px,3vw,30px)}
.p-rv-ask p{margin:0;color:var(--n-mute,#6f685f);font-weight:600}
.p-rv-list.open li{background:var(--p-lilac-t,#ece6fd)}
.p-rv-list .you b{white-space:pre-line}
.p-rv-list.open .you b{color:var(--n-ink,#161514)}
/* offline banner */
.g-offline{position:fixed;left:50%;bottom:16px;z-index:60;display:flex;flex-wrap:wrap;gap:6px;align-items:center;max-width:calc(100% - 32px);padding:10px 16px;border-radius:14px;background:var(--p-sun-t,#fdf1c9);color:#161514;font-size:14px;font-weight:600;box-shadow:0 12px 30px -12px rgba(22,21,20,.4);transform:translateX(-50%) rotate(-.5deg)}
.g-offline b{font-weight:800}
/* the team in play stands out: bigger, glowing; the others step back */
.p-scores.side .p-team{transition:transform .35s cubic-bezier(.3,1.4,.5,1),opacity .3s,box-shadow .3s}
.p-scores.side .p-team.turn{transform:scale(1.05)!important;transform-origin:center;z-index:3;position:relative;box-shadow:0 0 0 3px var(--n-card,#fbf8f1),0 0 0 6px var(--tc),0 14px 30px -10px rgba(22,21,20,.45)!important}
.p-scores.side .p-team.turn b{font-size:1.12em}
.p-scores.side:has(.p-team.turn) .p-team:not(.turn){opacity:.62;transform:scale(.95)!important}
/* the blank: a line under the "?", the missing letters appear on it */
.p-gap{background:transparent!important;border-radius:0!important;box-shadow:none!important;border-bottom:4px solid currentColor;padding:0 .25em!important;margin:0 .05em 0 0!important;color:#b07a00!important}
.p-gap.filled{background:transparent!important;color:#2f62d9!important;border-bottom-color:#2f62d9}
/* the chosen student: team colour pill, names in Times New Roman */
.p-who-name.spinning,.p-who-name.chosen{font-family:"Times New Roman",Times,serif!important;font-weight:700}
.p-who-name.chosen{display:inline-block;padding:4px 16px;border-radius:999px;background:var(--tc,#2f62d9);color:var(--tfg,#fff)!important;box-shadow:0 8px 18px -8px rgba(22,21,20,.45);transform:rotate(-2deg)}

.p-playing .p-scores.side{padding:14px 12px 10px!important;overflow-x:visible}
/* power-up message sits on a dark panel: bright word colours so nothing grey or black disappears */
.p-pq .p-pmsg b.good{color:#6fd3a0!important}.p-pq .p-pmsg b.bad{color:#ff8a85!important}.p-pq .p-pmsg b.mid{color:#93b2ff!important}
.p-pq .p-pmsg .who{filter:none!important;color:var(--tc)!important}
.p-pq .p-pmsg{color:#fffdf8!important}

/* bonus amount chosen by the teacher (7 Nov 2026) */
.p-bonus .p-bamt{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px}
.p-bonus .p-bamt span{font-weight:800;font-size:13px;margin-right:2px}
.p-bonus .p-bamt button{min-height:36px;padding:0 14px;border:2px solid rgba(var(--ink-rgb,22,21,20),.25);border-radius:12px;background:#fffdf8;color:#161514;font-weight:800}
.p-bonus .p-bamt button[aria-pressed="true"]{background:#2f62d9;border-color:#2f62d9;color:#fff}
.p-bonus .p-bamt label{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700}
.p-bonus .p-bamt input{width:76px;min-height:36px;padding:0 8px;border:2px solid rgba(var(--ink-rgb,22,21,20),.25);border-radius:12px;background:#fffdf8;color:#161514;font:700 14px/1 inherit;text-align:center}
/* power-ups added 7 Nov 2026: lasting effects, open questions, duel, fog, quake, board notes */
.p-team .fxs{display:inline-flex;gap:3px;margin-left:6px;vertical-align:middle}
.p-team .fxs i{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:7px;background:#fffdf8;color:#161514;border:1.5px solid rgba(22,21,20,.25)}
.p-team .fxs i.fx-shield,.p-team .fxs i.fx-mirror,.p-team .fxs i.fx-second,.p-team .fxs i.fx-extra,.p-team .fxs i.fx-jackpot,.p-team .fxs i.fx-pick{background:#dff3e8;border-color:#1f8a5a;color:#1f6f45}
.p-team .fxs i.fx-frozen{background:#e1f4ff;border-color:#2f62d9;color:#2f62d9}
.p-team .fxs i.fx-hot,.p-team .fxs i.fx-fog,.p-team .fxs i.fx-back{background:#ffe3e3;border-color:#d8383b;color:#a3191c}
.p-team .fxs i.fx-bet{background:#fff3c4;border-color:#b45309;color:#8a4a00}
.p-q-main{transition:filter .6s,opacity .6s}
.p-q-main.p-fogged .p-q-text,.p-q-main.p-fogged .p-q-img,.p-q-main.p-fogged .p-scramble{filter:blur(16px);opacity:.25;transition:filter .8s,opacity .8s}
.p-teamwin{min-height:50px;padding:0 20px;border:3px solid var(--tc);border-radius:16px;background:var(--tc);color:var(--tfg,#fff);font-size:17px;font-weight:850;cursor:pointer;box-shadow:0 4px 0 rgba(22,21,20,.35)}
.p-teamwin:hover{transform:translateY(-2px)}
.p-captain{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:center;margin-top:6px}
.p-captain small{width:100%;text-align:center;font-weight:700}
.p-captain button{min-height:34px;padding:0 12px;border:2px solid rgba(22,21,20,.25);border-radius:12px;background:#fffdf8;color:#161514;font-weight:750;cursor:pointer}
.p-captain button[aria-pressed="true"]{background:#2f62d9;border-color:#2f62d9;color:#fff}
.p-die{font-size:22px!important;letter-spacing:.04em}
.p-board.p-shake{animation:pQuake .8s ease-in-out}
@keyframes pQuake{10%,50%,90%{transform:translate(-6px,2px) rotate(-.6deg)}30%,70%{transform:translate(6px,-2px) rotate(.6deg)}100%{transform:none}}
.p-bnote{position:fixed;left:50%;top:84px;z-index:60;transform:translateX(-50%);padding:12px 20px;border-radius:16px;background:#161514;color:#fffdf8;font-weight:850;font-size:20px;box-shadow:0 6px 0 rgba(0,0,0,.25);animation:pNoteIn .35s cubic-bezier(.3,1.4,.5,1);transition:opacity .4s,transform .4s}
.p-bnote.ice{background:#2f62d9;color:#fff}.p-bnote.good{background:#1f8a5a;color:#fff}
.p-bnote.out{opacity:0;transform:translate(-50%,-12px)}
@keyframes pNoteIn{from{opacity:0;transform:translate(-50%,-16px) scale(.9)}}
.p-root.adult .p-board.p-shake{animation-duration:.4s}
/* class teams on the setup page: minimal and compact (7 Nov 2026) — names as plain lines, no boxes */
.p-class-teams.v2{grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:10px}
.p-class-teams.v2 .p-cteam,.p-cteam{background:color-mix(in srgb,var(--tc) 9%,var(--n-card,#fbf8f1))!important;border:0!important;border-top:4px solid var(--tc)!important;border-radius:12px!important;box-shadow:none!important;animation:none!important}
.p-class-teams.v2 .p-cteam::after{display:none!important}
.p-class-teams.v2 .h{padding:9px 12px 4px!important}
.p-class-teams.v2 .h b{font-size:15px!important;font-weight:800!important;color:var(--n-ink,#161514)!important}
.p-class-teams.v2 .h i{min-width:0!important;height:auto!important;padding:0!important;background:none!important;color:var(--n-mute,#5a534b)!important;font-weight:700!important;font-size:12.5px!important}
.p-class-teams.v2 .h i::after{content:" students"}
.p-class-teams.v2 ul{gap:0!important;padding:0 12px 8px!important}
.p-class-teams.v2 li{padding:4px 0!important;border:0!important;border-bottom:1px solid rgba(var(--ink-rgb,22,21,20),.08)!important;border-radius:0!important;background:none!important;color:var(--n-ink,#161514)!important;font:500 14.5px/1.35 "Times New Roman",Times,serif!important;letter-spacing:0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p-class-teams.v2 li:last-child{border-bottom:0!important}
html[data-tgh-theme="dark"] .p-class-teams.v2 .p-cteam{background:color-mix(in srgb,var(--tc) 14%,#1d1c1a)!important}
html[data-tgh-theme="dark"] .p-class-teams.v2 li,html[data-tgh-theme="dark"] .p-class-teams.v2 .h b{color:#f3efe6!important}
/* setup page, compact (7 Nov 2026): option tiles as slim rows (icon + text side by side) */
.p-class-teams.v2 .h i{display:inline-block!important;white-space:nowrap}
.p-opts.choice .p-opt:not(.num){display:grid!important;grid-template-columns:auto 1fr;grid-template-rows:auto auto;align-items:center;column-gap:10px;row-gap:0;min-height:0!important;padding:10px 12px!important;border-radius:14px!important}
.p-opts.choice .p-opt:not(.num) .ico{grid-row:1/3;width:34px!important;height:34px!important;margin:0!important;border-radius:10px!important}
.p-opts.choice .p-opt:not(.num) .ico .tt-ic{width:20px;height:20px}
.p-opts.choice .p-opt:not(.num) b{font-size:15px;line-height:1.2}
.p-opts.choice .p-opt:not(.num) small{grid-column:2;font-size:12px;line-height:1.3;opacity:.85}
.p-opts.choice .p-opt:not(.num) b:only-of-type{grid-row:1/3}
.p-opts.choice .p-opt.num{min-height:0!important;padding:10px 12px!important;border-radius:14px!important}
.p-opts{gap:8px!important}
.p-sec{margin-bottom:14px}
/* TeachNLearn presenter notes on the teacher's phone (join page) */
.jn-notes{padding:14px 16px 90px;color:var(--n-ink,#161514)}
.jn-notes .k{margin:0 0 4px;font-size:13px;color:var(--n-mute,#5a534b)}
.jn-notes h2{margin:0 0 12px;font-size:20px;line-height:1.3}
.jn-notes h3{margin:14px 0 3px;font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;color:#2f62d9}
.jn-notes p{margin:0;font-size:16px;line-height:1.5}
.jn-nfoot{position:fixed;left:0;right:0;bottom:0;display:flex;gap:10px;padding:10px 12px;background:var(--n-card,#fbf8f1);border-top:1px solid rgba(22,21,20,.12)}
.jn-nfoot button{flex:1;min-height:56px;border:2px solid #161514;border-radius:14px;background:#fffdf8;color:#161514;font-size:18px;font-weight:800}
.jn-nfoot button.next{background:#2f62d9;border-color:#2f62d9;color:#fff}

/* TeachNLearn live class on the learner's phone */
.jn-class{display:flex;flex-direction:column;min-height:100%}
.jn-cls{flex:1;display:flex;flex-direction:column;gap:12px;padding:12px 0 96px}
.jn-cmain{flex:1;display:flex;flex-direction:column;gap:12px}
.jn-hand{display:grid;gap:2px;padding:12px 14px;border:1.5px solid rgba(22,21,20,.16);border-radius:16px;background:#e4ecfb;color:#161514;text-decoration:none;box-shadow:3px 3px 0 rgba(22,21,20,.85);transform:rotate(-.5deg)}
.jn-hand small{color:#5a534b}.jn-hand b{font-size:17px}
.jn-hand span{justify-self:start;margin-top:6px;padding:7px 14px;border-radius:10px;background:#2f62d9;color:#fff;font-weight:800}
.jn-cq small{color:var(--n-mute,#5a534b)}.jn-cq h2{margin:4px 0 0;font-size:22px;line-height:1.3}
.jn-copts{display:grid;gap:10px}
.jn-copts button{min-height:min(14vh,110px)!important}
.jn-copts button i{font-size:26px!important;font-weight:900}
.jn-copts button em{font-style:normal;font-weight:900}
.jn-copts.done button{opacity:.55}
.jn-copts.done button.picked,.jn-copts.done button.right{opacity:1}
.jn-copts button.right{outline:4px solid #1f8a5a;outline-offset:2px}
.jn-cres{margin:0;padding:10px 14px;border-radius:12px;font-weight:800;text-align:center}
.jn-cres.ok{background:#dcf2e6;color:#17683f}.jn-cres.no{background:#fbf8f1;color:#161514}
.jn-pulse{position:fixed;left:0;right:0;bottom:0;display:flex;gap:10px;padding:12px 14px calc(12px + env(safe-area-inset-bottom));background:rgba(251,248,241,.96);border-top:1.5px solid rgba(22,21,20,.12)}
.jn-pulse button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:56px;border:1.5px solid rgba(22,21,20,.2);border-radius:16px;background:#fff;color:#161514;font:800 17px Inter,system-ui,sans-serif;cursor:pointer;transition:transform .1s}
.jn-pulse button:active{transform:scale(.96)}
.jn-pulse button.lost.on{background:#fde2dc;border-color:#d8383b;color:#a3321c;box-shadow:3px 3px 0 #a3321c}
.jn-pulse button.got.on{background:#dcf2e6;border-color:#1f8a5a;color:#17683f;box-shadow:3px 3px 0 #17683f}

/* live class: the teacher's step card mirrored on the phone (read-only) and the poll window */
.jn-livek{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:#fde2dc;color:#a3321c;font-weight:900;font-size:13px;letter-spacing:.06em;text-transform:uppercase}
.jn-livek i{width:8px;height:8px;border-radius:50%;background:#d8383b;animation:jnBlink 1.2s ease-in-out infinite}
@keyframes jnBlink{50%{opacity:.25}}
.jn-mtitle{margin:0;color:var(--n-mute,#5a534b);font-size:13px;font-weight:700}
.jn-mtitle:empty{display:none}
.jn-mirror{padding:16px;border:1.5px solid rgba(22,21,20,.16);border-radius:18px;background:#fbf8f1;color:#161514;box-shadow:3px 3px 0 rgba(22,21,20,.85);font-size:16px;line-height:1.5;overflow-wrap:anywhere}
.jn-mirror .jn-wait{min-height:30vh}
.mr-kicker{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px}
.mr-kicker>span:first-child{padding:3px 9px;border:1.5px solid #1f6f66;border-radius:7px;background:#dff3ef;color:#1f6f66;font-size:11.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.mr-sn{color:#5a534b;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.mr-rv{color:#2f62d9}
.mr-rvnote{color:#5a534b;font-size:13px}
.jn-mirror h2.mr-q{margin:0 0 12px;font-size:21px;line-height:1.3}
.mr-brief p{margin:0 0 10px}.mr-brief ul,.mr-brief ol{margin:0 0 10px;padding-left:20px}.mr-brief li{margin:4px 0}
.jn-mirror table{width:100%;margin:6px 0 12px;border-collapse:collapse;font-size:14px;display:block;overflow-x:auto}
.jn-mirror th,.jn-mirror td{padding:6px 8px;border:1px solid rgba(22,21,20,.16);text-align:left;vertical-align:top}
.jn-mirror th{background:#efe9dd}
.jn-mirror code{padding:1px 5px;border-radius:5px;background:#efe9dd;font-size:.92em}
.mr-opts{display:grid;gap:8px;margin:4px 0 10px}
.mr-opt{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1.5px solid rgba(22,21,20,.18);border-radius:12px;background:#fff}
.mr-box{flex:none;width:18px;height:18px;border:2px solid #161514;border-radius:50%}
.mr-opt.mr-on{border-color:#2f62d9;background:#e4ecfb}.mr-opt.mr-on .mr-box{background:#2f62d9;border-color:#2f62d9}
.mr-opt.mr-good{border-color:#1f8a5a;background:#dcf2e6}.mr-opt.mr-bad{border-color:#d8383b;background:#fde2dc}
.mr-opt.mr-out{opacity:.45;text-decoration:line-through}
.mr-fb{margin:10px 0;padding:10px 12px;border-radius:12px;background:#efe9dd}.mr-fb.mr-good{background:#dcf2e6}.mr-fb.mr-bad{background:#fde2dc}
.mr-hintbox{margin:10px 0;padding:10px 12px;border-radius:12px;background:#fff6d8}
.mr-wait{color:#5a534b;font-style:italic}
.mr-pool,.mr-binin{display:flex;flex-wrap:wrap;gap:6px}.mr-bins{display:grid;gap:8px;margin-top:8px}
.mr-bin{padding:8px;border:1.5px dashed rgba(22,21,20,.25);border-radius:12px}.mr-bin>b{display:block;margin-bottom:6px}
.mr-chipx{padding:5px 10px;border:1.5px solid rgba(22,21,20,.2);border-radius:999px;background:#fff;font-size:14px}
.mr-inval{padding:2px 8px;border-radius:6px;background:#e4ecfb;font-weight:800}
.mr-code label{display:block;margin:4px 0}
.jn-sheet{position:fixed;inset:0;z-index:50;display:flex;align-items:flex-end;background:rgba(22,21,20,.45);animation:jnFade .2s ease}
.jn-sheet[hidden]{display:none}
.jn-sheetin{width:100%;max-height:92vh;overflow:auto;padding:16px 16px calc(18px + env(safe-area-inset-bottom));border-radius:22px 22px 0 0;background:#fbf8f1;box-shadow:0 -4px 0 rgba(22,21,20,.85);animation:jnUp .28s cubic-bezier(.3,1.3,.5,1)}
.jn-sheetk{display:inline-block;margin:0 0 6px;padding:3px 10px;border-radius:7px;background:#2f62d9;color:#fff;font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.jn-sheetin .jn-copts{margin-top:12px}
.jn-sheetnote{margin:12px 0 0;color:#5a534b;font-size:13px;text-align:center}
body.jn-sheeton{overflow:hidden}
@keyframes jnUp{from{transform:translateY(40%)}}
@keyframes jnFade{from{opacity:0}}

/* live class: the teacher's voice */
.jn-listen{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:52px;padding:0 16px;border:0;border-radius:16px;background:#2f62d9;color:#fff;font:800 17px Inter,system-ui,sans-serif;box-shadow:3px 3px 0 rgba(22,21,20,.85);cursor:pointer}
.jn-listen[hidden]{display:none}
.jn-listen.s-on{background:#dcf2e6;color:#17683f;box-shadow:3px 3px 0 #17683f}
.jn-listen.s-muted{background:#efe9dd;color:#161514}
.jn-listen.s-failed,.jn-listen.s-tap{background:#fde2dc;color:#a3321c;box-shadow:3px 3px 0 #a3321c}
.jn-eq{display:inline-flex;align-items:flex-end;gap:3px;height:18px}
.jn-eq i{width:4px;height:6px;border-radius:2px;background:currentColor}
.jn-listen.s-on .jn-eq i{animation:jnEq .9s ease-in-out infinite}.jn-listen.s-on .jn-eq i:nth-child(2){animation-delay:.2s}.jn-listen.s-on .jn-eq i:nth-child(3){animation-delay:.4s}
.jn-listen.s-connecting .jn-eq i{animation:jnEq 1.4s ease-in-out infinite;opacity:.7}
@keyframes jnEq{50%{height:18px}}

/* live class: the lab on the phone (video from the teacher's screen, view only) */
.jn-labv{display:grid;gap:6px}
.jn-labv[hidden]{display:none}
.jn-labk{display:flex;align-items:center;gap:6px;margin:4px 0 0;font-size:12px;font-weight:900;letter-spacing:.07em;text-transform:uppercase;color:#a3321c}
.jn-labk i{width:8px;height:8px;border-radius:50%;background:#d8383b;animation:jnBlink 1.2s ease-in-out infinite}
.jn-labv video{width:100%;border:1.5px solid rgba(22,21,20,.2);border-radius:14px;background:#161514;box-shadow:3px 3px 0 rgba(22,21,20,.85)}
.jn-labv small{color:#5a534b;font-size:12px}
.jn-sheet{bottom:calc(80px + env(safe-area-inset-bottom))}.jn-sheetin{max-height:calc(92vh - 80px);border-radius:22px 22px 0 0} /* "I am lost" / "Got it" stay usable while a question is open */

/* live class: the document (questionnaire, codebook…) on the phone */
.jn-paperv{display:grid;gap:6px}.jn-paperv[hidden]{display:none}
.jn-labk.doc{color:#1f6f66}.jn-labk.doc::before{content:"";width:8px;height:8px;border-radius:2px;background:#1f6f66}
.mr-paper{font-size:14.5px;line-height:1.45;color:#161514}
.mr-paper .mr-chip{display:inline-block;margin:0 0 8px;padding:3px 10px;border:1.5px solid #161514;border-radius:999px;background:#f2b31d;font-size:11.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.mr-form-paper{padding:14px 14px;border:2px solid #161514;border-radius:14px;background:#fffdf7;box-shadow:3px 3px 0 rgba(22,21,20,.85)}
.mr-form-paper h3{margin:0 0 4px;font-size:16px}
.mp-q{margin:8px 0;padding-bottom:8px;border-bottom:1px dashed rgba(22,21,20,.25)}.mp-q>b{display:block;margin-bottom:3px}
.mp-hand{font-family:"Comic Sans MS","Segoe Print","Bradley Hand",cursive;color:#1b3fa0;font-size:15px}
.mp-box{display:inline-block;margin-right:12px;white-space:nowrap}
.mp-box i{display:inline-grid;place-items:center;width:15px;height:15px;margin-right:4px;border:1.5px solid #161514;border-radius:3px;font-style:normal;font-size:12px;line-height:1;color:#1b3fa0;vertical-align:-2px}
.mp-skip{color:#8a5a00;font-size:12.5px}
.mr-codebook{margin-top:14px}.mr-codebook table,.mr-def{width:100%;border-collapse:collapse;font-size:13px}
.mr-codebook th,.mr-codebook td,.mr-def th,.mr-def td{padding:6px 7px;border:1px solid rgba(22,21,20,.16);text-align:left;vertical-align:top}
.mr-codebook th{background:#e4ecfb}
.mr-checklist{list-style:none;padding:0;display:grid;gap:6px}.mr-checklist li{padding:8px 10px;border:1.5px solid rgba(22,21,20,.16);border-radius:12px;background:#fff}
.mr-note{color:#5a534b;font-size:13px}
.jn-paper{margin:10px 0 4px;border:1.5px solid rgba(22,21,20,.16);border-radius:14px;background:#fff;overflow:hidden}
.jn-paper summary{padding:10px 14px;font-weight:800;cursor:pointer;color:#1f6f66}
.jn-paper>.mr-paper{padding:0 12px 12px;max-height:46vh;overflow:auto}
/* live class: every question type on the phone */
.jn-send{width:100%;min-height:52px;margin-top:12px;border:0;border-radius:16px;background:#2f62d9;color:#fff;font:800 17px Inter,system-ui,sans-serif;box-shadow:3px 3px 0 rgba(22,21,20,.85);cursor:pointer}
.jn-send:disabled{opacity:.45;cursor:default}
.jn-copts.multi button.picked{outline:4px solid #161514;outline-offset:2px}
.jn-numin{display:flex;align-items:center;gap:10px;margin-top:12px}
.jn-numin input,.jn-codein input{flex:1;min-width:0;height:52px;padding:0 14px;border:2px solid rgba(22,21,20,.25);border-radius:14px;background:#fff;font:700 20px Inter,system-ui,sans-serif;color:#161514}
.jn-numin span{font-weight:800}
.jn-codein{display:grid;gap:8px;margin-top:12px}
.jn-codein label{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1.5px solid rgba(22,21,20,.16);border-radius:14px;background:#fff}
.jn-codein label span{flex:1;display:grid}.jn-codein label small{color:#5a534b}
.jn-codein input{flex:0 0 110px;height:44px;font-size:18px}
.jn-codein label.good{border-color:#1f8a5a;background:#dcf2e6}.jn-codein label.bad{border-color:#d8383b;background:#fde2dc}
.jn-sort{display:grid;gap:10px;margin-top:12px;touch-action:none}
.jn-spool{display:flex;flex-wrap:wrap;gap:8px;min-height:52px;padding:10px;border:1.5px dashed rgba(22,21,20,.3);border-radius:14px;background:#fff}
.jn-sbins{display:grid;gap:8px}
.jn-sbin{padding:8px 10px;border:2px solid rgba(22,21,20,.2);border-radius:14px;background:#efe9dd}
.jn-sbin>b{display:block;margin-bottom:6px}
.jn-sbin .in{display:flex;flex-wrap:wrap;gap:6px;min-height:40px}
.jn-sbin.over,.jn-spool.over{border-color:#2f62d9;background:#e4ecfb}
.jn-schip{padding:8px 12px;border:1.5px solid rgba(22,21,20,.25);border-radius:999px;background:#fff;color:#161514;font:700 14px Inter,system-ui,sans-serif;cursor:grab;touch-action:none;user-select:none}
.jn-schip.sel{background:#2f62d9;border-color:#2f62d9;color:#fff}
.jn-schip.lift{opacity:.35}
.jn-schip.ghost{position:fixed;z-index:100;pointer-events:none;box-shadow:4px 4px 0 rgba(22,21,20,.85);transform:rotate(-3deg)}
.jn-schip.good{background:#dcf2e6;border-color:#1f8a5a}.jn-schip.bad{background:#fde2dc;border-color:#d8383b}
.jn-sdone{color:#5a534b}

/* "Where to go" path in the mirrored card */
.mr-where{margin:0 0 12px;padding:10px 12px;border:2px solid #161514;border-radius:14px;background:#fbe7b0}
.mr-wl{display:block;margin-bottom:4px;font-size:11.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:#8a5a00}
.mr-wp{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px}
.mr-wp b{padding:3px 9px;border:1.5px solid #161514;border-radius:9px;background:#fff;font-size:14px}
.mr-wp i{font-style:normal;font-weight:900;font-size:18px;color:#2f62d9}

/* live class · raise hand, speak, ask a question (8 Nov 2026) */
.jn-pulse{flex-direction:column;gap:8px}
.jn-prow{display:flex;gap:10px}
.jn-prow.sm button{height:46px;font-size:15px;font-weight:750}
.jn-pulse button svg{width:20px;height:20px;flex:none}
.jn-pulse .jn-handb.on{background:#fff1bf;border-color:#c98a00;color:#6b4a00;box-shadow:3px 3px 0 #c98a00}
.jn-pulse .jn-handb:disabled{background:#dcf2e6;border-color:#1f8a5a;color:#17683f;opacity:1}
.jn-cls{padding-bottom:calc(var(--jnfoot,140px) + 16px)}
.jn-sheet{bottom:var(--jnfoot,140px)}.jn-sheetin{max-height:calc(92vh - var(--jnfoot,140px))}
.jn-pulse .jn-listen{flex:none;width:100%;min-height:46px;height:auto;border:0;background:#2f62d9;color:#fff;font-size:16px}
.jn-pulse .jn-listen[hidden]{display:none}
.jn-pulse .jn-listen.s-on{background:#dcf2e6;color:#17683f}.jn-pulse .jn-listen.s-muted{background:#efe9dd;color:#161514}.jn-pulse .jn-listen.s-failed,.jn-pulse .jn-listen.s-tap{background:#fde2dc;color:#a3321c}
.jn-pulse .jn-micb{flex:2;background:#2f62d9;border-color:#2f62d9;color:#fff;box-shadow:3px 3px 0 rgba(22,21,20,.85)}
.jn-pulse .jn-micb.on{background:#d8383b;border-color:#d8383b}
.jn-pulse .jn-doneb{flex:1;font-size:14px!important}
.jn-pulse button[hidden]{display:none}
.jn-speak{padding:14px;border:2px solid #1f8a5a;border-radius:18px;background:#dcf2e6;box-shadow:3px 3px 0 #17683f;color:#17683f}
.jn-speak[hidden]{display:none}
.jn-speak p{margin:0 0 10px}.jn-speak p b{display:block;font-size:17px}.jn-speak p span{font-size:14px}
.jn-speakb{display:flex;gap:8px;flex-wrap:wrap}
.jn-speak .jn-micb{flex:1 1 200px;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 14px;border:0;border-radius:16px;background:#2f62d9;color:#fff;font:800 17px Inter,system-ui,sans-serif;box-shadow:3px 3px 0 rgba(22,21,20,.85);cursor:pointer}
.jn-micb svg{width:22px;height:22px}
.jn-micb.on{background:#d8383b;animation:jnTalk 1.6s ease-in-out infinite}
@keyframes jnTalk{50%{box-shadow:3px 3px 0 rgba(22,21,20,.85),0 0 0 6px rgba(216,56,59,.25)}}
.jn-speakb .jn-ghost{flex:0 1 auto;min-height:52px;padding:0 14px;border:1.5px solid rgba(22,21,20,.25);border-radius:16px;background:#fff;color:#161514;font:750 15px Inter,system-ui,sans-serif}
.jn-ask{position:fixed;inset:0;z-index:60;display:flex;align-items:flex-end;background:rgba(22,21,20,.45);animation:jnFade .2s ease}
.jn-ask[hidden]{display:none}
.jn-askin{width:100%;padding:16px 16px calc(18px + env(safe-area-inset-bottom));border-radius:22px 22px 0 0;background:#fbf8f1;box-shadow:0 -4px 0 rgba(22,21,20,.85);color:#161514;animation:jnUp .28s cubic-bezier(.3,1.3,.5,1)}
.jn-askin h3{margin:0 0 4px;font:800 20px Inter,system-ui,sans-serif}
.jn-askin p{margin:0 0 10px;font-size:14px;color:#5a534b}
.jn-askin textarea{width:100%;box-sizing:border-box;padding:12px;border:1.5px solid rgba(22,21,20,.3);border-radius:14px;background:#fff;color:#161514;font:500 17px/1.35 Inter,system-ui,sans-serif;resize:vertical}
.jn-anon{display:flex;align-items:center;gap:8px;margin:10px 0 2px;font-weight:650}
.jn-anon input{width:20px;height:20px}
.jn-askbtns{display:flex;gap:10px;align-items:center}
.jn-askbtns .jn-ghost{min-height:52px;margin-top:12px;padding:0 18px;border:1.5px solid rgba(22,21,20,.25);border-radius:16px;background:#fff;color:#161514;font:750 16px Inter,system-ui,sans-serif}
.jn-askbtns .jn-send{flex:1}

/* live class · a learner controls the lab (8 Nov 2026) */
.jn-labv.ctrl video{border:3px solid #f2b31d;box-shadow:3px 3px 0 #c98a00;touch-action:none;cursor:crosshair}
.jn-ctrlk{margin:0;padding:8px 10px;border-radius:12px;background:#fff1bf;color:#6b4a00;font-size:14px}
.jn-ctrlk[hidden],.jn-ctrlp[hidden]{display:none}
.jn-ctrlp{display:grid;gap:8px}
.jn-typer{display:flex;gap:8px}
.jn-typer input{flex:1;min-width:0;min-height:46px;padding:0 12px;border:1.5px solid rgba(22,21,20,.3);border-radius:12px;background:#fff;color:#161514;font:500 16px Inter,system-ui,sans-serif}
.jn-typer button{min-height:46px;padding:0 16px;border:0;border-radius:12px;background:#2f62d9;color:#fff;font:800 15px Inter,system-ui,sans-serif}
.jn-keys{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.jn-keys button{min-height:40px;border:1.5px solid rgba(22,21,20,.25);border-radius:10px;background:#fff;color:#161514;font:700 14px Inter,system-ui,sans-serif}
.jn-pickl{display:grid;gap:6px;max-height:55vh;overflow:auto}
.jn-pickl button{min-height:46px;padding:0 12px;text-align:left;border:1.5px solid rgba(22,21,20,.25);border-radius:12px;background:#fff;color:#161514;font:650 16px Inter,system-ui,sans-serif}
.jn-pickl button.on{border-color:#2f62d9;background:#e4ecfb}

/* live class · compact footer and wide screens (8 Nov 2026) */
.jn-pulse{gap:6px;padding:8px 10px calc(8px + env(safe-area-inset-bottom))}
.jn-pulse .jn-prow{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.jn-pulse .jn-prow button,.jn-prow.sm button{flex:none;height:auto;min-height:50px;padding:5px 2px 4px;flex-direction:column;gap:2px;border-radius:13px;font:750 12.5px/1.15 Inter,system-ui,sans-serif;letter-spacing:-.01em}
.jn-pulse .jn-prow button svg{width:20px;height:20px}
.jn-pulse .jn-prow button span{white-space:nowrap}
.jn-pulse .jn-prow button[hidden]{display:none}
.jn-pulse .jn-micb{box-shadow:2px 2px 0 rgba(22,21,20,.85)}
.jn-pulse button.lost.on{box-shadow:2px 2px 0 #a3321c}.jn-pulse button.got.on{box-shadow:2px 2px 0 #17683f}
.jn-pulse .jn-handb.on{box-shadow:2px 2px 0 #c98a00}
.jn-pulse .jn-doneb{font-size:12.5px!important}
.jn-pulse .jn-listen{min-height:38px;border-radius:12px;font-size:14.5px;box-shadow:2px 2px 0 rgba(22,21,20,.85)}
.jn-pulse .jn-listen .jn-eq{transform:scale(.85)}
@media (min-width:700px){
  .jn-class .jn-head,.jn-class .jn-cls{width:100%;max-width:760px;margin-left:auto;margin-right:auto;box-sizing:border-box}
  .jn-pulse>*{width:100%;max-width:760px;margin-left:auto;margin-right:auto;box-sizing:border-box}
  .jn-pulse .jn-prow button{flex-direction:row;gap:7px;min-height:46px;font-size:14.5px}
  .jn-sheet,.jn-ask{justify-content:center}
  .jn-sheetin,.jn-askin{max-width:760px;margin:0 auto;border-radius:22px 22px 0 0}
  .jn-labv video{max-height:62vh;object-fit:contain}
}
@media (min-width:1100px){.jn-class .jn-head,.jn-class .jn-cls,.jn-pulse>*,.jn-sheetin,.jn-askin{max-width:880px}}
@media (hover:hover){.jn-pulse button:hover{transform:translateY(-1px)}.jn-pulse button:active{transform:scale(.97)}}
.jn-class~.jn-toast,.jn-toast{bottom:calc(var(--jnfoot,12px) + 12px);max-width:min(92vw,520px);text-align:center}
.mr-plain{margin:8px 0;padding:8px 10px;border-left:4px solid #1f8a5a;border-radius:10px;background:#e7f5ec}.mr-plain b{color:#17683f}.mr-ex{margin:8px 0;padding:8px 10px;border-left:4px solid #f2b31d;border-radius:10px;background:#fff8e1}

/* phones: smaller buttons at the bottom; the shared lab first and bigger (8 Nov 2026) */
.jn-pulse{gap:4px;padding:5px 8px calc(5px + env(safe-area-inset-bottom))}
.jn-pulse .jn-prow{gap:5px}
.jn-pulse .jn-prow button,.jn-prow.sm button{min-height:40px;padding:3px 2px;gap:1px;border-radius:11px;font-size:11px}
.jn-pulse .jn-prow button svg{width:16px;height:16px}
.jn-pulse .jn-listen{min-height:30px;border-radius:10px;font-size:13px}
.jn-pulse .jn-doneb{font-size:11px!important}
@media (min-width:700px){.jn-pulse .jn-prow button{min-height:38px;font-size:13px}}
.jn-cls .jn-labv{order:-1}
.jn-labv video{width:calc(100% + 24px);margin:0 -12px;border-radius:10px}
.jn-labk{display:flex;align-items:center;gap:6px}
.jn-bigb{margin-left:auto;display:inline-flex;align-items:center;gap:4px;min-height:30px;padding:0 10px;border:0;border-radius:999px;background:#2f62d9;color:#fff;font:800 12.5px Inter,system-ui,sans-serif;cursor:pointer}
.jn-bigb svg{width:15px;height:15px}
.jn-bigx{display:none}
.jn-labv.big{position:fixed;left:0;right:0;top:0;bottom:var(--jnfoot,90px);z-index:40;display:block;margin:0;padding:0;background:#161514;overflow:hidden}
.jn-labv.big>:not(video):not(.jn-bigx):not(.jn-bigin){display:none!important}
.jn-labv.big video{position:absolute;max-height:none;margin:0;border:0;border-radius:0;box-shadow:none;object-fit:contain;background:#161514}
.jn-labv.big video.rot{transform:rotate(90deg);transform-origin:50% 50%}
.jn-labv.big.ctrl video{border:0;outline:3px solid #f2b31d;outline-offset:-3px}
.jn-labv.big .jn-bigx{display:grid;place-items:center;position:absolute;top:calc(8px + env(safe-area-inset-top));right:8px;z-index:2;width:40px;height:40px;border:2px solid #fff;border-radius:50%;background:rgba(22,21,20,.7);color:#fff;font:700 24px/1 Inter,system-ui,sans-serif;cursor:pointer}
.jn-pulse{z-index:45}
html.jn-bigon,html.jn-bigon body{overflow:hidden}
.jn-labv.big[hidden]{display:none}

/* big lab view: instructions in sight (8 Nov 2026) */
.jn-bigin{display:contents}
.jn-labv.big .jn-bigin{display:flex;position:absolute;align-items:stretch;background:#161514}
.jn-labv.big .jn-bigin.rot{transform:rotate(90deg);transform-origin:50% 50%}
.jn-labv.big video,.jn-labv.big video.rot{position:static;flex:1 1 auto;min-width:0;width:auto!important;height:100%!important;transform:none!important;left:auto;top:auto}
.jn-bigtxt[hidden]{display:none}
.jn-labv.big .jn-bigtxt{flex:0 0 clamp(150px,32%,300px);overflow:auto;padding:10px 10px 12px;background:#fbf8f1;color:#161514;font:500 13px/1.35 Inter,system-ui,sans-serif;border-right:3px solid #f2b31d}
.jn-bigtxt .mr-kicker{display:flex;justify-content:space-between;gap:6px;margin-bottom:4px;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#5a534b}
.jn-bigtxt .mr-q{margin:0 0 8px;font-size:15px;line-height:1.3;font-weight:750}
.jn-bigtxt .mr-where{margin:6px 0;padding:6px 8px;border-radius:9px;background:#fff1bf;font-size:12px}
.jn-bigtxt .mr-fb,.jn-bigtxt .mr-hintbox{margin:6px 0;padding:6px 8px;border-radius:9px;background:#e4ecfb;font-size:12.5px}
.jn-bigempty{margin:0;color:#5a534b}
.jn-labv.big .jn-bigx{z-index:3;top:auto;right:auto;bottom:8px;left:8px}

/* pointers over the lab on the phones (8 Nov 2026) */
.jn-rcur{position:fixed;left:0;top:0;z-index:44;display:flex;align-items:flex-start;gap:1px;pointer-events:none;transition:transform .09s linear,opacity .4s}
.jn-rcur[hidden]{display:none}
.jn-rcur svg{width:20px;height:20px;margin:-2px 0 0 -2px;filter:drop-shadow(1px 1px 0 rgba(22,21,20,.45))}
.jn-rcur.learner svg path{fill:#f2b31d}.jn-rcur.teacher svg path{fill:#2f62d9;stroke:#fff}
.jn-rcur span{margin-top:13px;padding:0 6px;border:1.5px solid #161514;border-radius:999px;background:#fff1bf;font:700 12px/1.5 "Times New Roman",Times,serif;white-space:nowrap}
.jn-rcur.teacher span{background:#2f62d9;color:#fff;border-color:#2f62d9}
.jn-rcur{transform-origin:0 0}
.jn-rcur.idle{opacity:.4}

/* messages from the teacher's screen (8 Nov 2026) */
.jn-toast{z-index:60;line-height:1.35;font-weight:700}
.jn-toast.note{border-left:5px solid #2f62d9!important}
.jn-toast.good{border-left:5px solid #1f8a5a!important}.jn-toast.bad{border-left:5px solid #d8383b!important}
.jn-toast.rot{top:50%;bottom:auto;left:50%;translate:none;transform:translate(-50%,-50%) rotate(90deg);max-width:min(80vh,520px);animation:none}

/* typing window for the lab (8 Nov 2026) */
.jn-ask.typew{z-index:65}
.jn-toast{pointer-events:none} /* messages never block a tap on the lab */
.jn-typein{width:100%;box-sizing:border-box;min-height:50px;padding:0 12px;border:2px solid #2f62d9;border-radius:14px;background:#fff;color:#161514;font:600 18px Inter,system-ui,sans-serif}

/* the whole step card beside the big lab (8 Nov 2026) */
.jn-labv.big .jn-bigtxt{flex-basis:clamp(170px,38%,360px);font-size:13px}
.jn-bigtxt .mr-step{margin:0}
.jn-bigtxt .mr-brief p,.jn-bigtxt p{margin:0 0 6px}
.jn-bigtxt table{width:100%;border-collapse:collapse;font-size:12px}.jn-bigtxt th,.jn-bigtxt td{padding:3px 4px;border-bottom:1px solid rgba(22,21,20,.12);text-align:left;vertical-align:top}
.jn-bigtxt .mr-opts{display:grid;gap:4px;margin:6px 0}.jn-bigtxt .mr-opt{padding:5px 7px;border:1.5px solid rgba(22,21,20,.2);border-radius:8px;background:#fff;font-size:12.5px}
.jn-bigtxt .mr-opt.mr-good{border-color:#1f8a5a;background:#dcf2e6}.jn-bigtxt .mr-opt.mr-on{border-color:#2f62d9;background:#e4ecfb}
.jn-bigtxt ul,.jn-bigtxt ol{margin:0 0 6px;padding-left:18px}
.jn-bigtxt .mr-plain,.jn-bigtxt .mr-ex{font-size:12px}

/* question window: fold it to see the lab, a How line, a small celebration (8 Nov 2026) */
.jn-cq{position:relative}
.jn-fold{float:right;display:inline-flex;align-items:center;gap:4px;min-height:32px;margin:-4px 0 4px 8px;padding:0 10px;border:1.5px solid rgba(22,21,20,.25);border-radius:999px;background:#fff;color:#161514;font:750 12.5px Inter,system-ui,sans-serif;cursor:pointer}
.jn-fold svg,.jn-unfold svg{width:16px;height:16px}
.jn-unfold{display:none}
.jn-sheet.folded{background:transparent;pointer-events:none}
.jn-sheet.folded .jn-sheetin{display:none}
.jn-sheet.folded .jn-unfold{pointer-events:auto;display:flex;align-items:center;justify-content:center;gap:6px;width:calc(100% - 16px);min-height:44px;margin:0 8px 6px;border:0;border-radius:14px;background:#2f62d9;color:#fff;font:800 15px Inter,system-ui,sans-serif;box-shadow:3px 3px 0 rgba(22,21,20,.85);animation:jnUp .25s ease}
.jn-sheet.withlab .jn-sheetin{max-height:min(52vh,calc(92vh - var(--jnfoot,140px)))}
.jn-sheet.withlab{background:rgba(22,21,20,.18)}
.jn-how{margin:8px 0 0;padding:8px 10px;border-left:4px solid #1f8a5a;border-radius:10px;background:#e7f5ec;font-size:14px;line-height:1.4}
.jn-how b{color:#17683f}
.jn-cres.ok{animation:jnPop .5s cubic-bezier(.3,1.6,.5,1) both}
@keyframes jnPop{from{transform:scale(.8);opacity:0}to{transform:none;opacity:1}}
.jn-yay{position:fixed;inset:0;z-index:70;pointer-events:none;overflow:hidden}
.jn-yay i{position:absolute;top:-12px;width:9px;height:14px;border-radius:2px;animation:jnFall 1.5s cubic-bezier(.2,.7,.4,1) forwards}
@keyframes jnFall{to{transform:translate(var(--dx),105vh) rotate(540deg);opacity:.9}}

.jn-bigtxt .mr-rqnote{display:block;margin-top:6px;padding:5px 8px;border-radius:9px;background:#e4ecfb;font-size:12px;font-weight:520}
.jn-toast.note,.jn-toast.good,.jn-toast.bad{top:calc(10px + env(safe-area-inset-top));bottom:auto;width:min(92vw,560px);max-width:none;box-sizing:border-box;padding:10px 14px;font-size:14px;text-align:left}
.jn-toast.rot{top:50%}

/* the big lab view stays open (8 Nov 35) */
.jn-labv.big .jn-bigx{display:none!important}
/* computers: the quick check docks on the left, the lab stays visible on the right */
html.jn-pollside{--jnside:clamp(320px,30vw,440px)}
html.jn-pollside .jn-sheet{inset:0 auto var(--jnfoot,90px) 0;width:var(--jnside);align-items:stretch;justify-content:flex-start;background:transparent;animation:none}
html.jn-pollside .jn-sheet.withlab .jn-sheetin,html.jn-pollside .jn-sheet .jn-sheetin{width:100%;max-width:none;height:100%;max-height:none;margin:0;box-sizing:border-box;border-radius:0;border-right:3px solid #161514;box-shadow:4px 0 0 rgba(22,21,20,.25);animation:jnSide .25s ease}
html.jn-pollside .jn-labv.big{left:var(--jnside)}
html.jn-pollside .jn-labv.big .jn-bigtxt{display:none!important}
html.jn-pollside .jn-fold,html.jn-pollside .jn-unfold{display:none!important}
html.jn-pollside .jn-sheetin .jn-copts{grid-template-columns:1fr;gap:8px}
html.jn-pollside .jn-sheetin .jn-copts button{min-height:52px!important;display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:12px!important;padding:10px 14px!important;text-align:left!important;font-size:15px!important;line-height:1.3!important}
html.jn-pollside .jn-sheetin .jn-copts button i{flex:none;font-size:20px!important;margin:0!important}
html.jn-pollside .jn-toast{left:calc(var(--jnside) + (100vw - var(--jnside)) / 2)}
@keyframes jnSide{from{transform:translateX(-24px);opacity:0}to{transform:none;opacity:1}}

.jn-bigtxt .mr-calc{display:inline-block;padding:1px 7px;border-radius:999px;background:#fff3c4;font-size:11px;font-weight:650}
.jn-bigtxt .mr-work{display:block;margin-top:4px;padding:4px 7px;border-radius:8px;background:#fff3c4}

.jn-bigtxt .mr-apa{padding:6px 8px;border:1.5px dashed #2f62d9;border-radius:9px;background:#fff}.jn-bigtxt .mr-where-note{padding:5px 8px;border-radius:8px;background:#fff1bf}
.mr-fig{margin:8px 0;padding:6px;border:1.5px solid #161514;border-radius:10px;background:#fffdf8}.mr-fig img{display:block;width:100%;height:auto}.mr-fig p{margin:4px 0 0;font-size:12px;line-height:1.35;color:#3d3832}

/* 8 Nov (43) */ .jn-labv.big .jn-bigtxt{display:none!important}

/* 8 Nov (45) */
.g-mtools{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:0 0 14px}
.g-sortsel{display:inline-flex;align-items:center;gap:8px;font-weight:650;font-size:14px;color:var(--n-ink,#161514)}
.g-sortsel select,.g-bset select{height:36px;padding:0 30px 0 12px;border:1.5px solid #161514;border-radius:12px;background:#fffdf8;color:#161514;font:inherit;font-weight:600;cursor:pointer}
.g-mcount{margin-right:auto;font-size:13.5px;color:var(--n-mute,#5a534b)}
.g-sel .g-card{position:relative;cursor:pointer;transition:transform .12s,box-shadow .12s}
.g-sel .g-card:hover{transform:translateY(-2px)}
.g-sel .g-card-foot{opacity:.4;pointer-events:none}
.g-sel .g-card[aria-checked="true"]{outline:3px solid #2f62d9;outline-offset:3px;box-shadow:5px 5px 0 #161514}
.g-cover .g-tick{position:absolute!important;left:10px!important;bottom:10px!important;top:auto!important;right:auto!important;z-index:3;display:grid!important;place-items:center;width:30px!important;height:30px!important;margin:0!important;padding:0!important;border:2px solid #161514!important;border-radius:9px!important;background:#fffdf8!important;box-shadow:2px 2px 0 #161514!important;transform:none!important}
.g-tick svg{opacity:0}
.g-card[aria-checked="true"] .g-cover .g-tick{background:#2f62d9!important}
.g-card[aria-checked="true"] .g-tick svg{opacity:1}
.g-wrap.g-selon{padding-bottom:150px}
.g-bulk{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:60;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;width:max-content;max-width:calc(100vw - 32px);padding:10px 14px;border:2px solid #161514;border-radius:18px;background:#fbf8f1;box-shadow:5px 5px 0 #161514;color:#161514;font-size:14px}
.g-bulk .g-bn{min-width:150px;font-weight:750}
.g-bulk .g-bsep{width:1px;height:26px;background:rgba(22,21,20,.2)}
.g-bset{display:inline-flex;align-items:center;gap:6px;font-weight:650}
.g-bulk button:disabled,.g-bulk select:disabled{opacity:.45;cursor:not-allowed}
.g-bulk .g-btn.primary{background:#2f62d9!important;color:#fff!important}
.g-bulk .g-btn svg{width:16px;height:16px}

/* 8 Nov (46) */
@media (min-width:700px){
  .jn-class:has(.jn-paperv:not([hidden])) .jn-head{max-width:min(1500px,calc(100vw - 40px))!important}
  .jn-class .jn-cls:has(> .jn-paperv:not([hidden])){display:grid;max-width:min(1500px,calc(100vw - 40px))!important;grid-template-columns:minmax(270px,38%) minmax(0,1fr);grid-auto-rows:min-content;column-gap:18px;row-gap:12px;align-items:start}
  .jn-cls:has(> .jn-paperv:not([hidden])) > *{grid-column:1/-1}
  .jn-cls:has(> .jn-paperv:not([hidden])) > .jn-mtitle{grid-row:1}
  .jn-cls:has(> .jn-paperv:not([hidden])) > .jn-mirror{grid-column:1;grid-row:2;position:sticky;top:12px;max-height:calc(100vh - var(--jnfoot,140px) - 24px);overflow:auto}
  .jn-cls:has(> .jn-paperv:not([hidden])) > .jn-paperv{grid-column:2;grid-row:2}
}

/* 8 Nov (47) */ .jn-ink{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:30}

/* 8 Nov (48) */
.jn-repon .jn-head,.jn-class.jn-repon .jn-cls{max-width:none!important}
.jn-class.jn-repon .jn-cls{display:flex!important;padding-left:12px;padding-right:12px}
.jn-repon .jn-mirror,.jn-repon .jn-paperv{display:none!important}
.jn-rep{display:flex;justify-content:center;width:100%;align-self:stretch;box-sizing:border-box}.jn-rep[hidden]{display:none}
.jn-repbox{position:relative;overflow:hidden;margin:0 auto;flex:none;border-radius:16px;background:#efe9dd;box-shadow:0 0 0 1.5px rgba(22,21,20,.14)}
.jn-repfr{position:absolute;left:0;top:0;border:0;transform-origin:0 0;pointer-events:none;background:transparent}
.jn-repink{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

/* 8 Nov (49) */ .jn-repin{position:absolute;inset:0;transition:transform .12s ease-out}

/* 8 Nov (50) */
html.jn-pollside{--jnside:clamp(280px,32vw,440px)}
html.jn-pollside .jn-class{padding-left:var(--jnside);box-sizing:border-box}
html.jn-pollside .jn-sheet{z-index:55}
html.jn-pollside .jn-sheetin{overflow:auto}
html.jn-pollside .jn-sheetin .jn-paper{display:none!important}
html.jn-pollside .jn-pulse{padding-left:calc(var(--jnside) + 10px)}

/* 8 Nov (51) */ .jn-tapfx{position:fixed;width:36px;height:36px;margin:-18px 0 0 -18px;border-radius:50%;border:3px solid #2f62d9;background:rgba(47,98,217,.18);pointer-events:none;z-index:80;animation:jnTapFx .45s ease-out forwards}@keyframes jnTapFx{from{transform:scale(.35);opacity:1}to{transform:scale(1.35);opacity:0}}

/* ---------- Crossword style (v212): the board, the spinning highlight and the question next to its word */
.p-playing .p-board.p-cw{display:flex!important;flex-direction:column;gap:10px;grid-template-columns:none!important;grid-template-rows:none!important}
.p-cwbar{flex:0 0 auto;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
.p-cwturn{display:inline-flex;align-items:center;padding:7px 16px;border:2px solid #161514;border-radius:999px;background:var(--tc,#ffd23f);color:var(--tfg,#161514);font-weight:800;font-size:17px;box-shadow:3px 3px 0 #161514}
.p-cwspin{display:inline-flex;align-items:center;gap:8px;padding:9px 20px;border:2px solid #161514;border-radius:999px;background:#2f62d9;color:#fff;font:800 16px/1 Inter,system-ui,sans-serif;cursor:pointer;box-shadow:3px 3px 0 #161514}
.p-cwspin:disabled{opacity:.45;cursor:default}
.p-cwbar small{font-weight:700;opacity:.75;font-size:14px}
.p-dark .p-cwbar small{color:#fffdf8}
.p-cw-stage{flex:1 1 auto;min-height:0;display:grid;place-items:center;overflow:hidden}
.p-cw-wrap{position:relative;width:calc(var(--cs,40px) * var(--cols) + 2px);height:calc(var(--cs,40px) * var(--rows) + 2px)}
.cw-cell{position:absolute;left:calc(var(--cs) * var(--c));top:calc(var(--cs) * var(--r));width:calc(var(--cs) + 2px);height:calc(var(--cs) + 2px);background:#fffdf8;border:2px solid #161514;box-sizing:border-box;transition:background .15s}
.cw-cell small{position:absolute;left:3px;top:2px;font-size:max(9px,calc(var(--cs) * .25));font-weight:700;line-height:1;color:#161514;pointer-events:none;z-index:1}
.cw-cell input{position:absolute;inset:0;width:100%;height:100%;border:0;margin:0;padding:calc(var(--cs) * .12) 0 0;background:transparent;text-align:center;font:800 calc(var(--cs) * .55)/1 Inter,system-ui,sans-serif;color:#161514;text-transform:uppercase;caret-color:transparent;outline:none;cursor:default;border-radius:0}
.cw-cell.solved{background:color-mix(in srgb,var(--by,#1f8a5a) 28%,#fffdf8)}
.cw-cell.rev{background:#e9e3d6}
.cw-cell.rev input{color:#7d776b}
.cw-cell.hl{background:#ffd23f}
.cw-cell.hit{background:#ffd23f;animation:cwHit .5s ease 2}
.cw-cell.act{background:var(--tc)}
.cw-cell.act input{color:var(--tfg);cursor:text}
.cw-cell.act small{color:var(--tfg)}
.cw-cell.act input:focus{background:rgba(255,253,248,.3);box-shadow:inset 0 0 0 3px #161514}
.cw-cell.bad{background:#d8383b!important;animation:cwShake .35s ease}
.cw-cell.bad input,.cw-cell.bad small{color:#fff!important}
.cw-cell.pop{animation:cwPop .5s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(var(--j,0) * 60ms)}
@keyframes cwHit{50%{background:#fffdf8}}
@keyframes cwShake{25%{translate:-4px 0}75%{translate:4px 0}}
@keyframes cwPop{from{scale:.55}to{scale:1}}
.p-q.p-cwq{position:fixed!important;inset:0!important;display:block!important;padding:0!important;background:none!important;backdrop-filter:none!important;pointer-events:none;border-radius:0!important;z-index:40}
.p-q.p-cwq .p-q-box{position:absolute!important;margin:0!important;width:min(440px,calc(100vw - 24px))!important;max-width:none!important;max-height:calc(100vh - 110px);overflow:auto;pointer-events:auto}
.p-cwq .p-q-main .p-q-text{font-size:clamp(19px,2vw,26px)!important;line-height:1.3}
.p-cwq .p-q-img{max-height:180px}
.p-cwclue{display:table;margin:0 auto 8px;padding:3px 12px;border-radius:999px;border:2px solid #161514;background:#ffd23f;color:#161514;font-weight:800;font-size:13px;letter-spacing:.3px}
.p-opt.off,.p-opt:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.6)}
.p-style-note{margin:10px 2px 0}
.p-q.p-cwq .p-q-box{padding:18px 20px!important;gap:10px!important}

/* ---------- More game styles (v213): style picker, anagram, Ball Drop, Memory, Four in a Row, XO Duel, Word Wheel, Hangman */
.p-style-note{white-space:pre-line}
.p-styles .p-opt{min-height:0}
.p-styles .p-opt small{font-size:12px}
.p-grid.wide .p-opt.num b{font-size:24px}
/* anagram: drag the letters into the boxes */
.p-ana{display:grid;gap:14px;justify-items:center;margin:4px auto 2px;--sz:clamp(40px,min(9vw,calc(560px / var(--n))),66px)}
.p-ana.words{--sz:auto}
.p-ana-slots,.p-ana-pool{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.p-ana-slot{width:var(--sz);height:var(--sz);min-width:40px;min-height:44px;border:2.5px dashed rgba(22,21,20,.45);border-radius:14px;display:grid;place-items:center;background:rgba(255,253,248,.7);transition:background .15s,transform .15s}
.p-ana.words .p-ana-slot{width:auto;min-width:90px;height:52px;padding:0 4px}
.p-ana-slot.over{background:#ffd23f;transform:scale(1.08)}
.p-ana-slot.full{border-style:solid;border-color:transparent;background:none}
.p-ana-slot.rev{border:2.5px solid #161514;background:#e9e3d6;font:900 calc(var(--sz) * .5)/1 Inter,system-ui,sans-serif;text-transform:uppercase;color:#4a453e}
.p-ana.words .p-ana-slot.rev{font-size:20px;text-transform:none;padding:0 12px}
.p-ana-home{width:var(--sz);height:var(--sz);min-width:40px;min-height:44px;display:grid;place-items:center}
.p-ana.words .p-ana-home{width:auto;min-width:0;height:52px}
.p-ana-chip{width:var(--sz);height:var(--sz);min-width:40px;min-height:44px;border:2.5px solid #161514;border-radius:14px;background:#2f62d9;color:#fff;font:900 calc(var(--sz) * .5)/1 Inter,system-ui,sans-serif;text-transform:uppercase;box-shadow:3px 3px 0 #161514;cursor:grab;touch-action:none;user-select:none;animation:pTileIn .45s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(var(--i) * 50ms)}
.p-ana-chip:nth-child(1){}
.p-ana-pool .p-ana-home:nth-child(3n+2) .p-ana-chip{background:#d8383b}
.p-ana-pool .p-ana-home:nth-child(3n) .p-ana-chip{background:#1f8a5a}
.p-ana.words .p-ana-chip{width:auto;min-width:70px;height:52px;padding:0 14px;font-size:20px;text-transform:none}
.p-ana-chip.lift{opacity:.25}
.p-ana-chip.ghost{box-shadow:6px 8px 0 rgba(22,21,20,.6);cursor:grabbing;animation:none}
.p-ana-slots .p-ana-chip{animation:cwPop .3s cubic-bezier(.3,1.5,.5,1) both;background:#2b2a28}
.p-ana.good .p-ana-slots .p-ana-chip{background:#1f8a5a}
.p-ana.bad .p-ana-slots .p-ana-chip{background:#d8383b;animation:cwShake .35s ease}
.p-ana-hint{margin:0;font-size:13px;font-weight:700;opacity:.7}
.p-ana.good .p-ana-hint,.p-ana.bad .p-ana-hint{visibility:hidden}

/* shared bar for the new styles */
.p-playing .p-board.p-arc{display:flex!important;flex-direction:column;gap:10px;grid-template-columns:none!important;grid-template-rows:none!important;position:relative}
.a-bar{flex:0 0 auto;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;min-height:46px}
.a-msg{font-weight:800;font-size:17px}
.p-dark .a-msg,.p-dark .a-info{color:#fffdf8}
.a-act{display:inline-flex;gap:8px}
.a-act:empty{display:none}
.a-info{display:inline-flex;align-items:center;gap:8px;font-weight:700;opacity:.8;font-size:14px}
.p-cwspin.ghost{background:#fffdf8;color:#161514}
.p-cwspin .tt-ic{flex:0 0 auto}
.a-stage{flex:1 1 auto;min-height:0;position:relative}
.a-float{position:absolute;transform:translate(-50%,-50%);font:900 26px/1 Inter,system-ui,sans-serif;padding:4px 10px;border:2px solid #161514;border-radius:999px;pointer-events:none;animation:aFloat 1.4s ease-out forwards;z-index:5}
.a-float.up{background:#36d07a;color:#161514}
.a-float.down{background:#ef4444;color:#fff}
@keyframes aFloat{0%{opacity:0;translate:0 10px;scale:.6}15%{opacity:1;scale:1.1}100%{opacity:0;translate:0 -60px;scale:1}}
.a-clue{padding:14px 16px;border:2.5px solid #161514;border-radius:18px;background:#fffdf8;box-shadow:4px 4px 0 #161514;color:#161514;text-align:center}
.a-clue .p-q-text{font-size:clamp(18px,1.8vw,26px)!important;line-height:1.3;font-weight:800}
.a-clue .p-q-img{max-height:min(200px,24vh);max-width:100%;border-radius:12px}

/* Ball Drop */
.bd-stage{display:grid;place-items:center}
.bd-svg{width:100%;height:100%;display:block;touch-action:none}
.bd-svg .bd-slot{cursor:default}
.bd-svg.aiming .bd-slot{cursor:pointer}
.bd-svg.aiming .bd-slot rect{animation:bdPulse 1s ease-in-out infinite}
.bd-svg.aiming .bd-slot:hover rect{filter:brightness(1.15)}
@keyframes bdPulse{50%{opacity:.75}}
.bd-peg.blast{animation:bdBlast .45s ease-out forwards;transform-box:fill-box;transform-origin:center}
@keyframes bdBlast{to{opacity:0;transform:scale(2.4)}}
.bd-bucket.hit rect{animation:bdHit .7s ease 2}
@keyframes bdHit{50%{fill:#fffdf8}}
.bd-pick{position:absolute;inset:0;margin:auto;width:min(760px,96%);height:max-content;max-height:96%;overflow:auto;display:grid;gap:14px;padding:22px;border:3px solid #161514;border-radius:24px;background:#fffdf8;box-shadow:6px 6px 0 #161514;color:#161514;z-index:3}
.bd-pick h3{margin:0;text-align:center;font-size:26px;font-weight:900}
.bd-pick .rows{display:grid;gap:10px}
.bd-prow{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.bd-prow .p-cwturn{min-width:110px;justify-content:center}
.bd-prow .opts{display:flex;gap:6px;flex-wrap:wrap}
.bd-ball{width:50px;height:50px;padding:3px;border:2.5px solid transparent;border-radius:50%;background:none;cursor:pointer;transition:transform .15s}
.bd-ball svg{width:100%;height:100%;display:block}
.bd-ball:hover{transform:scale(1.1)}
.bd-ball[aria-pressed="true"]{border-color:#161514;background:#ffd23f;transform:scale(1.12)}
.bd-pick .p-start{justify-self:center}
.bd-special{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border:2px solid #161514;border-radius:999px;background:#ffd23f;color:#161514;font-weight:800}

/* Memory */
.m-grid{display:grid;align-content:center;justify-content:center;perspective:1200px}
.m-card{position:relative;height:var(--ch,120px);min-height:0;padding:0;border:0;background:none;cursor:pointer;animation:pTileIn .45s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(var(--i) * 30ms)}
.m-in{position:absolute;inset:0;transition:transform .5s cubic-bezier(.3,1.3,.5,1);transform-style:preserve-3d}
.m-card.open .m-in{transform:rotateY(180deg)}
.m-back,.m-face{position:absolute;inset:0;border:3px solid #161514;border-radius:18px;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:4px 4px 0 #161514;overflow:hidden}
.m-back{display:grid;place-items:center;background:var(--bg);color:#fff;background-image:radial-gradient(rgba(255,255,255,.18) 2px,transparent 2.5px);background-size:16px 16px}
.m-back b{font:900 clamp(22px,calc(var(--ch,120px) * .36),64px)/1 Inter,system-ui,sans-serif;text-shadow:3px 3px 0 #161514;-webkit-text-stroke:1.5px #161514}
.m-card:hover:not(:disabled) .m-back{filter:brightness(1.08)}
.m-face{transform:rotateY(180deg);background:#fffdf8;color:#161514;display:grid;place-items:center;padding:8px;text-align:center}
.m-face .p-q-text{font-size:clamp(12px,calc(var(--ch,120px) * .12),20px)!important;line-height:1.2;font-weight:750;margin:0}
.m-face.sm .p-q-text{font-size:clamp(11px,calc(var(--ch,120px) * .1),17px)!important}
.m-face.xs .p-q-text{font-size:clamp(10px,calc(var(--ch,120px) * .085),15px)!important}
.m-face .p-q-img{max-height:calc(var(--ch,120px) * .6);max-width:100%;border-radius:8px}
.m-face.fq{background:#eaf1ff}
.m-face.fa{background:#fff6d8}
.m-ans{font-weight:900;font-size:clamp(15px,calc(var(--ch,120px) * .2),34px);line-height:1.1;word-break:break-word}
.m-face.sm .m-ans{font-size:clamp(12px,calc(var(--ch,120px) * .13),22px)}
.m-face.pw{background:#f3e8ff;align-content:center;gap:4px}
.m-face.pw .m-art{width:min(70%,calc(var(--ch,120px) * .6));aspect-ratio:1}
.m-face.pw .m-art svg{width:100%;height:100%}
.m-face.pw b{font-size:14px;font-weight:900}
.m-card.won{cursor:default}
.m-card.won .m-in{transform:rotateY(180deg)}
.m-card.won .m-face{border-color:var(--by,#1f8a5a);box-shadow:inset 0 0 0 4px var(--by,#1f8a5a),4px 4px 0 #161514;opacity:.92}
.m-card.used{cursor:default;opacity:.35}
.m-card.nope .m-face{background:#ffd6d6;animation:cwShake .35s ease}

/* Four in a Row */
.f4-stage{display:grid;place-items:center}
.f4-box{--cs:56px;display:grid;gap:6px;justify-items:center}
.f4-heads{display:grid;grid-template-columns:repeat(var(--cols),var(--cs));gap:0}
.f4-head{height:calc(var(--cs) * .9);border:0;background:none;font:900 calc(var(--cs) * .5)/1 Inter,system-ui,sans-serif;color:#2f62d9;-webkit-text-stroke:1.5px #161514;cursor:default;display:grid;place-items:center}
.p-dark .f4-head{color:#fffdf8}
.f4-heads.on .f4-head:not(:disabled){cursor:pointer}
.f4-heads.on .f4-head:not(:disabled) span{display:grid;place-items:center;width:calc(var(--cs) * .82);height:calc(var(--cs) * .82);border:3px solid #161514;border-radius:50%;background:var(--dc);color:var(--dfg);-webkit-text-stroke:0;box-shadow:3px 3px 0 #161514;transition:transform .15s}
.f4-heads.on .f4-head:not(:disabled):hover span,.f4-heads.on .f4-head.hover:not(:disabled) span{transform:translateY(4px) scale(1.08)}
.f4-head:disabled{opacity:.45}
.f4-board{display:grid;grid-template-columns:repeat(var(--cols),var(--cs));grid-template-rows:repeat(var(--rows),var(--cs));padding:6px;border:4px solid #161514;border-radius:16px;background:#1d4ed8;box-shadow:6px 6px 0 #161514}
.f4-hole{position:relative;display:grid;place-items:center}
.f4-hole::before{content:"";width:80%;height:80%;border-radius:50%;background:#fffdf8;border:3px solid #161514;box-sizing:border-box;box-shadow:inset 3px 4px 0 rgba(22,21,20,.18)}
.f4-disc{position:absolute;width:80%;height:80%;border-radius:50%;background:var(--dc);border:3px solid #161514;box-sizing:border-box;box-shadow:inset -4px -5px 0 rgba(22,21,20,.22),inset 4px 4px 0 rgba(255,255,255,.3)}
.f4-disc.fall{animation:f4Fall calc(.38s + var(--fall) * 45ms) cubic-bezier(.5,0,1,1) both,f4Bounce .3s ease-out calc(.38s + var(--fall) * 45ms)}
@keyframes f4Fall{from{transform:translateY(calc(var(--cs) * var(--fall) * -1))}to{transform:translateY(0)}}
@keyframes f4Bounce{40%{transform:translateY(-12%)}}
.f4-hole.win .f4-disc{animation:f4Win .6s ease-in-out infinite alternate;box-shadow:0 0 0 4px #ffd23f,inset -4px -5px 0 rgba(22,21,20,.22)}
@keyframes f4Win{to{transform:scale(1.12)}}

/* XO Duel */
.xo-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}
.xo-score{display:flex;align-items:center;gap:18px}
.xo-side{display:flex;align-items:center;gap:10px;padding:6px 16px;border:3px solid transparent;border-radius:999px;background:#fffdf8;color:#161514;font-size:20px;font-weight:900;box-shadow:3px 3px 0 rgba(22,21,20,.4)}
.xo-side.on{border-color:var(--tc);box-shadow:0 0 0 3px var(--tc),3px 3px 0 #161514}
.xo-mini{width:40px;height:40px;display:block}
.xo-mini svg{width:100%;height:100%}
.xo-mid{display:grid;justify-items:center;line-height:1;color:#161514}
.p-dark .xo-mid{color:#fffdf8}
.xo-mid small{font-weight:900;text-transform:uppercase;letter-spacing:.1em;font-size:12px}
.xo-mid strong{font-size:38px;font-weight:900}
.xo-board{--xs:420px;width:var(--xs);height:var(--xs);display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr)}
.xo-cell{position:relative;border:0;background:none;padding:0;display:grid;place-items:center;cursor:default}
.xo-cell:nth-child(-n+6){border-bottom:4px solid rgba(22,21,20,.3)}
.xo-cell:not(:nth-child(3n)){border-right:4px solid rgba(22,21,20,.3)}
.p-dark .xo-cell:nth-child(-n+6){border-bottom-color:rgba(255,253,248,.4)}
.p-dark .xo-cell:not(:nth-child(3n)){border-right-color:rgba(255,253,248,.4)}
.xo-cell .n{font:900 calc(var(--xs) * .17)/1 Inter,system-ui,sans-serif;color:#fffdf8;-webkit-text-stroke:3px var(--nc,#2f62d9);paint-order:stroke fill;text-shadow:4px 4px 0 var(--nc,#2f62d9);transition:transform .15s}
.xo-cell:not(:disabled){cursor:pointer}
.xo-cell:not(:disabled):hover .n{transform:scale(1.12)}
.xo-cell:disabled:not(.full) .n{opacity:.55}
.xo-cell.full .n{display:none}
.xo-pc{width:82%;height:82%;filter:drop-shadow(0 8px 6px rgba(22,21,20,.25))}
.xo-cell.pop .xo-pc{animation:xoPop .55s cubic-bezier(.3,1.6,.5,1) both}
@keyframes xoPop{0%{transform:scale(.2) rotate(-25deg);opacity:0}100%{transform:none;opacity:1}}
.xo-cell.old .xo-pc{opacity:.45;animation:xoOld 1s ease-in-out infinite alternate}
@keyframes xoOld{to{opacity:.2}}
.xo-cell.win{background:rgba(255,210,63,.45);border-radius:18px}
.xo-cell.win .xo-pc{animation:f4Win .55s ease-in-out infinite alternate}

/* Word Wheel */
.ww-stage{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:22px;align-items:center;overflow:auto}
.ww-left{display:grid;gap:14px;align-content:center;justify-items:center;min-width:0}
.ww-left .a-clue{width:100%;max-width:560px}
.ww-right{display:grid;justify-items:center;min-width:0}
.ww{display:grid;gap:10px;justify-items:center;width:100%}
.ww-ring{width:min(100%,46vh,400px);aspect-ratio:1}
.ww-svg{width:100%;height:100%;touch-action:none;user-select:none;cursor:pointer}
.ww-svg .ww-node circle{transition:fill .12s}
.ww-svg .ww-node.on circle{stroke-width:4}
.ww-svg text{pointer-events:none;font-family:Inter,system-ui,sans-serif}
.ww-line{opacity:.85;pointer-events:none}
.ww-word{min-height:46px;display:flex;gap:4px;flex-wrap:wrap;justify-content:center}
.ww-word span{display:grid;place-items:center;width:40px;height:44px;border:2.5px solid #161514;border-radius:10px;background:var(--wc,#2f62d9);color:var(--wfg,#fff);font:900 24px/1 Inter,system-ui,sans-serif;animation:cwPop .25s cubic-bezier(.3,1.5,.5,1) both}
.ww-btns{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.ww.locked .ww-svg{opacity:.55;cursor:default}
.ww-slots,.ww-trow{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}
.ww-slots i,.ww-trow i{display:grid;place-items:center;width:clamp(34px,4.4vw,52px);height:clamp(38px,4.8vw,56px);border:2.5px solid #161514;border-radius:10px;background:#fffdf8;color:#161514;font:900 clamp(20px,2.4vw,30px)/1 Inter,system-ui,sans-serif;font-style:normal;box-shadow:3px 3px 0 #161514}
.ww-slots.good i{background:var(--by,#1f8a5a);color:#fff;animation:cwPop .4s cubic-bezier(.3,1.5,.5,1) both}
.ww-slots.bad i{background:#d8383b;color:#fff;animation:cwShake .35s ease}
.ww-slots.rev i{background:#e9e3d6;color:#5d574e}
.ww-h{margin:0;font-size:clamp(20px,2.2vw,30px);font-weight:900;text-align:center}
.p-dark .ww-h,.p-dark .ww-hint{color:#fffdf8}
.ww-hint{margin:0;font-weight:700;opacity:.8}
.ww-targets{display:grid;gap:8px;justify-items:center}
.ww-trow i{width:clamp(28px,3.2vw,40px);height:clamp(30px,3.4vw,42px);font-size:clamp(16px,1.8vw,22px);box-shadow:2px 2px 0 #161514}
.ww-trow.got i{background:var(--by,#1f8a5a);color:#fff}
.ww-trow.pop i{animation:cwPop .4s cubic-bezier(.3,1.5,.5,1) both}
.ww-bonus{display:grid;gap:6px;justify-items:center}
.ww-bonus small{font-weight:800;text-transform:uppercase;letter-spacing:.08em;opacity:.7}
.ww-bonus .chips{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.ww-bonus .chips span{padding:4px 10px;border:2px solid #161514;border-radius:999px;background:var(--by,#2f62d9);color:#fff;font-weight:900}
.ww-judge{display:grid;gap:8px;justify-items:center;padding:12px 16px;border:3px solid #161514;border-radius:18px;background:#ffd23f;color:#161514;box-shadow:4px 4px 0 #161514;animation:cwPop .3s ease both}
.ww-judge p{margin:0;font-size:18px;font-weight:800}
.ww-judge div{display:flex;gap:8px}
.ww-judge button{min-height:44px;padding:0 18px;border:2px solid #161514;border-radius:12px;color:#fff;font-weight:800;font-size:16px;cursor:pointer}
.ww-cluebtn{min-height:38px;padding:0 14px;border:2px solid #161514!important;border-radius:999px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;gap:6px}

/* Hangman */
.hm-stage{display:grid;grid-template-columns:minmax(200px,.8fr) minmax(0,1.4fr);gap:22px;align-items:center;overflow:auto}
.hm-draw{display:grid;place-items:center;height:100%;min-height:0}
.hm-svg{width:100%;max-width:340px;max-height:100%;padding:10px;border:3px solid #161514;border-radius:22px;background:#eaf6ff;box-shadow:5px 5px 0 #161514;box-sizing:border-box}
.hm-part.new{animation:cwPop .45s cubic-bezier(.3,1.5,.5,1) both;transform-box:fill-box;transform-origin:center}
.hm-draw.lost .hm-face{display:none}
.hm-draw.lost .hm-svg{background:#ffe1e1}
.hm-right{display:grid;gap:16px;justify-items:center;min-width:0}
.hm-right .a-clue{width:100%;max-width:640px}
.hm-word{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.hm-word b{display:grid;place-items:end center;width:clamp(30px,3.6vw,46px);height:clamp(40px,4.6vw,56px);border-bottom:5px solid #161514;font:900 clamp(24px,3vw,38px)/1 Inter,system-ui,sans-serif;color:#161514;padding-bottom:4px;animation:cwPop .3s ease both}
.p-dark .hm-word b{color:#fffdf8;border-color:#fffdf8}
.hm-word b:empty{animation:none}
.hm-word b.miss{color:#d8383b}
.hm-word.won b{color:#1f8a5a}
.hm-word .gap{width:22px}
.hm-word .pun{display:grid;place-items:end center;font:900 clamp(24px,3vw,38px)/1 Inter,system-ui,sans-serif;padding-bottom:6px}
.hm-keys{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:6px;width:min(100%,620px)}
.hm-key{aspect-ratio:1/1.05;border:2.5px solid #161514;border-radius:12px;background:#b07a45;color:#fff;font:900 clamp(16px,1.8vw,24px)/1 Inter,system-ui,sans-serif;box-shadow:3px 3px 0 #161514;cursor:pointer;transition:transform .1s}
.hm-key:hover:not(:disabled){transform:translateY(-2px)}
.hm-key:disabled{cursor:default;box-shadow:none;transform:translate(2px,2px)}
.hm-key.hit{background:#1f8a5a}
.hm-key.miss{background:#cfc8bc;color:#7d776b}
.hm-key:disabled:not(.hit):not(.miss){opacity:.6}
.hm-solve{min-height:46px}
.hm-form{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.hm-form input{min-height:46px;padding:0 14px;border:2.5px solid #161514;border-radius:12px;font:800 18px Inter,system-ui,sans-serif;min-width:220px}
.hm-form button{min-height:46px;padding:0 18px;border-radius:12px;font-weight:800;cursor:pointer}
@media (max-width:760px){.ww-stage,.hm-stage{grid-template-columns:1fr}.hm-draw{max-height:30vh}.xo-score{gap:8px}.xo-side{font-size:15px;padding:4px 10px}}
/* v213: calm, grown-up look for the new styles */
.m-back{background-image:none!important}
.m-back b{text-shadow:none!important;-webkit-text-stroke:0!important;opacity:.95}
.xo-cell .n{color:var(--nc,#2f62d9)!important;-webkit-text-stroke:0!important;text-shadow:none!important;opacity:.55;font-weight:800}
.xo-cell:not(:disabled) .n{opacity:1}
.xo-pc{filter:none}
.hm-svg{background:#f6f3ec}
.hm-draw.lost .hm-svg{background:#fbe9e7}
.hm-key{background:#2b2a28}
.f4-head{-webkit-text-stroke:0!important;color:#2b2a28}
.m-ans{word-break:normal;overflow-wrap:break-word;hyphens:auto;font-size:min(calc(var(--ch,120px) * .2),calc(var(--cw,120px) * .135),34px)!important}
.m-face.sm .m-ans{font-size:min(calc(var(--ch,120px) * .13),calc(var(--cw,120px) * .1),22px)!important}
.p-ana-chip.lift{opacity:.25!important;animation:none!important}