/* Layout: una columna de celular, mundo de afiche fotocopiado — tinta negra, papel hueso, rojo de serigrafía. Fondo personal por usuario detrás de todo; barra inferior fija. */
:root{
  --ink:#0f0e0c; --ink-2:#1a1814; --ink-3:#2a2722; --line:#3a362e;
  --bone:#e9dfc4; --bone-2:#bbb497; --bone-dim:#8d8770;
  --rust:#d4532e; --rust-ink:#2a120b;
  --mustard:#d6a63c; --ok:#93b46f; --bad:#e0694a;
  --f-display:"Big Shoulders Display","Impact","Arial Narrow",sans-serif;
  --f-body:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-type:"Special Elite","Courier New",ui-monospace,monospace;
  --r:6px; --top-h:58px; --nav-h:64px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{background:var(--ink);color:var(--bone)}
body{font-family:var(--f-body);font-size:15px;line-height:1.45;min-height:100%;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:40;background:var(--ink)}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:100;opacity:.07;mix-blend-mode:screen;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1.4 -.4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--mustard);outline-offset:2px}
a{color:var(--bone)}
.wrap{max-width:520px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.tnum{font-variant-numeric:tabular-nums}
.label{font-family:var(--f-type);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--bone-dim)}
h1,h2,h3{font-family:var(--f-display);text-transform:uppercase;letter-spacing:.01em;line-height:.95;margin:0;text-wrap:balance}
h2{font-size:30px;font-weight:900}
h3{font-size:20px;font-weight:800}
.muted{color:var(--bone-dim)}
.im{background-size:cover;background-repeat:no-repeat}

/* fondo personal */
#bgLayer{position:fixed;inset:0;z-index:-1;pointer-events:none;background-size:cover}
#bgLayer::after{content:"";position:absolute;inset:0;background:var(--ink);opacity:var(--dim,.7)}
#bgLayer.mono{filter:grayscale(1) contrast(1.15)}

/* ---------- login ---------- */
#login{min-height:100vh;display:flex;flex-direction:column;position:relative;overflow:hidden}
#login .art{position:absolute;inset:0 0 auto;height:72vh;background:url(/static/original/image-1.webp) center 20%/cover no-repeat;opacity:.5;
  -webkit-mask-image:linear-gradient(#000 35%,transparent);mask-image:linear-gradient(#000 35%,transparent)}
#login .wrap{position:relative;flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:20px;padding-block:28px 32px;width:100%}
.logo-big{width:min(72%,320px);transform:rotate(-4deg);filter:drop-shadow(0 4px 0 rgba(0,0,0,.6))}
.tag{font-family:var(--f-type);color:var(--bone-2);font-size:15px;max-width:30ch;margin:0}
.panel{background:rgba(15,14,12,.94);border:1px solid var(--line);border-radius:var(--r);padding:18px;display:grid;gap:14px}
.fld{display:grid;gap:6px}
.fld label,.fld .flabel{font-family:var(--f-type);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--bone-2)}
.in{width:100%;background:var(--ink);border:1px solid var(--line);border-radius:4px;padding:12px;font-size:16px;color:var(--bone)}
.in:focus{border-color:var(--bone-2);outline:none}
textarea.in{min-height:90px;resize:vertical;line-height:1.4}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:4px;padding:13px 18px;font-weight:700;font-size:15px;
  background:var(--bone);color:var(--ink);text-decoration:none;letter-spacing:.01em}
