/* Footer on phone: two tidy columns, bigger tap targets, copyright last */
@media (max-width:640px){
  footer{padding:24px 0 calc(28px + env(safe-area-inset-bottom,0px))}
  footer .wrap{flex-direction:column-reverse;gap:20px}
  footer .links{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
  footer .links button{text-align:left;font-size:15px;min-height:44px;border-bottom:1px solid var(--border);color:var(--text-dim)}
  footer .links button[data-go="list"]{grid-column:1/-1;order:-1;margin-bottom:10px;border:1px solid var(--brand);border-radius:12px;text-align:center;color:var(--brand);font-weight:700;min-height:48px}
  footer .links .foot-owner{opacity:.5}
  footer .wrap>div:first-child{font-size:12px;text-align:center}
}

/* ---------- UI review pass 2026-10-20 ---------- */
/* Cookie notice waits until the intro deck is gone, so it never sits over the first poster. */
body:has(.intro-deck:not(.intro-off)) .cookie{display:none}
@media (min-width:821px){
  .cookie{left:auto;right:16px;bottom:16px;max-width:380px;border:1px solid var(--border);border-radius:14px;padding:12px 14px;box-shadow:0 10px 30px var(--shadow)}
  .cookie .in{flex-wrap:wrap;gap:10px}
}
/* Narrow screens: header button stays on one line, app promo stacks. */
#hdrSign,#hdrDash,header.top .btn{white-space:nowrap;flex:none}
@media (max-width:340px){
  .appad{flex-wrap:wrap}
  .appad>div{flex:1 1 100%;order:2}
  .appad>.btn{order:3;width:100%}
  header.top .wrap{gap:6px}
  .logo{font-size:19px}
}
/* Text floor is 13px. */
.fb-n{font-size:13px;min-width:22px;height:22px}
footer .wrap>div:first-child{font-size:13px}

/* ---------- Screens review 2026-10-20 ---------- */
/* Fan app titles are real headings now; keep the old look. */
h1.app-title{margin:0;line-height:inherit;text-wrap:initial}
/* Seller contact rows: same two slots on every row, WhatsApp first, Instagram second. */
.srow2 .acts{display:grid;grid-template-columns:repeat(2,104px);gap:8px;justify-content:end}
.srow2 .acts .btn{height:44px;min-height:44px;padding:0 10px;white-space:nowrap;font-size:14px;gap:6px}
.srow2 .acts .btn.wa{grid-column:1}
.srow2 .acts .btn:not(.wa){grid-column:2}
.srow2 .who small{font-size:13px}
/* Buy bar: one line for the button. */
.buybar .btn.wa.lg{flex:1;min-width:0;white-space:nowrap;padding-inline:12px;font-size:15px;gap:8px}
.buybar .pr{flex:none}
/* Text floor is 13px. */
.note,.si-sample,.byline .av,.promoter-row .av{font-size:13px}
.lsteps i{font-size:13px;width:24px;height:24px}
/* Inline links keep their look but get a 44px tap area. */
a[data-toast],.link,.byline,.legal a,.foot-link{position:relative}
a[data-toast]::after,.link::after{content:"";position:absolute;inset:-12px -6px}
.byline{min-height:44px}
@media (max-width:640px){.pd-sharebox{width:auto;max-width:100%;min-width:0}.pd-sharebox *{min-width:0;max-width:100%}.sharelink{overflow-wrap:anywhere}}
.view small,.view .mut,.pd-list small{font-size:13px}

/* FAQ accordions: one look everywhere (Help, event page, For promoters). A plus/minus shows the row opens. */
.faq details{border-bottom:1px solid var(--border);padding:0}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:52px;padding:12px 0;font-weight:600;font-size:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--chip);color:var(--text-dim);font-size:18px;line-height:1}
.faq details[open] summary::after{content:"\2212";background:var(--brand);color:var(--on-brand)}
.faq p{margin:0 0 14px;padding-right:44px;font-size:15px;line-height:1.55}

