/* =====================================================================
   Učiteľský Šuflík – vzhľad „17. november“ (Deň boja za slobodu a demokraciu)
   Načítava sa LEN pri dizajne november17, po system.css a zosit.css: zošit s krúžkovou väzbou ostáva.

   Smer: teplý krémový papier, námornícka modrá typografia, vínovo červené akcenty, zlato kľúčov len
   v ilustrácii. Symbolika s mierou – otvorená kovaná brána, zväzok kľúčov so stužkou v slovenských
   farbách, šuflík s papiermi a roztrhnutá reťaz. Bez pátosu, bez agresívnych výziev.

   Svetlý režim (predvolený – téma stojí na papieri): papier #f8f3e8, atrament #1b2a4a (12,9 : 1),
     vínová #8b1e2d (8,4 : 1), tlmený text #5a6173 (5,5 : 1), tlačidlo #1b2a4a s bielym textom (13,6 : 1).
   Tmavý režim („námornícka noc“): strana #141d33, krémový text #f3ede1 (14,5 : 1),
     vínová v texte #eb9aa4 (7,4 : 1), plné vínové tlačidlo #9b2436 s bielym textom (7,6 : 1),
     hlavné tlačidlo krémové #f1e8d6 s námorníckym textom (12,4 : 1).
   Hlavička ostáva ako na celom webe – ružové „Registrácia“ je značka Šuflíka.
   ===================================================================== */

/* ---------- Tmavý režim: námornícka noc ---------- */
:root {
    --nv-navy: #f3ede1;          /* „atrament“ = hlavný text a nadpisy */
    --nv-wine: #eb9aa4;          /* vínová v texte */
    --nv-wine-solid: #9b2436;    /* plné plochy (tlačidlá) */
    --nv-wine-solid-hover: #84202f;
    --nv-gold: #d9b15c;
    --nv-muted: #b5bdd0;
    --nv-cta-bg: #f1e8d6;
    --nv-cta-fg: #1b2a4a;
    --nv-cta-hover: #ffffff;
    --nv-line: rgba(243, 237, 225, 0.16);

    /* ilustrácia */
    --nv-iron: #9fb0d2;
    --nv-iron-2: #7f92b8;
    --nv-bar: #d4707e;
    --nv-cab: #2c3d66;
    --nv-cab-2: #3a4e7c;
    --nv-cab-edge: #9fb0d2;
    --nv-sheet: #f6efe0;
    --nv-sheet-line: rgba(27, 42, 74, 0.22);
    --nv-glow: rgba(233, 196, 120, 0.2);
    --nv-glow-0: rgba(233, 196, 120, 0);
    --nv-ground: rgba(243, 237, 225, 0.14);
    --nv-chain: #8d9bb8;
    --nv-key-gold: #e2b85a;
    --nv-key-gold-2: #b98a2c;
    --nv-key-silver: #d5dbe6;
    --nv-key-silver-2: #9aa5b8;
    --nv-leaf: #b9814a;

    --zs-desk: #0b1222;
    --zs-page: #151e35;
    --zs-page-2: #111a2d;
    --zs-rule: rgba(200, 212, 240, 0.06);
    --zs-margin: rgba(235, 154, 164, 0.38);
    --zs-glow-1: rgba(217, 177, 92, 0.07);
    --zs-glow-2: rgba(150, 175, 230, 0.05);
    --zs-glow-3: rgba(235, 154, 164, 0.04);
    --zs-page-edge: rgba(200, 212, 240, 0.1);
    --zs-nav: rgba(17, 26, 45, 0.9);
    --zs-nav-border: rgba(200, 212, 240, 0.12);
    --zs-footer: rgba(10, 16, 30, 0.96);

    --m-bg: #111a2d;
    --m-surface: #19233d;
    --m-surface-2: #1e2946;
    --m-input: #121b30;
    --m-border: rgba(200, 212, 240, 0.14);
    --m-border-strong: rgba(200, 212, 240, 0.24);
    --color-white: #f3ede1;
    --color-ink: #111a2d;
    --color-slate-950: #111a2d;
    --color-slate-900: #19233d;
    --color-slate-800: #263252;
    --color-slate-700: #354266;
    --color-slate-600: #515e85;
    --color-slate-500: #a3acc2;
    --color-slate-400: #bec5d6;
    --color-slate-300: #d8dce6;
    --color-slate-200: #e8e9ee;
    --color-slate-100: #f3ede1;

    --color-pencil: var(--nv-gold);
    --su-pencil: var(--nv-gold);
}

