/* elephant.css — page layer for /white-elephant-generator/. The shell (header,
   form controls, buttons, explainer, footer) is /assets/polyatic.css; this file
   adds the warm stage with the turn-order tickets, the paper rules card and the
   full-screen room view, from the site's tokens plus a small paper palette that
   stays the same in both themes (the tickets and card are printed objects). */
@font-face{font-family:"WE Classic";font-style:normal;font-weight:400;font-display:swap;src:url(/starmap/fonts/classic.woff2) format("woff2")}
:root{--we-paper:#fbf5e9;--we-ink:#2b1d17;--we-ink-2:#5b4638;--we-red:#a8242c;--we-gilt:#b88a2e;
  --we-serif:"WE Classic",Georgia,"Times New Roman",serif}

.we-noscript{margin:1rem;padding:.875rem 1rem;border:1px solid var(--line);border-left:.25rem solid var(--accent);border-radius:.625rem;background:var(--surface)}
.we-head .sub{margin-bottom:1rem}

/* ---------- the stage ---------- */
.duo.we-duo>.pane-result{position:static}
.we-stage{background:radial-gradient(120% 80% at 50% 0%,rgba(255,196,120,.16),transparent 60%),linear-gradient(180deg,var(--mat),var(--mat-2));
  color:var(--mat-ink);border-radius:var(--r);padding:.875rem .875rem 1rem;box-shadow:var(--shadow);min-width:0}
.we-stage-h{font-family:var(--mono);font-size:.6875rem;font-weight:500;text-transform:uppercase;letter-spacing:.07em;color:var(--mat-muted);margin:0 0 .625rem;text-align:center}
.we-order{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.375rem;counter-reset:none}
.we-order li{display:flex;align-items:baseline;gap:.5rem;min-width:0;background:var(--we-paper);color:var(--we-ink);border-radius:.375rem;padding:.4375rem .625rem;
  box-shadow:0 1px 0 rgba(0,0,0,.08),0 8px 18px -12px rgba(0,0,0,.6);border-left:.25rem solid var(--we-gilt)}