/* Event page: the phone buy bar already carries the "On sale ..." line and calendar button, so the in-page copy is for desktop only. */
@media (max-width:820px){.ev2-soon{display:none}}

/* ---------- Info pages: For promoters, Get the app, Help share one shell, hero, headings, cards, steps and panels. ---------- */
.ip{max-width:960px;margin-inline:auto;padding-inline:20px}
.ip-hero{padding:18px 0 8px}
.ip-hero h1,.ga-text.ip-hero h1{font-size:clamp(34px,5vw,48px);line-height:1.04;margin:0 0 14px}
.ip-lead,.ga-lead.ip-lead{font-size:18px;line-height:1.5;max-width:56ch;margin:0 0 22px}
.ip-h,.pp-h.ip-h,.ga-h.ip-h{font-size:22px;margin:44px 0 14px}
.ip-grid,.ga .benefits.ip-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin:0;padding:0;list-style:none}
.ip-card{border:1px solid var(--border);border-radius:14px;background:var(--panel);padding:18px}
.ip-card b{display:block;margin-bottom:6px}
.ip-card p{margin:0;font-size:15px}
.ip-steps,.ga-steps.ip-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.ip-steps li,.ga-steps.ip-steps li{display:flex;gap:14px;align-items:flex-start;border:0;background:none;padding:0;flex-direction:row}
.ip-steps i,.ga-steps.ip-steps i{flex:none;width:30px;height:30px;margin:0;border-radius:50%;border:1px solid var(--brand);color:var(--brand);display:grid;place-items:center;font-style:normal;font-weight:700}
.ip-steps b{display:block}
.ip-steps p{margin:2px 0 0;font-size:15px}
.ip-panel,.ga-qr.ip-panel,.help-contact.ip-panel{border:1px solid var(--border);border-radius:16px;background:var(--panel);padding:20px;max-width:none}
.ga-qr.ip-panel{max-width:440px}
.help-contact.ip-panel{margin:28px 0 10px}
.ip .faq,.ip .pp-faq,.hp .faq{max-width:720px}
.pp-end.ip-panel{padding:40px 24px}
.hp .help-contact.ip-panel{max-width:720px}
.ga .benefits.ip-grid{margin-top:32px}
.ga .note{margin:28px 0 20px}
.ip-grid,.ga .benefits.ip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:640px){.ip-grid,.ga .benefits.ip-grid{grid-template-columns:minmax(0,1fr)}.ip{padding-inline:16px}}

/* My tickets */
.tk-when{color:var(--text-dim);font-size:16px;margin:0 0 8px}
.rowhead.ip-hero{align-items:flex-end;margin-bottom:0}
.rowhead.ip-hero h1{margin:0 0 6px}
.ip-steps li>div{padding-top:3px;min-width:0}
.gp-next{margin:18px 0 24px}
.gp-next h2{font-size:24px;margin:4px 0 2px}
.wrap.narrow .ip-h{margin-top:32px}
.benefits.ip-grid{margin-top:28px}

/* No "List your event" in the footer on buyer account screens. */
body[data-view="orders"] footer [data-go="list"],body[data-view="account"] footer [data-go="list"],body[data-view="phoneopen"] footer [data-go="list"],body[data-view="appinstall"] footer [data-go="list"]{display:none}

/* Account: same shell as the other pages, three clear sections in a reading-width column. */
.acct-col{max-width:640px}
.acct-h{margin:32px 0 12px}
.acct-col>.acct-h:first-child{margin-top:22px}
.acct .ip-hero{padding-bottom:0}
.inp.ro{background:transparent;color:var(--text-dim);border-style:dashed}
.fhint{display:block;margin-top:6px;font-size:13px;color:var(--muted)}
.acct .check input{width:22px;height:22px;margin-top:1px;flex:none}
.acct .check{font-size:15px;align-items:center}
.acct .ip-panel .btn.danger{margin-left:0}