/* ---------- Svetlý režim: krémový papier ---------- */
[data-theme="light"] {
    --nv-navy: #1b2a4a;
    --nv-wine: #8b1e2d;
    --nv-wine-solid: #8b1e2d;
    --nv-wine-solid-hover: #721826;
    --nv-gold: #7a5512;
    --nv-muted: #5a6173;
    --nv-cta-bg: #1b2a4a;
    --nv-cta-fg: #ffffff;
    --nv-cta-hover: #24365d;
    --nv-line: rgba(27, 42, 74, 0.18);

    --nv-iron: #1d2b4a;
    --nv-iron-2: #33456e;
    --nv-bar: #8b1e2d;
    --nv-cab: #22325a;
    --nv-cab-2: #2f4372;
    --nv-cab-edge: #14203a;
    --nv-sheet: #fffbf2;
    --nv-sheet-line: rgba(27, 42, 74, 0.2);
    --nv-glow: rgba(226, 178, 92, 0.3);
    --nv-glow-0: rgba(226, 178, 92, 0);
    --nv-ground: rgba(27, 42, 74, 0.1);
    --nv-chain: #59657e;
    --nv-key-gold: #d4a33f;
    --nv-key-gold-2: #9c7120;
    --nv-key-silver: #c9d0dc;
    --nv-key-silver-2: #7e8aa0;
    --nv-leaf: #b06f35;

    --zs-desk: #e9e0cc;
    --zs-page: #f8f3e8;
    --zs-page-2: #f4ede0;
    --zs-rule: rgba(27, 42, 74, 0.085);
    --zs-margin: rgba(139, 30, 45, 0.34);
    --zs-glow-1: rgba(226, 178, 92, 0.1);
    --zs-glow-2: rgba(27, 42, 74, 0.025);
    --zs-glow-3: rgba(139, 30, 45, 0.03);
    --zs-page-edge: rgba(27, 42, 74, 0.1);
    --zs-nav: rgba(248, 243, 232, 0.93);
    --zs-nav-border: rgba(27, 42, 74, 0.1);
    --zs-footer: #efe7d6;

    --m-bg: #f4ede0;
    --m-surface: #fffcf5;
    --m-surface-2: #fbf6ec;
    --m-input: #fbf7ee;
    --m-border: rgba(27, 42, 74, 0.11);
    --m-border-strong: rgba(27, 42, 74, 0.2);
    --color-white: #1b2a4a;          /* nadpisy – námornícky atrament */
    --color-ink: #f8f3e8;
    --color-slate-950: #f4ede0;
    --color-slate-900: #fffcf5;
    --color-slate-800: #e8e0cf;
    --color-slate-700: #d8cfbb;
    --color-slate-600: #a49c8a;
    --color-slate-500: #5a6173;      /* 5,5 : 1 na papieri */
    --color-slate-400: #4a5266;
    --color-slate-300: #38405a;
    --color-slate-200: #283150;
    --color-slate-100: #1e2844;
    --color-slate-50: #1b2a4a;

    --color-pencil: #7a5512;
    --su-pencil: #7a5512;
}

