.phone{min-height:100vh;display:grid;grid-template-rows:auto auto auto 1fr auto;gap:.6rem;padding:.8rem;padding-bottom:max(.8rem,env(safe-area-inset-bottom))}.phone .me{display:flex;align-items:center;gap:.6rem;font-size:1.1rem}.phone .me .who{flex:1;font-weight:700}.phone .me .lvl{color:var(--ink-dim)}.mark{font-size:1.4rem}.score{text-align:center;font-size:1.6rem;font-weight:700;padding:.6rem;border-radius:.6rem;border:2px solid var(--line);font-variant-numeric:tabular-nums}.score.winning{border-color:var(--win)}.score.losing{border-color:var(--lose)}.err{background:var(--lose);color:#2a0d0d;border-radius:.5rem;padding:.6rem .8rem;font-weight:600}.screen{display:grid;align-content:center}.stack{display:grid;gap:.6rem}.idle{text-align:center;color:var(--ink-dim);font-size:1.2rem}.phone .big{font-size:1.4rem;min-height:5rem}.picked{border-color:var(--warm);background:var(--ground-2)}.hand{display:grid;grid-template-rows:auto minmax(0,1fr) auto;min-height:0;gap:var(--space-3)}.hand.browsing{grid-template-rows:auto auto minmax(0,1fr) auto}.hand .tabs{display:flex;gap:var(--space-2)}.hand .tabs button{flex:1;min-height:44px;padding:.5rem .6rem;background:var(--surface-sunken);box-shadow:none}.hand .tabs button.on{background:var(--spot-teal);color:var(--paper-bright);box-shadow:var(--shadow-block-sm)}.hand .cards{display:flex;flex-wrap:wrap;align-content:flex-start;gap:var(--space-3);overflow-y:auto;min-height:0;padding:var(--space-1) 0 var(--space-2)}.hand .cards .card{padding:0;border:none;background:none;box-shadow:none;width:auto;min-height:0}.hand .cards .card:active:not(:disabled){transform:none}.hand .who-picker{display:flex;gap:var(--space-2);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;padding-bottom:2px}.hand .who-picker::-webkit-scrollbar{display:none}.hand .who-picker button{width:auto;flex:0 0 auto;display:flex;align-items:center;gap:var(--space-2);min-height:44px;padding:.2rem .6rem .2rem .2rem;background:var(--surface-sunken);box-shadow:none}.hand .who-picker button.on{background:var(--spot-teal);color:var(--paper-bright);box-shadow:var(--shadow-block-sm)}.hand .who-picker .nm{font-family:var(--font-stencil);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:var(--tracking-stencil);max-width:7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hand .who-picker .lv{font-family:var(--font-display);font-size:var(--text-md);line-height:1}.card.dead{opacity:.35}.card.live{border-color:var(--warm-deep)}.phone.boot{grid-template-rows:none;grid-auto-rows:min-content;grid-template-columns:minmax(0,1fr);align-content:center;gap:1.2rem;max-width:34rem;margin-inline:auto;width:100%}.phone.boot h1{text-align:center;margin:0}.phone label{display:grid;gap:.3rem;color:var(--ink-dim);font-size:.95rem}.phone input{font:inherit;font-size:1.4rem;padding:.8rem;border-radius:.5rem;border:1px solid var(--line);background:var(--ground-2);color:var(--ink);text-align:center;letter-spacing:.2em}.offline{position:fixed;top:0;left:0;right:0;background:var(--warm-deep);color:#1a1206;text-align:center;padding:.3rem;font-size:.9rem;z-index:20}.chooser{gap:1rem}.as-button{display:block;text-align:center;text-decoration:none;font:inherit;color:inherit;background:var(--ground-3);border:1px solid var(--line);border-radius:.6rem;padding:1.1rem 1.2rem;min-height:3.4rem}.chooser .hint{text-align:center;line-height:1.5}.card-open{background:var(--ground-2);border:1px solid var(--warm-deep);border-radius:.6rem;padding:.8rem;margin-bottom:.6rem}.card-name{font-weight:700;font-size:1.15rem;margin-bottom:.4rem}.card-rules{margin:0 0 .5rem;padding-left:1.1rem;display:grid;gap:.2rem;font-size:.98rem;color:var(--ink)}.card-flavour{font-style:italic;color:var(--ink-faint);font-size:.92rem}.card-actions{display:grid;gap:var(--space-2);padding-top:var(--space-3);border-top:var(--border-heavy)}.card-actions button{min-height:52px}.card.open{border-color:var(--warm)}.rotate-me{display:none}@media(orientation:portrait){.rotate-me{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:grid;place-content:center;justify-items:center;gap:var(--space-4);padding:var(--space-6);text-align:center;background:var(--surface-plate);color:var(--paper-bright);background-image:var(--texture-grain)}.rotate-me .glyph{font-size:88px;line-height:1;color:var(--spot-amber);animation:nudge 2.4s var(--ease-stamp) infinite}.rotate-me .say{font-family:var(--font-display);font-size:var(--text-2xl);letter-spacing:var(--tracking-display)}.rotate-me .teach{width:auto;min-height:3rem;padding:0 var(--space-5);margin-top:var(--space-3);background:transparent;color:var(--paper-bright);border:2px solid var(--spot-amber);font-family:var(--font-stencil);font-size:var(--text-sm);letter-spacing:var(--tracking-stencil-wide)}.rotate-me .why{font-family:var(--font-stencil);font-size:var(--text-md);text-transform:uppercase;letter-spacing:var(--tracking-stencil-wide);color:var(--spot-amber)}}@keyframes nudge{0%,70%,to{transform:rotate(0)}80%,92%{transform:rotate(90deg)}}@media(orientation:landscape){.phone{display:grid;grid-template-rows:auto auto minmax(0,1fr);grid-template-columns:auto auto minmax(0,1fr) auto auto;column-gap:var(--space-3);row-gap:var(--space-2);height:100dvh;min-height:0;overflow:hidden;padding:var(--space-2) var(--space-3)}.phone>.hand{display:contents}.phone>.err{grid-row:1;grid-column:1 / -1}.phone>.me{grid-row:2;grid-column:1;padding:0;font-size:var(--text-sm)}.phone>.score{grid-row:2;grid-column:2;margin:0}.phone>.screen{grid-row:2;grid-column:3;min-width:0;overflow:hidden}.phone>.screen .stack{display:flex;flex-direction:row;align-items:center;gap:var(--space-2);overflow-x:auto}.phone>.screen .stack button{width:auto;flex:0 0 auto;min-height:46px}.phone .tabs{grid-row:2;grid-column:4;align-self:center}.phone .tabs button{min-height:40px;padding:.2rem .6rem;font-size:var(--text-xs)}.phone .card-actions{grid-row:2;grid-column:5;padding:0;border:none}.phone .card-actions button{min-height:46px;width:auto}.phone:has(.who-picker){grid-template-rows:auto auto auto minmax(0,1fr)}.phone .who-picker{grid-row:3;grid-column:1 / -1}.phone:has(.who-picker) .cards{grid-row:4}.phone .cards{grid-row:3;grid-column:1 / -1;flex-wrap:wrap;align-content:flex-start;overflow-y:auto;overflow-x:hidden;min-height:0}}