/* Sign in: same shell and heading as the other pages; the hero panel and form sit under it. */
.si2 .si2-grid{margin-top:14px}
.si2-form{padding:26px}
.si-code .label{text-transform:none;letter-spacing:0;font-size:14px;color:var(--text-dim);font-weight:500;margin-bottom:8px}
.codes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.codes input{max-width:none;min-width:0;height:52px;padding:0;font-size:22px}
body[data-view="signin"] #hdrSign{display:none}
}
.si2-form>.si2-g:first-child{margin-top:0}

/* Sign in: hint under the email field; the side panel hides on phones. */
.si2-form .fhint{margin-top:6px}
.si2-mark i{width:30px;height:32px;border-radius:0;background:url('../assets/RMDIcon.svg') no-repeat center/contain}
@media (max-width:860px){.si2-hero{display:none}}

/* Promoter dashboard: standard shell, phone tables keep the key columns, event switcher reads as a button. */
@media (max-width:640px){
  .t-ticket th:nth-child(4),.t-ticket td:nth-child(4),.t-ticket th:nth-child(5),.t-ticket td:nth-child(5){display:none}
  .t-latest th:nth-child(1),.t-latest td:nth-child(1){display:none}
  .t-extras th:nth-child(4),.t-extras td:nth-child(4){display:none}
}
.pd-menu small,.pd-item small{font-size:13px}
.pd-menu.big summary::after{content:"Switch event \25BE";width:auto;height:auto;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600;color:var(--text-dim);white-space:nowrap}
.pd-acts .btn{min-height:40px}
@media (max-width:640px){.t-extras{table-layout:fixed;width:100%}.t-extras td,.t-extras th{overflow-wrap:anywhere}.t-extras th:first-child,.t-extras td:first-child{width:42%}}
@media (max-width:640px){.t-extras th,.t-extras td{padding:8px 6px}}

/* Edit event: standard shell, real section headings, one bordered row per ticket, readable inputs. */
.pe-col{max-width:720px}
.pe-col>.acct-h:first-child{margin-top:22px}
.pe .ped-t{padding:14px 0;margin:0;border-bottom:1px solid var(--border)}
.pe .ped-t:last-of-type{border-bottom:0}
.pe .ped-n b{font-size:16px}
.pe .ped-n{padding-bottom:12px}
.pe .fld-sm{color:var(--text-dim);font-size:13px}
.pe .fld-sm .inp,.pe .inp{color:var(--text)}
.pe .ped-date{background:transparent;border-style:dashed}
.pe .ped-date span{color:var(--text-dim)}
.pe-file{padding:8px}
.pe-file::file-selector-button{margin-right:12px;padding:8px 14px;border:1px solid var(--border-strong);border-radius:8px;background:var(--chip);color:var(--text);font:600 14px var(--body);cursor:pointer}
.pe-savenote{margin:18px 0 10px;font-size:14px}
.pe-col>.ip-panel .banner{margin-bottom:16px}

/* Header on phones: the promoter's Dashboard link lives in the menu, so the bar keeps logo, one account button and the menu. */
@media (max-width:820px){#hdrDash{display:none}}

/* Dashboard: request more tickets as two packs */
.rqpacks{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 12px}
.rqpack{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--panel);color:var(--text);cursor:pointer;text-align:left;font:inherit}
.rqpack b{font:700 22px var(--display)}.rqpack span{font-size:12px;color:var(--muted)}.rqpack em{font-style:normal;font-weight:700;margin-top:6px}.rqpack small{color:var(--muted);font-size:12px}
.rqpack.on{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand) inset}
.rqpack:disabled{opacity:.5;cursor:default}
.si-note{display:block;margin-top:6px;font-size:13px}
.si2-pro{margin-top:14px!important;font-size:14px!important;opacity:.85}

