/* Izvuceno iz templates/guest_portal/dashboard.html (scripts/build/izvuci_inline_css.py).
   Uredjuj OVDJE, ne u predlosku — predlozak ga samo linka. */
/* ═══════════ NO-SCROLL BENTO DECK "Dalia Dossier" — paritet s couple ═══════════ */
/* Vedran 2026-07-31: kartice su na desktopu bile ODREZANE gore.
   Uzrok: deck je negativnom marginom poništavao OPĆU ostavu `.gp-main`
   (`clamp(1.5rem,4vw,2.5rem)` = 40 px), a `.gp-main` je u međuvremenu dobio
   ZASEBAN gornji override (`clamp(1rem,2.2vw,1.5rem)` = 24 px, shell_guest:160).
   Razlika od 16 px vukla je mrežu iznad vrha prozora, a `overflow:hidden` ju je
   odrezao.

   Gornja ostava se sad NE poništava — ona je taj rub gore koji je Vedran tražio.
   Visina se za nju umanjuje ISTIM izrazom, pa deck i dalje stane bez scrolla i
   ne može se razići ako se ostava opet promijeni. Bočni i donji bleed ostaju. */
.gp-stage { margin: 0 -1rem calc(-1 * clamp(1.5rem, 4vw, 2.5rem)); padding: 4px;
  height: calc(100vh - clamp(1rem, 2.2vw, 1.5rem));
  height: calc(100dvh - clamp(1rem, 2.2vw, 1.5rem));
  min-height:540px; overflow:hidden; display:flex; flex-direction:column; gap:8px; }

/* ── DESKTOP: ista širina ekrana kao mladenački deck (Vedran 2026-08-02) ──────
   Gost je do danas bio stisnut na `max-width:1180px` (shell_guest:148) dok par
   ima 1440px (shell_couple:534). Mjereno na 1920px: gostov deck 1132px prema
   1376px kod para, stupci 372/356/372 prema 449/430/449 — 23% manje korisne
   plohe za isti sadržaj, uz ~250px mrtve margine sa SVAKE strane.

   Ostava se NE dira globalno: `.gp-main` je ljuska SVIH gostinskih stranica
   (pratnja, prijevoz, galerija, profil…) i ondje je 1180px namjeran raspon za
   čitanje. Zato `:has(.gp-stage)` — `.gp-stage` postoji samo na ovoj stranici.
   Isti obrazac već vozi u repou: `static/css/couple-pozivnice.css:635`.

   Donja ostava ide na 0 jer je 192px (shell_guest:157) rezervirano za rail
   plutajućih ploha, a on na ovoj stranici ne postoji: `#dwVinyl` se sam gasi kad
   na stranici stoji `#vinyl-data` (components/_vinyl_player.html:259), a taj
   <script> emitira upravo ovaj deck. Deck je već točno 100dvh, pa je tih 192px
   bilo doslovno 152px scrolla u prazno ispod njega. Ostaje samo `.dalia-chat-btn`
   koji pluta preko donjeg desnog ugla — to je namjeran chrome, ne sadržaj. */
