/* Galería QR de invitados · estilos del diseño aprobado (portal.css + gal.css) con ajustes para pantalla real */
html,body{margin:0;background:#fff}
/* Estilos tomados del portal de la pareja (public/portal.js). Compartidos por los portales de Bodas, XV, Fotografía y la vista del invitado. */
.pt{--ink:#0a0a0a;--mut:#5f5f66;--line:#e0e0e3;--card:#f5f5f6;--ac:#b45309;background:#fff;color:var(--ink);font-family:"DM Sans",system-ui,sans-serif;line-height:1.4;font-size:15px}
.pt *{box-sizing:border-box}
.pt a{color:var(--ac)}
.pt p{margin:0}
.pt .hd{background:#000;color:#f4f4f5}
.pt .hd>div{max-width:1000px;margin:0 auto;padding:16px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.pt .brand{font-family:"Cormorant Garamond",Georgia,serif;font-size:22px;font-weight:600;letter-spacing:.02em;color:#fff}
.pt .brand small{display:block;font-family:"DM Sans",sans-serif;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#c9c9cf;font-weight:500}
.pt .hd nav{display:flex;gap:4px;flex-wrap:wrap}
.pt .hd nav a{color:#c9c9cf;text-decoration:none;font-size:14px;padding:0 12px;min-height:40px;display:inline-flex;align-items:center;border-radius:999px}
.pt .hd nav a.on{background:#fff;color:#0a0a0a;font-weight:600}
.pt .hero{background:var(--card);border-bottom:1px solid var(--line)}
.pt .hero>div{max-width:1000px;margin:0 auto;padding:40px 24px 32px;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px}
.pt .k{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);font-weight:600}
.pt h1{margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(40px,7vw,68px);font-weight:600;line-height:1;text-wrap:balance}
.pt h2{margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-size:32px;font-weight:600;line-height:1.05}
.pt h3{margin:0;font-size:17px;font-weight:600}
.pt .pill{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 18px 8px 8px;font-size:14px;font-weight:600}
.pt .pill b{min-width:40px;height:40px;padding:0 10px;border-radius:20px;background:#000;color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px}
.pt .main{max-width:1000px;margin:0 auto;padding:28px 24px 64px;display:flex;flex-direction:column;gap:24px}
.pt .card{border:1px solid var(--line);border-radius:16px;padding:22px;background:#fff}
.pt .box{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:clamp(20px,4vw,36px);display:flex;flex-direction:column;gap:16px}
.pt .d14{font-size:14px;color:#46464d}
.pt .s13{font-size:13px;color:var(--mut)}
.pt .tt{display:flex;gap:8px;flex-wrap:wrap}
.pt .tt button{min-height:44px;padding:0 18px;border-radius:999px;border:1px solid #cfcfd4;background:#fff;color:#0a0a0a;font:inherit;font-size:14px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.pt .tt button span{font-size:12px;background:var(--card);border-radius:999px;padding:2px 8px;font-weight:600}
.pt .tt button.on{background:#000;border-color:#000;color:#fff}
.pt .tt button.on span{background:#333;color:#fff}
.pt .bt{min-height:48px;padding:0 22px;border:1px solid #0a0a0a;border-radius:10px;background:#fff;color:#0a0a0a;font:inherit;font-weight:600;font-size:15px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}
.pt .bt.k2{background:#000;color:#fff}
.pt .bt:disabled{opacity:.45;cursor:default}
.pt .chip{font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;background:var(--card);border:1px solid var(--line);color:#3a3a40;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.pt .chip.ok{background:#e8f5ec;border-color:#e8f5ec;color:#14532d}
.pt .chip.wa{background:#fff7ed;border-color:#e3b98a;color:#7c3a06}
.pt .chip.nx{background:#000;border-color:#000;color:#fff}
.pt .bar{height:12px;border-radius:999px;background:#e8e8ea;overflow:hidden}
.pt .bar i{display:block;height:100%;background:#000;border-radius:999px}
.pt .gr{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:14px}
.pt .sg{border:1px solid #cfcfd4;border-radius:14px;padding:20px;background:#fff;display:flex;flex-direction:column;gap:8px}
.pt .sg.on{border-color:#000;box-shadow:inset 0 0 0 1px #000}
.pt .sg .pr{font-family:"Cormorant Garamond",Georgia,serif;font-size:30px;font-weight:600}
.pt .note{display:flex;gap:10px;align-items:flex-start;background:#fff7ed;border:1px solid #f1d2ae;color:#6b3407;border-radius:12px;padding:12px 14px;font-size:14px}
.pt .okn{display:flex;gap:10px;align-items:flex-start;background:#e8f5ec;border:1px solid #c7e6d2;color:#14532d;border-radius:12px;padding:12px 14px;font-size:14px}
.pt .row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pt .sp{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.pt label{display:block;font-size:14px;font-weight:600}
.pt input[type=text]{display:block;width:100%;margin-top:6px;font:inherit;font-size:15px;color:var(--ink);padding:0 14px;height:48px;border:1px solid #cfcfd4;border-radius:10px;background:#fff}
.pt .foot{font-size:12px;color:var(--mut);border-top:1px solid var(--line);padding-top:16px}
/* Componentes de galería compartidos por el CRM y todos los portales. Cambiar aquí actualiza todas las vistas. */
.gg{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px}
.gg.s{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:4px}
.gg.m2{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
.gg.m3{grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}
.gt{position:relative;aspect-ratio:1/1;border-radius:6px;overflow:hidden;background:#d8d2c8;display:block}
.gt.t1{background:#d8d2c8}.gt.t2{background:#c9cfd2}.gt.t3{background:#d6cdc4}.gt.t4{background:#bfc6c1}.gt.t5{background:#cfc6ce}.gt.t6{background:#c4bdb2}
.gt .fn{position:absolute;left:6px;bottom:6px;font:10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:#2a2a2a;background:rgba(255,255,255,.78);padding:4px 6px;border-radius:4px}
.gt .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:rgba(0,0,0,.28)}
.gt.sel{box-shadow:inset 0 0 0 3px #0a0a0a}
.gt.dim{opacity:.45}
.hb{position:absolute;top:6px;right:6px;width:36px;height:36px;border-radius:999px;border:0;background:rgba(255,255,255,.92);color:#0a0a0a;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.hb.on{background:#0a0a0a;color:#fff}
.ck{position:absolute;top:6px;left:6px;width:36px;height:36px;border-radius:999px;border:2px solid #fff;background:rgba(0,0,0,.25);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.ck.on{background:#0a0a0a;border-color:#0a0a0a}
.gv{position:relative;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#1c1c1e;color:#f4f4f5;display:flex;align-items:center;justify-content:center}
.gv .pl{width:64px;height:64px;border-radius:999px;background:rgba(255,255,255,.95);color:#0a0a0a;display:flex;align-items:center;justify-content:center;border:0;cursor:pointer}
.gv .du{position:absolute;right:10px;bottom:10px;font-size:12px;font-weight:600;background:rgba(0,0,0,.6);padding:4px 8px;border-radius:6px}
.gv .tl{position:absolute;left:12px;top:10px;font-size:12px;font-weight:600;letter-spacing:.04em}
.gv.sm{border-radius:6px}
.gv.sm .pl{width:40px;height:40px}
.pgb{height:6px;background:#e6e6e1;border-radius:3px;overflow:hidden}
.pgb i{display:block;height:100%;background:#0a0a0a}
.pgb i.ok{background:#15803d}
.mod{display:flex;gap:4px;padding:6px;background:#fff;border-top:1px solid #e6e6e1}
.mod button{flex:1 1 0;min-height:36px;border-radius:8px;border:1px solid #d4d4d8;background:#fff;font:inherit;font-size:12px;font-weight:600;cursor:pointer;color:#0a0a0a;padding:0 4px}
.mod button.ap{background:#0a0a0a;border-color:#0a0a0a;color:#fff}
.gcard{border-radius:8px;overflow:hidden;border:1px solid #e6e6e1;background:#fff}
.gcard .gt{border-radius:0}
.gcard .by{font-size:11px;color:#5b5b63;padding:6px 8px 0}

/* ajustes de pantalla real */
.pt{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
.pt .hd>div{justify-content:center;padding:12px 16px}
.pt .brand{font-size:18px;text-align:center}
#m{flex:1 1 auto;display:flex;flex-direction:column;width:100%;max-width:520px;margin:0 auto}
.pt .scr{flex:1 1 auto;display:flex;flex-direction:column;gap:14px;padding:24px 20px}
.pt .ld{padding:60px 20px;text-align:center;color:var(--mut)}
.pt .home{background:#f5f5f6;justify-content:space-between;gap:20px;padding:28px 20px 24px}
.pt .home h1{font-size:52px}
.pt .ctr{display:flex;flex-direction:column;gap:10px;text-align:center;align-items:center}
.pt .stk{display:flex;flex-direction:column;gap:10px}
.pt .bt.big{min-height:56px;font-size:16px}
.pt .gt img,.pt .gt video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.pt .gt{cursor:pointer;border:0;padding:0}
.pt .gt .fn{z-index:1}
.pt .err{color:#9a1c1c;font-size:13px}
.pt .up{display:flex;gap:10px;align-items:center}
.pt .up .gt{flex:0 0 48px;cursor:default}
.pt .up>div{flex:1 1 auto;display:flex;flex-direction:column;gap:4px;min-width:0}
.pt .up .s13{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pt .pgb i.er{background:#9a1c1c}
.pt input[type=checkbox]{width:20px;height:20px;margin:2px 0 0;accent-color:#000;flex:none}
.lb{position:fixed;inset:0;background:rgba(0,0,0,.95);z-index:50;display:flex;align-items:center;justify-content:center;font-family:"DM Sans",system-ui,sans-serif}
.lb .st{position:absolute;inset:56px 0 0;display:flex;align-items:center;justify-content:center;padding:0 8px 16px}
.lb img,.lb video{max-width:100%;max-height:100%;display:block;object-fit:contain}
.lb button{position:absolute;min-width:48px;min-height:48px;border-radius:999px;border:0;background:rgba(255,255,255,.92);color:#0a0a0a;font-size:24px;line-height:1;cursor:pointer;z-index:2}
.lb .x{top:6px;right:8px}.lb .pv{left:8px;top:50%;margin-top:-24px}.lb .nx{right:8px;top:50%;margin-top:-24px}
.lb .ct{position:absolute;top:0;left:0;right:0;height:56px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;font-weight:600;letter-spacing:.04em;pointer-events:none}
.pt .hd .logo{display:block;height:44px;width:auto;max-width:70vw}