/* AAO 2026 planner. Layout: Explorer home (art header, search, day chips, cards), five-tab bottom bar.
   Tokens: Academy violet + brass gold on a lavender-grey ground; dark mode keeps the night-violet header. */
:root{
  --bg:#f4f2f8; --panel:#ffffff; --panel2:#f9f8fc; --ink:#1d1a2b; --muted:#625d79; --line:#e2dfea;
  --accent:#5a2d91; --accent-ink:#ffffff; --gold:#b9861a; --gold-soft:#fbf1d8; --warn:#b4371f; --warn-soft:#fde8e3; --ok:#257044;
  --c-core:#5a2d91; --c-sub:#1f6f8b; --c-ind:#a0522d; --c-soc:#b03a7a; --c-yo:#2c7a4b; --c-expo:#8a6d12; --c-city:#4b5563; --c-log:#3f51b5;
  --display:"Fraunces",Georgia,serif; --body:"Public Sans",system-ui,-apple-system,sans-serif; --mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --tabh:64px; color-scheme:light;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#13111b; --panel:#1d1a28; --panel2:#24202f; --ink:#ecebf3; --muted:#a8a3bf; --line:#322d42;
  --accent:#a685e0; --accent-ink:#13111b; --gold:#e3b54a; --gold-soft:#3a2f14; --warn:#f08a70; --warn-soft:#3b1d16; --ok:#6fcf97;
  --c-core:#a685e0; --c-sub:#5fb6d3; --c-ind:#e0956b; --c-soc:#e27ab3; --c-yo:#6fcf97; --c-expo:#d9b54a; --c-city:#9aa3b2; --c-log:#8c9cf0;
  color-scheme:dark}}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.45;-webkit-text-size-adjust:100%}
h1,h2,h3{font-family:var(--display);margin:0;text-wrap:balance}
button,input,textarea,select{font:inherit;color:inherit}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
[hidden]{display:none!important}

/* shell */
main{max-width:760px;margin:0 auto;padding-bottom:calc(var(--tabh) + env(safe-area-inset-bottom,0px) + 24px)}
.pad{padding-inline:16px}
.view{display:flex;flex-direction:column;gap:18px}
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--panel);border-top:1px solid var(--line);
  padding-bottom:env(safe-area-inset-bottom,0px);display:flex;justify-content:center}
.tabbar nav{display:grid;grid-template-columns:repeat(5,1fr);width:100%;max-width:760px}
.tabbar button{background:none;border:0;height:var(--tabh);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  font-size:11px;font-weight:600;color:var(--muted);cursor:pointer;position:relative}
.tabbar svg{width:23px;height:23px}
.tabbar button[aria-current="page"]{color:var(--accent)}
.tabbar .badge{position:absolute;top:8px;left:calc(50% + 6px);background:var(--accent);color:var(--accent-ink);font-size:10px;border-radius:999px;padding:0 5px;min-width:16px;line-height:16px}