/* Akcent v obsahu = vínová (ružová ostáva len v hlavičke ako značka Šuflíka) */
main, footer, [role="dialog"] {
    --color-pink: var(--nv-wine);
    --color-pink-dark: var(--nv-wine-solid-hover);
    --su-pink: var(--nv-wine);
    --su-pink-solid: var(--nv-wine-solid);
    --su-pink-solid-hover: var(--nv-wine-solid-hover);
}
main :is(.bg-pink, .bg-\[\#ED5686\]) { background-color: var(--nv-wine-solid); }
main :is(.hover\:bg-pink-dark:hover, .bg-pink-dark) { background-color: var(--nv-wine-solid-hover); }
main .shadow-pink\/30, main .shadow-pink\/20 { --tw-shadow-color: color-mix(in srgb, var(--nv-wine-solid) 25%, transparent); }

/* Väzba zošita: obyčajné krúžky (bez zlatenia), strana bez farebných žiar */
.bg-notebook::after {
    background-image:
        radial-gradient(900px 480px at 78% 4%, var(--zs-glow-1), transparent 62%),
        linear-gradient(90deg, transparent 72px, var(--zs-margin) 72px, var(--zs-margin) 73.5px, transparent 73.5px),
        repeating-linear-gradient(to bottom, transparent 0, transparent 33px, var(--zs-rule) 33px, var(--zs-rule) 34px),
        linear-gradient(180deg, var(--zs-page) 0%, var(--zs-page-2) 100%);
}
@media (max-width: 1023px) {
    .bg-notebook::after {
        background-image:
            repeating-linear-gradient(to bottom, transparent 0, transparent 33px, var(--zs-rule) 33px, var(--zs-rule) 34px),
            linear-gradient(180deg, var(--zs-page) 0%, var(--zs-page-2) 100%);
    }
}

/* Hlavička ostáva bez zmeny – značku témy v nej nezobrazujeme */
.nv-nav-mark { display: none !important; }

/* Odkazy a fokus: námornícka modrá / krémová, vždy viditeľný obrys */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 3px solid var(--nv-navy); outline-offset: 3px; }
.text-gradient { background-image: linear-gradient(110deg, var(--nv-navy) 0%, var(--nv-navy) 45%, var(--nv-wine) 100%); }

/* Karty materiálov: pokojné, pri prejdení myšou tenký námornícky okraj */
.material-card:hover {
    border-color: color-mix(in srgb, var(--nv-navy) 35%, transparent);
    box-shadow: var(--m-shadow), 0 24px 44px -28px color-mix(in srgb, var(--nv-navy) 45%, transparent);
}
.material-card .tape { background: color-mix(in srgb, var(--nv-wine) 18%, transparent); }
.zs-chalk { color: color-mix(in srgb, var(--nv-navy) 55%, transparent); text-shadow: none; }
.su-hero-halo { background: radial-gradient(closest-side, var(--nv-glow), transparent 70%) !important; opacity: .5; }

/* Nadpisy stránok (katalóg, detail, košík): námornícke písmo, v katalógu krátka vínová linka pod nadpisom */
main h1.font-display { color: var(--nv-navy); letter-spacing: -0.03em; }
[data-su-page="catalog"] main h1.font-display::after {
    content: ""; display: block; width: 2.6rem; height: 3px; margin-top: .45rem; border-radius: 2px; background: var(--nv-wine);
}
[data-su-page="catalog"] .nv-discover { color: var(--nv-navy); background: color-mix(in srgb, var(--nv-wine) 10%, transparent); }
[data-su-page="catalog"] .nv-discover:hover { box-shadow: inset 0 -2px 0 var(--nv-wine); }
/* Detail: štítky a plné tlačidlá v téme, náhľad v tenkom papierovom ráme */
[data-su-page="detail"] main .font-display.text-2xl { color: var(--nv-navy); }
/* Košík: len farby, žiadne dekorácie */
[data-su-page="cart"] main .font-hand { color: var(--nv-wine); }

/* Pätička: tenká trikolóra a tichá poznámka */
.nv-tricolor { height: 3px; background: linear-gradient(90deg, #ffffff 0 33.33%, #1f4fa0 33.33% 66.66%, #c4202f 66.66% 100%); box-shadow: inset 0 0 0 1px rgba(27, 42, 74, .08); }
.nv-footer-note { font-size: .8rem; line-height: 1.5; color: var(--color-slate-400); max-width: 26rem; }
.nv-footer-note strong { color: var(--nv-wine); font-weight: 800; }

/* =====================================================================
   Úvodná kompozícia (partials/season-november.blade.php)
   ===================================================================== */
.nv-hero {
    width: 100%; display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr); align-items: center;
    gap: 1.5rem 3rem; text-align: left; margin: .5rem 0 2.25rem;
}
.nv-eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .8rem; margin: 0 0 1.15rem; font-size: .9rem; font-weight: 600; color: var(--nv-muted); }
.nv-date { font-size: .78rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--nv-wine); }
.nv-rule { width: 2.25rem; height: 1.5px; background: color-mix(in srgb, var(--nv-wine) 60%, transparent); border-radius: 1px; }
.nv-title {
    margin: 0; font-family: 'Bricolage Grotesque', 'Inter', sans-serif; font-weight: 800; letter-spacing: -.035em; line-height: .98;
    font-size: clamp(2.6rem, 6.2vw, 5.1rem); color: var(--nv-navy); text-wrap: balance;
}
.nv-t1, .nv-t2 { display: block; }
.nv-t2 { color: var(--nv-wine); }
.nv-lead { margin: 1.35rem 0 0; max-width: 30rem; font-size: clamp(1.02rem, 1.45vw, 1.2rem); line-height: 1.6; color: var(--nv-muted); }
.nv-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.1rem; margin-top: 1.8rem; }
.nv-cta {
    display: inline-flex; align-items: center; gap: .6rem; min-height: 52px; padding: .8rem 1.35rem .8rem 1.5rem; border-radius: 14px;
    font-weight: 800; font-size: 1rem; color: var(--nv-cta-fg); background: var(--nv-cta-bg); text-decoration: none;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .08) inset, 0 14px 28px -18px rgba(27, 42, 74, .7);
    transition: background-color .2s ease, transform .2s ease;
}
.nv-cta:hover { background: var(--nv-cta-hover); }
.nv-cta svg { transition: transform .25s ease; }
.nv-cta:hover svg { transform: translateX(3px); }
.nv-cta:focus-visible { outline: 3px solid var(--nv-wine); outline-offset: 3px; }
.nv-count { font-size: .88rem; font-weight: 600; color: var(--nv-muted); }