@media (min-width: 901px) {
  .gp-main:has(.gp-stage) {
    max-width: 1440px;
    padding-left: max(2rem, 4vw);
    padding-right: max(2rem, 4vw);
    padding-bottom: 0;
  }
  /* Visina se i dalje umanjuje za gornju ostavu (ona je rub koji je Vedran
     tražio), a donja se više nema što poništavati. */
  .gp-stage { margin-bottom: 0; }

  /* ── NAŠA PRIČA NA DESKTOPU (Vedran 31.8.2026.: „ovako je nešto zbugano") ──
     Iznad 900px priča je UVIJEK otvorena: `.dc-more { display: contents }`
     (dalia-collapse.css:47) ukida vrpcu, pa je stupac za čitanje stalni
     stanar ćelije. Ćelija je pritom fiksna — `.gp-grid` ima `1.1fr 1fr`
     unutar `.gp-stage` visine 100dvh, uz `.gp-grid > * { overflow:hidden }`.
     Odatle dvije stvari koje se vide na snimci:

     REZ. `.gp-hero2` je `justify-content:center` (dalia-hero-vjencanje.css:40),
     pa sadržaj koji prelazi okvir ispada na OBA kraja i `overflow:hidden` ga
     reže gore i dolje — odlazi i vrh imena mladenaca, bez ijednog znaka da
     tekst ide dalje. Rez sada ide samo dolje (imena su prikovana za vrh), a
     ono što ne stane ISPADA U MAGLU i skrola se u sebi. To je doslovno
     obrazac kojim par rješava isti sukob (couple-dashboard.css:500-506).

     UKRAS. `dc-br` je usidren na `bottom:0/right:0` KARTICE, a na visokoj
     kartici ondje počinje tekst — 132px cvijeta leži preko svakog retka
     priče. Ukras pripada traci identiteta, ne stupcu za čitanje: donji
     cvijet se seli u gornji desni kut i s prvim uokviruje imena, a oba se
     stisnu toliko da ih imena ne dodiruju. Priča ostaje na čistom papiru pri
     SVAKOJ duljini koju par upiše — to je razlika prema mjeri koja bi
     vrijedila samo za jednu priču.

     Sve je zaključano na `:has(.gp-prica)`: vjenčanje bez priče zadržava
     zatečenu karticu znak po znak, a parova kartica taj element nema, pa je
     pravilo za nju neizvedivo po konstrukciji — zato ovo i ne ide u dijeljeni
     `dalia-hero-vjencanje.css`. */
  .gp-hero2:has(.gp-prica) { justify-content: flex-start; }
  .gp-hero2:has(.gp-prica) > .gp-hero2-body { flex: 1 1 auto; min-height: 0; width: 100%; }
  .gp-hero2:has(.gp-prica) .gp-prica {
    flex: 1 1 auto; min-height: 0; width: 100%; overflow-y: auto;
    -webkit-mask-image: linear-gradient(to bottom, black calc(100% - 22px), transparent);
    mask-image: linear-gradient(to bottom, black calc(100% - 22px), transparent);
  }
  .gp-hero2:has(.gp-prica) > .gp-hero2-corner.dc-tl { width: 132px; }
  .gp-hero2:has(.gp-prica) > .gp-hero2-corner.dc-br {
    top: 0; bottom: auto; width: 112px; transform: scale(-1, 1);
  }
}
.gp-dualbar { flex-shrink:0; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 14px; border-radius:12px; background:rgba(181,107,141,0.06); font-family:var(--font-sans); font-size:12.5px; color:var(--stone); }
.gp-dualbar a { color:#a05a7d; text-decoration:none; font-weight:600; white-space:nowrap; }
/* Proporcije 1:1 s couple deckom. */
.gp-grid { flex:1; min-height:0; display:grid; grid-template-columns:1.15fr 1.1fr 1.15fr; grid-template-rows:1.1fr 1fr; gap:12px; }
/* `min-width:0` je jednako nužan kao `min-height:0` (paritet s couple:116):
   bez njega grid track naraste na min-content najšireg djeteta (Leafletova
   ploha, dug naslov pjesme, dugo ime pogodnosti) i cijela stranica dobije
   vodoravni scroll. Kod para je to zabilježen kvar (couple:112-115). */
.gp-grid > * { min-height:0; min-width:0; overflow:hidden; }
/* paperC — ručno rađena papir-ploha (1:1 couple). */
.gp-tile { position:relative; overflow:hidden; padding:18px 20px; display:flex; flex-direction:column;
  background-color:#fff;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' seed='7'/><feColorMatrix values='0 0 0 0 0.42  0 0 0 0 0.30  0 0 0 0 0.44  0 0 0 0.045 0'/></filter><rect width='300' height='300' filter='url(%23n)'/></svg>"),
    radial-gradient(ellipse 100% 70% at 0% 0%, rgba(232,197,212,0.10), transparent 55%),
    radial-gradient(ellipse 100% 70% at 100% 100%, rgba(184,165,204,0.10), transparent 55%);
  border:1px solid rgba(107,78,113,0.14); border-radius:14px;
  box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset, 0 8px 22px -14px rgba(74,52,80,0.22), 0 2px 5px -2px rgba(74,52,80,0.08); }
.gp-tile > * { position:relative; z-index:1; }
a.gp-tile { text-decoration:none; color:inherit; transition: transform .18s var(--ease,cubic-bezier(.22,1,.36,1)), box-shadow .18s var(--ease,cubic-bezier(.22,1,.36,1)); }
a.gp-tile:hover { transform: translateY(-2px); box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset, 0 18px 40px -20px rgba(160,90,125,0.42), 0 3px 8px -3px rgba(74,52,80,0.12); }
.gp-go { color:var(--color-deep-mauve,#b56b8d); font-weight:700; }

/* Naslov kartice — 1:1 couple .ch (display serif + script em akcent). */
.ch { font-family:var(--font-serif); font-weight:500; font-size:19px; color:#2A1F2E; margin:0 0 8px;
  display:flex; justify-content:space-between; align-items:center; gap:10px; flex-shrink:0; }
.ch em { font-family:var(--font-script,'Caveat',cursive); font-style:normal; font-weight:500; color:#6B4E71; font-size:24px; }
.vinyl-ch-title { display:inline-flex; align-items:center; gap:8px; min-width:0; }
.vinyl-am-badge { display:inline-flex; align-items:center; gap:5px; width:max-content; margin:0; padding:3px 10px; border-radius:8px; background:#1a1a1c; color:#fff; font-size:10.5px; font-weight:600; text-decoration:none; flex-shrink:0; font-family:var(--font-sans); }
.vinyl-am-badge:hover { background:#000; }
/* more-c link — 1:1 couple. */
.more-c { display:inline-flex; align-items:center; gap:6px; font-family:var(--font-script,'Caveat',cursive); font-size:17px;
  color:#6B4E71; text-decoration:none; margin-top:6px; border-top:1px dashed rgba(107,78,113,0.22); padding-top:6px;
  flex-shrink:0; align-self:stretch; justify-content:center; }
.more-c svg { flex-shrink:0; }

/* HERO = papir-identitet. Kroj kartice preseljen u
   `static/css/dalia-hero-vjencanje.css` (Vedran 2026-08-09) — ISTA datoteka
   nosi i naslovnu mladenaca, pa se dvije kartice više ne mogu razići.
   Ovdje ostaje samo MJESTO u decku. */
.gp-hero2 { grid-column:1; grid-row:1; }

/* Naša priča u otvorenom dijelu kartice s imenima (Vedran 14.8.2026.).
   Mjera je ČITANJE, ne pregled: 1.75 prored i nijedan `text-overflow`, jer je
   ovo jedini tekst na pregledu koji se čita od početka do kraja — sve
   ostalo se skenira.

   `max-width:66ch` je STROP za širu plohu, ne mjera ovog decka: stupac je
   ovdje trećina mreže zaustavljene na 1440px (~400px na 1920, ~315px na
   1440), pa se priča stvarno čita na 42-51 znak po retku i granica se nikad
   ne aktivira. Ostaje jer vrijedi u trenutku kad priča dobije vlastitu
   plohu; ne čitaj je kao opis zatečenog stanja. */
.gp-prica { margin-top:clamp(18px,3vh,26px); padding-top:18px; text-align:left;
  border-top:1px solid rgba(182,146,212,0.28); max-width:66ch; margin-left:auto; margin-right:auto; }
.gp-prica-nas { font-family:var(--font-serif); font-size:clamp(19px,2vw,22px); line-height:1.25;
  color:var(--hero-ink); margin-bottom:10px; }
.gp-prica-pod { font-family:var(--font-sans); font-size:11px; font-weight:600; text-transform:uppercase;
  letter-spacing:0.09em; color:var(--hero-meta); margin:18px 0 6px; }
/* `pre-line` čuva prazan redak koji je par upisao — priča je pisana u
   odlomcima i bez toga se slije u jedan blok. */
.gp-prica-p { font-family:var(--font-sans); font-size:15px; line-height:1.75; color:#3D3244;
  margin:0 0 10px; white-space:pre-line; }
.gp-prica-p .tko { display:block; font-size:11px; font-weight:600; text-transform:uppercase;
  letter-spacing:0.08em; color:var(--hero-meta); margin-bottom:2px; }
.gp-prica-fun { font-family:var(--font-serif); font-size:16px; line-height:1.6; color:#5C4A63;
  margin:12px 0 0; }
.gp-prica-qa { margin-top:18px; }
.gp-prica-q { font-family:var(--font-serif); font-size:16.5px; line-height:1.35; color:var(--hero-ink);
  margin-bottom:6px; }

/* Countdown triplet pill — 1:1 couple .diary-timer. */
.diary-timer { margin-top:clamp(18px,3vh,28px); padding:10px 22px; background:rgba(250,246,255,0.75);
  border:1px solid rgba(182,146,212,0.28); border-radius:100px; display:flex; align-items:center; justify-content:center;
  gap:14px; flex-shrink:0; width:max-content; margin-left:auto; margin-right:auto; }
.diary-timer .cd-cell { display:flex; flex-direction:column; align-items:center; gap:2px; min-width:38px; }
.diary-timer .tn { font-family:var(--font-serif); font-weight:500; font-size:clamp(20px,2vw,24px); line-height:1; color:#2A1F2E; letter-spacing:-0.02em; text-align:center; font-variant-numeric:tabular-nums; }
.diary-timer .tl { font-family:var(--font-sans); font-size:11px; text-transform:uppercase; letter-spacing:0.08em; color:#8A7E90; text-align:center; line-height:1; }
.diary-timer .tdiv { width:5px; height:5px; border-radius:50%; background:#C89FB0; box-shadow:0 0 0 3px rgba(200,159,176,0.2); align-self:center; margin-bottom:14px; }

/* GALERIJA — polaroid stack (1:1 couple). */
.gp-gal { grid-column:1; grid-row:2; }
/* `container-type: inline-size` (1:1 couple:384-390): polaroidi se mjere prema
   ŠIRINI KARTICE, ne prema širini prozora. Bez toga su stražnje dvije pločice
   na širokom ekranu izlazile iz kartice i `overflow:hidden` ih je REZAO
   (mjereno: ~31px u mirovanju, ~48px na hoveru). Isti kvar je kod para
   zabilježen i riješen (#619); gost je taj dio porta preskočio. */
.diary-gallery { flex:1; display:flex; flex-direction:column; align-items:center; gap:10px; min-height:0; container-type:inline-size; }
/* Script naslov kartice — 1:1 couple .diary-gallery .gal-title (hairline krila). */
.diary-gallery .gal-title { font-family:var(--font-script,'Caveat',cursive); font-size:22px; color:#6B4E71;
  display:flex; align-items:center; gap:10px; align-self:stretch; flex-shrink:0; }
.diary-gallery .gal-title::before, .diary-gallery .gal-title::after { content:''; flex:1; height:1px; background:rgba(200,159,176,0.35); }
.diary-gallery .stack { position:relative; width:100%; max-width:380px; flex:1; min-height:0; display:flex; align-items:center; justify-content:center; }
/* Prvi `width` je fallback za preglednike bez container queryja; drugi (cqw)
   pobjeđuje ondje gdje ih ima — 1:1 couple:403-412. */
.polaC { position:absolute; width:clamp(150px,20vw,290px); width:min(290px, 55cqw); background:#FDFBF7; padding:10px 10px 34px;
  box-shadow:0 12px 28px -8px rgba(74,52,80,0.45), 0 2px 0 rgba(255,255,255,0.5) inset; border-radius:4px;
  transition:transform 0.55s cubic-bezier(.34,.05,.2,1), box-shadow 0.4s cubic-bezier(.34,.05,.2,1);
  cursor:pointer; text-decoration:none; will-change:transform; }
.polaC.shuffling { z-index:100 !important; box-shadow:0 24px 50px -10px rgba(74,52,80,0.55), 0 2px 0 rgba(255,255,255,0.5) inset; }
/* Pomaci u % VLASTITE širine, ne u px — druga polovica popravka #619, koju je
   gost preskočio: `container-type:inline-size` i `width:min(290px,55cqw)` je
   preuzeo (r. 199, 207), pa se fotografija steže s karticom, a fan je ostao
   fiksan i na uskoj kartici probijao `overflow:hidden` (izmjereno: rez na
   hoveru ispod ~300px kontejnera). Postoci su GOSTOVI, ne parovi: 60/58px i
   72/70px na 290px polaroidu daju 20.7/20.0 i 24.8/24.1 — fan na širokoj
   kartici ostaje znak po znak isti. Parove brojke (24.8/29.7) opisuju NJIHOV
   širi fan i ovdje bi bile promjena izgleda, ne popravak. */
.polaC.back1:hover { transform:rotate(-1deg) translate(-24.8%,-12px) scale(1.14) !important; z-index:50 !important; opacity:1 !important;
  box-shadow:0 22px 48px -12px rgba(74,52,80,0.48), 0 2px 0 rgba(255,255,255,0.5) inset !important; }
.polaC.back2:hover { transform:rotate(1deg) translate(24.1%,-12px) scale(1.14) !important; z-index:50 !important; opacity:1 !important;
  box-shadow:0 22px 48px -12px rgba(74,52,80,0.48), 0 2px 0 rgba(255,255,255,0.5) inset !important; }
.polaC .ph { width:100%; aspect-ratio:4/5; overflow:hidden; border-radius:2px; background:var(--paper,#fffaf6); }
.polaC .ph img { width:100%; height:100%; object-fit:cover; display:block; }
.polaC .cap { position:absolute; left:0; right:0; bottom:8px; text-align:center; font-family:var(--font-script,'Caveat',cursive); font-size:17px; color:#6B4E71; }
.polaC.back1 { transform:rotate(-2.5deg) translate(-20.7%,6px); z-index:1; opacity:0.78; }
.polaC.back2 { transform:rotate(2.5deg) translate(20%,-4px); z-index:2; opacity:0.92; }
.polaC.front { transform:rotate(-0.5deg) translate(0,0); z-index:3; opacity:1; }
.stack.stack-empty, .stack.stack-solo { max-width:240px; }
.stack.stack-empty .polaC, .stack.stack-solo .polaC { position:relative !important; }
/* Prazno stanje galerije nosi `cap cap-cta` (niže u markupu), ali je jedino
   pravilo za tu klasu u `couple-dashboard.css` — datoteci koju gostinska ljuska
   ne učitava. Gost je zato dobivao goli `.cap` na 17px umjesto poziva na 19px. */
.polaC .cap.cap-cta { color:#6B4E71; font-size:19px; }
.polaC.polaC-cta:hover { transform:rotate(-1.5deg) translate(0,-4px) !important; }
.ph-empty { display:flex; align-items:center; justify-content:center; }
.ph-empty-inner { padding:14px; text-align:center; }
.ph-empty-line1 { font-family:var(--font-sans); font-size:12.5px; color:var(--stone); line-height:1.5; }
@media (prefers-reduced-motion: reduce){ .polaC { transition:none; } }

/* PODSJETNIK — ticket (gost-specifično; stub mekan). Ime „Karta dana" povučeno
   2026-07-29; klase (.gp-kd*) ostaju da se ne lomi ostatak stilova. */
.gp-kd { grid-column:2; grid-row:1; padding:0; overflow:visible; background:none; border:none; box-shadow:none; }
.gp-ticket { position:relative; height:100%; display:flex; overflow:hidden; border-radius:14px; border:1px solid rgba(107,78,113,0.14);
  background-color:#fff;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' seed='7'/><feColorMatrix values='0 0 0 0 0.42  0 0 0 0 0.30  0 0 0 0 0.44  0 0 0 0.045 0'/></filter><rect width='300' height='300' filter='url(%23n)'/></svg>"),
    radial-gradient(ellipse 100% 70% at 100% 100%, rgba(184,165,204,0.10), transparent 55%);
  box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset, 0 8px 22px -14px rgba(74,52,80,0.22); }
.gp-ticket > * { position:relative; z-index:1; }
/* Vedran 2026-07-31: bočni okomiti natpis („PODSJETNIK" postrance) je maknut —
   naslov ide gore kao svaki drugi. Perforacija ostaje kao jezik ove kartice,
   sad kao tanka crta uz lijevi rub tijela. */
.gp-ticket-perf { width:0; border-left:1.5px dashed rgba(107,78,113,0.18); position:relative; margin-left:10px; }
.gp-ticket-perf::before, .gp-ticket-perf::after { content:''; position:absolute; left:-8px; width:14px; height:14px; border-radius:50%; background:var(--paper,#fffaf6); }
.gp-ticket-perf::before { top:-7px; } .gp-ticket-perf::after { bottom:-7px; }
.gp-ticket-body { flex:1; padding:15px 20px 17px; display:flex; flex-direction:column; min-width:0; }
.gp-ticket-head { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:8px; }
.gp-ticket-kicker { font-family:var(--font-sans); font-size:11px; letter-spacing:.16em; text-transform:uppercase; font-weight:700; color:var(--color-deep-mauve,#b56b8d); margin:0; }
.gp-ticket-count { font-family:var(--font-sans); font-size:11.5px; font-weight:700; color:var(--stone); font-variant-numeric:tabular-nums; }
.gp-ticket-name { font-family:var(--font-serif); font-size:20px; color:#2A1F2E; line-height:1.15; }
.gp-ticket-status { font-family:var(--font-script,'Caveat',cursive); font-size:20px; color:#6e8170; margin-top:1px; }

/* Traka napretka — jedina animirana stvar u kartici; pomiče se kad gost
   nešto riješi, pa je „dinamičko" doslovno vidljivo. */
.gp-steps-bar { height:3px; border-radius:999px; background:rgba(107,78,113,0.10); margin:10px 0 8px; overflow:hidden; }
.gp-steps-bar span { display:block; height:100%; background:var(--color-deep-mauve,#b56b8d); border-radius:999px; transition:width .5s var(--ease,cubic-bezier(.22,1,.36,1)); }

.gp-steps { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; flex:1; overflow:auto; min-height:0;
  /* Popis je viši od kartice kad koraka ima 5+. Bez ovoga se zadnji red REŽE i
     izgleda kao greška; maska ga blago rastopi, što se čita kao "ima još". */
  -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 18px), transparent);
  mask-image: linear-gradient(to bottom, #000 calc(100% - 18px), transparent); }
.gp-step-link { display:flex; align-items:center; gap:10px; padding:7px 8px; margin:0 -8px; border-radius:9px;
  text-decoration:none; color:inherit; transition:background .14s ease; min-height:40px; }
.gp-step-link:hover { background:rgba(181,107,141,0.07); }
.gp-step-link:focus-visible { outline:2px solid var(--color-deep-mauve,#b56b8d); outline-offset:-2px; }
.gp-step-mark { flex:0 0 auto; width:19px; height:19px; border-radius:50%; border:1.5px solid rgba(107,78,113,0.28);
  display:inline-flex; align-items:center; justify-content:center; color:#fff; }
.gp-step-mark svg { width:11px; height:11px; }
.gp-step.is-done .gp-step-mark { background:var(--color-deep-mauve,#b56b8d); border-color:var(--color-deep-mauve,#b56b8d); }
.gp-step-txt { flex:1; min-width:0; display:flex; align-items:baseline; gap:7px; flex-wrap:wrap; }
.gp-step-label { font-family:var(--font-sans); font-size:14.5px; font-weight:600; color:var(--warm-black,#2d2238); }
.gp-step-value { font-family:var(--font-sans); font-size:12.5px; color:var(--stone); }
/* Riješen korak se stiša, ali se NE precrtava — gost i dalje mora moći
   provjeriti što je odabrao, a precrtano se čita kao „otkazano". */
.gp-step.is-done .gp-step-label { color:var(--stone); font-weight:500; }
.gp-step-go { flex:0 0 auto; color:transparent; font-size:15px; transition:color .14s ease; }
.gp-step-link:hover .gp-step-go, .gp-step-link:focus-visible .gp-step-go { color:var(--color-deep-mauve,#b56b8d); }

.gp-ticket-notes { display:flex; flex-direction:column; gap:2px; margin-top:8px; padding-top:8px; border-top:1px solid rgba(107,78,113,0.10); }
.gp-ticket-note { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:5px 8px; margin:0 -8px; border-radius:8px;
  font-family:var(--font-sans); font-size:12.5px; color:var(--charcoal); text-decoration:none; transition:background .14s ease; }
a.gp-ticket-note:hover { background:rgba(181,107,141,0.07); }
.gp-ticket-note b { color:var(--warm-black); font-weight:600; }
.gp-ticket-note em { color:var(--color-deep-mauve,#b56b8d); font-style:normal; font-weight:600; }
.gp-ticket-note--flat { color:var(--stone); }
/* Datum uz prvu točku — samo kad ta točka NIJE na dan vjenčanja. Tiši od
   naslova: to je pojašnjenje, ne podatak zbog kojeg se kartica otvara. */
.gp-note-day { font-size:11.5px; color:var(--stone); font-variant-numeric:tabular-nums; white-space:nowrap; }
@media (prefers-reduced-motion: reduce) { .gp-steps-bar span { transition:none; } }
.gp-kd-cta-row { display:flex; align-items:center; gap:12px; margin-top:12px; }
.gp-kd-cta { display:inline-flex; align-items:center; background:var(--color-deep-mauve,#b56b8d); color:#fff; font-family:var(--font-sans); font-size:12.5px; font-weight:600; padding:9px 16px; border-radius:999px; text-decoration:none; }
.gp-kd-cta:hover { background:#a05a7d; }
.gp-kd-link { font-family:var(--font-sans); font-size:12.5px; font-weight:600; color:var(--stone); text-decoration:none; }
.gp-kd-link:hover { color:var(--color-deep-mauve,#b56b8d); }

/* KARTA GOSTIJU — 1:1 couple logi-card (header gore + chip dolje-lijevo). */
.gp-logi { grid-column:2; grid-row:2; padding:0; overflow:hidden; }
.logi-map-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:52% 40%; display:block; background:#E9E3DB; transition:transform .4s ease; z-index:0; }
a.gp-logi:hover .logi-map-img { transform:scale(1.04); }
a.gp-logi:hover .logi-open { opacity:1; }
/* Sloj iz registra, ne sirova brojka (dalia-portal.css). 600 je `--z-lightbox`
   i vrijedio je u KORIJENSKOM kontekstu — nijedan predak ovdje ne otvara svoj
   stacking context — pa su traka i chip stajali preko modala dvorane
   (`.vp-overlay`), koji se otvara s ove iste stranice. Karta je na `z-index:0`,
   pa je za nadslojavanje dovoljan sadržajni kat. */
.logi-card-top { position:absolute; top:0; left:0; right:0; z-index:var(--z-content); padding:13px 16px 30px; pointer-events:none;
  background:linear-gradient(to bottom, rgba(253,251,247,0.98) 0%, rgba(253,251,247,0.94) 48%, rgba(253,251,247,0.55) 75%, rgba(253,251,247,0)); }
.logi-card-top .ch { margin:0; }
.logi-card-top .ch span { text-shadow:0 1px 4px rgba(253,251,247,0.95), 0 0 2px rgba(253,251,247,0.9); }
.logi-open { font-family:var(--font-script,'Caveat',cursive); font-size:16px; color:#6B4E71; opacity:0.85; transition:opacity .2s; }
.logi-overlay { position:absolute; left:12px; bottom:12px; z-index:calc(var(--z-content) + 1); pointer-events:none; }
.logi-chip { font-family:var(--font-script,'Caveat',cursive); font-size:14px; color:#4A3450;
  background:rgba(253,251,247,0.93); border:1px solid rgba(107,78,113,0.15);
  padding:4px 13px; border-radius:100px; box-shadow:0 2px 8px -3px rgba(74,52,80,0.28); }
/* Kad gost ima vožnju: tile pokazuje NJEGOVU vožnju umjesto default screenshota
   meka podloga + mali koridor origin→sala, bez map enginea. */
.gp-logi--mine { background:linear-gradient(135deg, rgba(181,107,141,0.12), rgba(126,148,132,0.07)); }
/* Prava karta te vožnje (Vedran 2026-07-31). Kontejner je ispod chipa i naslova
   (z-index 0) — oni imaju svoje slojeve iznad. Karta ne prima geste (ride-map.js),
   pa cijeli tile ostaje poveznica na /prijevoz. */
.logi-ridemap { position:absolute; inset:0; z-index:0; background:#eee9e2; }
.gp-logi--map .logi-ridemap { border-radius:inherit; }
.rm-pin { border-radius:50%; box-shadow:0 0 0 3px rgba(255,255,255,0.9), 0 2px 6px -1px rgba(45,34,56,0.4); }
.rm-pin--from { background:#b56b8d; }
.rm-pin--to { background:#b56b8d; }
/* Leafletova ploha ne smije pokupiti klik — tile je <a>. */
.logi-ridemap, .logi-ridemap * { pointer-events:none !important; }
.logi-mine-bg { position:absolute; inset:0; z-index:0; display:flex; align-items:center; justify-content:center; }
.logi-mine-track { width:42%; height:0; border-top:2px dashed rgba(181,107,141,0.55); }
.logi-mine-dot { width:12px; height:12px; border-radius:50%; flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; }
.logi-mine-dot.from { background:#b56b8d; box-shadow:0 0 0 4px rgba(181,107,141,0.16); }
.logi-mine-dot.to { background:none; font-size:18px; }
/* Rasmus: status s vremenom hoće sans, ne rukopis (Caveat pretvara "15:00" u ukras). */
.logi-chip--mine { display:inline-block; max-width:calc(100% - 8px); font-family:var(--font-sans,'Manrope',sans-serif); font-size:12.5px; font-weight:600; line-height:1.35; }
/* ETA je drugi red istog chipa, tiši od statusa: status je „tvoja vožnja",
   ETA je „koliko traje". Zaseban chip bi na uskoj pločici pojeo kartu. */
.logi-chip-eta { display:block; margin-top:2px; font-weight:600; color:var(--color-deep-mauve,#b56b8d); font-variant-numeric:tabular-nums; }
body.dark-mode .logi-chip-eta { color:#d18ab0; }

/* POKLONI + POGODNOSTI (gost-specifično, CSS art v3 "go all out" 2026-07-16). */
.gp-give { grid-column:3; grid-row:1; padding:0; overflow:hidden; }
.gp-give-half { flex:1; position:relative; display:flex; flex-direction:column; justify-content:flex-end; padding:15px 18px; text-decoration:none; color:inherit; overflow:hidden; transition:box-shadow .18s var(--ease,cubic-bezier(.22,1,.36,1)); }
.gp-give-half + .gp-give-half { border-top:1px solid rgba(107,78,113,0.12); }
.gp-give-gift { background:linear-gradient(135deg, rgba(181,107,141,0.13), rgba(181,107,141,0.02)); }
.gp-give-perk { background:linear-gradient(135deg, rgba(181,107,141,0.13), rgba(181,107,141,0.02)); }
.gp-give-gift:hover, .gp-give-gift:focus-visible { box-shadow:inset 0 0 0 1px rgba(181,107,141,0.22); }
.gp-give-perk:hover, .gp-give-perk:focus-visible { box-shadow:inset 0 0 0 1px rgba(181,107,141,0.30); }
.gp-give-h { font-family:var(--font-serif); font-size:19px; color:#2A1F2E; position:relative; z-index:1; }
.gp-give-s { font-family:var(--font-sans); font-size:12px; color:var(--stone); margin-top:2px; position:relative; z-index:1; }
/* Živi red (podaci iz rute) — isti script glas kao logi-chip / vinyl-guest. */
.gp-give-live { font-family:var(--font-script,'Caveat',cursive); font-size:15.5px; color:#6B4E71; margin-top:2px; position:relative; z-index:1; }
/* "Novo od zadnjeg posjeta" (Rasmus). Ne uvodi se novi rječnik — isti Caveat rez
   kao .gp-give-live, mijenja se SAMO boja: mauve je glas para, sage je signature
   gostinskog portala (guest-portal.css --lilac-400 → --sage-500). Kad red pozeleni,
   prestaje biti "par ti govori" i postaje "portal ti javlja".
   Kontrast mjeren na bijeloj pločici: --sage-700 6,74:1 · --sage-500 samo 3,25:1
   (pada, Caveat je tanki pisani rez) · dark --sage-300 na #252220 = 9,29:1.
   BEZ pulsa, treptanja i disanja — marker je zatečena činjenica, ne događaj koji
   se zbiva dok gost gleda. Puls bi bio pokušaj otvaranja ambient plohe B, a ona je
   zatvorena na znaku (RASMUS_AMBIENT_BUDGET_PRESUDA.md). */
.gp-live--new { color: var(--sage-700, #4d6053); }
body.dark-mode .gp-live--new { color: var(--sage-300, #b7cdac); }
/* Galerija: brojka iza script naslova. Imenica se ne ponavlja — naslov je već kaže. */
.gal-new { font-family:var(--font-script,'Caveat',cursive); font-size:14px; margin-left:8px; white-space:nowrap; }
.gp-give-open { position:absolute; top:10px; left:16px; z-index:1; font-family:var(--font-script,'Caveat',cursive); font-size:16px; color:#6B4E71; opacity:0; transition:opacity .18s var(--ease,cubic-bezier(.22,1,.36,1)); }
.gp-give-half:hover .gp-give-open, .gp-give-half:focus-visible .gp-give-open { opacity:.85; }
/* Fond: tanka lilac linija na ivory podlozi — samo postotak, nikad iznosi. */
.gp-give-fundbar { display:block; position:relative; z-index:1; margin-top:7px; width:min(160px,70%); height:3px; border-radius:99px; background:rgba(182,146,212,0.22); overflow:hidden; }
.gp-give-fundbar i { display:block; height:100%; border-radius:99px; background:var(--lilac-400,#b692d4); }
/* Zlatna KTC poklon kartica (S6 2026-07-19): mini .gkart-face jezik s gift
   stranice — brand gore + hairline + label dolje + točkasti uzorak — umjesto
   ribbon arta. Lift + giftShine sweep ostaju (registar: content tier).
   Art je desno-centriran objekt polovice (kao disc u Pjesmama), tekst dolje-lijevo. */
.gp-give-art { position:absolute; top:50%; right:20px; z-index:0; pointer-events:none; }
/* Prava kartica kao SLIKA — omjer diktira artwork (386x248), ne naše brojke,
   pa se ne izobliči ako se dizajn kartice promijeni. */
/* 132 → clamp(132..182) (Vedran 2026-08-02): deck je nakon proširenja na 1440
   dobio ~77px po stupcu, a kartica je ostala na staroj mjeri i djelovala
   izgubljeno u polovici. Raste sa širinom, na uskom ekranu ostaje ista. */
.gp-give-art--gift { width:clamp(132px,11.5vw,182px); border-radius:9px; overflow:hidden;
  transform:translateY(-50%) rotate(-7deg); line-height:0;
  box-shadow:0 10px 22px -8px rgba(155,120,40,0.5);
  transition:transform .3s var(--ease,cubic-bezier(.22,1,.36,1)), box-shadow .3s var(--ease,cubic-bezier(.22,1,.36,1)); }
.gp-give-art--gift img { width:100%; height:auto; display:block; }
.gp-give-gift:hover .gp-give-art--gift { transform:translateY(calc(-50% - 4px)) rotate(-3deg) scale(1.04);
  box-shadow:0 16px 30px -10px rgba(155,120,40,0.55), inset 0 1px 0 rgba(255,255,255,0.45); }
.gp-gift-shine { position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(115deg, transparent 32%, rgba(255,255,255,0.6) 48%, rgba(255,255,255,0.22) 54%, transparent 66%);
  transform:translateX(-110%); }
.gp-give-gift:hover .gp-gift-shine { animation:giftShine .48s var(--ease,cubic-bezier(.22,1,.36,1)) forwards; }
@keyframes giftShine { to { transform:translateX(110%); } }
/* Kupon: prave perforacije (mask notchevi na pola visine) + ✦ stub iza
   dashed perforacije; sjena preko drop-shadow (prati izrezani obris). */
.gp-give-art--perk { width:142px; height:68px; border-radius:10px;
  transform:translateY(-50%) rotate(6deg);
  background:#fffdf6; border:1.5px dashed rgba(181,107,141,0.7); color:#b58a2e;
  display:flex; align-items:stretch;
  font-family:var(--font-serif); font-size:15.5px; letter-spacing:0.04em;
  filter:drop-shadow(0 8px 10px rgba(155,120,40,0.32));
  transition:transform .3s var(--ease,cubic-bezier(.22,1,.36,1)), filter .3s var(--ease,cubic-bezier(.22,1,.36,1));
  -webkit-mask:radial-gradient(circle 7px at 0 50%, transparent 6.5px, #000 7px),
               radial-gradient(circle 7px at 100% 50%, transparent 6.5px, #000 7px);
  -webkit-mask-composite:source-in;
          mask:radial-gradient(circle 7px at 0 50%, transparent 6.5px, #000 7px),
               radial-gradient(circle 7px at 100% 50%, transparent 6.5px, #000 7px);
          mask-composite:intersect; }
.gp-perk-stub { display:flex; align-items:center; justify-content:center; width:38px; flex-shrink:0;
  font-weight:400; border-right:1.5px dashed rgba(181,107,141,0.55); }
.gp-perk-txt { flex:1; display:flex; align-items:center; justify-content:center; }
.gp-give-perk:hover .gp-give-art--perk { transform:translateY(calc(-50% - 4px)) rotate(2deg) scale(1.05);
  filter:drop-shadow(0 13px 14px rgba(155,120,40,0.4)); }
/* Stvarne pogodnosti (S6): 1-2 mini kupona s nazivom u art zoni — isti
   zlatni kupon-jezik (dashed rub, ✦ stub), naziv jedan red s ellipsis. */
.gp-perk-minis { position:absolute; top:50%; right:16px; transform:translateY(-50%);
  z-index:0; display:flex; flex-direction:column; gap:7px; width:min(158px,52%);
  pointer-events:none; transition:transform .3s var(--ease,cubic-bezier(.22,1,.36,1)); }
.gp-perk-mini { display:flex; align-items:center; min-height:30px;
  background:#fffdf6; border:1.5px dashed rgba(181,107,141,0.7); border-radius:8px;
  filter:drop-shadow(0 5px 7px rgba(155,120,40,0.22)); }
.gp-perk-mini:nth-child(1) { transform:rotate(2deg); }
.gp-perk-mini:nth-child(2) { transform:rotate(-2deg); }
.gp-perk-mini b { flex-shrink:0; width:24px; text-align:center; font-weight:400;
  font-family:var(--font-serif); font-size:12px; color:#b58a2e;
  border-right:1.5px dashed rgba(181,107,141,0.5); align-self:stretch;
  display:flex; align-items:center; justify-content:center; }
.gp-perk-mini i { flex:1; min-width:0; padding:4px 9px; font-style:normal;
  font-family:var(--font-sans); font-size:11px; line-height:1.3; color:var(--charcoal);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gp-give-perk:hover .gp-perk-minis { transform:translateY(calc(-50% - 3px)); }
/* Fotografija vendora — JEDNA, u punoj mjeri kartice, s imenom ispod.
   Lepeza od tri (58-86px, rotirane, preklopljene) je maknuta: na toj mjeri se
   prepoznaje boja, ne predmet, a bez imena i alt teksta bila je ukras. */
.gp-perk-shot { position:absolute; top:50%; right:18px; transform:translateY(-50%);
  z-index:0; width:clamp(84px,10.5vw,124px); pointer-events:none;
  display:flex; flex-direction:column; align-items:center; gap:6px;
  transition:transform .3s var(--ease,cubic-bezier(.22,1,.36,1)); }
.gp-perk-shot img { width:100%; aspect-ratio:3/4; object-fit:cover; display:block;
  border-radius:10px; background:var(--ivory,#ede8df);
  box-shadow:0 10px 22px -10px rgba(74,52,80,0.45), 0 0 0 3px rgba(255,255,255,0.92); }
.gp-perk-shot b { max-width:100%; font-family:var(--font-sans); font-size:11px; font-weight:600;
  color:var(--stone,#8c7f6e); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gp-give-perk:hover .gp-perk-shot { transform:translateY(calc(-50% - 4px)); }
body.dark-mode .gp-perk-shot img { background:#2A2520; box-shadow:0 10px 22px -10px rgba(0,0,0,0.6), 0 0 0 3px rgba(37,34,32,0.92); }
body.dark-mode .gp-perk-shot b { color:#9B9188; }
@media (prefers-reduced-motion: reduce){ .gp-perk-shot { transition:none; }
  .gp-give-perk:hover .gp-perk-shot { transform:translateY(-50%); } }
@media (prefers-reduced-motion: reduce){
  .gp-give-half, .gp-give-open, .gp-give-art--gift, .gp-give-art--perk, .gp-perk-minis { transition:none; }
  .gp-give-gift:hover .gp-gift-shine { animation:none; }
  .gp-give-gift:hover .gp-give-art--gift { transform:translateY(-50%) rotate(-7deg); }
  .gp-give-perk:hover .gp-give-art--perk { transform:translateY(-50%) rotate(6deg); }
  .gp-give-perk:hover .gp-perk-minis { transform:translateY(-50%); }
}

/* VINYL / PJESME — 1:1 couple (disc 164, label 78). */
.gp-vinyl { grid-column:3; grid-row:2; align-items:stretch; text-align:center; }
/* `overflow:hidden` je OGRADA, ne kroj (Vedran 31.8.2026.: „za pjesme ima kao
   2 teksta na CTA"). Stage je jedini rastezljiv član pločice (`flex:1`) i
   smije se stisnuti do nule (`min-height:0`), ali djeca mu ne popuštaju: ploča
   je `flex-shrink:0`, a tekstualni redci imaju automatski minimum jednak
   sadržaju. Na niskom prozoru kutija padne ispod visine sadržaja i višak se
   dosad iscrtavao IZVAN nje, prema dolje (`justify-content:flex-start` na
   ≥901px) — ravno na `.gp-vfoot`, koje je prozirno, pa se poruka praznog
   stanja čitala KROZ pilulu „Predloži pjesmu". Ograda drži prelijevanje unutar
   pločice; da se ne bi imalo što prelijevati, prazno stanje niže skida ploču. */
.vinyl-stage { display:flex; flex-direction:column; align-items:center; gap:8px; flex:1; min-height:0; justify-content:center; overflow:hidden; }
/* PRAZNO STANJE NEMA GRAMOFON. Ploča bez ijedne pjesme je najveći element
   kartice i jedini bez ijedne radnje: naslovnice nema, igla ne svira, gumb je
   `opacity:0`. Njezinih ~150px je uz to i razlog zbog kojeg stage uopće
   prelije. Mobitel to već rješava ovako — `.gp-vsug` nosi poziv bez ploče —
   pa desktop ovdje samo preuzima obrazac koji kartica već ima. */
.vinyl-stage.is-empty { justify-content:center; }
.vinyl-stage.is-empty .vinyl-disc-wrap,
.vinyl-stage.is-empty .vinyl-titlerow,
.vinyl-stage.is-empty .vinyl-artist,
.vinyl-stage.is-empty .vinyl-guest { display:none; }
/* Desktop: ploča se steže i sjeda GORE (1:1 couple:1009-1016 + .vinyl-stage
   flex-start). Sa 164px i `justify-content:center` je kartica visoka ~490px
   držala ~135px praznog papira iznad i ispod ploče — najpraznija pločica decka.
   Oslobođeni prostor uzima poziv na predlaganje ispod. */
@media (min-width: 901px) {
  .vinyl-stage { justify-content:flex-start; gap:10px; }
  .vinyl-disc-wrap { width:140px; height:140px; }
  .vinyl-disc { width:140px; height:140px; }
  .vinyl-label { width:66px; height:66px; }
  .vinyl-tonearm::after { height:58px; }
  .vinyl-play { width:42px; height:42px; }
}
/* Podnožje kartice je POZIV, ne popis (Vedran 2026-08-02): „sve pjesme →" je
   gosta vodio gledati tuđi izbor; „Predloži pjesmu" ga zove da doda svoju.
   Slušanje ostaje, ali kao tiša druga radnja u istom redu. */
.gp-vfoot { display:flex; flex-direction:column; align-items:stretch; gap:6px; flex-shrink:0; margin-top:8px;
  border-top:1px dashed rgba(107,78,113,0.22); padding-top:9px; }
/* GHOST, ne ispunjen (Rasmus B2): na decku smije stajati točno JEDAN ispunjen
   mauve gumb, a to je „Potvrdi dolazak" — glagol ove stranice. Ovaj je bio i
   ispunjen i veći (13.5px pune širine prema 12.5px inline), pa je u prvom
   pogledu pobjeđivao poziv koji para stvarno zanima. Ostaje gumb, prestaje biti
   primarni. */
.gp-vfoot-cta { display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:9px 16px; border-radius:999px; text-decoration:none;
  background:transparent; border:1px solid rgba(181,107,141,0.45);
  color:var(--color-deep-mauve,#b56b8d);
  font-family:var(--font-sans); font-size:12.5px; font-weight:600;
  transition:background .16s var(--ease,cubic-bezier(.22,1,.36,1)); }
.gp-vfoot-cta:hover { background:rgba(181,107,141,0.08); }
body.dark-mode .gp-vfoot-cta { border-color:#3A3530; color:#d18ab0; }
body.dark-mode .gp-vfoot-cta:hover { background:rgba(181,107,141,0.14); }
.gp-vfoot-cta svg { width:16px; height:16px; flex-shrink:0; }
.gp-vfoot-sub { margin:0; font-family:var(--font-script,'Caveat',cursive); font-size:15px; color:#6B4E71; text-align:center; }
.gp-vfoot-sub a { color:inherit; text-decoration:none; border-bottom:1px dotted rgba(107,78,113,.45); }
body.dark-mode .gp-vfoot { border-top-color:#3A3530; }
body.dark-mode .gp-vfoot-sub { color:#c99fb0; }
.vinyl-disc-wrap { position:relative; width:164px; height:164px; flex-shrink:0; }
.vinyl-disc { position:absolute; inset:0; border-radius:50%; background:radial-gradient(circle at 50% 50%, #4a4250 0 14%, #1b171f 14% 100%); box-shadow:0 10px 26px -8px rgba(0,0,0,0.55), inset 0 0 0 1px rgba(255,255,255,0.07); }
.vinyl-grooves { position:absolute; inset:9px; border-radius:50%; background:repeating-radial-gradient(circle at 50% 50%, rgba(255,255,255,0.14) 0 1px, rgba(255,255,255,0.02) 1px 4.5px); pointer-events:none; }
.vinyl-disc.spinning { animation:vinylspin 3.2s linear infinite; }
@keyframes vinylspin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce){ .vinyl-disc.spinning{ animation:none; } }
.vinyl-label { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:78px; height:78px; border-radius:50%; overflow:hidden; z-index:2; background:var(--color-deep-mauve,#b56b8d); display:flex; align-items:center; justify-content:center; box-shadow:inset 0 0 0 3px rgba(0,0,0,0.25), 0 0 0 5px rgba(20,16,22,0.55); }
.vinyl-label::after { content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:9px; height:9px; border-radius:50%; background:#1b171f; z-index:3; }
.vinyl-label img { width:100%; height:100%; object-fit:cover; }
.vinyl-tonearm { position:absolute; top:0; right:-1px; width:14px; height:14px; z-index:4; pointer-events:none; transform:rotate(-16deg); transition:transform .45s var(--ease,cubic-bezier(.22,1,.36,1)); }
.vinyl-tonearm::before { content:''; position:absolute; top:0; right:0; width:14px; height:14px; border-radius:50%; background:linear-gradient(135deg,#e7e2ea,#b9b2c0); box-shadow:0 1px 4px rgba(0,0,0,0.4); }
.vinyl-tonearm::after { content:''; position:absolute; top:10px; right:5px; width:3.5px; height:66px; border-radius:3px; background:linear-gradient(180deg,#d8d2dc,#9a93a3); transform-origin:top center; transform:rotate(20deg); box-shadow:0 1px 3px rgba(0,0,0,0.3); }
.vinyl-disc-wrap.is-playing .vinyl-tonearm { transform:rotate(8deg); }
.vinyl-play { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:46px; height:46px; border-radius:50%; z-index:5; background:rgba(255,255,255,0.97); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; color:#2A1F2E; box-shadow:0 2px 10px rgba(0,0,0,0.4); opacity:0; visibility:hidden; transition:opacity .15s, transform .12s, visibility .15s; }
.vinyl-disc-wrap:hover .vinyl-play, .vinyl-play:focus-visible { opacity:1; visibility:visible; }
.vinyl-play:hover { transform:translate(-50%,-50%) scale(1.08); }
.vinyl-play.is-disabled { opacity:0 !important; }
.vinyl-play .v-ico { width:21px; height:21px; } .vinyl-play .v-play { margin-left:2px; }
.vinyl-meta { width:100%; min-width:0; }
.vinyl-titlerow { display:flex; align-items:center; justify-content:center; gap:4px; min-width:0; }
.vinyl-title { font-family:var(--font-serif); font-weight:500; font-size:16px; color:#2A1F2E; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.25; flex:0 1 auto; min-width:0; max-width:calc(100% - 68px); }
/* Naslov pjesme vodi u Pjesme (Bruno 2026-07-16) — nenametljivo, underline tek na hover. */
a.vinyl-title { text-decoration:none; }
a.vinyl-title:hover, a.vinyl-title:focus-visible { text-decoration:underline; text-underline-offset:3px; text-decoration-color:rgba(107,78,113,0.55); }
.vinyl-nav { background:transparent; border:none; cursor:pointer; color:#6B4E71; font-size:20px; line-height:1; padding:0 4px; }
.vinyl-artist { font-size:12.5px; color:#8A7E72; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vinyl-guest { font-family:var(--font-script,'Caveat',cursive); font-size:15px; color:#6B4E71; margin-top:2px; }
/* Srce uz pjesmu koja svira. Prazno je obris, dano je ispunjeno — jedina
   razlika je ispuna, ne veličina ni položaj, pa se broj ne pomiče pri kliku. */
.vinyl-heart { display:inline-flex; align-items:center; gap:5px; margin-top:7px; padding:5px 12px;
  border-radius:999px; cursor:pointer; background:none;
  border:1px solid rgba(181,107,141,0.35); color:var(--color-deep-mauve,#b56b8d);
  font-family:var(--font-sans); font-size:12.5px; font-weight:600;
  font-variant-numeric:tabular-nums; transition:background .14s ease, border-color .14s ease; }
.vinyl-heart svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.9; }
.vinyl-heart:hover { background:rgba(181,107,141,0.08); }
.vinyl-heart.voted { background:var(--color-deep-mauve,#b56b8d); border-color:var(--color-deep-mauve,#b56b8d); color:#fff; }
.vinyl-heart.voted svg { fill:currentColor; stroke:none; }
.vinyl-heart:disabled { opacity:.55; cursor:default; }
body.dark-mode .vinyl-heart { border-color:#3A3530; color:#d18ab0; }
body.dark-mode .vinyl-heart.voted { background:#b56b8d; border-color:#b56b8d; color:#fff; }
.vinyl-empty-msg { font-size:12.5px; color:var(--stone); font-style:italic; }

/* ── Dark-mode (paritet s #341): bento pločice → tamni papir. ── */
body.dark-mode .gp-tile, body.dark-mode .gp-ticket { background-color:#252220; border-color:#3A3530; box-shadow: 0 1px 0 rgba(255,255,255,0.03) inset, 0 8px 22px -14px rgba(0,0,0,0.55); }
body.dark-mode a.gp-tile:hover { box-shadow: 0 1px 0 rgba(255,255,255,0.03) inset, 0 18px 40px -20px rgba(0,0,0,0.6); }
body.dark-mode .ch { color:#E8DED0; }
body.dark-mode .ch em { color:#c99fb0; }
body.dark-mode .diary-timer { background:rgba(37,34,32,0.85); border-color:#3A3530; }
body.dark-mode .diary-timer .tn { color:#E8DED0; }
body.dark-mode .diary-timer .tl { color:#9B9188; }
body.dark-mode .polaC { background:#2A2520; }
body.dark-mode .polaC .cap { color:#c99fb0; }
body.dark-mode .diary-gallery .gal-title { color:#c99fb0; }
body.dark-mode .diary-gallery .gal-title::before, body.dark-mode .diary-gallery .gal-title::after { background:rgba(201,159,176,0.25); }
body.dark-mode .ph-empty-line1 { color:#9B9188; }
body.dark-mode .gp-ticket-name { color:#E8DED0; }
body.dark-mode .gp-ticket-perf { border-left-color:#3A3530; }
body.dark-mode .gp-ticket-perf::before, body.dark-mode .gp-ticket-perf::after { background:#1A1714; }
body.dark-mode .gp-kd-link { color:#9B9188; }
body.dark-mode .logi-card-top { background:linear-gradient(to bottom, rgba(30,28,26,0.96) 0%, rgba(30,28,26,0.9) 48%, rgba(30,28,26,0.5) 75%, rgba(30,28,26,0)); }
body.dark-mode .logi-card-top .ch span { text-shadow:none; }
/* Preview karte je statična svijetla slika; u tamnoj temi bi bila jedina bijela
   ploha na ekranu. Deklaracija je doslovno parova (couple-dashboard.css), da se
   dvije iste kartice ne raziđu. Gost je za istu karticu portao tamni tretman
   trake, poveznice i chipa, a samu sliku ispustio. */
body.dark-mode .logi-map-img { filter: brightness(.72) saturate(.85) contrast(1.04); }
body.dark-mode .logi-open { color:#c99fb0; }
body.dark-mode .logi-chip { background:rgba(30,28,26,0.92); border-color:#3A3530; color:#D4C4B0; }
body.dark-mode .gp-give-gift { background:linear-gradient(135deg, rgba(181,107,141,0.20), rgba(181,107,141,0.05)); }
body.dark-mode .gp-give-perk { background:linear-gradient(135deg, rgba(181,107,141,0.20), rgba(181,107,141,0.05)); }
body.dark-mode .gp-give-h { color:#E8DED0; }
body.dark-mode .gp-give-s { color:#9B9188; }
body.dark-mode .gp-give-half + .gp-give-half { border-top-color:#3A3530; }
body.dark-mode .gp-give-art--perk { background:#252220; }
body.dark-mode .gp-perk-mini { background:#252220; border-color:rgba(181,107,141,0.45); }
body.dark-mode .gp-perk-mini i { color:#D4C4B0; }
body.dark-mode .gp-give-live { color:#c99fb0; }
body.dark-mode .gp-give-open { color:#c99fb0; }
body.dark-mode .gp-give-fundbar { background:rgba(182,146,212,0.18); }
body.dark-mode .vinyl-title { color:#E8DED0; }
body.dark-mode .vinyl-artist { color:#9B9188; }
body.dark-mode .vinyl-guest { color:#c99fb0; }
body.dark-mode .more-c { color:#c99fb0; border-top-color:#3A3530; }
body.dark-mode .gp-dualbar { background:rgba(181,107,141,0.12); color:#9B9188; }
/* Priča je jedini blok ove kartice koji je ostao bez tamne teme, a podloga se
   mijenja (`.gp-tile` gore na #252220). Naslov i pitanje su ondje `#2A1F2E` na
   `#252220` — kontrast 1.00:1, dakle tekst koji fizički nestane. Boje idu iz
   ISTIH tokena kojima se u tamnoj temi vode imena i datum iste kartice
   (dalia-hero-vjencanje.css:86-88), pa priča prati karticu u kojoj sjedi
   umjesto da uvede četvrtu paletu. `.gp-prica-p` i `.gp-prica-fun` nemaju
   vlastiti token, pa u svijetloj temi ostaju kakvi jesu. */
body.dark-mode .gp-prica { border-top-color:#3A3530; }
body.dark-mode .gp-prica-nas, body.dark-mode .gp-prica-q { color:var(--hero-ink-dark); }
body.dark-mode .gp-prica-p, body.dark-mode .gp-prica-fun { color:var(--hero-date-dark); }
body.dark-mode .gp-prica-pod, body.dark-mode .gp-prica-p .tko { color:var(--hero-meta-dark); }

/* ── Mobitel: deck escapea u prirodan scroll ── */
@media (max-width: 900px) {
  .gp-stage { height:auto; min-height:0; overflow:visible; margin:0; padding:0; display:block; }
  .gp-grid { display:flex; flex-direction:column; gap:12px; }
  .gp-tile, .gp-kd { min-height:auto; }
  .gp-gal { min-height:330px; } .diary-gallery .stack { min-height:280px; }
  /* Paritet s couple ≤979px ("60% rez"): script naslov pada na mobitelu. */
  .diary-gallery .gal-title { display:none; }
  .gp-logi { min-height:170px; } .gp-vinyl { min-height:300px; }
  .gp-give-half { min-height:128px; }
  .gp-kd-cta { padding:12px 18px; }

  /* Naslovna na mobitelu (vrpca) je u `dalia-hero-vjencanje.css`. */
}

/* ── Breakpoint prekidači (Vedran 2026-07-29) ──────────────────────────────
   `.gp-only-mob` / `.gp-hide-mob` postoje jer desktop bento ima FIKSNI 3×2 grid
   s izričitim pozicijama: pločica koju Jinja izbaci ostavila bi rupu u decku, a
   sedma pločica bi ga razvalila. Zato je razlika CSS-om, ne granama u templateu.
   Prag je 900px (isti kao ostatak ovog fajla), ne 768px iz shella — deck se lomi
   ranije od chromea. */
.gp-only-mob, .gp-only-mob-i { display:none; }
@media (max-width: 900px) {
  .gp-hide-mob { display:none !important; }
  .gp-only-mob { display:flex; }
  .gp-only-mob-i { display:inline; }
  .gp-only-desk { display:none; }

  /* Smještaj — mobilna kartica (na desktopu je dio Karte gostiju). */
  .gp-smj { min-height:0; }
  .gp-smj-body { display:flex; align-items:flex-start; gap:11px; margin-top:2px; }
  .gp-smj-ic { width:26px; height:26px; flex-shrink:0; color:var(--color-deep-mauve,#b56b8d); opacity:.75; }
  .gp-smj-txt { font-family:var(--font-sans); font-size:13px; line-height:1.45; color:var(--charcoal); }
  body.dark-mode .gp-smj-txt { color:#D4C4B0; }

  /* Pjesme — radnja umjesto ploče. */
  .gp-vinyl { min-height:0; }
  .gp-vsug { flex-direction:column; align-items:stretch; gap:8px; margin-top:4px; }
  .gp-vsug-cta { display:flex; align-items:center; justify-content:center; gap:9px;
    padding:13px 16px; border-radius:12px; text-decoration:none;
    background:var(--color-deep-mauve,#b56b8d); color:#fff;
    font-family:var(--font-sans); font-size:14.5px; font-weight:600; }
  .gp-vsug-cta:active { transform:scale(.985); }
  .gp-vsug-cta svg { width:19px; height:19px; }
  .gp-vsug-sub { margin:0; font-family:var(--font-sans); font-size:12px; color:var(--stone); text-align:center; }
  .gp-vsug-listen { display:flex; align-items:center; justify-content:center; gap:8px;
    padding:10px 14px; border-radius:12px; text-decoration:none;
    border:1px solid rgba(181,107,141,0.28); color:#6B4E71;
    font-family:var(--font-sans); font-size:13px; font-weight:600; }
  .gp-vsug-listen svg { width:15px; height:15px; }
  body.dark-mode .gp-vsug-listen { border-color:#3A3530; color:#c99fb0; }
}