.btn:active{transform:translateY(1px)}
.btn.block{width:100%}
.btn.rust{background:var(--rust);color:#fff6ec}
.btn.ghost{background:rgba(15,14,12,.35);color:var(--bone);border:1px solid var(--line)}
.btn.small{padding:8px 12px;font-size:13px}
.btn[disabled]{opacity:.45;pointer-events:none}
.demo-note{font-size:13px;color:var(--bone-dim);border-left:2px solid var(--mustard);padding-left:10px}
.err{color:var(--bad);font-size:13.5px}
.link-btn{background:none;border:0;color:var(--bone-2);font-size:13.5px;text-decoration:underline;text-underline-offset:3px;padding:4px 0}

/* ---------- app shell ---------- */
#app{padding-bottom:calc(var(--nav-h) + 76px + env(safe-area-inset-bottom,0px))}
#app.home{padding-bottom:calc(var(--nav-h) + 24px + env(safe-area-inset-bottom,0px))}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:linear-gradient(var(--ink) 65%,rgba(15,14,12,0))}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:var(--top-h)}
.logo-sm{height:32px;transform:rotate(-4deg)}
.av{--c:var(--bone-2);width:34px;height:34px;border-radius:50%;display:inline-grid;place-items:center;background-color:var(--c);color:var(--ink);
  font-weight:700;font-size:13px;border:2px solid var(--ink);flex:none;background-size:cover}
.av.pic{color:transparent}
.av.sm{width:26px;height:26px;font-size:11px}
.av.lg{width:64px;height:64px;font-size:22px}
.me-btn{display:flex;align-items:center;gap:8px;background:none;border:0;padding:4px;color:var(--bone-2);font-size:13px}
.pill-demo{font-family:var(--f-type);font-size:11px;letter-spacing:.1em;background:var(--mustard);color:var(--ink);padding:2px 7px;border-radius:3px}
.banner{font-size:12.5px;color:var(--ink);background:var(--mustard);padding:7px 12px;border-radius:4px}
.view{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;padding-block:4px 20px}
.view>*{min-width:0}
.sec-h{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px}

/* home hero: llena la pantalla visible */
.hero{position:relative;border-radius:var(--r);overflow:hidden;background:rgba(26,24,20,.78);border:1px solid var(--line);isolation:isolate;
  min-height:calc(100vh - var(--top-h) - var(--nav-h) - 40px);
  min-height:calc(100svh - var(--top-h) - var(--nav-h) - 40px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));
  max-height:760px;display:flex}