.rqalloc{display:grid;gap:8px;margin:0 0 10px}
.rqa{display:flex;align-items:center;justify-content:space-between;gap:12px}
.rqa .inp{width:96px;text-align:right}
.rqtools{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px;font-size:14px}
.rqmeter{color:var(--muted)}.rqmeter b{color:var(--text)}.rqmeter.full b{color:var(--brand)}

/* List your event: standard shell, step label, comfortable tap targets. */
.pl .lw{grid-template-columns:minmax(0,1fr) 320px;gap:28px}
.lstepno{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 4px}
.crumb{min-height:44px;display:inline-flex;align-items:center}
.pl .btn.sm,.lw .btn.sm{min-height:40px;padding-inline:14px}
.slot-f span,.lpresets span{font-size:13px}
.pl .pe-file{padding:8px}
@media (max-width:820px){.pl .lw{grid-template-columns:minmax(0,1fr)}}

/* Legal pages: standard shell and heading, reading-width text, tabs that stay on one line. */
.lg-col{max-width:720px}
.lg .tabs{overflow-x:auto;flex-wrap:nowrap;white-space:nowrap;scrollbar-width:none;margin-bottom:6px}
.lg .tabs::-webkit-scrollbar{display:none}
.lg .tabs button{flex:none}
.legal-draft{display:inline-block;margin:0 0 18px;padding:6px 12px;border:1px dashed var(--border-strong);border-radius:999px;font-size:13px;color:var(--muted)}
.lg h2{font-size:22px;margin:32px 0 10px}

/* Fan app: Mark all read is a green action like the rest; "Need more tickets?" opens a quiet section. */
.app-ic.txt{color:var(--brand)}
.app-sw span small{display:block;margin-top:2px;font-size:13px;font-weight:400;color:var(--muted)}
.app-more{margin:16px 0 8px;border:1px solid var(--border);border-radius:16px;background:var(--panel);padding:0 14px}
.app-more summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;min-height:52px;font-weight:600}
.app-more summary::-webkit-details-marker{display:none}
.app-more summary::after{content:"+";width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--chip);color:var(--text-dim);font-size:18px}
.app-more[open] summary::after{content:"\2212";background:var(--brand);color:var(--on-brand)}
.app-more[open]{padding-bottom:14px}

/* Remaining screens pass: mock emails use h2 (the page keeps one h1), comfortable buttons, 13px floor in admin. */
.dm-title h2{font-family:'Helvetica Neue',Arial,sans-serif;font-weight:700;line-height:1.2;font-size:28px;color:#39c984;margin:0 0 8px;letter-spacing:0}
.dlwrap .btn{min-height:44px}
.app-line .link{min-height:44px;padding-inline:6px;display:inline-flex;align-items:center}
.adm-b,.adm-gl,.adm code,.adm small,.adm .mut{font-size:13px}
.emptyhero h2{font-size:clamp(28px,5vw,40px);margin-bottom:8px}
#app code{font-size:13px}

/* Get the app (phone): quiet phone switcher, action heading, comfortable footer links. */
.gp-ah{margin:22px 0 12px}
.os-switch{margin:26px 0 0;font-size:14px;color:var(--muted)}
.os-switch summary{cursor:pointer;min-height:44px;display:flex;align-items:center}
.os-switch .tabs{margin-top:6px}
.note .link{min-height:44px;display:inline-flex;align-items:center}
.os-switch .tabs button{min-height:44px}

/* Small things pass: toasts clear the buy bar and may be wide enough to read; comfortable buttons in Manage. */
.toast{width:max-content;max-width:min(92vw,440px)}
@media (max-width:820px){body:has(.buybar:not(.hide-bar)) .toast{bottom:calc(92px + env(safe-area-inset-bottom,0px))}}
.lpresets .btn.sm,.rowhead .btn.sm,.rqpanel .btn.sm,#rqpanel .btn.sm{min-height:40px}
.cookie .btn.sm{min-height:40px;padding:6px 14px}

/* one code box: paste, type, or phone autofill */
.codes.one{display:block}
.codes.one input{width:100%;height:60px;font-size:30px;font-weight:700;letter-spacing:.3em;text-indent:.3em;text-align:center;font-variant-numeric:tabular-nums}
.codes.one input::placeholder{letter-spacing:.3em;opacity:.35}
.si-again{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:space-between;margin:10px 0 12px;font-size:14px}

/* My tickets with many tickets: folders by ticket name, used tickets tucked away */
.wsub{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:16px 0 6px;font-weight:700}
.tgrp{margin:8px 0;border:1px solid var(--border);border-radius:14px;background:var(--panel);overflow:hidden}
.tgrp>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;cursor:pointer;list-style:none;min-height:48px}
.tgrp>summary::-webkit-details-marker{display:none}
.tgrp>summary b{font-size:16px}
.tgrp>summary::after{content:'\203A';color:var(--muted);font-size:22px;transition:transform .15s;margin-left:4px}
.tgrp[open]>summary::after{transform:rotate(90deg)}
.tgrp>summary .mut{margin-left:auto;font-size:14px}
.tgrp .wlist{border-top:1px solid var(--border)}
.tgrp.tused{opacity:.85}
.app-used{margin:18px 0 8px}
.app-used>summary{cursor:pointer;color:var(--muted);font-size:14px;padding:8px 2px;list-style:none}
.app-used>summary::-webkit-details-marker{display:none}
.app-used>summary span{margin-left:6px;background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:1px 8px}
.tk-gl{text-align:center;font-size:14px;font-weight:700;color:rgba(255,255,255,.85);margin:2px 0 8px}
.tk-used{text-align:center;font-size:13px;color:var(--muted);margin:6px 0 0}
.app-dots.many{display:none}

