/* Foaia de stil a paginii „Unde stau?” (app/unde/index.html), scoasă din
   pagină într-un fișier: politica de conținut (app/_headers) ajunge la
   „style-src 'self'” numai fără blocuri <style> în pagini. */
/* Pagina invitatului: un QR pe invitație sau la intrare o deschide. Își
   scrie numele și vede masa. Nimic de bifat, nimic de răsfoit: primește
   numai ce a căutat. Culorile sunt ale aplicației de la ușă, ca să fie
   aceeași casă. */
:root{
  /* Culorile, cu temele și color-scheme, sunt în paleta site-ului
     (app/paleta.css), aceleași cu ale ușii: auriul luminos #8A6424, pe care
     cifra albă de pe masa invitatului are 5,34:1, și scrisul închis de pe
     auriul și verdele deschise ale temei întunecate. Aici, rotunjimea. */
  --r:14px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0}
body{background:var(--ground);color:var(--ink);font-family:"Karla",system-ui,sans-serif;font-size:15px;line-height:1.45;
  padding:env(safe-area-inset-top,0) 0 env(safe-area-inset-bottom,0)}
header{padding:22px 18px 10px;text-align:center}
h1{font-family:"Bodoni Moda",Georgia,serif;font-weight:400;font-size:24px;margin:0}
h1 small{display:block;font-family:"Karla",sans-serif;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin-top:6px}
main{max-width:560px;margin:0 auto;padding:0 16px 40px}
/* întrebarea e eticheta căsuței: citită cu voce când omul ajunge în ea */
.intrebare{display:block;font-family:"Bodoni Moda",Georgia,serif;font-size:19px;margin:14px 0 8px}
/* Numai pentru cititorul de ecran: nu se vede, dar se aude. */
.doar-cititor{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;
  overflow:hidden;white-space:nowrap;clip-path:inset(50%);
}
.cauta{position:relative}
input#q{width:100%;padding:14px 16px;font:inherit;font-size:17px;border:1.5px solid var(--line-strong);border-radius:var(--r);background:var(--surface);color:var(--ink)}
input#q:focus{outline:none;border-color:var(--gold)}
.note{font-size:12.5px;color:var(--ink-2);margin:8px 2px 0}
.lista{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.rand{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:12px 14px;border:1.5px solid var(--line);border-radius:var(--r);background:var(--surface);color:var(--ink);font:inherit;cursor:pointer}
.rand[aria-pressed="true"]{border-color:var(--gold);background:var(--surface-2)}
.rand .nm{flex:1}.rand .nm b{display:block;font-weight:700}.rand .nm span{font-size:12.5px;color:var(--ink-2)}
.rand .masa{font-family:"Bodoni Moda",Georgia,serif;font-size:22px;color:var(--gold);white-space:nowrap}
.rand .masa small{display:block;font-family:"Karla",sans-serif;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);text-align:right}
.gol{padding:14px 2px;color:var(--ink-2);font-size:14px}
.raspuns{margin-top:18px;padding:16px;border-radius:var(--r);background:var(--surface);border:1.5px solid var(--line)}
.raspuns .mare{font-family:"Bodoni Moda",Georgia,serif;font-size:30px;color:var(--gold);margin:0}
.raspuns .cine{font-weight:700;margin:2px 0 8px}
.raspuns .indicatie{color:var(--ink-2);margin:0 0 12px}
/* Planul se poate mări: cu „+” și „−”, cu două degete, cu rotița și Ctrl
   (sau ciupit pe touchpad). Cât e întreg, un deget derulează pagina ca
   oriunde altundeva — planul stă la capătul ei, iar cine vrea înapoi la
   nume pune degetul unde se nimerește. Mărit, degetul plimbă planul. */
.plan{border:1px solid var(--line);border-radius:12px;background:var(--surface-2);overflow:hidden;touch-action:pan-y}
.plan.marit{touch-action:none}
.plan svg{display:block;width:100%;height:auto;max-height:60vh}
/* Aceleași reguli ca pe planul de la ușă (app/index.html): la tot planul, pe
   un telefon, o unitate de plan e cam o treime de pixel. Cu 13 și 11 cum
   erau, numerele meselor ieșeau de șase pixeli și INTRAREA de cinci: se
   vedea forma sălii, nu se citea nimic. Karla groasă, cu un contur de
   culoarea mesei dedesubt — paint-order pune conturul sub literă. */
.fixture{fill:var(--surface);stroke:var(--line-strong);stroke-width:1}
.flabel{
  fill:var(--ink);font-family:"Karla",sans-serif;font-size:17px;font-weight:700;letter-spacing:.04em;text-anchor:middle;dominant-baseline:central;
  paint-order:stroke;stroke:var(--surface);stroke-width:3px;stroke-linejoin:round;
}
.t-masa{fill:var(--surface);stroke:var(--line-strong);stroke-width:1.5}
.t-num{
  fill:var(--ink);font-family:"Karla",sans-serif;font-size:20px;font-weight:700;text-anchor:middle;dominant-baseline:central;
  paint-order:stroke;stroke:var(--surface);stroke-width:3px;stroke-linejoin:round;
}
/* Masa invitatului se vede de departe: plină, aurie, cu un inel grena în
   jurul ei. Un inel subțire pe un cerc mic nu ajungea într-o sală cu
   patruzeci de mese. */
.t-masa.a-ta{fill:var(--gold);stroke:var(--gold)}
.t-num.a-ta{fill:var(--on-gold);stroke:var(--gold)}
.hl{fill:none;stroke:var(--garnet);stroke-width:6}
/* Butoane cât degetul, sub plan, nu peste el: pe un colț de plan ar fi
   putut sta chiar masa lui. */
.lupa{display:flex;justify-content:flex-end;gap:4px;padding:4px;border-top:1px solid var(--line);background:var(--surface)}
.lupa button{min-width:40px;height:40px;border:0;border-radius:9px;background:none;color:var(--ink);font:inherit;font-weight:700;font-size:18px;line-height:1;cursor:pointer}
.lupa button.lat{padding:0 10px;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.lupa button:active{background:var(--surface-2)}
.loose{margin:12px 0 0;padding:8px 12px;border-radius:10px;font-size:12.5px;background:var(--surface-2);border:1px solid var(--line);color:var(--ink-2)}
.blocat{padding:60px 24px;text-align:center}
.blocat b{display:block;font-family:"Bodoni Moda",Georgia,serif;font-size:20px;margin-bottom:8px}
.blocat p{color:var(--ink-2)}
footer{padding:10px 18px 30px;text-align:center;font-size:12px;color:var(--ink-3)}
/* Semnătura produsului, sub tot: mică, în cerneala mărunțișului, fără nimic
   care să tragă ochiul de la ce a venit omul să afle. Un link simplu spre
   prezentare, pe același site: nimic în adresă după care să se știe de unde
   a venit cine o apasă. */
.semnatura{margin:14px 0 0;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.semnatura a{color:var(--ink-3);text-decoration:none}
.semnatura a:hover,.semnatura a:focus-visible{text-decoration:underline}
.semnatura b{font-weight:800}