/* hero */
.hero{position:relative;color:#fff;min-height:236px;padding:calc(env(safe-area-inset-top,0px) + 34px) 20px 44px;
  background:#24103f url("/hero-phone.webp") right center/cover no-repeat;}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(18,8,36,.88) 0%,rgba(18,8,36,.55) 48%,rgba(18,8,36,.05) 100%)}
.hero>*{position:relative}
.hero .eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.hero h1{font-size:36px;line-height:1.05;margin-top:8px}
.hero .sub{opacity:.9;margin-top:6px;max-width:30ch}
.search{position:relative;margin:-26px 16px 0;z-index:2}
.search input{width:100%;border:1px solid var(--line);background:var(--panel);border-radius:14px;padding:13px 14px 13px 40px;font-size:16px;
  box-shadow:0 10px 26px rgba(30,15,60,.18)}
.search svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--muted)}
.pagehead{padding:calc(env(safe-area-inset-top,0px) + 18px) 16px 4px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.pagehead h1{font-size:28px}

/* chips */
.chips{display:flex;gap:6px;overflow-x:auto;padding:2px 16px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;border:1px solid var(--line);background:var(--panel);border-radius:999px;padding:7px 13px;font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;gap:6px;align-items:center;white-space:nowrap}
.chip small{font-weight:500;opacity:.7}
.chip[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.chip .dot{width:8px;height:8px;border-radius:50%}
.chip.soft[aria-pressed="false"]{opacity:.5}

/* sections & cards */
.sec{display:flex;flex-direction:column;gap:10px}
.sec>h2{font-size:19px;padding-inline:16px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.sec>h2 small{font-family:var(--body);font-size:13px;color:var(--muted);font-weight:500}
.rail{display:flex;gap:10px;overflow-x:auto;padding:2px 16px 6px;scroll-snap-type:x mandatory;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.tile{flex:none;width:min(240px,72vw);scroll-snap-align:start;background:var(--panel);border-radius:14px;padding:12px 13px;border-top:4px solid var(--cat);
  display:flex;flex-direction:column;gap:3px;box-shadow:0 2px 10px rgba(30,15,60,.06);cursor:pointer;text-align:left;border-left:0;border-right:0;border-bottom:0}
.tile .when{font-family:var(--mono);font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.tile b{font-size:15px;line-height:1.25}
.tile .where{font-size:12px;color:var(--muted)}
.tile.now{box-shadow:0 0 0 2px var(--warn) inset}
.list{display:flex;flex-direction:column;gap:8px;padding-inline:16px}
.box{background:var(--panel);border:1px solid var(--line);border-radius:14px}
.rows>*+*{border-top:1px solid var(--line)}

.ev{display:grid;grid-template-columns:62px minmax(0,1fr) auto;gap:10px;background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--cat);border-radius:12px;padding:10px 8px 10px 11px}
.ev.starred{background:linear-gradient(var(--gold-soft),var(--gold-soft))}
.ev.clash{border-color:var(--warn);border-left-color:var(--warn)}
.ev.past{opacity:.55}
.ev .t{font-family:var(--mono);font-size:12.5px;line-height:1.3;color:var(--muted);font-variant-numeric:tabular-nums}
.ev .t b{display:block;color:var(--ink);font-weight:500;font-size:13.5px}
.ev .ttl{font-weight:700;line-height:1.3}
.ev .meta{font-size:13px;color:var(--muted);margin-top:1px}
.ev .desc{font-size:13.5px;margin-top:4px}
.tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px;align-items:center}
.tag{font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;border-radius:4px;padding:2px 6px;background:color-mix(in srgb,var(--cat) 15%,transparent);color:var(--cat)}
.tag.cost{background:var(--gold-soft);color:var(--ink)}
.tag.warn{background:var(--warn);color:var(--panel)}
.tag.unc{background:var(--warn-soft);color:var(--warn)}
.tag.nowtag{background:var(--warn);color:#fff}
.src{font-size:12px}
.star{border:0;background:none;cursor:pointer;width:40px;height:40px;display:grid;place-items:center;color:var(--line);border-radius:10px}
.star svg{width:24px;height:24px}
.star[aria-pressed="true"]{color:var(--gold)}
.nowline{display:flex;align-items:center;gap:8px;color:var(--warn);font-family:var(--mono);font-size:12px;font-weight:700;padding-inline:4px}
.nowline::after{content:"";flex:1;border-top:2px solid var(--warn)}

.ex{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px;align-items:center;padding:10px 6px 10px 13px}
.ex .co{font-weight:700;line-height:1.25}
.ex .what{font-size:13px;color:var(--muted)}
.ex .booth{font-family:var(--mono);font-size:13px;text-align:right;line-height:1.2}
.ex .booth small{display:block;color:var(--muted);font-size:10.5px}
.visit{border:1px solid var(--line);background:var(--panel2);border-radius:8px;font-size:11px;font-weight:700;padding:5px 7px;cursor:pointer;color:var(--muted)}
.visit[aria-pressed="true"]{background:var(--ok);border-color:var(--ok);color:#fff}

.check{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;padding:11px 13px;align-items:start}
.check input{width:20px;height:20px;margin-top:2px;accent-color:var(--accent)}
.check .why{font-size:13px;color:var(--muted)}
.check.done .txt{text-decoration:line-through;color:var(--muted)}
.callout{background:var(--warn-soft);border:1px solid var(--warn);border-radius:14px;padding:12px 14px;margin-inline:16px}
.callout b{color:var(--warn)}
.empty{border:1px dashed var(--line);border-radius:14px;padding:18px;text-align:center;color:var(--muted);margin-inline:16px}
.btn{border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:8px 14px;font-weight:700;font-size:14px;cursor:pointer}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding-inline:16px}
.note{width:100%;min-height:62px;border:1px solid var(--line);border-radius:10px;background:var(--panel2);padding:8px 10px;font-size:14px;resize:vertical;margin-top:8px}
.notebtn{border:0;background:none;color:var(--accent);font-size:12px;font-weight:700;cursor:pointer;padding:2px 0}
.daytitle{font-family:var(--display);font-size:20px;padding:8px 16px 0}
.muted{color:var(--muted)}
.small{font-size:13px}

/* map */
.halls{display:flex;flex-direction:column;gap:10px;padding-inline:16px}
.hall{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px 13px}
.hall h3{font-size:18px;display:flex;justify-content:space-between;align-items:baseline}
.hall h3 small{font-family:var(--mono);font-size:12px;color:var(--muted);font-weight:500}
.strip{position:relative;height:30px;margin:10px 0 6px;background:repeating-linear-gradient(90deg,var(--panel2) 0 9px,var(--line) 9px 10px);border-radius:8px}
.pin{position:absolute;top:3px;width:24px;height:24px;margin-left:-12px;border-radius:50%;background:var(--gold);color:#1d1a2b;font:700 10px var(--mono);display:grid;place-items:center;border:2px solid var(--panel)}
.pin.land{background:var(--accent);color:var(--accent-ink);border-radius:6px}
.pin.done{background:var(--ok);color:#fff}
.hall ol{margin:6px 0 0;padding-left:20px;font-size:14px}
.hall li span{font-family:var(--mono);color:var(--muted);font-size:12px}

/* status */
.sync{position:fixed;top:calc(env(safe-area-inset-top,0px) + 10px);right:12px;z-index:30;font-size:12px;font-weight:700;border-radius:999px;padding:4px 10px;
  background:var(--panel);border:1px solid var(--line);box-shadow:0 4px 12px rgba(0,0,0,.12)}
.sync.bad{background:var(--warn);color:#fff;border-color:var(--warn)}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--tabh) + env(safe-area-inset-bottom,0px) + 14px);background:var(--ink);color:var(--bg);
  padding:8px 14px;border-radius:10px;font-size:14px;z-index:40}
.foot{padding:24px 16px 0;font-size:12px;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px 14px}
@media (min-width:700px){.hero{min-height:280px;background-image:url("/hero.webp")}.hero h1{font-size:44px}}
@media (prefers-reduced-motion:no-preference){.tile,.ev{transition:transform .12s}.tile:active{transform:scale(.98)}}

/* ---- themes: Blender card art (3D = glass, Claymation = clay) ---- */
.tile.art{position:relative;min-height:150px;justify-content:flex-end;overflow:hidden;color:#fff;border-top:0;
  background:linear-gradient(95deg,rgba(14,7,30,.92) 0%,rgba(14,7,30,.72) 52%,rgba(14,7,30,.1) 100%),var(--art) right center/cover no-repeat,#2a1650;}
.tile.art .when,.tile.art .where{color:rgba(255,255,255,.82)}
.tile.art::after{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--cat)}
.tile.art.mine{box-shadow:0 0 0 2px var(--gold) inset}
.tile.art.now{box-shadow:0 0 0 2px var(--warn) inset}
.tilegrp{position:absolute;top:10px;right:10px;background:var(--gold);color:#1d1a2b;font-size:10.5px;font-weight:700;border-radius:999px;padding:2px 8px;max-width:60%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-theme="clay"] .tile.art{color:#2b2233;background:linear-gradient(95deg,rgba(250,240,228,.95) 0%,rgba(250,240,228,.8) 50%,rgba(250,240,228,.05) 100%),var(--art) right center/cover no-repeat,#f1e3d3}
body[data-theme="clay"] .tile.art .when,body[data-theme="clay"] .tile.art .where{color:#5d4f63}
body[data-theme="clay"] .hero{background-image:url("/cards/clay_hero_phone.webp")}
body[data-theme="clay"] .hero::before{background:linear-gradient(100deg,rgba(40,22,50,.82) 0%,rgba(40,22,50,.45) 50%,rgba(40,22,50,0) 100%)}
@media (min-width:700px){body[data-theme="clay"] .hero{background-image:url("/cards/clay_hero_phone.webp")}}
.tag.grp{background:var(--gold);color:#1d1a2b}

/* ---- hero buttons, You page, voice ---- */
.herobtns{position:absolute!important;top:calc(env(safe-area-inset-top,0px) + 14px);right:14px;display:flex;gap:8px;z-index:3}
.roundbtn{width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(20,10,40,.45);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(6px)}
.roundbtn svg{width:22px;height:22px}
.callout.invite,.callout.trip{display:block;text-align:left;font:inherit;color:var(--ink);background:var(--gold-soft);border-color:var(--gold);cursor:pointer;text-decoration:none}
.callout.invite{width:calc(100% - 32px)}
.affrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:11px 8px 11px 13px;align-items:start}
.matchrow{display:flex;justify-content:space-between;gap:8px;align-items:baseline;font-size:13.5px;margin-top:5px}
.themes{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-inline:16px}
.themecard{border:2px solid var(--line);background:var(--panel);border-radius:14px;padding:0 0 10px;overflow:hidden;cursor:pointer;display:flex;flex-direction:column;gap:8px;text-align:center}
.themecard.on{border-color:var(--accent)}
.themeart{display:block;aspect-ratio:9/5;max-width:100%;background:#2a1650 center/cover no-repeat}
.res{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;padding:11px 13px}
.resicon{width:34px;height:34px;border-radius:10px;background:var(--gold-soft);display:grid;place-items:center;font-size:17px}
.voice{display:flex;flex-direction:column;align-items:center;gap:14px;padding:12px 16px}
.micbig{width:128px;height:128px;border-radius:50%;border:0;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;cursor:pointer;box-shadow:0 12px 32px rgba(90,45,145,.35)}
.micbig svg{width:56px;height:56px}
.micbig[disabled]{opacity:.4;cursor:not-allowed}
.micbig.live{background:var(--warn);color:#fff}
@media (prefers-reduced-motion:no-preference){.micbig.live{animation:pulse 1.2s ease-in-out infinite}@keyframes pulse{50%{transform:scale(1.06)}}}
.vstate{font-weight:700}
.heard{font-family:var(--display);font-size:20px;text-align:center}
.vans{width:100%;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.vans p{margin:0;font-size:16px}
.vcard{border-top:1px solid var(--line);padding-top:8px}
.linkbtn{border:0;background:none;padding:0;text-align:left;font-size:15px;color:var(--ink);cursor:pointer}
.matchrow .notebtn{white-space:nowrap}
.sec>h2{flex-wrap:wrap;row-gap:2px}
.sec>h2 small{text-align:right;margin-left:auto}
.micbig.busy{opacity:.6}

/* ---- calm home layouts ---- */
.band{position:relative;color:#fff;padding:calc(env(safe-area-inset-top,0px) + 22px) 20px 44px;background:#24103f url("/hero-phone.webp") right 30%/cover no-repeat}
.band::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(18,8,36,.9),rgba(18,8,36,.55) 60%,rgba(18,8,36,.2))}
.band>*{position:relative}
.band h1{font-size:28px;margin-top:6px}
body[data-theme="clay"] .band{background-image:url("/cards/clay_hero_phone.webp")}
.search.calm{margin-top:-22px}
.pagehead .search.calm,.plainhead+.search.calm{margin-top:4px}
.nextp{display:flex;flex-direction:column;gap:4px;width:100%;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:16px;cursor:pointer;color:var(--ink)}
.nextp b{font-family:var(--display);font-size:22px;line-height:1.2}
.nextp span{color:var(--muted);font-size:14px}
.eyebrow2{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.eyebrow3{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.navlist{display:flex;flex-direction:column;margin:0 16px;border:1px solid var(--line);border-radius:16px;background:var(--panel);overflow:hidden}
.navlist:empty{display:none}
.navrow{display:grid;grid-template-columns:34px minmax(0,1fr) 16px;gap:12px;align-items:center;padding:13px 14px;border:0;background:none;text-align:left;cursor:pointer;color:var(--ink)}
.navrow+.navrow{border-top:1px solid var(--line)}
.navicon{width:34px;height:34px;border-radius:10px;background:var(--gold-soft);display:grid;place-items:center;font-size:16px}
.navtxt{display:flex;flex-direction:column;min-width:0}
.navtxt span{color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chev{color:var(--muted);font-size:22px}
.plainhead{align-items:center}
.herobtns.inline{position:static!important;display:flex;gap:8px}
.herobtns.inline .roundbtn{background:var(--panel);color:var(--ink);border-color:var(--line)}
.agenda{display:flex;flex-direction:column;margin:0 16px;border-left:2px solid var(--line)}
.agline{display:grid;grid-template-columns:72px minmax(0,1fr);gap:10px;padding:10px 4px 10px 12px;border:0;background:none;text-align:left;cursor:pointer;color:var(--ink);position:relative}
.agline::before{content:"";position:absolute;left:-6px;top:15px;width:10px;height:10px;border-radius:50%;background:var(--panel);border:2px solid var(--accent)}
.agline.on::before{background:var(--warn);border-color:var(--warn)}
.agline.past{opacity:.5}
.agline .mono{font-size:13px;color:var(--muted);padding-top:2px}
.agline small{display:block;color:var(--muted);font-size:13px}
.agline.clash small{color:var(--warn)}
.calmhero{min-height:300px}
.quietlist{display:flex;flex-direction:column;gap:2px;margin:18px 16px 0}
.quiet{display:flex;flex-direction:column;gap:2px;text-align:left;border:0;background:none;padding:12px 2px;border-bottom:1px solid var(--line);cursor:pointer;color:var(--ink)}
.quiet b{font-family:var(--display);font-size:19px;line-height:1.25}
.detailbtn{width:100%;padding:12px}
.quiet{display:grid!important;grid-template-columns:minmax(0,1fr) 92px;gap:12px;align-items:center}
.qtxt{display:flex;flex-direction:column;gap:2px;min-width:0}
.qart{width:92px;aspect-ratio:9/5;max-width:100%;border-radius:10px;background:#2a1650 78% center/cover no-repeat}
body[data-theme="clay"] .qart{background-color:#efe2d4}