/* Get the app (desktop): big QR first, the three steps in a row, brand-coloured phone pictures */
.ga-qr.ga-qrbig{display:flex;gap:24px;align-items:center;max-width:560px;padding:22px}
.ga-qr.ga-qrbig .phoneqr{width:200px;flex:none}
.ga-qrtext b{font-size:18px}
.ga-qrtext p{margin:6px 0 0;font-size:14px}
.ga-url{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0 0}
.ga-url code{background:var(--bg-2,#1b1b1d);border:1px solid var(--border);border-radius:8px;padding:6px 10px;font-size:13px;word-break:break-all}
.ga-tip{margin-top:12px!important;color:var(--text)!important;font-weight:600}
.ga-prev .gp-bar i{background:var(--brand)}
.ga-prev .gp-tabs u.on{background:var(--brand)}
.ga-prev .gp-poster{background:linear-gradient(160deg,#0f3d2a,#2aa86f)}
.ga-prev .gp-tk em{background:var(--brand);color:#06220f}
.ga .ga-hero{grid-template-columns:minmax(0,1.55fr) minmax(0,.8fr);gap:40px}
.ga-prev .gp-ph{flex-basis:150px}
.ga-steps.ip-steps.ga-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ga-steps.ip-steps.ga-row li{border:1px solid var(--border);background:var(--panel);border-radius:14px;padding:18px}
.ga .ga-h.ip-h{margin-top:36px}
.ga-signin{margin:18px 0 0;font-size:14px}
/* A smaller desktop window: one column, the QR card the full width of the page, no decorative phone pictures, steps still in a row */
@media (max-width:980px){
  .ga .ga-hero{grid-template-columns:minmax(0,1fr);gap:20px}
  .ga-prev{display:none}
  .ga-qr.ga-qrbig{max-width:none;flex-direction:row;align-items:center}
  .ga-qr.ga-qrbig .phoneqr{width:180px}
}
@media (max-width:760px){
  .ga-steps.ip-steps.ga-row{grid-template-columns:minmax(0,1fr)}
  .ga-qr.ga-qrbig{flex-direction:column;align-items:flex-start}
  .ga-qr.ga-qrbig .phoneqr{width:160px}
}