.setting{display:block;margin-top:11px;font-size:11px;font-weight:950;letter-spacing:.08em}.setting input,.setting select{display:block;width:100%;border:2px solid var(--ink);border-radius:9px;background:#fff;padding:9px;margin-top:4px;font:inherit}.setting[hidden]{display:none}.settings-row{display:flex;align-items:end;gap:8px;margin:13px 0}.settings-row label{flex:1;font-size:10px;font-weight:950}.settings-row label:first-child{display:flex;align-items:center;gap:4px}.settings-row select{display:block;width:100%;border:2px solid var(--ink);border-radius:7px;padding:6px;background:white}.secondary,.reroll-row button{border:2px solid var(--ink);background:white;border-radius:8px;padding:9px;font-weight:950}.mode-card>.secondary{display:block;width:100%;margin-top:12px}.reroll-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.reroll-row button{font-size:11px;background:#fff0c8;box-shadow:2px 2px var(--ink)}.reroll-row button:last-child{background:#e8e1ff}.reroll-row button:disabled{opacity:.45;box-shadow:none}#toast{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);z-index:20;background:var(--ink);color:white;padding:10px 17px;border-radius:10px;max-width:90vw;text-align:center}#toast[hidden]{display:none}.center-panel{max-width:900px;margin:0 auto}.small-hero{font-size:clamp(2rem,6vw,3.4rem)!important}.waiting-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;text-align:left;margin-top:18px}.waiting-grid h2,#opponent-result h2{font-size:14px;letter-spacing:.08em}#waiting-status{margin-top:15px}.reveal-card{min-height:470px;display:grid;place-content:center;gap:12px}.reveal-card h1{font-size:clamp(2rem,7vw,5rem);overflow-wrap:anywhere}.reveal-card #reveal-versus{font-weight:900;font-size:20px}.back{border:0;background:none;font-weight:950;padding:7px}.link-button{background:none;border:none;text-decoration:underline;margin-top:17px;cursor:pointer}#opponent-result{border-top:3px solid var(--ink);margin-top:22px;text-align:left;padding-top:16px}#opponent-slots{display:grid;grid-template-columns:1fr 1fr;gap:0 15px}.history-row{display:flex;justify-content:space-between;gap:8px;text-align:left;padding:12px;border-bottom:1px solid #aaa;text-decoration:none;color:inherit}.history-row small{font-size:11px}.result-card .fine-print{max-width:620px;margin:12px auto}.final-row span{min-width:0;overflow-wrap:anywhere}
@media(max-width:740px){.settings-row{flex-wrap:wrap}.settings-row label:first-child{flex:0 0 100%}.hero h1{font-size:clamp(2.4rem,11vw,3.3rem)}.hero{padding:3px}.hero p:last-child{font-size:12px}.mode-card{box-shadow:3px 4px var(--ink)}.mode-grid{gap:6px}.mode{min-height:64px}.draft-head{margin-bottom:6px}.reroll-row{margin-top:7px;gap:5px}.reroll-row button{padding:6px 2px;font-size:9px}.options{height:calc(100dvh - 358px);min-height:240px}.stats{gap:3px}.stats>span{padding:2px}.stats small{font-size:8px}.waiting-grid{grid-template-columns:1fr;gap:5px}.waiting-grid .final-row{padding:4px}.result-columns{margin-top:12px}.result-card h1{font-size:4.5rem}.result-card .small-hero{font-size:2rem}.result-buttons{flex-wrap:wrap}.result-buttons button{flex:1}.reveal-card{min-height:55vh}#opponent-slots{grid-template-columns:1fr}}

/* Shared mobile safe viewport for iPhone and embedded browsers. */
:root{--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--app-height:100dvh}
html{min-height:100%;background:var(--paper);scroll-padding-top:var(--safe-top)}
body{min-height:var(--app-height);padding-top:var(--safe-top);padding-right:var(--safe-right);padding-bottom:var(--safe-bottom);padding-left:var(--safe-left)}
#toast{bottom:calc(16px + var(--safe-bottom))}
@media(max-width:740px){
  header{height:57px}
  main{min-height:calc(var(--app-height) - 57px - var(--safe-top) - var(--safe-bottom));padding-bottom:calc(14px + var(--safe-bottom))}
  .setup{min-height:calc(var(--app-height) - 76px - var(--safe-top) - var(--safe-bottom))}
  .options{height:calc(var(--app-height) - 335px - var(--safe-top) - var(--safe-bottom));min-height:180px}
  .center-panel{padding-top:4px;padding-bottom:calc(10px + var(--safe-bottom))}
  .reveal-card{min-height:calc(var(--app-height) - 90px - var(--safe-top) - var(--safe-bottom))}
}