.nv-art { margin: 0; position: relative; }
.nv-art svg { display: block; width: 100%; height: auto; max-height: 440px; overflow: visible; }

/* ilustrácia – farby z premenných (svetlý aj tmavý režim) */
.nv-i-iron { fill: var(--nv-iron); }
.nv-i-iron-s { stroke: var(--nv-iron); fill: none; }
.nv-i-iron-2 { fill: var(--nv-iron-2); }
.nv-i-bar { stroke: var(--nv-bar); fill: none; }
.nv-i-bar-f { fill: var(--nv-bar); }
.nv-i-cab { fill: var(--nv-cab); }
.nv-i-cab-2 { fill: var(--nv-cab-2); }
.nv-i-cab-edge { stroke: var(--nv-cab-edge); fill: none; }
.nv-i-sheet { fill: var(--nv-sheet); stroke: color-mix(in srgb, var(--nv-iron) 25%, transparent); stroke-width: 1; }
.nv-i-sheet-line { stroke: var(--nv-sheet-line); }
.nv-i-ground { fill: var(--nv-ground); }
.nv-i-ground-s { stroke: var(--nv-ground); fill: none; }
.nv-i-chain { stroke: var(--nv-chain); fill: none; }
.nv-i-gold { fill: var(--nv-key-gold); stroke: var(--nv-key-gold-2); }
.nv-i-silver { fill: var(--nv-key-silver); stroke: var(--nv-key-silver-2); }
.nv-i-gold-s { stroke: var(--nv-key-gold); fill: none; }
.nv-i-leaf { fill: var(--nv-leaf); }
.nv-i-label { font: 700 15px/1 'Caveat', cursive; fill: #1b2a4a; }
.nv-i-glow { fill: var(--nv-glow); }

/* jemný pohyb pri prvom načítaní: krídla brány sa dootvoria, šuflík sa vysunie, kľúče dokývu */
.nv-wing { transform-box: view-box; }
.nv-wing-l { transform-origin: 176px 300px; }
.nv-wing-r { transform-origin: 384px 300px; }
.nv-drawer { transform-box: view-box; }
.nv-keys { transform-box: view-box; transform-origin: 397px 197px; }
@media (prefers-reduced-motion: no-preference) {
    html:not(.su-no-intro) .nv-wing { animation: nv-open 1.6s cubic-bezier(.2, .8, .25, 1) .15s both; }
    html:not(.su-no-intro) .nv-drawer { animation: nv-drawer 1.1s cubic-bezier(.2, .8, .25, 1) .55s both; }
    html:not(.su-no-intro) .nv-keys { animation: nv-keys 2.6s cubic-bezier(.25, .7, .3, 1) .35s both; }
    .nv-art:hover .nv-keys { animation: nv-keys-touch 1.8s cubic-bezier(.25, .7, .3, 1) both; }
}
@keyframes nv-open { from { transform: scaleX(.72); } to { transform: none; } }
@keyframes nv-drawer { from { transform: translateY(-14px); } to { transform: none; } }
@keyframes nv-keys { 0% { transform: rotate(9deg); } 30% { transform: rotate(-5deg); } 55% { transform: rotate(2.5deg); } 78% { transform: rotate(-1deg); } 100% { transform: none; } }
@keyframes nv-keys-touch { 0% { transform: none; } 20% { transform: rotate(-4deg); } 45% { transform: rotate(2.5deg); } 70% { transform: rotate(-1deg); } 100% { transform: none; } }

/* Vyhľadávanie a predmety pod úvodom – teplý papier, zelené tlačidlo ostáva */
[data-su-page="home"] .su-hero-search { background: var(--m-surface); border-color: var(--m-border-strong); }
[data-theme="light"][data-su-page="home"] .su-hero-search { box-shadow: 0 0 0 6px color-mix(in srgb, var(--nv-navy) 5%, transparent), 0 18px 36px -24px rgba(27, 42, 74, .35); }
.su-season-all { color: var(--nv-navy) !important; }

@media (max-width: 900px) {
    .nv-hero { grid-template-columns: 1fr; gap: .25rem; margin: 0 0 1.4rem; }
    .nv-eyebrow { margin-bottom: .8rem; font-size: .82rem; }
    .nv-title { font-size: clamp(2.5rem, 12vw, 3.6rem); }
    .nv-lead { margin-top: 1rem; }
    .nv-actions { margin-top: 1.25rem; }
    .nv-cta { width: 100%; justify-content: center; }
    .nv-count { width: 100%; text-align: center; }
    .nv-art { order: 2; max-width: 310px; width: 100%; margin: .5rem auto -.5rem; }
    .nv-art .nv-hide-sm { display: none; }
}

/* Mobil: brána ako malá ilustrácia nad nadpisom, pod ňou krátky text, tlačidlo a hneď vyhľadávanie */
@media (max-width: 640px) {
    .nv-hero { margin: 0 0 .75rem; gap: 0; }
    .nv-art { order: -1; display: block; width: 74%; max-width: 270px; margin: -2.4rem auto .1rem; }
    .nv-rule { display: none; }
    .nv-art svg { display: block; width: 100%; height: auto; }
    .nv-eyebrow { margin-bottom: .55rem; font-size: .78rem; justify-content: center; text-align: center; flex-wrap: wrap; }
    .nv-copy { text-align: center; }
    .nv-title { font-size: clamp(2.3rem, 11vw, 2.9rem); line-height: 1.02; }
    .nv-lead { margin: .7rem auto 0; font-size: 1rem; line-height: 1.5; max-width: 22rem; }
    .nv-actions { margin-top: 1rem; gap: .4rem; }
    .nv-cta { padding-top: .85rem; padding-bottom: .85rem; }
    .nv-count { font-size: .8rem; }
}

/* =====================================================================
   „Čo sloboda prináša do triedy“ (partials/november-classroom) – rovnaké farby ako úvod
   ===================================================================== */
:root { --nv-ink: var(--nv-navy); --nv-door: #a9bbe0; --nv-yellow: var(--nv-gold); --nv-red: var(--nv-wine); --nv-paper-art: #19233d; --nv-red-text: var(--nv-wine); }
[data-theme="light"] { --nv-door: #1b2a4a; --nv-paper-art: #fffcf5; }

.nv-class-head { max-width: 40rem; margin-bottom: 1.6rem; }
.nv-class-kicker { font-size: 1.35rem; color: var(--nv-wine); margin: 0; transform: rotate(-1deg); transform-origin: left; }
.nv-class-title { margin: .15rem 0 .5rem; font-family: 'Bricolage Grotesque', 'Inter', sans-serif; font-size: clamp(1.6rem, 3.4vw, 2.4rem); font-weight: 800; letter-spacing: -.02em; color: var(--nv-ink); }
.nv-class-note { margin: 0; font-size: .92rem; line-height: 1.55; color: var(--nv-muted); }
.nv-line { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; padding-top: 1.6rem; }
.nv-line-string { position: absolute; inset: 0 0 auto; width: 100%; height: 42px; color: color-mix(in srgb, var(--nv-ink) 35%, transparent); }
.nv-ticket { position: relative; transform: rotate(var(--tilt, 0deg)); transform-origin: 50% 0; transition: transform .5s cubic-bezier(.16, 1, .3, 1); }
.nv-ticket:has(.nv-ticket-btn[aria-expanded="true"]) { transform: rotate(0deg); }
.nv-ticket-pin { position: absolute; top: -26px; left: 50%; width: 2px; height: 34px; margin-left: -1px; background: color-mix(in srgb, var(--nv-ink) 45%, transparent); z-index: 1; border-radius: 2px; }
.nv-ticket-btn { width: 100%; display: grid; gap: .35rem; text-align: left; cursor: pointer; padding: 1.9rem 1.25rem 1.1rem; position: relative; min-height: 130px; color: var(--nv-ink); border: 0;
    clip-path: polygon(16% 0, 84% 0, 100% 18%, 100% 100%, 0 100%, 0 18%);
    background:
        radial-gradient(circle at 50% 13px, transparent 6px, color-mix(in srgb, var(--nv-tone) 85%, #000 0%) 6.5px 8.5px, transparent 9px),
        linear-gradient(to top, var(--nv-tone) 0 5px, transparent 5px),
        repeating-linear-gradient(to bottom, transparent 0 25px, color-mix(in srgb, var(--nv-ink) 6%, transparent) 25px 26px),
        var(--nv-paper-art);
    filter: drop-shadow(0 1px 0 color-mix(in srgb, var(--nv-ink) 16%, transparent)) drop-shadow(0 8px 14px rgba(27, 42, 74, .08)); }
.nv-tag-blue { --nv-tone: var(--nv-door); } .nv-tag-yellow { --nv-tone: var(--nv-yellow); } .nv-tag-red { --nv-tone: var(--nv-red); }
.nv-ticket-n { font-family: 'Caveat', cursive; font-size: 1.2rem; line-height: 1; color: var(--nv-muted); }
.nv-ticket-thought { font-family: 'Bricolage Grotesque', 'Inter', sans-serif; font-size: clamp(1.25rem, 2.4vw, 1.6rem); font-weight: 800; line-height: 1.15; letter-spacing: -.015em; }
.nv-ticket-more { font-size: .9rem; min-height: 24px; font-weight: 700; color: var(--nv-wine); text-decoration: underline; text-underline-offset: 3px; }
.nv-ticket-btn:focus-visible { outline: 3px solid var(--nv-navy); outline-offset: 3px; }
.nv-ticket-btn[aria-expanded="true"] .nv-ticket-more { color: var(--nv-ink); }
.nv-ticket-q { margin: .6rem .3rem 0; font-size: 1rem; line-height: 1.5; color: var(--nv-ink); font-weight: 600; }
.nv-ticket-label { display: block; font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--nv-muted); margin-bottom: .15rem; }
@media (max-width: 760px) {
    .nv-line { grid-template-columns: 1fr; gap: 1.4rem; padding-top: .8rem; }
    .nv-line-string, .nv-ticket-pin { display: none; }
    .nv-ticket { transform: none; }
}

/* Režim „Zobraziť pre triedu“ */
.nv-present-row { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; margin-top: 1.8rem; }
.nv-present-open { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: .55rem 1.1rem; border-radius: 999px; font-weight: 700; font-size: .95rem; cursor: pointer;
    color: var(--nv-ink); background: transparent; border: 2px solid color-mix(in srgb, var(--nv-ink) 70%, transparent); }
.nv-present-open:hover { background: color-mix(in srgb, var(--nv-ink) 8%, transparent); }
.nv-present-open:focus-visible, .nv-present-btn:focus-visible, .nv-present-x:focus-visible { outline: 3px solid var(--nv-wine); outline-offset: 3px; }
.nv-present-hint { font-size: .85rem; color: var(--nv-muted); }
.nv-present { width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: var(--nv-paper-art); color: var(--nv-ink); }
.nv-present::backdrop { background: rgba(15, 23, 42, .5); }
.nv-present-inner { box-sizing: border-box; height: 100%; display: grid; grid-template-rows: auto 1fr auto; gap: 1rem; padding: clamp(1rem, 4vw, 3rem); max-width: 72rem; margin: 0 auto; }
.nv-present-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.nv-present-src { margin: 0; font-size: clamp(.85rem, 1.6vw, 1rem); font-weight: 700; color: var(--nv-muted); }
.nv-present-x { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 999px; border: 0; cursor: pointer; background: color-mix(in srgb, var(--nv-ink) 8%, transparent); color: var(--nv-ink); }
.nv-present-slide { align-self: center; padding-left: clamp(1rem, 3vw, 2rem); border-left: 10px solid var(--nv-door); }
.nv-present-slide.nv-tag-yellow { border-left-color: var(--nv-yellow); }
.nv-present-slide.nv-tag-red { border-left-color: var(--nv-wine); }
.nv-present-thought { margin: 0 0 .6rem; font-family: 'Caveat', cursive; font-size: clamp(1.6rem, 4vw, 2.6rem); color: var(--nv-muted); }
.nv-present-q { margin: 0; font-family: 'Bricolage Grotesque', 'Inter', sans-serif; font-weight: 800; font-size: clamp(2rem, 6.5vw, 4.6rem); line-height: 1.12; letter-spacing: -.02em; text-wrap: balance; }
.nv-present-nav { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.nv-present-btn { min-height: 48px; padding: .6rem 1.2rem; border-radius: 999px; font-weight: 700; font-size: clamp(.9rem, 1.8vw, 1.1rem); cursor: pointer; border: 2px solid var(--nv-ink); background: transparent; color: var(--nv-ink); }
.nv-present-btn:disabled { opacity: .35; cursor: default; }
.nv-present-count { font-weight: 800; font-size: clamp(1rem, 2vw, 1.25rem); font-variant-numeric: tabular-nums; }
@media (max-width: 480px) { .nv-present-btn { padding: .55rem .8rem; } }

@media (prefers-reduced-motion: reduce) {
    .nv-wing, .nv-drawer, .nv-keys { animation: none !important; }
    .nv-ticket, .nv-cta, .nv-cta svg { transition: none !important; }
}