.hero.art::before{content:"";position:absolute;inset:0;z-index:-1;background:url(/static/original/image-2.webp) right center/cover no-repeat;opacity:.4;
  -webkit-mask-image:linear-gradient(160deg,transparent 10%,#000 75%);mask-image:linear-gradient(160deg,transparent 10%,#000 75%)}
.hero.t-show{background:rgba(42,18,11,.86);border-color:#5a2616}
.hero-in{padding:18px;display:flex;flex-direction:column;gap:12px;width:100%}
.hero-foot{margin-top:auto;display:grid;gap:14px}
.chip{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-type);font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  padding:3px 9px;border-radius:3px;border:1px solid currentColor;width:max-content;white-space:nowrap}
.chip.show{background:var(--rust);border-color:var(--rust);color:#fff6ec}
.chip.ensayo{color:var(--bone)}
.chip.grabacion{background:var(--mustard);border-color:var(--mustard);color:var(--ink)}
.chip.otro{color:var(--bone-dim)}
.chip.off{color:var(--bone-dim);text-decoration:line-through}
.bigdate{display:flex;align-items:flex-end;gap:14px}
.bigdate .d{font-family:var(--f-display);font-weight:900;font-size:min(30vw,128px);line-height:.78;letter-spacing:-.02em}
.bigdate .mw{font-family:var(--f-display);font-weight:800;font-size:28px;line-height:.95;text-transform:uppercase;padding-bottom:6px}
.bigdate .mw span{display:block;color:var(--bone-2);font-size:21px}
.hero-title{font-family:var(--f-display);font-weight:800;font-size:34px;text-transform:uppercase;line-height:.95;max-width:16ch}
.meta{display:grid;gap:4px;font-size:15px;color:var(--bone-2)}
.meta b{color:var(--bone);font-weight:600}
.count{font-family:var(--f-type);font-size:14px;color:var(--mustard)}
.t-show .count{color:#ffd7c4}
.rsvp{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.faces{display:flex}
.faces .av{margin-right:-8px}
.faces .av.no{opacity:.35}
.rsvp-btns{display:flex;gap:8px;margin-left:auto}
.seg{border:1px solid var(--line);background:rgba(15,14,12,.35);color:var(--bone);border-radius:4px;padding:8px 12px;font-size:13px;font-weight:600}
.seg.on{background:var(--bone);color:var(--ink);border-color:var(--bone)}
.seg.on.neg{background:var(--bad);border-color:var(--bad);color:var(--ink)}
.hero-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px}
.peek{display:flex;justify-content:center;color:var(--bone-dim);font-size:12px;font-family:var(--f-type);letter-spacing:.08em;margin-top:-12px}

/* lists */
.list{display:grid;border-top:1px solid var(--line)}
.row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:13px 2px;border-bottom:1px solid var(--line);
  background:none;border-left:0;border-right:0;border-top:0;text-align:left;width:100%;color:inherit}
.row .dt{width:46px;text-align:center;font-family:var(--f-display);line-height:.9;text-transform:uppercase}
.row .dt b{display:block;font-size:30px;font-weight:900}
.row .dt span{font-size:13px;font-weight:800;color:var(--bone-2)}
.row .main{min-width:0;display:grid;gap:3px}
.row .ttl{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .sub{font-size:13px;color:var(--bone-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .amt{font-weight:700;font-variant-numeric:tabular-nums;text-align:right}
.row.off .ttl{text-decoration:line-through;color:var(--bone-dim)}
.tick{width:4px;align-self:stretch;border-radius:2px;background:var(--bone-2)}
.tick.show{background:var(--rust)} .tick.grabacion{background:var(--mustard)} .tick.otro{background:var(--bone-dim)}
.rowx{grid-template-columns:4px 46px 1fr auto}
.month{font-family:var(--f-type);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--bone-dim);padding:18px 0 8px}

/* stats */
.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.stat{background:rgba(26,24,20,.88);border:1px solid var(--line);border-radius:var(--r);padding:14px;display:grid;gap:6px;min-width:0}
.stat .v{font-family:var(--f-display);font-weight:900;font-size:32px;line-height:.9;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.stat .v.pos{color:var(--ok)} .stat .v.neg{color:var(--bad)}
.stat .s{font-size:12.5px;color:var(--bone-dim)}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tile{background:rgba(26,24,20,.88);border:1px solid var(--line);border-radius:var(--r);padding:14px 10px;display:grid;gap:8px;justify-items:start;
  text-decoration:none;color:var(--bone);font-weight:600;font-size:14px;text-align:left}
.tile svg{width:22px;height:22px;stroke:var(--bone-2);fill:none;stroke-width:1.8}

.filters{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.filters::-webkit-scrollbar{display:none}
.fchip{flex:none;border:1px solid var(--line);background:rgba(15,14,12,.4);color:var(--bone-2);border-radius:99px;padding:7px 14px;font-size:13px;font-weight:600}
.fchip.on{background:var(--bone);color:var(--ink);border-color:var(--bone)}

/* ---------- calendario ---------- */
.cal-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px}
.cal-head h2{text-align:center;font-size:28px}
.navb{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:rgba(15,14,12,.5);color:var(--bone);font-size:20px;line-height:1;display:grid;place-items:center}
.cal-tools{display:flex;gap:8px;align-items:center;justify-content:space-between}
.segs{display:inline-flex;border:1px solid var(--line);border-radius:5px;overflow:hidden;background:rgba(15,14,12,.5)}
.segs button{border:0;background:none;color:var(--bone-2);padding:8px 14px;font-size:13.5px;font-weight:600}
.segs button+button{border-left:1px solid var(--line)}
.segs button.on{background:var(--bone);color:var(--ink)}
.legend{display:flex;gap:6px;flex-wrap:wrap}
.lgd{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:99px;padding:4px 10px 4px 8px;background:rgba(15,14,12,.4);font-size:12.5px;color:var(--bone-2)}
.lgd i{width:9px;height:9px;border-radius:2px;background:var(--bone-2)}
.lgd i.show{background:var(--rust)} .lgd i.grabacion{background:var(--mustard)} .lgd i.otro{background:var(--bone-dim)} .lgd i.ensayo{background:transparent;border:1.5px solid var(--bone)}
.lgd.offl{opacity:.4;text-decoration:line-through}
.mgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-left:1px solid var(--line);border-top:1px solid var(--line);background:rgba(15,14,12,.55);border-radius:var(--r);overflow:hidden}
.mdow{font-family:var(--f-type);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--bone-dim);text-align:center;padding:6px 0;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.mc{min-height:68px;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:none;padding:4px 3px;text-align:left;display:flex;flex-direction:column;gap:2px;color:var(--bone);min-width:0}
.mc .n{font-family:var(--f-display);font-weight:800;font-size:17px;line-height:1;padding:2px 3px;width:max-content;border-radius:3px}
.mc.out{color:var(--bone-dim);opacity:.45}
.mc.today .n{background:var(--rust);color:#fff6ec}
.mc.sel{background:rgba(233,223,196,.12);box-shadow:inset 0 0 0 2px var(--bone)}
.ev{display:block;font-size:10px;font-weight:700;line-height:1.25;padding:1px 3px;border-radius:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-style:normal}
.ev.show{background:var(--rust);color:#fff6ec} .ev.grabacion{background:var(--mustard);color:var(--ink)} .ev.otro{background:var(--ink-3);color:var(--bone-2)}
.ev.ensayo{border:1px solid var(--bone-2);color:var(--bone)} .ev.off{opacity:.4;text-decoration:line-through}
.more{font-size:10px;color:var(--bone-dim);padding-left:3px}
.dayl{display:grid;gap:8px}
.wk{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:rgba(15,14,12,.6)}
.wk-row{display:grid;grid-template-columns:40px repeat(var(--cols),minmax(0,1fr))}
.wk-h{border-bottom:1px solid var(--line)}
.wk-h button{border:0;border-left:1px solid var(--line);background:none;color:var(--bone);padding:6px 0;text-align:center;display:grid;gap:1px}
.wk-h .dw{font-family:var(--f-type);font-size:10.5px;text-transform:uppercase;color:var(--bone-dim)}
.wk-h .dn{font-family:var(--f-display);font-weight:800;font-size:19px;line-height:1}
.wk-h .today .dn{color:var(--rust)}
.wk-ad{border-bottom:1px solid var(--line);min-height:26px}
.wk-ad>div{border-left:1px solid var(--line);padding:3px 2px;display:grid;gap:2px;align-content:start;min-width:0}
.wk-ad .gut,.wk-h .gut{font-family:var(--f-type);font-size:9.5px;color:var(--bone-dim);display:grid;place-items:center;border:0;text-align:center;line-height:1.1}
.wk-scroll{max-height:min(62vh,560px);overflow-y:auto;position:relative}
.wk-body{position:relative}
.wk-body .hrs{position:relative}
.hl{position:absolute;left:0;right:0;font-family:var(--f-type);font-size:10px;color:var(--bone-dim);padding-left:4px;transform:translateY(-6px)}
.col{position:relative;border-left:1px solid var(--line);
  background-image:repeating-linear-gradient(to bottom,transparent 0,transparent calc(var(--hh) - 1px),rgba(233,223,196,.09) calc(var(--hh) - 1px),rgba(233,223,196,.09) var(--hh));cursor:copy}
.col.today{background-color:rgba(212,83,46,.07)}
.blk{position:absolute;border:0;border-radius:3px;padding:3px 4px;text-align:left;overflow:hidden;font-size:11px;line-height:1.2;color:var(--ink);background:var(--bone-2);display:grid;align-content:start;gap:1px}
.blk b{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.blk span{opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.blk.show{background:var(--rust);color:#fff6ec} .blk.grabacion{background:var(--mustard)} .blk.otro{background:var(--ink-3);color:var(--bone)}
.blk.ensayo{background:var(--ink-2);color:var(--bone);box-shadow:inset 0 0 0 1.5px var(--bone-2)}
.blk.off{opacity:.4;text-decoration:line-through}
.blk.big{font-size:13.5px;padding:6px 8px}
.nowline{position:absolute;left:0;right:0;height:2px;background:var(--rust);z-index:2;pointer-events:none}
.nowline::before{content:"";position:absolute;left:-4px;top:-3px;width:8px;height:8px;border-radius:50%;background:var(--rust)}
.cal-hint{font-size:12.5px;color:var(--bone-dim);margin:0}

/* ---------- gastos ---------- */
.variants{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.variants::-webkit-scrollbar{display:none}
.vbtn{flex:none;border:1px dashed var(--line);background:rgba(15,14,12,.5);color:var(--bone-2);border-radius:4px;padding:7px 10px;font-size:12.5px;font-weight:600;display:flex;gap:6px;align-items:center}
.vbtn b{font-family:var(--f-display);font-weight:900;font-size:15px}
.vbtn.on{border-style:solid;border-color:var(--mustard);color:var(--bone);background:rgba(214,166,60,.12)}
.bal{display:grid;gap:10px}
.bal-row{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center}
.bal-bar{height:8px;border-radius:2px;background:var(--ink-3);position:relative;overflow:hidden}
.bal-bar i{position:absolute;top:0;bottom:0;left:50%}
.bal-bar i.pos{background:var(--ok)} .bal-bar i.neg{background:var(--bad);transform:translateX(-100%)}
.bal-bar::after{content:"";position:absolute;left:50%;top:-2px;bottom:-2px;width:1px;background:var(--bone-dim)}
.settle{display:grid;gap:8px}
.settle-item{display:flex;align-items:center;gap:10px;background:rgba(26,24,20,.88);border:1px dashed var(--line);border-radius:var(--r);padding:10px 12px;flex-wrap:wrap}
.settle-item .who{flex:1;min-width:0;font-size:14px}
.cats{display:grid;gap:9px}
.cat{display:grid;grid-template-columns:96px 1fr auto;gap:10px;align-items:center;font-size:13.5px}
.cat .bar{height:10px;background:var(--ink-3);border-radius:2px;overflow:hidden}
.cat .bar i{display:block;height:100%;background:var(--bone-2)}
.cat:first-child .bar i{background:var(--rust)}
.empty{display:grid;justify-items:center;text-align:center;gap:10px;padding:20px 10px;color:var(--bone-dim)}
.empty img{width:120px;opacity:.6}
/* B libreta */
.ticket{background:#e9dfc4;color:#1b1914;font-family:var(--f-type);padding:22px 18px 18px;position:relative;
  -webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/14px 51% repeat-x,conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/14px 51% repeat-x;
  mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/14px 51% repeat-x,conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/14px 51% repeat-x}
.tk-h{text-align:center;font-size:15px;letter-spacing:.12em;line-height:1.5;border-bottom:1px dashed #1b1914;padding-bottom:10px;margin-bottom:8px}
.tk-h img{width:120px;filter:brightness(.1);transform:rotate(-4deg);display:block;margin:0 auto 6px}
.tk-m{font-size:12px;letter-spacing:.14em;margin:12px 0 4px;text-transform:uppercase}
.tk-r{display:flex;gap:6px;align-items:baseline;font-size:14px;width:100%;background:none;border:0;padding:3px 0;color:inherit;text-align:left;font-family:inherit}
.tk-r .c{text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:55%}
.tk-r .dots{flex:1;border-bottom:1px dotted #1b1914;transform:translateY(-4px);min-width:10px}
.tk-r .a{font-variant-numeric:tabular-nums;white-space:nowrap}
.tk-s{font-size:11.5px;opacity:.65;padding-left:46px;margin-top:-2px;margin-bottom:4px}
.tk-tot{border-top:1px dashed #1b1914;margin-top:12px;padding-top:10px;display:flex;justify-content:space-between;font-size:20px;letter-spacing:.06em}
.tk-cu{display:flex;justify-content:space-between;font-size:13px;opacity:.75}
.tk-cc{border-top:1px dashed #1b1914;margin-top:12px;padding-top:10px;display:grid;gap:8px}
.tk-cc .ln{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:14px;flex-wrap:wrap}
.tk-cc button{font-family:var(--f-type);background:#1b1914;color:#e9dfc4;border:0;border-radius:2px;padding:5px 9px;font-size:12px;letter-spacing:.06em}
.tk-bar{height:34px;margin-top:16px;background:repeating-linear-gradient(90deg,#1b1914 0 2px,transparent 2px 4px,#1b1914 4px 7px,transparent 7px 8px,#1b1914 8px 9px,transparent 9px 12px)}
.tk-foot{text-align:center;font-size:11px;letter-spacing:.2em;margin-top:6px}
/* C por persona */
.share{display:flex;height:16px;border-radius:3px;overflow:hidden;background:var(--ink-3)}
.share i{display:block;height:100%}
.share-lg{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12.5px;color:var(--bone-2);margin-top:8px}
.share-lg span{display:inline-flex;gap:6px;align-items:center}
.share-lg i{width:10px;height:10px;border-radius:2px}
.pcards{display:grid;grid-auto-flow:column;grid-auto-columns:78%;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:none}
.pcards::-webkit-scrollbar{display:none}
.pcard{scroll-snap-align:start;background:rgba(26,24,20,.9);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:grid;gap:12px;text-align:left;color:inherit}
.pcard.on{border-color:var(--bone)}
.pcard .hd{display:flex;gap:12px;align-items:center}
.pcard .nm{font-family:var(--f-display);font-weight:800;font-size:24px;text-transform:uppercase;line-height:1}
.pcard .kv{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pcard .kv div{display:grid;gap:2px}
.pcard .kv b{font-size:17px;font-variant-numeric:tabular-nums}
.pcard .sal{font-family:var(--f-display);font-weight:900;font-size:36px;line-height:.9;font-variant-numeric:tabular-nums}
/* D por evento */
.pos{background:rgba(26,24,20,.92);border:1px solid var(--line);border-radius:var(--r);padding:14px;display:grid;gap:12px}
.pos-disp{display:flex;align-items:baseline;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line);padding-bottom:8px}
.pos-disp .v{font-family:var(--f-display);font-weight:900;font-size:46px;line-height:.9;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.keys{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.keys button{border:1px solid var(--line);background:var(--ink);color:var(--bone);border-radius:4px;padding:11px 0;font-family:var(--f-display);font-weight:800;font-size:22px}
.keys button:active{background:var(--ink-3)}
.egroup{background:rgba(26,24,20,.9);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.egroup summary{list-style:none;display:grid;grid-template-columns:4px 1fr auto;gap:12px;align-items:center;padding:12px 14px 12px 0;cursor:pointer}
.egroup summary::-webkit-details-marker{display:none}
.egroup .gt{font-weight:600}
.egroup .gs{font-size:12.5px;color:var(--bone-dim)}
.egroup .ga{font-family:var(--f-display);font-weight:900;font-size:24px;font-variant-numeric:tabular-nums}
.egroup .list{margin:0 14px 6px}

/* ---------- lista (setlist) ---------- */
.evpick{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.evpick::-webkit-scrollbar{display:none}
.evp{flex:none;display:grid;gap:2px;text-align:left;border:1px solid var(--line);background:rgba(15,14,12,.5);color:var(--bone-2);border-radius:5px;padding:8px 12px;min-width:110px}
.evp b{font-family:var(--f-display);font-weight:800;font-size:18px;line-height:1;color:var(--bone);text-transform:uppercase}
.evp span{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
.evp.on{border-color:var(--rust);background:rgba(212,83,46,.14)}
.sl-head{background:rgba(26,24,20,.9);border:1px solid var(--line);border-radius:var(--r);padding:14px;display:grid;gap:6px}
.songs{display:grid;border-top:1px solid var(--line)}
.song{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:8px;border-bottom:1px solid var(--line);padding:6px 0}
.song .nr{font-family:var(--f-display);font-weight:900;font-size:28px;line-height:1;color:var(--rust);text-align:right;font-variant-numeric:tabular-nums}
.song .tt{background:none;border:0;text-align:left;color:var(--bone);padding:6px 4px;min-width:0;display:grid;gap:2px}
.song .tt b{font-family:var(--f-display);font-weight:800;font-size:22px;text-transform:uppercase;line-height:1.05;overflow-wrap:anywhere}
.song .tt span{font-family:var(--f-type);font-size:12px;color:var(--bone-dim)}
.song .ops{display:flex;gap:2px}
.song .ops button{width:34px;height:34px;border:1px solid var(--line);background:rgba(15,14,12,.5);color:var(--bone-2);border-radius:4px;font-size:14px;line-height:1}
.song .ops button[disabled]{opacity:.25}
.addsong{display:flex;gap:8px}
.export-prev{display:grid;place-items:center;background:var(--ink);border:1px solid var(--line);border-radius:var(--r);padding:12px}
.export-prev img{max-height:52vh;width:auto;box-shadow:0 8px 24px rgba(0,0,0,.6)}

/* rider */
.rider-sec{display:grid;gap:10px}
.stage{position:relative;aspect-ratio:16/10;max-width:100%;background:
  repeating-linear-gradient(0deg,transparent 0 23px,rgba(233,223,196,.05) 23px 24px),
  repeating-linear-gradient(90deg,transparent 0 23px,rgba(233,223,196,.05) 23px 24px),rgba(26,24,20,.92);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;touch-action:none}
.stage .aud{position:absolute;left:0;right:0;bottom:0;text-align:center;font-family:var(--f-type);font-size:11px;letter-spacing:.3em;color:var(--bone-dim);border-top:1px dashed var(--line);padding:4px}
.piece{position:absolute;transform:translate(-50%,-50%);background:var(--bone);color:var(--ink);font-weight:700;font-size:12px;padding:5px 9px;border-radius:3px;white-space:nowrap;user-select:none}
.piece.drag{cursor:grab;outline:1px dashed var(--mustard);outline-offset:3px}
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:rgba(15,14,12,.7)}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-family:var(--f-type);font-weight:400;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--bone-dim);background:var(--ink-2)}
td.ch{font-family:var(--f-display);font-weight:900;font-size:18px;width:40px;font-variant-numeric:tabular-nums}
tr:last-child td{border-bottom:0}
td input{width:100%;min-width:70px;background:var(--ink);border:1px solid var(--line);border-radius:3px;padding:6px;font-size:14px}
.xbtn{background:none;border:0;color:var(--bone-dim);font-size:18px;padding:2px 6px;line-height:1}
.prose{white-space:pre-wrap;font-size:14.5px;color:var(--bone-2);background:rgba(26,24,20,.9);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.prose.empty-p{font-style:italic;color:var(--bone-dim)}
.typed{font-family:var(--f-type)}
.card{background:rgba(26,24,20,.9);border:1px solid var(--line);border-radius:var(--r);padding:4px 14px}
.card .row:last-child{border-bottom:0}
.card .list{border-top:0}

/* galería */
.gal{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.gal button{aspect-ratio:1;border-radius:50%;border:2px solid transparent;padding:0;background-color:var(--ink-3)}
.gal.rect{grid-template-columns:repeat(4,1fr)}
.gal.rect button{aspect-ratio:3/4;border-radius:4px}
.gal button.on{border-color:var(--mustard);box-shadow:0 0 0 2px var(--ink)}
.gal .none{display:grid;place-items:center;font-size:11px;color:var(--bone-dim);font-weight:600}
.prof-prev{display:flex;gap:14px;align-items:center}
input[type=range]{width:100%;accent-color:var(--rust)}
.switch{display:flex;align-items:center;gap:10px;font-size:14px}

/* bottom nav */
nav.tabs{position:fixed;left:0;right:0;bottom:0;z-index:35;background:rgba(15,14,12,.96);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px);backdrop-filter:blur(6px)}
nav.tabs .wrap{display:grid;grid-template-columns:repeat(5,1fr);height:var(--nav-h)}
nav.tabs button{background:none;border:0;color:var(--bone-dim);display:grid;justify-items:center;align-content:center;gap:3px;font-size:11px;font-weight:600;letter-spacing:.02em}
nav.tabs svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
nav.tabs button.on{color:var(--bone)}
nav.tabs button.on svg{stroke:var(--rust)}
.fab{position:fixed;z-index:34;right:max(16px,calc(50vw - 244px),env(safe-area-inset-right,0px));bottom:calc(var(--nav-h) + 14px + env(safe-area-inset-bottom,0px));
  background:var(--rust);color:#fff6ec;border:0;border-radius:99px;padding:13px 18px;font-weight:700;display:flex;gap:6px;align-items:center;box-shadow:0 6px 18px rgba(0,0,0,.5)}

/* sheet */
.scrim{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.6);display:flex;align-items:flex-end;justify-content:center}
.sheet{width:100%;max-width:560px;max-height:90vh;overflow-y:auto;background:var(--ink-2);border:1px solid var(--line);border-bottom:0;border-radius:12px 12px 0 0;
  padding:8px max(18px,env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) max(18px,env(safe-area-inset-left,0px));animation:up .22s ease-out}
@keyframes up{from{transform:translateY(30px);opacity:.4}}
.grab{width:42px;height:4px;border-radius:2px;background:var(--line);margin:4px auto 14px}
.sheet form,.sheet .stack{display:grid;gap:14px}
.sheet-h{display:flex;justify-content:space-between;align-items:center;gap:10px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.chips{display:flex;flex-wrap:wrap;gap:7px}
.confirm{display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:var(--ink);border:1px solid var(--bad);border-radius:var(--r);padding:10px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--nav-h) + 28px + env(safe-area-inset-bottom,0px));z-index:90;background:var(--bone);color:var(--ink);
  padding:10px 16px;border-radius:4px;font-weight:600;font-size:14px;box-shadow:0 8px 24px rgba(0,0,0,.5);max-width:calc(100% - 32px)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media (max-width:370px){.stat .v{font-size:26px}.tiles{grid-template-columns:1fr 1fr}.mc{min-height:58px}.hero-title{font-size:28px}}
@media (max-height:700px){.bigdate .d{font-size:92px}.hero-in{gap:9px}}