.we-order li:first-child{border-left-color:var(--we-red)}
.we-order b{font-family:var(--we-serif);font-weight:400;font-size:1.0625rem;color:var(--we-red);min-width:1.875rem;font-variant-numeric:tabular-nums}
.we-order span{font-weight:600;font-size:.9375rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.we-order li.we-num-only span{font-weight:500;color:var(--we-ink-2);font-size:.8125rem}
.we-order.we-order-long{grid-template-columns:repeat(auto-fill,minmax(7.5rem,1fr));max-height:22rem;overflow:auto;padding-right:.125rem}
.we-order.we-flash li{animation:we-pop .35s ease-out both}
@keyframes we-pop{from{opacity:.25;transform:translateY(3px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.we-order.we-flash li{animation:none}}
.we-actions{display:grid;grid-template-columns:1fr auto;gap:.5rem;margin-top:.875rem}
.we-start{height:3.125rem;font-size:1.0625rem;background:var(--signal);color:var(--signal-ink);box-shadow:0 1px 0 rgba(0,0,0,.2)}
.btn.ghost.we-shuffle{height:3.125rem;background:transparent;color:var(--mat-ink);border-color:rgba(255,255,255,.4)}
.btn.ghost.we-shuffle:hover{border-color:var(--mat-ink)}
.we-actions .btn:disabled{opacity:.5;cursor:not-allowed}
.we-summary{margin:.5rem 0 0;font-size:.8125rem;color:var(--mat-muted);text-align:center}
.we-start:focus-visible,.we-shuffle:focus-visible{outline:3px solid var(--signal);outline-offset:2px}

/* ---------- the form ---------- */
.we-form-h{margin:0;font-size:1.0625rem}
.we-form .controls{margin-top:1rem;gap:1rem}
.we-form .modes{margin-bottom:0}
.we-hint{margin:.375rem 0 0;font-size:.8125rem;color:var(--muted)}
.we-off{opacity:.45;pointer-events:none}

/* ---------- print panel + rules card ---------- */
.we-print{margin-top:1.25rem}
.we-print h2{margin:0 0 .25rem;font-size:1.1875rem}
.we-print-intro{margin:0 0 1rem;color:var(--muted);font-size:.9375rem;max-width:60ch}
.we-print .modes{margin-bottom:.875rem}
.we-print-grid{display:grid;gap:1.25rem;align-items:start}
.we-print-side{min-width:0}
.we-print-btns{display:flex;flex-wrap:wrap;gap:.5rem}
.we-print-msg{margin:.625rem 0 0;font-size:.875rem;color:var(--muted);min-height:1.25rem}
.we-paper-note{font-size:.75rem!important;font-weight:500!important;color:var(--muted)!important}
.we-card{position:relative;background:var(--we-paper);color:var(--we-ink);border-radius:.375rem;padding:1.375rem 1.375rem 1.25rem;max-width:30rem;margin:0 auto;width:100%;
  box-shadow:0 1px 0 rgba(0,0,0,.08),0 14px 34px -18px rgba(0,0,0,.55)}
.we-card::before{content:"";position:absolute;inset:.4375rem;border:1px solid var(--we-gilt);border-radius:.25rem;pointer-events:none;opacity:.8}
.we-card h3{color:var(--we-ink);font-family:var(--we-serif);font-weight:400;font-size:1.625rem;text-align:center;margin:0;letter-spacing:-.01em}
.we-card-sub{text-align:center;font-family:var(--mono);font-size:.6875rem;letter-spacing:.07em;text-transform:uppercase;color:var(--we-ink-2);margin:.125rem 0 .75rem}
.we-card ol{margin:0;padding-left:1.375rem;font-size:.875rem;line-height:1.5}
.we-card li{margin:0 0 .375rem}
.we-card li::marker{color:var(--we-red);font-family:var(--we-serif);font-weight:700}
@media(min-width:48rem){.we-print-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}}

/* ---------- room view: one name, readable across a room ---------- */
.we-room{position:fixed;inset:0;z-index:300;display:flex;flex-direction:column;background:var(--bg);color:var(--ink);padding:max(1rem,env(safe-area-inset-top)) 1rem max(1rem,env(safe-area-inset-bottom))}
.we-room[hidden]{display:none}
body.we-room-open{overflow:hidden}
.we-room-top{display:flex;justify-content:space-between;align-items:center;gap:1rem}
.we-room-step{font-family:var(--mono);font-size:.875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.we-room-close{font:inherit;font-size:.9375rem;font-weight:600;background:var(--surface);color:var(--ink);border:1px solid var(--line-2);border-radius:.5rem;padding:.5rem .875rem;cursor:pointer}
.we-room-mid{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;min-height:0}
.we-room-now{margin:0;font-size:clamp(1.25rem,4.5vw,2.25rem);color:var(--muted);line-height:1.1}
.we-room-now b{display:block;color:var(--ink);font-size:clamp(3rem,15vw,10rem);letter-spacing:-.04em;line-height:1.02;margin:.25rem 0;overflow-wrap:anywhere;text-wrap:balance}
.we-room-num{display:inline-block;font-family:var(--mono);font-weight:600;font-size:clamp(1.5rem,6vw,3.5rem);color:var(--signal-ink);background:var(--signal);border-radius:.5rem;padding:.125rem .75rem;margin-top:.25rem}
.we-room-next{margin:1.5rem 0 0;font-size:clamp(1rem,3.5vw,1.75rem);color:var(--ink-2)}
.we-room-rule{margin:.5rem 0 0;font-size:clamp(.875rem,2.5vw,1.25rem);color:var(--muted);max-width:40ch}
.we-room-btns{display:grid;grid-template-columns:1fr 2fr;gap:.75rem;max-width:40rem;width:100%;margin:0 auto}
.we-room-btns .btn{height:4.5rem;font-size:1.375rem;border-radius:.75rem}
.we-room-go{background:var(--signal);color:var(--signal-ink)}
.we-room-btns .btn:disabled{opacity:.4;cursor:not-allowed}
.we-room button:focus-visible{outline:3px solid var(--accent);outline-offset:3px}

/* ---------- dice game (T-PAWHITE.2) ---------- */
.we-dice-only[hidden],.we-classic-only[hidden]{display:none!important}
.we-faces-set{border:0;padding:0;margin:0;min-width:0}
.we-faces-set legend{padding:0;margin-bottom:.5rem;width:100%}
.we-faces{display:grid;gap:.5rem}
.we-face{display:grid;grid-template-columns:2.25rem minmax(0,1fr);gap:.625rem;align-items:center}
.we-face select{padding:.5rem .625rem;font-size:.875rem}
.we-mini-die{width:2.25rem;height:2.25rem;display:block}
.we-mini-die rect,.we-die rect{fill:var(--we-paper);stroke:var(--we-ink);stroke-width:5}
.we-mini-die circle,.we-die circle{fill:var(--we-ink)}
.we-link-btn{font:inherit;font-size:.8125rem;color:var(--accent);background:none;border:0;padding:.375rem 0 0;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.we-link-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.we-bw{margin-bottom:.75rem}
.we-dice-table{width:100%;border-collapse:collapse;font-size:.875rem;margin-bottom:.75rem}
.we-dice-table thead th{font-family:var(--mono);font-size:.625rem;font-weight:500;letter-spacing:.07em;text-transform:uppercase;color:var(--we-ink-2);text-align:left;padding:0 0 .25rem}
.we-dface{display:flex;align-items:center;gap:.375rem}
.we-dice-table tbody th{padding:.3125rem .5rem .3125rem 0;vertical-align:middle;text-align:left;font-family:var(--we-serif);font-weight:400;font-size:1.125rem;color:var(--we-red);white-space:nowrap}
.we-dice-table .we-mini-die{width:1.75rem;height:1.75rem}
.we-dice-table td{padding:.3125rem 0;font-weight:600;border-top:1px solid rgba(43,29,23,.12)}
.we-dice-table tbody tr:first-child td{border-top:0}
.we-dice-table tbody th{border-top:1px solid rgba(43,29,23,.12)}
.we-dice-table tbody tr:first-child th{border-top:0}
.we-dice-rounds{font-size:.8125rem;line-height:1.5}
.we-dice-rounds p{margin:0 0 .375rem}
.we-dice-rounds ul{margin:.25rem 0 0;padding-left:1.125rem}

/* the roll view */
.we-droom .we-room-top{flex-wrap:wrap}
.we-dround{margin:0;flex-wrap:nowrap}
.we-dround button{white-space:nowrap;padding:.5rem .875rem}
.we-dmid{gap:.5rem}
.we-dturn{margin:0;font-size:clamp(1.25rem,5vw,2.25rem);font-weight:600;color:var(--ink);line-height:1.2;overflow-wrap:anywhere}
.we-dturn .we-room-num{font-size:clamp(1rem,4vw,1.75rem);vertical-align:.125em;margin:0 0 0 .25rem}
.we-die{width:min(40vw,30vh,12rem);height:auto;display:block;margin:.5rem auto;filter:drop-shadow(0 10px 18px rgba(0,0,0,.25))}
.we-die.we-die-blank rect{stroke-dasharray:10 8;opacity:.7}
.we-die.we-rolling{animation:we-shake .38s ease-in-out}
@keyframes we-shake{0%{transform:rotate(0)}25%{transform:rotate(-14deg) scale(.94)}50%{transform:rotate(12deg) scale(1.04)}75%{transform:rotate(-6deg)}100%{transform:rotate(0)}}
@media (prefers-reduced-motion:reduce){.we-die.we-rolling{animation:none}}
.we-daction{margin:0;font-size:clamp(1.5rem,6.5vw,3.25rem);font-weight:700;letter-spacing:-.02em;line-height:1.12;max-width:22ch;text-wrap:balance}
.we-timer{display:grid;justify-items:center;gap:.5rem;margin-top:.5rem}
.we-timer[hidden]{display:none}
.we-timer-t{margin:0;font-family:var(--mono);font-weight:600;font-size:clamp(2.5rem,12vw,5rem);line-height:1;font-variant-numeric:tabular-nums}
.we-timer-done .we-timer-t{color:var(--bad)}
.we-timer-btns{display:flex;gap:.5rem}
.we-timer-btns .btn{min-width:6.5rem;height:2.75rem}
.we-sound{font-size:.875rem;color:var(--muted)}
.we-droom .we-room-btns .btn[hidden]{display:none}
.we-droom .we-room-btns{grid-template-columns:auto 1fr}
.we-droom .we-room-btns .btn{font-size:1.25rem;white-space:nowrap;padding:0 1.25rem}
.we-droom .we-room-btns:has(.btn[hidden]){grid-template-columns:1fr}

/* ---------- game names, quick rules, twists (T-PAWHITE.3) ---------- */
.we-presets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
.we-presets button{font:inherit;text-align:left;display:grid;gap:.125rem;padding:.5625rem .6875rem;border:1px solid var(--line-2);border-radius:.5rem;background:var(--surface);color:var(--ink);cursor:pointer;min-width:0}
.we-presets button b{font-size:.875rem;font-weight:650}
.we-presets button small{font-size:.75rem;color:var(--muted);line-height:1.35}
.we-presets button:hover{border-color:var(--ink)}
.we-presets button.active{border-color:var(--accent);background:var(--accent-soft)}
.we-presets button:focus-visible,.we-twists summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.we-twists{border:1px solid var(--line);border-radius:.5rem;padding:.5rem .75rem;background:var(--surface)}
.we-twists summary{cursor:pointer;font-size:.9375rem;font-weight:600;display:flex;gap:.5rem;align-items:baseline;flex-wrap:wrap}
.we-twist-n{font-family:var(--mono);font-size:.6875rem;font-weight:500;color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
.we-twists .we-hint{margin:.5rem 0}
.we-twist-list{display:grid;gap:.5rem}
.we-twist-list label.check{align-items:flex-start;font-size:.875rem}
.we-twist-list label.check input{margin-top:.1875rem;flex:none}
.we-twist-list b{display:block}
.we-twist-list small{color:var(--muted);font-size:.8125rem;line-height:1.4}
