/* Befrendle 0.6 — refined layer over the original mint / white system. MIT.
   Loaded last. Pure-white pages, mint accents, deep-green emphasis. No black surfaces in the
   light theme. Dark mode remains an explicit choice. No remote fonts or assets. */
:root{--bg:#fff;--card:#fff;--surface:#f4f6f5;--surface-2:#eef2ef;--line:#e5e9e7;--ink:#151515;--muted:#69706c;--mint:#86deae;--mint-dark:#17432a;--mint-ink:#1f5a3a;--mint-soft:#ebf8f1;--mint-line:#c4eed7;--mint-strong:#5fcb92;--serif:"Iowan Old Style","Charter","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;--radius-xl:28px;--shadow-soft:0 1px 2px #1515150a,0 10px 30px -14px #17432a26;--shadow-lift:0 24px 54px -26px #17432a40;--mint-glow:0 14px 30px -14px #5fcb92b3}
body[data-theme=dark]{--mint-ink:#a9ecc7;--mint-soft:#1c3126;--mint-line:#2d5841;--shadow-soft:0 1px 2px #0005;--shadow-lift:0 24px 50px -24px #000c}
html{background:var(--bg)}body{background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
h1,h2,h3{letter-spacing:-.03em}
::selection{background:var(--mint);color:#11271b}
:focus-visible{outline:2px solid var(--mint-strong);outline-offset:3px}

/* Buttons */
.button{border-radius:999px;font-weight:600;letter-spacing:-.005em;transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s,background .18s,border-color .18s,color .18s;gap:8px}
.button .icon{width:17px;height:17px}
.button.primary{background:var(--mint);color:#0f2a1b;box-shadow:inset 0 1px 0 #ffffff59,0 8px 20px -12px #2f8a5a99}
.button.primary:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 #ffffff59,0 14px 26px -12px #2f8a5ab3}
.button.outline,.button.ghost{background:var(--card);border:1px solid var(--line);color:var(--ink)}
.button.outline:hover,.button.ghost:hover{border-color:var(--mint-strong);color:var(--mint-ink)}
.button.glow{background:linear-gradient(180deg,#9fe9c2,#76d5a2);color:#0d2617;border:0;box-shadow:inset 0 1px 0 #ffffff80,var(--mint-glow)}
.button.glow:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 #ffffff80,0 18px 36px -14px #5fcb92e6}
.button.large{min-height:52px;padding:14px 24px;font-size:14px}
.button[disabled]{opacity:.55;cursor:not-allowed;transform:none!important}
.text-link{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:13px;color:var(--mint-ink)}
.text-link .icon{width:15px;transition:transform .2s}.text-link:hover .icon{transform:translateX(3px)}

/* Shell: rail call to action and navigation */
.rail{background:var(--card);border-right:1px solid var(--line)}
.rail-cta{display:flex;align-items:center;gap:12px;margin:26px 0 4px;padding:12px 14px;border-radius:16px;background:var(--mint);color:#0f2a1b;box-shadow:inset 0 1px 0 #ffffff66,0 12px 26px -16px #2f8a5ac4;transition:transform .18s,box-shadow .18s}
.rail-cta:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 #ffffff66,0 18px 30px -16px #2f8a5ad9}
.rail-cta>span:last-child{display:flex;flex-direction:column;font-size:13px;font-weight:650;line-height:1.3}
.rail-cta small{font-size:10px;font-weight:500;color:#25583b;margin-top:2px}
.rail-cta-icon{width:34px;height:34px;border-radius:11px;background:#ffffffbf;color:var(--mint-dark);display:grid;place-items:center;flex:none}
.rail-cta-icon .icon{width:18px;height:18px}
.rail-label{margin-top:30px}
.nav-tag{font-style:normal;font-size:9px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:999px;background:var(--mint-soft);color:var(--mint-ink);margin-left:auto}
.rail-secondary .nav-link{gap:11px}
.discover-entry{background:var(--card);border:1px solid var(--line)}

/* Page structure */
.page-head h1,.home-heading h1{font-size:clamp(28px,3vw,38px);letter-spacing:-.04em}
.page-section{margin-top:56px}
.section-lead{max-width:720px;color:var(--muted);margin:-6px 0 22px;font-size:14px}
.page-foot{margin-top:18px}
.soft-pill,.soon-pill,.live-pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;font-size:10.5px;font-weight:650;padding:4px 10px;white-space:nowrap;letter-spacing:.01em}
.soft-pill{background:var(--surface);color:var(--muted)}
.soon-pill{background:var(--mint-soft);color:var(--mint-ink);letter-spacing:.06em;text-transform:uppercase;font-size:9.5px;border:1px solid var(--mint-line)}
.soon-pill.is-live{background:var(--mint);border-color:var(--mint);color:#0f2a1b}
.live-pill{background:var(--mint-soft);color:var(--mint-ink);border:1px solid var(--mint-line)}
.live-pill i,.live-dot{width:7px;height:7px;border-radius:50%;background:var(--mint-strong);display:inline-block;box-shadow:0 0 0 0 #5fcb9299;animation:bf-pulse 2s infinite}
@keyframes bf-pulse{0%{box-shadow:0 0 0 0 #5fcb9299}70%{box-shadow:0 0 0 9px #5fcb9200}100%{box-shadow:0 0 0 0 #5fcb9200}}
.description{white-space:pre-line}

/* Hero ("stage"): white, airy, mint accents — no dark or green-filled slabs */
.stage-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:44px;align-items:center;padding:clamp(28px,4vw,56px);border-radius:var(--radius-xl);background:radial-gradient(55% 75% at 100% 0%,#86deae29,transparent 62%),radial-gradient(45% 60% at 0% 100%,#86deae14,transparent 64%),var(--card);border:1px solid var(--line);overflow:hidden;isolation:isolate;box-shadow:0 30px 70px -48px #17432a59}
.stage-hero::after{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(#17432a0b 1px,transparent 1px),linear-gradient(90deg,#17432a0b 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(70% 80% at 75% 30%,#000,transparent 75%);-webkit-mask-image:radial-gradient(70% 80% at 75% 30%,#000,transparent 75%)}
.stage-copy .eyebrow{color:var(--mint-ink);display:inline-flex;align-items:center;gap:8px;margin-bottom:18px}
.stage-copy .eyebrow .icon{width:15px;height:15px}
.stage-copy h1,.stage-copy h2{font-size:clamp(34px,4.4vw,58px);line-height:1.02;letter-spacing:-.045em;font-weight:680;color:var(--ink)}
.stage-copy em{font-family:var(--serif);font-style:italic;font-weight:500;letter-spacing:-.02em;color:var(--mint-dark);background:linear-gradient(transparent 66%,#86deae80 66%,#86deae80 92%,transparent 92%);padding:0 .06em}
body[data-theme=dark] .stage-copy em{color:var(--mint);background:none}
.stage-copy>p{color:var(--muted);font-size:15.5px;line-height:1.6;max-width:520px;margin:20px 0 0}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero-facts{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;margin:26px 0 0;padding:0;font-size:12px;color:var(--muted)}
.hero-facts li{display:flex;align-items:center;gap:7px}.hero-facts .icon{width:15px;height:15px;color:var(--mint-strong)}

/* The illustrative room (light) */
.room-visual{position:relative;padding:8px 0 34px}
.rv-window{position:relative;border-radius:20px;background:var(--card);border:1px solid var(--line);box-shadow:0 40px 80px -40px #17432a59,0 2px 8px #1515150d;overflow:hidden;transform:perspective(1400px) rotateY(-7deg) rotateX(2deg);transform-origin:left center}
.rv-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;font-size:10.5px;color:var(--muted);border-bottom:1px solid var(--line)}
.rv-bar i{width:8px;height:8px;border-radius:50%;background:#e1e6e3}.rv-bar span{margin-left:8px}
.rv-live{margin-left:auto;font-size:9px;letter-spacing:.12em;padding:3px 8px;border-radius:999px;background:var(--mint);color:#0f2a1b}
.rv-screen{position:relative;aspect-ratio:16/9;margin:12px;border-radius:12px;overflow:hidden;background:#eaf2f6}
.rv-scene{position:absolute;inset:0;background:linear-gradient(180deg,#cfe7f4 0%,#f3e6d6 64%,#f6cfa8 100%)}
.rv-sun{position:absolute;left:58%;top:34%;width:22%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fffaf0,#ffd9a8 58%,#ffd9a800 72%)}
.rv-hill{position:absolute;bottom:-30%;border-radius:50%}
.rv-hill.one{left:-20%;width:90%;height:70%;background:#c8efd9}.rv-hill.two{right:-25%;width:95%;height:62%;background:#9fe3be}
.rv-title{position:absolute;left:7%;top:12%;font:700 clamp(12px,1.5vw,18px)/1.05 var(--serif);letter-spacing:.06em;color:var(--mint-dark)}
.rv-sharer{position:absolute;left:10px;bottom:12px;display:flex;align-items:center;gap:6px;font-size:10px;padding:5px 9px;border-radius:999px;background:#ffffffe6;color:var(--ink);box-shadow:0 4px 12px -6px #17432a59}
.rv-sharer .icon{width:12px;height:12px;color:var(--mint-strong)}
.rv-progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:#ffffff99}.rv-progress i{display:block;height:100%;width:38%;background:var(--mint-strong)}
.rv-people{display:flex;align-items:center;gap:8px;padding:0 14px 14px}
.rv-face{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;font-size:11px;font-weight:700;color:#0f2a1b;box-shadow:0 0 0 2px var(--card)}
.rv-face.f1{background:var(--mint)}.rv-face.f2{background:#f1e7d8}.rv-face.f3{background:#dfe9f0}.rv-face.f4{background:var(--surface);color:var(--muted)}
.rv-mic{margin-left:auto;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--surface);color:var(--mint-ink)}.rv-mic .icon{width:15px;height:15px}
.rv-chat{position:absolute;right:-6px;bottom:0;width:min(220px,58%);display:grid;gap:7px;font-size:11px}
.rv-chat p{margin:0;padding:8px 11px;border-radius:13px 13px 13px 4px;background:var(--card);border:1px solid var(--line);color:var(--ink);box-shadow:0 14px 28px -16px #17432a59;line-height:1.35}
.rv-chat p b{display:block;font-size:9.5px;color:var(--muted);margin-bottom:1px}
.rv-chat p.me{background:var(--mint);border-color:var(--mint);border-radius:13px 13px 4px 13px;justify-self:end}.rv-chat p.me b{color:#25583b}
.rv-caption{position:absolute;left:0;bottom:4px;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:#a3aaa6}
aside .room-visual{background:var(--surface);border-radius:22px;padding:18px 18px 34px;margin-bottom:20px}
aside .room-visual .rv-window{transform:none}aside .room-visual .rv-chat{right:10px;bottom:26px;width:62%}aside .room-visual .rv-caption{left:18px;bottom:10px}

/* Home */
.home-heading{margin-bottom:24px}
.home-hero{margin-bottom:34px}
.ways-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.way-card{position:relative;display:flex;flex-direction:column;gap:6px;padding:18px 18px 20px;border-radius:18px;background:var(--card);border:1px solid var(--line);transition:transform .18s,box-shadow .18s,border-color .18s}
.way-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-soft);border-color:var(--mint-line)}
.way-icon,.room-row-icon,.agent-icon,.partner-mark,.ai-teaser-icon,.stream-icon{display:grid;place-items:center;background:var(--mint-soft);color:var(--mint-ink);border:1px solid var(--mint-line);flex:none}
.way-icon{width:38px;height:38px;border-radius:12px;margin-bottom:8px}.way-icon .icon{width:19px;height:19px}
.way-card strong{font-size:14px;display:flex;align-items:center;gap:6px}.way-card small{font-size:12px;color:var(--muted);line-height:1.5}
.way-go{position:absolute;right:16px;top:18px;color:var(--muted)}.way-go .icon{width:16px;transition:transform .2s}.way-card:hover .way-go .icon{transform:translateX(3px)}
.way-card .nav-tag{margin-left:2px}
.idea-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}
.badge.on-art{background:#ffffffe6;color:#151515;box-shadow:0 2px 8px #17432a1f}
.rv-sharer{color:#151515!important}.rv-chat p.me{color:#0f2a1b}
.idea-pill{min-width:0;display:flex;align-items:center;gap:12px;padding:14px;border-radius:16px;background:var(--surface);border:1px solid transparent;transition:border-color .18s,background .18s}
.idea-pill:hover{border-color:var(--line);background:var(--card)}
.idea-pill>span{width:34px;height:34px;border-radius:10px;background:var(--card);display:grid;place-items:center;flex:none;color:var(--mint-ink)}.idea-pill>span .icon{width:17px}
.idea-pill div{min-width:0}.idea-pill strong{display:block;font-size:13px}.idea-pill small{display:block;font-size:11.5px;color:var(--muted);line-height:1.45;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.idea-pill>.icon{width:15px;flex:none;color:var(--muted)}
.home-aside .side-panel,.side-panel{background:var(--card);border:1px solid var(--line)}
.nearby-callout{background:var(--card);border:1px solid var(--line);color:var(--ink);border-radius:20px}
.nearby-callout .eyebrow{color:var(--mint-ink)}.nearby-callout p{color:var(--muted)}.nearby-callout h3{color:var(--ink)}
.nearby-callout>span .icon{color:var(--mint-strong)}

/* Rooms */
.room-list{display:grid;gap:10px}
.room-row{display:flex;align-items:center;gap:16px;padding:16px 18px;border-radius:18px;background:var(--card);border:1px solid var(--line);transition:box-shadow .18s,border-color .18s}
.room-row:hover{box-shadow:var(--shadow-soft)}
.room-row.is-live{border-color:var(--mint);box-shadow:0 0 0 3px #86deae2e}
.room-row-icon{width:44px;height:44px;border-radius:14px}.room-row-icon .icon{width:21px;height:21px}
.room-row-copy{flex:1;min-width:0}.room-row-copy h3{font-size:15px;margin:4px 0 2px}.room-row-copy p{font-size:12px;color:var(--muted);margin:0}
.room-row .actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.quiet-empty{display:flex;align-items:center;gap:18px;padding:22px;border-radius:20px;border:1px dashed #cdd5d0;background:var(--card)}
.quiet-empty>.icon{width:26px;height:26px;color:var(--mint-strong);flex:none}.quiet-empty>div{flex:1}.quiet-empty h3{font-size:15px;margin:0 0 4px}.quiet-empty p{font-size:13px;color:var(--muted);margin:0}
.steps-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:6px}
.steps-3>div{padding:22px;border-radius:20px;background:var(--card);border:1px solid var(--line)}
.steps-3 b{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--mint-soft);border:1px solid var(--mint-line);color:var(--mint-ink);font-size:11px;margin-bottom:14px}
.steps-3 h3{font-size:16px;margin-bottom:6px}.steps-3 p{font-size:13px;color:var(--muted);margin:0}
.mode-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.mode-tile{display:block;padding:20px;border-radius:18px;background:var(--surface);border:1px solid transparent;transition:border-color .18s,background .18s}
a.mode-tile:hover{background:var(--card);border-color:var(--line)}
.mode-tile .icon{width:20px;height:20px;margin-bottom:12px;color:var(--mint-ink)}.mode-tile h3{font-size:14px;margin-bottom:6px}.mode-tile p{font-size:12px;color:var(--muted);margin:0;line-height:1.55}
.mode-tile.is-muted{border:1px dashed var(--line)}.mode-tile.is-muted .icon{opacity:.5}

/* Start-a-room form */
.form-pane{padding:28px}
.choice-chips,.mode-options{border:0;padding:0;margin:0 0 22px}
.choice-chips legend,.mode-options legend{font-size:13px;font-weight:600;margin-bottom:10px}
.choice-chips{display:flex;flex-wrap:wrap;gap:8px}
.choice-chip,.mode-option{position:relative}
.choice-chip input,.mode-option input,#rm-open .room-mode input{position:absolute;left:0;top:0;width:1px;height:1px;min-height:0;margin:0;opacity:0;pointer-events:none}
.choice-chip span{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;border:1px solid var(--line);font-size:13px;cursor:pointer;transition:all .15s}
.choice-chip span .icon{width:16px;height:16px}
.choice-chip input:checked+span{background:var(--mint);border-color:var(--mint);color:#0f2a1b;font-weight:600}
.choice-chip input:focus-visible+span,.mode-option input:focus-visible+span{outline:2px solid var(--mint-strong);outline-offset:2px}
.mode-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mode-options legend{grid-column:1/-1}
.mode-option span{display:flex;flex-direction:column;gap:4px;height:100%;padding:16px;border-radius:16px;border:1px solid var(--line);cursor:pointer;transition:all .15s}
.mode-option span .icon{width:20px;height:20px;margin-bottom:6px;color:var(--muted)}.mode-option strong{font-size:13.5px;font-weight:650}.mode-option small{font-size:11.5px;color:var(--muted);line-height:1.45;font-weight:400}
.choice-chip span{font-weight:500}
.mode-option input:checked+span{border-color:var(--mint-strong);background:var(--mint-soft);box-shadow:0 0 0 1px var(--mint-strong)}
.mode-option input:checked+span .icon{color:var(--mint-ink)}
.mode-option input:disabled+span{opacity:.45;cursor:not-allowed}
.check-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.check-list li{display:flex;gap:10px;font-size:13px;color:var(--muted);line-height:1.5}.check-list .icon{width:16px;height:16px;flex:none;color:var(--mint-strong);margin-top:2px}
.side-link{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:13px;margin-top:6px;color:var(--mint-ink)}.side-link .icon{width:15px}

/* Room setup and live room */
#rm-open .room-mode{position:relative;cursor:pointer;padding-right:46px;transition:border-color .15s,box-shadow .15s,background .15s}
#rm-open .room-mode::after{content:"";position:absolute;top:18px;right:18px;width:18px;height:18px;border-radius:50%;border:2px solid #cfd6d2;background:var(--card);transition:all .15s}
#rm-open .room-mode:has(input:checked){border-color:var(--mint-strong);background:var(--mint-soft);box-shadow:0 0 0 1px var(--mint-strong)}
#rm-open .room-mode:has(input:checked)::after{border-color:var(--mint-strong);background:radial-gradient(circle,var(--mint-strong) 0 4px,var(--card) 5px)}
#rm-open .room-mode:has(input:disabled){opacity:.55;cursor:not-allowed}
#rm-open .room-mode:has(input:focus-visible){outline:2px solid var(--mint-strong);outline-offset:2px}
.room-mode-hero{display:flex!important;align-items:flex-start;gap:18px;padding:22px 52px 22px 22px!important;margin:22px 0 10px;border-radius:20px!important;border:1px solid var(--line)}
.room-mode-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:var(--mint);color:#0f2a1b;flex:none;box-shadow:var(--mint-glow)}.room-mode-icon .icon{width:24px;height:24px}
.room-mode-copy .eyebrow{color:var(--mint-ink);margin-bottom:6px}.room-mode-copy h3{font-size:20px;margin-bottom:6px}.room-mode-copy p{color:var(--muted);margin:0;font-size:13.5px;font-weight:400}
.room-mode-label{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:18px 0 10px;font-weight:600}
#rm-open .room-mode-grid{margin:0 0 20px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
#rm-open .room-mode-grid .room-mode{padding:16px;border-radius:16px}
#rm-open .room-mode-grid .room-mode h3{font-size:14.5px}#rm-open .room-mode-grid .room-mode p{font-size:12px;font-weight:400;color:var(--muted)}
.room-pane{border-color:var(--mint)!important;box-shadow:0 0 0 3px #86deae24}
.room-pane .eyebrow,.share-pane .eyebrow{display:flex;align-items:center;gap:7px;color:var(--mint-ink)}.room-pane .eyebrow .icon,.share-pane .eyebrow .icon{width:14px;height:14px}

/* Workshops */
.class-visual{position:relative;display:grid;gap:12px;padding-bottom:24px}
.cv-slide{position:relative;aspect-ratio:16/10;border-radius:18px;padding:22px;background:linear-gradient(160deg,#fbf8f3,#efe7da);color:var(--ink);overflow:hidden;border:1px solid #ece4d6;box-shadow:0 30px 60px -36px #17432a59}
.cv-slide strong{display:block;font:600 clamp(22px,2.6vw,32px)/1.05 var(--serif);margin-top:28px}.cv-slide em{font-style:italic;color:var(--mint-dark)}
.cv-tag{font-size:9px;letter-spacing:.14em;font-weight:700;padding:4px 9px;border-radius:999px;background:var(--mint);color:#0f2a1b}
.cv-lens{position:absolute;right:-18px;bottom:-18px;width:44%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#dfeee6 0 26%,#b7d9c6 27% 50%,#ffffff 51% 58%,#cfe3d8 59%);box-shadow:0 10px 30px -10px #17432a59}
.cv-card{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-soft)}
.cv-avatar{width:36px;height:36px;border-radius:11px;background:var(--mint);color:#0f2a1b;display:grid;place-items:center;font-size:11px;font-weight:700}
.cv-card b{display:block;font-size:12.5px}.cv-card small{font-size:11px;color:var(--muted)}.cv-seats{margin-left:auto;font-size:10.5px;font-weight:650;padding:4px 9px;border-radius:999px;background:var(--mint-soft);color:var(--mint-ink)}
.cv-q{padding:12px 14px;border-radius:16px 16px 16px 5px;background:var(--card);border:1px solid var(--line);max-width:78%;justify-self:end;box-shadow:var(--shadow-soft)}
.cv-q b{font-size:9.5px;letter-spacing:.12em;color:var(--mint-ink)}.cv-q p{margin:2px 0 0;font-size:12px}
.topic-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.topic-card{position:relative;display:flex;flex-direction:column;padding:20px;min-height:190px;border-radius:20px;background:var(--card);border:1px solid var(--line);transition:transform .18s,box-shadow .18s,border-color .18s}
.topic-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-soft);border-color:var(--mint-line)}
.topic-number{font:500 13px var(--serif);font-style:italic;color:var(--mint-ink)}.topic-card h3{font-size:16px;margin:16px 0 6px}.topic-card p{font-size:12.5px;color:var(--muted);margin:0 0 16px;line-height:1.5}
.topic-go{margin-top:auto;display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--mint-ink)}.topic-go .icon{width:14px}
.share-pane{border:1px solid var(--line)}
.link-list{display:grid;gap:8px;margin-top:16px}
.link-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:var(--surface)}
.link-row>.icon{width:18px;color:var(--mint-ink);flex:none}.link-row div{flex:1;min-width:0}.link-row strong{display:block;font-size:13px}.link-row small{font-size:11.5px;color:var(--muted)}
.copy-field{display:flex;gap:8px;margin:18px 0 10px}.copy-field input{flex:1;min-width:0;font-size:13px}
.plus-pane{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start;border:1px solid var(--mint-line);background:linear-gradient(135deg,var(--mint-soft),var(--card) 60%)}
.plus-perks{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:9px}.plus-perks li{display:flex;gap:10px;font-size:13px}.plus-perks .icon{width:16px;color:var(--mint-strong);flex:none;margin-top:2px}
.price-options{display:flex;flex-wrap:wrap;gap:8px;border:0;padding:0;margin:0 0 16px}.price-options legend{font-size:13px;font-weight:600;margin-bottom:10px}

/* AI Studio */
.studio-hero .stage-copy h1{font-size:clamp(32px,4vw,54px)}
.prompt-box{margin-top:26px;padding:14px;border-radius:20px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-soft)}
.prompt-box textarea{width:100%;min-height:58px;border:0;background:transparent;color:var(--ink);font-size:15px;resize:none;padding:4px 6px;box-shadow:none}
.prompt-box textarea:focus{outline:none;box-shadow:none}.prompt-box textarea::placeholder{color:#9aa19d}
.prompt-row{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:8px}
.prompt-starters{display:flex;flex-wrap:wrap;gap:6px}
.starter{border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:999px;padding:6px 11px;font-size:11px;cursor:pointer;transition:all .15s}
.starter:hover{border-color:var(--mint-strong);color:var(--mint-ink);background:var(--card)}
.studio-visual{position:relative;display:grid;gap:12px;padding-bottom:24px}
.sv-card{padding:16px 18px;border-radius:18px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-soft)}
.sv-host{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;align-items:center}.sv-host b{font-size:12px}.sv-host p{grid-column:1/-1;margin:4px 0 0;font:italic 16px/1.45 var(--serif);color:var(--ink)}
.sv-dot{width:10px;height:10px;border-radius:50%;background:var(--mint-strong);box-shadow:0 0 12px var(--mint)}
.sv-q{margin-left:28px}.sv-q small{font-size:9.5px;letter-spacing:.12em;color:var(--muted)}.sv-q b{display:block;font-size:14px;margin:6px 0 10px}
.sv-q div{display:flex;gap:6px;flex-wrap:wrap}.sv-q span{font-size:11px;padding:5px 10px;border-radius:999px;background:var(--surface)}.sv-q span.ok{background:var(--mint);font-weight:600}
.sv-score{display:flex;gap:8px;justify-content:space-between;width:80%}.sv-score span{flex:1;font-size:11px;color:var(--muted);display:flex;justify-content:space-between;padding:8px 10px;border-radius:12px;background:var(--surface)}.sv-score b{color:var(--mint-ink)}
.agent-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.agent-card{display:flex;flex-direction:column;padding:22px;border-radius:22px;background:var(--card);border:1px solid var(--line)}
.agent-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.agent-icon{width:42px;height:42px;border-radius:13px}.agent-icon .icon{width:20px;height:20px}
.agent-card h3{font-size:18px;margin-bottom:4px}.agent-tagline{font-size:12px;color:var(--mint-ink);font-weight:600;margin:0 0 10px}
.agent-card>p{font-size:13px;color:var(--muted);line-height:1.55}
.agent-steps{margin:6px 0 16px;padding-left:18px;font-size:12.5px;display:grid;gap:4px}
.agent-sample{margin-top:auto;border-top:1px solid var(--line);padding-top:12px}
.agent-sample summary{cursor:pointer;font-size:12.5px;font-weight:600;list-style:none;color:var(--mint-ink)}.agent-sample summary::-webkit-details-marker{display:none}
.agent-sample summary::after{content:" +"}.agent-sample[open] summary::after{content:" –"}
.ai-out{margin-top:12px;padding:16px;border-radius:16px;background:var(--surface);font-size:13px}
.ai-out h3{font-size:15px;margin:6px 0 8px}.ai-out .ai-scene{font:italic 14px/1.55 var(--serif)}
.ai-out .ai-cast{display:grid;gap:8px;margin:10px 0}.ai-out .ai-cast div{display:grid;padding:9px 11px;border-radius:12px;background:var(--card)}.ai-out .ai-cast span{font-size:12px}.ai-out .ai-cast small{font-size:11px;color:var(--muted)}
.ai-out .ai-choices{display:grid;gap:6px}.ai-out .ai-choices span{padding:8px 11px;border-radius:999px;border:1px solid var(--line);background:var(--card);font-size:12px}
.ai-out .ai-clue{display:flex;gap:8px;align-items:flex-start;font-size:12px;color:var(--muted);margin:10px 0 0}.ai-out .ai-clue .icon{width:15px;flex:none;margin-top:2px}
.ai-out .ai-question{padding:10px 0;border-bottom:1px solid var(--line)}.ai-out .ai-question:last-child{border:0}.ai-out .ai-question small{font-size:9.5px;letter-spacing:.12em;color:var(--muted)}
.ai-out .ai-options{display:grid;grid-template-columns:1fr 1fr;gap:6px}.ai-out .ai-options span{font-size:12px;padding:7px 10px;border-radius:10px;background:var(--card)}.ai-out .ai-options span.correct{background:var(--mint);color:#0f2a1b;font-weight:600}
.ai-out .ai-banter{font:italic 13px var(--serif);color:var(--muted);margin:8px 0 0}
.ai-out .ai-scores{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}.ai-out .ai-scores div{padding:12px;border-radius:14px;background:var(--card);display:grid}.ai-out .ai-scores div.won{box-shadow:0 0 0 2px var(--mint)}
.ai-out .ai-scores strong{font-size:26px;letter-spacing:-.03em}.ai-out .ai-scores small{font-size:11px;color:var(--muted)}
.ai-out .ai-guess{display:grid;grid-template-columns:auto 1fr auto;gap:2px 10px;padding:8px 0}.ai-out .ai-guess small{grid-column:1/-1;color:var(--muted)}.ai-out .ai-guess strong{color:var(--mint-ink)}
.how-ai{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px;align-items:start}
.arch-steps{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:12px}
.arch-steps li{display:flex;gap:14px;padding:16px;border-radius:18px;border:1px solid var(--line)}.arch-steps b{font:italic 500 16px var(--serif);color:var(--mint-ink)}.arch-steps h3{font-size:15px;margin-bottom:4px}.arch-steps p{margin:0;font-size:13px;color:var(--muted)}
.code-card{border-radius:22px;background:var(--surface);border:1px solid var(--line);padding:18px}
.code-head{display:flex;align-items:center;gap:6px;margin-bottom:12px}.code-head span{width:9px;height:9px;border-radius:50%;background:#d6dcd8}.code-head small{margin-left:8px;font-size:11px;color:var(--muted)}
.code-card{min-width:0}
.code-card pre{margin:0;padding:14px;border-radius:14px;background:var(--card);border:1px solid var(--line);overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;font:12.5px/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.code-card code{color:var(--mint-dark)}
body[data-theme=dark] .code-card code{color:var(--mint)}
.code-card .small-note{margin-top:12px}
.early-pane{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:28px;align-items:start}
.preview-pane .debate-only textarea{min-height:80px}

/* Game night */
.games-visual{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:14px;transform:rotate(-4deg)}
.gv-tile{aspect-ratio:1;border-radius:22px;background:var(--card);border:1px solid var(--line);display:grid;place-items:center;padding:16%;box-shadow:0 30px 50px -34px #17432a66}
.gv-tile svg{width:100%;height:100%}.gv-tile:nth-child(2){transform:translateY(22px)}.gv-tile:nth-child(3){transform:translateY(-8px)}.gv-tile:nth-child(4){transform:translateY(14px)}
.game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.game-card{border-radius:22px;background:var(--card);border:1px solid var(--line);overflow:hidden;transition:transform .2s,box-shadow .2s,border-color .2s}
.game-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift);border-color:var(--mint-line)}
.game-card-art{position:relative;height:150px;display:grid;place-items:center;background:radial-gradient(80% 90% at 80% 0%,#86deae2e,transparent 62%),var(--surface);border-bottom:1px solid var(--line)}
.game-card-art svg{height:96px;width:auto;transition:transform .3s}.game-card:hover .game-card-art svg{transform:scale(1.06) rotate(-2deg)}
.game-card-tag{position:absolute;left:14px;top:14px;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--mint-ink)}
.game-card-copy{padding:18px 20px 20px}.game-card-copy h3{font-size:17px;margin-bottom:2px}.game-card-copy small{font-size:11.5px;color:var(--muted)}.game-card-copy p{font-size:13px;color:var(--muted);margin:10px 0 14px;line-height:1.55}
.partner-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.partner-card{display:flex;flex-direction:column;padding:18px;border-radius:20px;background:var(--card);border:1px solid var(--line);transition:border-color .18s,box-shadow .18s}
.partner-card:hover{border-color:var(--mint-line);box-shadow:var(--shadow-soft)}
.partner-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.partner-mark{width:40px;height:40px;border-radius:12px;font:600 18px var(--serif)}
.partner-card h3{font-size:15px;margin-bottom:2px}.partner-card small{font-size:11.5px;color:var(--muted)}.partner-card p{font-size:12.5px;color:var(--muted);margin:10px 0 16px;line-height:1.5}
.partner-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}
.stream-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.stream-card{display:flex;flex-direction:column;gap:12px;padding:22px;border-radius:22px;background:linear-gradient(160deg,var(--mint-soft),var(--card) 55%);border:1px solid var(--mint-line)}
.stream-card h3{font-size:16px;margin-bottom:6px}.stream-card p{font-size:12.5px;color:var(--muted);margin:0 0 6px;line-height:1.55}.stream-card small{font-size:11px;color:var(--mint-ink);font-weight:600}
.stream-icon{width:42px;height:42px;border-radius:13px;background:var(--card)}.stream-icon .icon{width:20px;height:20px}
.ai-teaser{display:flex;align-items:center;gap:16px;margin-top:28px;padding:18px 22px;border-radius:22px;border:1px solid var(--line);background:var(--card);transition:box-shadow .2s,border-color .2s}
.ai-teaser:hover{box-shadow:var(--shadow-soft);border-color:var(--mint-line)}
.ai-teaser-icon{width:44px;height:44px;border-radius:14px}.ai-teaser-icon .icon{width:21px}
.ai-teaser>span:nth-child(2){flex:1;display:grid}.ai-teaser strong{font-size:15px}.ai-teaser small{font-size:12.5px;color:var(--muted)}.ai-teaser>.icon{width:17px;color:var(--muted)}

/* Native boards (light boards; deep green vs white pieces) */
.arcade-table h2{font-size:22px}
.reversi-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px;padding:8px;border-radius:16px;background:#d9e6de;max-width:460px;aspect-ratio:1}
.rv-cell{position:relative;aspect-ratio:1;border:0;border-radius:6px;background:#eef4f0;padding:0;cursor:default}
.rv-cell i{position:absolute;inset:12%;border-radius:50%;transition:transform .3s,background .3s}
.rv-cell.disc-1 i{background:radial-gradient(circle at 35% 30%,#4f9a72,#1f5a3a);box-shadow:0 2px 4px #17432a4d}
.rv-cell.disc-2 i{background:radial-gradient(circle at 35% 30%,#fff,#e4e9e6);box-shadow:0 0 0 1px #c9d3cd,0 2px 4px #17432a26}
.rv-cell.legal{cursor:pointer}.rv-cell.legal i{inset:38%;background:var(--mint-strong);opacity:.8}.rv-cell.legal:hover i{inset:16%;opacity:.45}
.rv-cell.last{box-shadow:inset 0 0 0 2px var(--mint-strong)}
.go-grid{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));max-width:520px;aspect-ratio:1;padding:10px;border-radius:16px;background:#f1e3c6}
body[data-theme=dark] .go-grid{background:#c9b48b}
.go-cell{position:relative;border:0;padding:0;background:transparent;aspect-ratio:1;cursor:pointer}
.go-cell::before,.go-cell::after{content:"";position:absolute;background:#bda577}
.go-cell::before{left:0;right:0;top:50%;height:1px}.go-cell::after{top:0;bottom:0;left:50%;width:1px}
.go-cell i{position:absolute;inset:9%;border-radius:50%;z-index:1}
.go-cell.stone-1 i{background:radial-gradient(circle at 35% 30%,#4f9a72,#1f5a3a);box-shadow:0 2px 3px #17432a59}
.go-cell.stone-2 i{background:radial-gradient(circle at 35% 30%,#fff,#e6ebe8);box-shadow:0 0 0 1px #d1c3a4,0 2px 3px #0002}
.go-cell.last i{box-shadow:0 0 0 2px var(--mint-strong)}
.go-cell:not([disabled]):hover i{background:#17432a1f}
.go-cell[disabled]{cursor:default}
.mancala-board{display:grid;grid-template-columns:72px 1fr 72px;gap:10px;align-items:stretch;padding:14px;border-radius:999px;background:linear-gradient(180deg,#f1e2c8,#e3cba4);max-width:640px;box-shadow:inset 0 2px 0 #ffffff99,0 20px 40px -28px #6b4a2f80;border:1px solid #e0caa6}
.mancala-board .store{border-radius:999px;background:#e6d2ae;box-shadow:inset 0 3px 8px #8a6a3f40;display:grid;place-items:center;align-content:center;gap:2px;color:#4a3720;text-align:center;padding:8px 4px}
.mancala-board .store b{font-size:26px}.mancala-board .store small{font-size:10px;opacity:.8;max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pits{display:grid;gap:10px}.pit-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.pit{position:relative;aspect-ratio:1;border:0;border-radius:50%;background:#e6d2ae;box-shadow:inset 0 3px 7px #8a6a3f47;color:#4a3720;cursor:pointer;padding:0}
.pit[disabled]{cursor:default}.pit:not([disabled]):hover{box-shadow:inset 0 3px 7px #8a6a3f47,0 0 0 3px var(--mint-strong)}
.pit.last{box-shadow:inset 0 3px 7px #8a6a3f47,0 0 0 2px #fff}
.pit .seeds{position:absolute;inset:22%;display:flex;flex-wrap:wrap;align-content:center;justify-content:center;gap:2px}.pit .seeds i{width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#e3f8ec,#5fcb92)}
.pit b{position:absolute;right:6%;bottom:2%;font-size:10px;opacity:.85}
.dots-board{display:grid;grid-template-columns:repeat(var(--n),12px minmax(0,1fr)) 12px;grid-template-rows:repeat(var(--n),12px minmax(0,1fr)) 12px;max-width:420px;aspect-ratio:1;padding:6px}
.dots-board .dot{width:12px;height:12px;border-radius:50%;background:#aeb7b2}
.dots-board .edge{border:0;padding:0;background:transparent;cursor:pointer;position:relative}
.dots-board .edge::after{content:"";position:absolute;inset:3px;border-radius:4px;background:var(--surface-2);transition:background .15s}
.dots-board .edge:not([disabled]):hover::after{background:#86deae99}
.dots-board .edge.drawn-1::after{background:#1f5a3a}.dots-board .edge.drawn-2::after{background:var(--mint-strong)}
.dots-board .edge.last::after{box-shadow:0 0 0 2px #86deae80}
.dots-board .edge[disabled]{cursor:default}
.dots-board .box{display:grid;place-items:center;font-weight:700;font-size:15px;border-radius:6px;margin:4px}
.dots-board .box.owned-1{background:#1f5a3a;color:#fff}.dots-board .box.owned-2{background:var(--mint);color:#0f2a1b}

/* Light-theme versions of the original components that used dark panels */
body:not([data-theme=dark]) .activity-art,body:not([data-theme=dark]) .idea-art{background:var(--surface)}
body:not([data-theme=dark]) .chip.active{background:var(--mint);color:#0f2a1b;border-color:var(--mint)}
body:not([data-theme=dark]) .question{background:var(--card);color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow-soft)}
body:not([data-theme=dark]) .answer-options button{background:var(--surface);color:var(--ink);border:1px solid var(--line)}
body:not([data-theme=dark]) .answer-options button:hover:not([disabled]){border-color:var(--mint-strong)}
body:not([data-theme=dark]) .answer-options button.chosen{background:var(--mint);border-color:var(--mint);color:#0f2a1b}
body:not([data-theme=dark]) .answer-options button.correct{box-shadow:0 0 0 2px var(--mint-strong)}
body:not([data-theme=dark]) #toast{background:var(--card);color:var(--ink);border:1px solid var(--line);box-shadow:0 18px 40px -18px #17432a59}
body:not([data-theme=dark]) .auth-story{background:radial-gradient(70% 60% at 100% 0%,#86deae33,transparent 60%),var(--surface);color:var(--ink)}
body:not([data-theme=dark]) .auth-story .brand{color:var(--ink)}
body:not([data-theme=dark]) .auth-story h1 span{color:var(--mint-dark)}
body:not([data-theme=dark]) .auth-story p,body:not([data-theme=dark]) .auth-story>p{color:var(--muted)}
body:not([data-theme=dark]) .auth-activities span{border-color:var(--line);color:var(--ink);background:var(--card)}
body:not([data-theme=dark]) .auth-activities span .icon{color:var(--mint-strong)}
body:not([data-theme=dark]) .auth-story footer{color:var(--muted)}
body:not([data-theme=dark]) .book-cover{background:var(--surface);color:var(--ink);border:1px solid var(--line)}
body:not([data-theme=dark]) .book-cover .eyebrow,body:not([data-theme=dark]) .book-cover small{color:var(--muted)}
body:not([data-theme=dark]) .couple-cover{background:var(--surface);color:var(--ink)}
body:not([data-theme=dark]) .couple-cover>span{color:var(--mint-ink)}body:not([data-theme=dark]) .couple-cover small{color:var(--muted)}
body:not([data-theme=dark]) .library-spines span{background:#d7efe2;color:var(--mint-dark)}
body:not([data-theme=dark]) .library-spines span:nth-child(2){background:#efe2cc;color:#5d4a31}
body:not([data-theme=dark]) .library-spines span:nth-child(3){background:#e2e8ef;color:#38465a}
body:not([data-theme=dark]) .editorial-book{background:#e5f5ec;color:var(--mint-dark)}
body:not([data-theme=dark]) .editorial-book.tone-1{background:#f0e6d6;color:#5d4a31}
body:not([data-theme=dark]) .editorial-book.tone-2{background:#e3e9f0;color:#38465a}
body:not([data-theme=dark]) .editorial-book.tone-3{background:#f3e3dd;color:#6b3f33}
body:not([data-theme=dark]) .editorial-book:after{border-color:#15151514}
body:not([data-theme=dark]) .cinema-banner,body:not([data-theme=dark]) .listening-hero,body:not([data-theme=dark]) .teleparty-banner{background:radial-gradient(60% 80% at 100% 0%,#86deae2b,transparent 62%),var(--card);color:var(--ink);border:1px solid var(--line)}
body:not([data-theme=dark]) .cinema-banner p,body:not([data-theme=dark]) .listening-hero p,body:not([data-theme=dark]) .teleparty-banner p{color:var(--muted)}
body:not([data-theme=dark]) .cinema-banner .eyebrow,body:not([data-theme=dark]) .listening-hero .eyebrow,body:not([data-theme=dark]) .teleparty-banner .eyebrow{color:var(--mint-ink)}
body:not([data-theme=dark]) .record-art{background:repeating-radial-gradient(circle,#e3e9e5 0,#e3e9e5 4px,#d2dbd5 5px,#e9eeeb 7px);box-shadow:0 15px 40px #17432a26}
body:not([data-theme=dark]) .record-art span{background:var(--card)}
body:not([data-theme=dark]) .film-poster{background:radial-gradient(ellipse at 90% 100%,#86deae47,transparent 70%),var(--surface);color:var(--ink)}
body:not([data-theme=dark]) .film-poster small{color:var(--muted)}
body:not([data-theme=dark]) .poster-play{border-color:var(--line);color:var(--mint-ink)}
body:not([data-theme=dark]) .music-art,body:not([data-theme=dark]) .game-art,body:not([data-theme=dark]) .music-tile:nth-child(n) .music-art{background:radial-gradient(80% 90% at 90% 0%,#86deae33,transparent 62%),var(--surface);color:var(--ink)}
body:not([data-theme=dark]) .music-art small{color:var(--muted)}
body:not([data-theme=dark]) .music-art svg,body:not([data-theme=dark]) .game-art>svg,body:not([data-theme=dark]) .game-art>span{color:var(--mint-ink)}
body:not([data-theme=dark]) .cols-7{background:#d9e6de}
body:not([data-theme=dark]) .cols-7 .arcade-cell{background:#fff}
body:not([data-theme=dark]) .cols-7 .disc-1{background:var(--mint)}body:not([data-theme=dark]) .cols-7 .disc-2{background:#e7c598}
body:not([data-theme=dark]) .watch-player{background:var(--surface);color:var(--ink);border:1px solid var(--line)}
body:not([data-theme=dark]) .watch-player video{background:#e9eeeb}
body:not([data-theme=dark]) .watch-status{border-top-color:var(--line);color:var(--muted)}
body:not([data-theme=dark]) .room-stage,body:not([data-theme=dark]) .room-stage .official-player,body:not([data-theme=dark]) .room-stage .browser-frame{background:radial-gradient(70% 70% at 50% 0%,#86deae26,transparent 62%),var(--surface)}
body:not([data-theme=dark]) .room-stage{border:1px solid var(--line)}
body:not([data-theme=dark]) .stage-empty h2{color:var(--ink)}body:not([data-theme=dark]) .stage-empty p{color:var(--muted)}body:not([data-theme=dark]) .stage-empty .icon{color:var(--mint-strong)}
body:not([data-theme=dark]) .rtc-tile,body:not([data-theme=dark]) .local-preview{background:var(--surface)}
body:not([data-theme=dark]) .rtc-tile span{color:var(--ink)}
body:not([data-theme=dark]) .network-banner{background:var(--mint);color:#0f2a1b}
body:not([data-theme=dark]) .button.dark{background:var(--mint);color:#0f2a1b}

/* Live AI hosts (room stage and standalone page) */
.ai-panel{display:grid;gap:14px}
.ai-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ai-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:var(--mint-soft);border:1px solid var(--mint-line);color:var(--mint-ink);font-size:12px;font-weight:650;width:max-content}.ai-badge .icon{width:15px;height:15px}
.ai-meta{font-size:11px;color:var(--muted);letter-spacing:.04em}
.ai-card{padding:24px;border-radius:22px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-soft)}
.ai-card h2{font-size:clamp(20px,2.2vw,26px);line-height:1.25;margin:10px 0 16px}
.ai-card .ai-sub{color:var(--muted);margin:-8px 0 16px;font-size:14px}
.ai-q{font-family:var(--serif);font-weight:500;letter-spacing:-.01em}
.ai-answers,.ai-panel .ai-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:4px 0 12px}
.ai-panel .ai-choices{grid-template-columns:minmax(0,1fr)}
.ai-answer{display:flex;align-items:center;gap:12px;text-align:left;padding:13px 15px;border-radius:16px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-size:14px;cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s;min-height:56px}
.ai-answer b{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:var(--surface);font-size:12px;flex:none}
.ai-answer:not([disabled]):hover{border-color:var(--mint-strong)}
.ai-answer.chosen{border-color:var(--mint-strong);background:var(--mint-soft)}.ai-answer.chosen b{background:var(--mint)}
.ai-answer.correct{border-color:var(--mint-strong);background:var(--mint-soft);box-shadow:0 0 0 1px var(--mint-strong)}.ai-answer.correct b{background:var(--mint-strong);color:#fff}
.ai-answer.wrong{opacity:.55}.ai-answer small{margin-left:auto;font-size:11px;color:var(--muted);white-space:nowrap}
.ai-answer[disabled]{cursor:default;opacity:.72}
.ai-answer.correct[disabled],.ai-answer.chosen[disabled]{opacity:1}.ai-answer.wrong[disabled]{opacity:.5}
.ai-panel .ai-banter{font:italic 15px/1.5 var(--serif);color:var(--mint-ink);margin:8px 0 0}
.ai-panel .ai-scores{padding:18px 20px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}
.ai-panel .ai-scores>div{display:flex;align-items:center;gap:12px;padding:8px 0;border-top:1px solid var(--line);font-size:14px}.ai-panel .ai-scores>div:first-of-type{border-top:0}
.ai-panel .ai-scores b{width:24px;color:var(--muted);font:italic 500 14px var(--serif)}.ai-panel .ai-scores span{flex:1}.ai-panel .ai-scores strong{font-size:18px;letter-spacing:-.02em}
.ai-panel .ai-scores .me span{font-weight:650}
.ai-panel .ai-scene{font:17px/1.65 var(--serif);color:var(--ink);margin:0 0 12px}
.ai-panel .ai-clue{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--mint-ink);margin:0 0 14px}.ai-panel .ai-clue .icon{width:15px;flex:none;margin-top:2px}
.ai-inline{display:flex;gap:8px;margin:12px 0 0}.ai-inline input{flex:1;min-width:0}
.ai-actions{margin-top:12px;display:grid;gap:6px}.ai-actions p{margin:0;font-size:13px;padding:8px 12px;border-radius:12px;background:var(--surface)}.ai-actions b{margin-right:6px}
.ai-panel .ai-cast{padding:18px 20px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}.ai-panel .ai-cast p{margin:8px 0 0;font-size:13px}.ai-panel .ai-cast p b{margin-right:6px}
.ai-me{display:grid;gap:4px;padding:14px;border-radius:14px;background:var(--mint-soft);border:1px solid var(--mint-line);margin-top:6px}.ai-me small{color:var(--mint-ink);font-size:12.5px}
.ai-sides{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:4px 0 14px}
.ai-side{padding:18px;border-radius:18px;border:1px solid var(--line);background:var(--surface);display:grid;gap:8px;align-content:start}
.ai-side.won{border-color:var(--mint-strong);background:var(--mint-soft);box-shadow:0 0 0 1px var(--mint-strong)}
.ai-side h3{font-size:16px}.ai-side p{margin:0;font:15px/1.55 var(--serif)}.ai-side textarea{min-height:90px}
.ai-points strong{font-size:28px;letter-spacing:-.03em;display:block}.ai-points small{font-size:11.5px;color:var(--muted)}
.ai-verdict{padding:16px 18px;border-radius:16px;background:var(--mint-soft);border:1px solid var(--mint-line);margin-bottom:14px}.ai-verdict strong{display:block;font:500 18px/1.4 var(--serif)}.ai-verdict p{margin:6px 0 0;font-size:14px;color:var(--muted)}
.ai-thinking,.ai-waiting{display:grid;justify-items:center;text-align:center;padding:44px 24px}.ai-thinking p,.ai-waiting p{color:var(--muted);margin:0}
.ai-orb{display:inline-flex;gap:7px;margin-bottom:6px}.ai-orb i{width:11px;height:11px;border-radius:50%;background:var(--mint-strong);animation:ai-bounce 1.2s infinite ease-in-out}.ai-orb i:nth-child(2){animation-delay:.15s}.ai-orb i:nth-child(3){animation-delay:.3s}
@keyframes ai-bounce{0%,80%,100%{transform:scale(.55);opacity:.45}40%{transform:scale(1);opacity:1}}
.ai-foot{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--muted);margin:0}.ai-foot .icon{width:14px;flex:none}
.ai-start .choice-chips{margin-bottom:16px}
#ai-start:not(:has(input[value=debate-judge]:checked)) .ai-debaters{display:none}
.ai-page{max-width:900px}
.ai-stage{padding:22px!important;min-height:420px;color:var(--ink)}.ai-stage #rm-ai{width:100%}
body:not([data-theme=dark]) .room-stage{color:var(--ink)}
.ai-pane .eyebrow{display:flex;align-items:center;gap:7px;color:var(--mint-ink)}.ai-pane .eyebrow .icon{width:14px;height:14px}
.agent-cta{margin:0 0 14px;align-self:flex-start}
.prompt-kinds{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 2px}.prompt-kinds .choice-chip span{padding:6px 11px;font-size:12px}
.setup-pane{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:center;border:1px solid var(--mint-line);background:linear-gradient(135deg,var(--mint-soft),var(--card) 60%)}
.setup-steps{margin:0;padding-left:20px;display:grid;gap:10px;font-size:14px}.setup-steps code{font-size:12.5px;padding:2px 6px;border-radius:6px;background:var(--card);border:1px solid var(--line)}
@media(max-width:760px){.ai-answers,.ai-sides,.setup-pane{grid-template-columns:minmax(0,1fr)}.ai-card{padding:18px}.ai-inline{flex-direction:column}}
@media(prefers-reduced-motion:reduce){.ai-orb i{animation:none}}

/* Mobile bottom bar with a centre "Start a room" button; profile moves to the header */
.mobile-nav .nav-cta{display:none}
@media(max-width:760px){
 .top-actions .profile-link{display:flex;margin-left:4px}.top-actions .profile-link>span:not(.avatar){display:none}
 .mobile-nav{align-items:center;padding:7px 8px;border-radius:24px;background:color-mix(in srgb,var(--card) 90%,transparent);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);box-shadow:0 18px 44px -18px #17432a59}
 .mobile-nav .nav-link.active{background:transparent;color:var(--ink);font-weight:650}
 .mobile-nav .nav-link.active .icon{color:var(--mint-ink)}
 .mobile-nav .nav-cta{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;flex:1;font-size:9px;font-weight:650;color:var(--ink)}
 .mobile-nav .nav-cta .icon{width:46px;height:46px;padding:12px;border-radius:16px;background:var(--mint);color:#0f2a1b;margin-top:-22px;box-shadow:0 12px 24px -10px #2f8a5ab3;stroke-width:1.8}
 .stage-hero{grid-template-columns:1fr;gap:26px;border-radius:24px;padding:26px 22px}
 .stage-copy h1,.stage-copy h2{font-size:clamp(32px,9vw,40px)}
 .hero-actions .button{flex:1 1 auto}
 .room-visual{padding-bottom:40px}.rv-window{transform:none}.rv-chat{right:0;width:62%}
 .ways-grid,.idea-strip,.steps-3,.mode-tiles,.topic-grid,.agent-grid,.game-grid,.partner-grid,.stream-grid,.how-ai,.early-pane,.plus-pane{grid-template-columns:minmax(0,1fr)}
 .mode-options{grid-template-columns:minmax(0,1fr)}
 .room-row{flex-wrap:wrap}.room-row>.button,.room-row>.soft-pill,.room-row .actions{width:100%;justify-content:center}
 .quiet-empty{flex-direction:column;align-items:flex-start}
 .games-visual{transform:none;grid-template-columns:repeat(4,1fr);gap:8px}.gv-tile{border-radius:14px}.gv-tile:nth-child(n){transform:none}
 .mancala-board{grid-template-columns:44px 1fr 44px;padding:10px;border-radius:28px;gap:6px}.pit-row{gap:4px}.mancala-board .store b{font-size:18px}.pit .seeds i{width:4px;height:4px}
 .ai-teaser{flex-wrap:wrap}.prompt-row{flex-direction:column;align-items:stretch}
 .cv-q{max-width:92%}
}
@media(min-width:761px) and (max-width:1200px){
 .ways-grid,.mode-tiles,.topic-grid,.agent-grid,.partner-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .game-grid,.stream-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .idea-strip{grid-template-columns:1fr}
 .stage-hero{grid-template-columns:1fr}
 .rv-window{transform:none}
}
@media(prefers-reduced-motion:reduce){.live-pill i,.live-dot{animation:none}.button,.way-card,.game-card,.topic-card{transition:none}}

/* 0.6 hangout hub — who's around, friend links, gamer cards, squads, Odd One Out, live room controls */
.whos-around:empty{display:none}
.whos-around{margin:0 0 30px}
.around-card{padding:22px 24px;border-radius:24px;background:linear-gradient(135deg,var(--mint-soft),var(--card) 62%);border:1px solid var(--mint-line);box-shadow:var(--shadow-soft)}
.around-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.around-head .eyebrow{display:flex;align-items:center;gap:8px}.around-head h2{font-size:22px;margin:4px 0 0}
.share-toggle{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 15px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:all .15s}
.share-toggle:hover{border-color:var(--mint-strong);color:var(--mint-ink)}
.share-toggle.on{background:var(--mint);border-color:var(--mint);color:#0f2a1b}.share-toggle .icon{width:15px;height:15px}
.around-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;margin-top:16px}
.around-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;background:var(--card);border:1px solid var(--line)}
.around-row .item-copy{flex:1;min-width:0}.around-row .item-copy strong{display:block;font-size:14px}.around-row .item-copy small{display:block;font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.around-row .button{flex:none}
.around-avatar{position:relative;flex:none;display:inline-flex}
.presence-dot{position:absolute;right:-1px;bottom:-1px;width:12px;height:12px;border-radius:50%;background:var(--mint-strong);box-shadow:0 0 0 2.5px var(--card)}
.presence-dot.in-room{background:#f2b84b}
.around-empty{margin:10px 0 0;font-size:13px;color:var(--muted);max-width:640px}
.friend-link-panel{background:linear-gradient(160deg,var(--mint-soft),var(--card) 70%);border:1px solid var(--mint-line)}
.friend-link-panel .eyebrow{display:flex;align-items:center;gap:6px}.friend-link-panel .eyebrow .icon{width:13px;height:13px}
.gamer-peek{margin-top:18px;padding:16px 18px;border-radius:18px;background:var(--surface);border:1px solid var(--line)}
.gamer-peek .eyebrow{display:flex;align-items:center;gap:6px;margin-bottom:8px}.gamer-peek .eyebrow .icon{width:14px;height:14px}
.handle-row{display:flex;align-items:center;gap:10px;padding:7px 0;border-top:1px solid var(--line);font-size:13px}.handle-row:first-of-type{border-top:0}
.handle-row span{width:120px;color:var(--muted);flex:none}.handle-row code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:12.5px;background:var(--card);padding:3px 8px;border-radius:8px;border:1px solid var(--line)}
.shared-games{display:flex;align-items:center;gap:6px;margin:10px 0 0;font-size:13px;font-weight:600;color:var(--mint-ink)}.shared-games .icon{width:15px;height:15px;flex:none}
.gamer-pane .eyebrow{display:flex;align-items:center;gap:6px}.gamer-pane .eyebrow .icon{width:14px;height:14px}.gamer-pane h3{margin:6px 0 4px}
.game-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}.game-chips:empty{display:none}
.game-chip{display:inline-flex;align-items:center;gap:4px;padding:5px 6px 5px 12px;border-radius:999px;background:var(--mint-soft);border:1px solid var(--mint-line);font-size:12.5px;font-weight:600;color:var(--mint-ink)}
.game-chip button{width:22px;height:22px;min-height:0;padding:0;border:0;border-radius:50%;background:transparent;color:inherit;cursor:pointer;display:grid;place-items:center;font-size:14px;line-height:1}
.game-chip button:hover{background:var(--card)}.game-chip .icon{width:12px;height:12px}
.game-add{display:flex;gap:8px}.game-add input{flex:1;min-width:0}
.game-suggest{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.handles-box{margin:4px 0 16px;border:1px solid var(--line);border-radius:16px;padding:12px 16px}
.handles-box summary{cursor:pointer;font-size:13px;font-weight:600}
.handles-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px;margin-top:12px}.handles-grid .field{margin-bottom:10px}
.squad-section:empty{display:none}
.squad-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.squad-card{display:flex;flex-direction:column;gap:14px;padding:18px;border-radius:22px;background:var(--card);border:1px solid var(--line);transition:border-color .18s,box-shadow .18s}
.squad-card:hover{border-color:var(--mint-line);box-shadow:var(--shadow-soft)}
.squad-top{display:flex;align-items:center;gap:12px}.squad-top h3{font-size:16px;margin:0}.squad-top small{font-size:12px;color:var(--muted)}
.squad-mark{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:var(--mint-soft);color:var(--mint-ink);flex:none}.squad-mark .icon{width:20px;height:20px}
.squad-people{display:flex;align-items:center;gap:4px;min-width:0}.squad-people small{margin-left:6px;font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.squad-card .partner-actions{margin-top:auto}
/* Odd One Out */
.party-card{display:grid;gap:16px}
.party-intro h2{font:500 26px/1.2 var(--serif);letter-spacing:-.02em;margin:12px 0}
.party-rules{margin:0 0 14px;padding-left:20px;display:grid;gap:6px;font-size:14px;color:var(--ink)}
.party-word{display:grid;gap:2px;justify-items:center;text-align:center;padding:22px;border-radius:20px;background:linear-gradient(160deg,var(--mint-soft),var(--card));border:1px solid var(--mint-line)}
.party-word small{font-size:10.5px;letter-spacing:.16em;font-weight:700;color:var(--mint-ink)}
.party-word strong{font:500 clamp(30px,5vw,44px)/1.1 var(--serif);letter-spacing:-.02em;color:var(--mint-dark)}
.party-word span{font-size:12px;color:var(--muted)}
.party-players{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.party-player{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:var(--surface);border:1px solid transparent;font-size:13px;min-width:0}
.party-player.me{border-color:var(--mint-line);background:var(--mint-soft)}
.party-player b{width:24px;height:24px;border-radius:8px;display:grid;place-items:center;background:var(--card);font-size:11px;flex:none}
.party-player span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.party-player em{font-style:normal;font-weight:650;color:var(--mint-ink);max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.party-hint{margin:0;font-size:14px;color:var(--muted)}
.party-vote{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.party-card .actions{display:flex;flex-wrap:wrap;gap:8px}
/* Room: switch activity + reactions */
.rm-switch{display:flex;flex-wrap:wrap;align-items:center;gap:6px;width:100%;padding:10px 12px;border-radius:18px;background:var(--surface);border:1px solid var(--line)}
.rm-switch>span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--muted);margin-right:4px}
.rm-switch .chip{min-height:34px;padding:6px 12px;background:var(--card);cursor:pointer;color:var(--ink);font:inherit;font-size:12px}
.rm-switch .chip .icon{width:14px;height:14px}.rm-switch .chip:hover:not([disabled]){border-color:var(--mint-strong);color:var(--mint-ink)}
.rm-switch .chip.active{background:var(--mint);border-color:var(--mint);color:#0f2a1b;opacity:1;cursor:default}
.rm-reactions{display:flex;gap:4px;margin-left:auto;padding:4px;border-radius:999px;background:var(--surface);border:1px solid var(--line)}
.reaction-btn{width:38px;height:38px;min-height:0;padding:0;border:0;border-radius:50%;background:transparent;font-size:19px;line-height:1;cursor:pointer;transition:transform .15s,background .15s}
.reaction-btn:hover{background:var(--card);transform:translateY(-2px) scale(1.08)}.reaction-btn:active{transform:scale(.92)}
.floating-reaction{position:absolute;bottom:14px;z-index:5;display:grid;justify-items:center;gap:2px;pointer-events:none;animation:float-up 2.6s cubic-bezier(.2,.7,.3,1) forwards}
.floating-reaction b{font-size:34px;line-height:1;filter:drop-shadow(0 6px 10px #17432a33)}
.floating-reaction small{font-size:10.5px;font-weight:650;padding:2px 8px;border-radius:999px;background:var(--card);color:var(--ink);box-shadow:var(--shadow-soft);white-space:nowrap}
@keyframes float-up{0%{opacity:0;transform:translateY(16px) scale(.6)}12%{opacity:1;transform:translateY(0) scale(1.08)}75%{opacity:1}100%{opacity:0;transform:translateY(-220px) scale(.95)}}
@media(max-width:1100px){.squad-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
 .around-card{padding:18px}.around-head h2{font-size:19px}.around-list{grid-template-columns:minmax(0,1fr)}
 .squad-grid,.party-vote,.handles-grid{grid-template-columns:minmax(0,1fr)}
 .rm-reactions{margin-left:0;width:100%;justify-content:space-between}
 .handle-row span{width:92px}
}
@media(prefers-reduced-motion:reduce){.floating-reaction{animation:none;opacity:0}.reaction-btn,.share-toggle{transition:none}}
/* 0.6 hub polish: quiet presence strip, link status, curated game grids */
.whos-around{margin:0 0 24px}
.around-card.is-quiet{display:flex;align-items:center;gap:16px;padding:14px 18px;background:var(--card);border-color:var(--line);box-shadow:none}
.around-quiet-mark{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:var(--mint-soft);color:var(--mint-ink);flex:none}.around-quiet-mark .icon{width:20px;height:20px}
.around-quiet-copy{flex:1;min-width:0}.around-quiet-copy strong{display:block;font-size:14.5px}.around-quiet-copy small{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
.around-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.around-list{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.around-row .item-copy strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.link-status{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px;padding-top:10px;border-top:1px solid var(--mint-line);font-size:12px;color:var(--muted)}.link-status:empty{display:none}
.link-status .button{min-height:0;padding:0;font-size:12px}
.rm-switch{flex:1 1 520px;width:auto}
.invite-landing .button.full{margin-top:18px}
.gamer-pane>.small-note{margin-bottom:18px}
.game-grid.duel-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.game-card.featured{grid-column:span 2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.game-card.featured .game-card-art{height:auto;min-height:220px;border-bottom:0;border-right:1px solid var(--line)}.game-card.featured .game-card-art svg{height:124px}
.game-card.featured .game-card-copy{align-self:center}
.cloud-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:761px) and (max-width:1200px){
 .game-grid.duel-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .game-grid.party-three .game-card:first-child{grid-column:span 2}
}
@media(max-width:760px){
 .game-grid.duel-grid,.game-grid.party-three,.cloud-grid{grid-template-columns:minmax(0,1fr)}
 .game-card.featured,.game-grid.party-three .game-card:first-child{grid-column:auto}
 .game-card.featured{display:block}.game-card.featured .game-card-art{min-height:0;height:150px;border-right:0;border-bottom:1px solid var(--line)}.game-card.featured .game-card-art svg{height:96px}
 .around-card.is-quiet{flex-wrap:wrap}.around-actions{width:100%;justify-content:flex-start}
 .rm-switch{flex-basis:100%}
}
body[data-theme=dark] .party-word strong{color:var(--mint-ink)}
body[data-theme=dark] .presence-dot{box-shadow:0 0 0 2.5px var(--bg)}

/* ===== 0.7 — avatars are squares with rounded corners (not circles), with optional rings ===== */
.avatar{border-radius:30%!important}
.avatar img{border-radius:30%}
.avatar[data-ring]:not([data-ring=none]){box-shadow:0 0 0 2px var(--card),0 0 0 4.5px var(--ring,var(--mint-strong))}
.avatar[data-ring=mint]{--ring:#5fcb92}.avatar[data-ring=sunrise]{--ring:#f2a65a}.avatar[data-ring=ocean]{--ring:#4aa3df}.avatar[data-ring=berry]{--ring:#d4588f}
.avatar[data-ring=gold]{box-shadow:0 0 0 2px var(--card),0 0 0 4.5px #d4a73a,0 0 14px 2px #f2c94c66}
.avatar[data-ring=aurora],.avatar[data-ring=prism],.avatar[data-ring=confetti],.avatar[data-ring=pulse]{box-shadow:0 0 0 2px var(--card)}
@property --ring-angle{syntax:'<angle>';inherits:false;initial-value:0deg}
.avatar[data-ring=aurora]::after,.avatar[data-ring=prism]::after,.avatar[data-ring=confetti]::after{content:"";position:absolute;inset:-5px;border-radius:34%;padding:3px;pointer-events:none;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.avatar[data-ring=aurora]::after{background:conic-gradient(from var(--ring-angle),#86deae,#7cc6f2,#c6a8ff,#f49ac1,#86deae);animation:ring-spin 5s linear infinite}
.avatar[data-ring=prism]::after{background:conic-gradient(from var(--ring-angle),#ff8a80,#ffd166,#86deae,#7cc6f2,#c6a8ff,#ff8a80);animation:ring-spin 3.5s linear infinite}
.avatar[data-ring=confetti]::after{background:repeating-conic-gradient(#f2b84b 0 12deg,#86deae 12deg 24deg,#f49ac1 24deg 36deg,#7cc6f2 36deg 48deg)}
.avatar[data-ring=pulse]{animation:ring-pulse 2.2s ease-in-out infinite}
@keyframes ring-spin{to{--ring-angle:360deg}}
@keyframes ring-pulse{0%,100%{box-shadow:0 0 0 2px var(--card),0 0 0 4px #5fcb92,0 0 0 4px #5fcb9200}50%{box-shadow:0 0 0 2px var(--card),0 0 0 4px #5fcb92,0 0 0 10px #5fcb9233}}

/* ===== Emoji picker ===== */
.emoji-pop{position:fixed;z-index:80;width:340px;max-width:calc(100vw - 16px);max-height:min(420px,calc(100vh - 16px));display:grid;grid-template-rows:auto auto 1fr;background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:0 24px 60px -20px #17432a40,0 2px 6px #1515150f;overflow:hidden}
.emoji-top{padding:10px 10px 6px}.emoji-top input{width:100%;min-height:38px;border-radius:12px;font-size:13px}
.emoji-tabs{display:flex;gap:2px;padding:0 8px 6px;overflow-x:auto;scrollbar-width:none}.emoji-tabs::-webkit-scrollbar{display:none}
.emoji-tabs button{flex:none;width:34px;height:34px;min-height:0;padding:0;border:0;border-radius:10px;background:transparent;font-size:18px;cursor:pointer;opacity:.6}
.emoji-tabs button[aria-selected=true]{background:var(--mint-soft);opacity:1}
.emoji-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));align-content:start;gap:2px;padding:4px 8px 10px;overflow-y:auto;overscroll-behavior:contain}
.emoji-label{grid-column:1/-1;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--muted);padding:6px 4px}
.emoji-cell{aspect-ratio:1;min-height:0;padding:0;border:0;border-radius:10px;background:transparent;font-size:22px;line-height:1;cursor:pointer;transition:transform .1s,background .1s}
.emoji-cell:hover,.emoji-cell:focus-visible{background:var(--mint-soft);transform:scale(1.15)}
.emoji-none{grid-column:1/-1;color:var(--muted);font-size:13px;padding:12px 4px}
.emoji-button{font-size:18px;line-height:1}
@media(max-width:600px){.emoji-pop{left:8px!important;right:8px;top:auto!important;bottom:8px;width:auto}.emoji-grid{grid-template-columns:repeat(7,minmax(0,1fr))}}

/* ===== Style editor, status, banners and effects ===== */
.style-pane .eyebrow,.status-pane .eyebrow,.push-pane .eyebrow,.claim-pane .eyebrow{display:flex;align-items:center;gap:6px}.style-pane .eyebrow .icon,.status-pane .eyebrow .icon,.push-pane .eyebrow .icon,.claim-pane .eyebrow .icon{width:14px;height:14px}
.style-preview{position:relative;border-radius:22px;overflow:hidden;border:1px solid var(--line);margin:16px 0 18px;background:var(--card)}
.style-preview-art{height:96px;background:var(--banner);position:relative;overflow:hidden}
.style-preview-body{display:flex;align-items:flex-start;gap:14px;padding:0 18px 16px;margin-top:-38px;position:relative}.style-preview-body>div{padding-top:44px;min-width:0}
.style-preview-body .avatar{width:76px;height:76px;font-size:22px;background:var(--mint-soft)}
.style-preview-body strong{display:block;font-size:17px}.style-preview-body small{display:block;color:var(--muted);font-size:12px}
.status-chip{display:inline-flex;align-items:center;gap:4px;margin-top:6px;padding:3px 10px;border-radius:999px;background:var(--mint-soft);color:var(--mint-ink);font-size:12px;font-weight:600}
.tier-chip{display:inline-flex;margin:6px 0 0 6px;padding:3px 9px;border-radius:999px;font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--mint-soft);color:var(--mint-ink)}
.tier-chip.tier-headliner{background:#fff4d6;color:#7a5600}.tier-chip.tier-inner-circle{background:#eef3ff;color:#2d4a8a}
.banner-meadow{--banner:linear-gradient(135deg,#e2f7ec,#a8e6c6 55%,#5fcb92)}.banner-sunset{--banner:linear-gradient(135deg,#ffe7cc,#ffbe92 55%,#f4917a)}
.banner-lagoon{--banner:linear-gradient(135deg,#dcf4fb,#97d6ec 55%,#4aa3df)}.banner-blossom{--banner:linear-gradient(135deg,#ffe8f1,#f7bcd3 55%,#e284ac)}
.banner-aurora{--banner:linear-gradient(120deg,#c9f7e2,#b1dcff 35%,#dccbff 65%,#ffdcee)}
.banner-confetti{--banner:radial-gradient(circle at 12% 30%,#f2b84b 0 4px,transparent 5px),radial-gradient(circle at 34% 70%,#5fcb92 0 4px,transparent 5px),radial-gradient(circle at 58% 25%,#f49ac1 0 4px,transparent 5px),radial-gradient(circle at 80% 62%,#7cc6f2 0 4px,transparent 5px),radial-gradient(circle at 92% 22%,#86deae 0 3px,transparent 4px),linear-gradient(135deg,#fffaf0,#fff1f6)}
.banner-waves{--banner:repeating-radial-gradient(circle at 0 100%,#c9eedc 0 10px,#effaf4 10px 20px)}
.banner-stardust{--banner:radial-gradient(circle at 30% 40%,#fff 0 1.5px,transparent 2px) 0 0/22px 22px,radial-gradient(circle at 70% 70%,#fff 0 1px,transparent 1.5px) 0 0/30px 30px,linear-gradient(135deg,#cfe6ff,#e6d7ff)}
.style-preview-art i{position:absolute;bottom:-14px;width:10px;height:10px;border-radius:50%;opacity:.9;animation:fx-rise 4s linear infinite}
.style-preview-art i:nth-child(1){left:10%;animation-delay:0s}.style-preview-art i:nth-child(2){left:26%;animation-delay:.7s}.style-preview-art i:nth-child(3){left:44%;animation-delay:1.4s}.style-preview-art i:nth-child(4){left:62%;animation-delay:2.1s}.style-preview-art i:nth-child(5){left:78%;animation-delay:2.8s}.style-preview-art i:nth-child(6){left:90%;animation-delay:3.4s}
.effect-sparkle .style-preview-art i{width:7px;height:7px;background:#fff;box-shadow:0 0 8px 2px #fff}.effect-petals .style-preview-art i{width:10px;height:7px;border-radius:70% 0;background:#f7a8c8}.effect-bubbles .style-preview-art i{background:transparent;border:1.5px solid #ffffffcc}
@keyframes fx-rise{0%{transform:translateY(0) rotate(0);opacity:0}15%{opacity:.95}100%{transform:translateY(-120px) rotate(160deg);opacity:0}}
.style-block{margin:0 0 16px}.style-block h4{font-size:13px;margin:0 0 8px}
.style-swatches{display:flex;flex-wrap:wrap;gap:8px}
.style-swatch{position:relative;display:grid;justify-items:center;gap:5px;width:74px;padding:9px 4px 7px;border:1px solid var(--line);border-radius:16px;background:var(--card);cursor:pointer;font:inherit;color:var(--ink);transition:border-color .15s,box-shadow .15s}
.style-swatch:hover{border-color:var(--mint-strong)}.style-swatch.selected{border-color:var(--mint-strong);box-shadow:0 0 0 2px var(--mint-line)}
.style-swatch small{font-size:10.5px;color:var(--muted);text-align:center;line-height:1.2}
.style-swatch em{position:absolute;top:5px;right:5px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:var(--surface);color:var(--muted)}.style-swatch em .icon{width:11px;height:11px}
.style-swatch.locked .swatch-dot{opacity:.75}
.swatch-dot{width:34px;height:34px;border-radius:30%;background:var(--surface);position:relative}
.swatch-ring .swatch-dot{background:var(--mint-soft);box-shadow:0 0 0 2px var(--card),0 0 0 4.5px var(--ring,#d9dedb)}
.ring-mint .swatch-dot{--ring:#5fcb92}.ring-sunrise .swatch-dot{--ring:#f2a65a}.ring-ocean .swatch-dot{--ring:#4aa3df}.ring-berry .swatch-dot{--ring:#d4588f}.ring-gold .swatch-dot{--ring:#d4a73a}.ring-none .swatch-dot{--ring:#e5e9e7}
.ring-aurora .swatch-dot{box-shadow:none;background:conic-gradient(#86deae,#7cc6f2,#c6a8ff,#f49ac1,#86deae)}.ring-prism .swatch-dot{box-shadow:none;background:conic-gradient(#ff8a80,#ffd166,#86deae,#7cc6f2,#c6a8ff,#ff8a80)}
.ring-confetti .swatch-dot{box-shadow:none;background:repeating-conic-gradient(#f2b84b 0 12deg,#86deae 12deg 24deg,#f49ac1 24deg 36deg,#7cc6f2 36deg 48deg)}.ring-pulse .swatch-dot{box-shadow:0 0 0 2px var(--card),0 0 0 4.5px #5fcb92,0 0 10px 3px #5fcb9244}
.swatch-banner .swatch-dot{width:52px;height:30px;border-radius:9px;background:var(--banner)}
.swatch-effect .swatch-dot{background:var(--mint-soft);display:grid;place-items:center}.effect-sparkle .swatch-dot::after{content:"✨"}.effect-petals .swatch-dot::after{content:"🌸"}.effect-bubbles .swatch-dot::after{content:"🫧"}.effect-none .swatch-dot::after{content:"—";color:var(--muted)}
.ring-preview[data-ring]{box-shadow:0 0 0 3px var(--card),0 0 0 6px var(--ring,var(--mint-strong))}
.react-slots{display:flex;gap:8px;flex-wrap:wrap}.react-slot{width:46px;height:46px;min-height:0;padding:0;border:1px dashed #cdd5d0;border-radius:14px;background:var(--card);font-size:22px;cursor:pointer}.react-slot:hover{border-style:solid;border-color:var(--mint-strong)}
.status-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0}
.status-row input[name=text]{flex:1;min-width:160px}.status-row select{width:auto}
.status-emoji{width:46px;height:46px;min-height:0;padding:0;border:1px solid var(--line);border-radius:14px;background:var(--mint-soft);font-size:22px;cursor:pointer}

/* ===== Memberships ===== */
.plans-banner{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:18px;background:var(--mint-soft);border:1px solid var(--mint-line);margin:0 0 18px;font-size:13.5px}.plans-banner .icon{width:18px;height:18px;flex:none;color:var(--mint-ink);margin-top:1px}
.period-toggle{display:inline-flex;gap:6px;padding:5px;border-radius:999px;background:var(--surface);margin:0 0 18px}.period-toggle .chip{border:0;min-height:36px;cursor:pointer}
.plan-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:stretch}
.plan-card{position:relative;display:flex;flex-direction:column;gap:14px;padding:22px 20px;border-radius:26px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-soft)}
.plan-card.popular{border-color:var(--mint-strong);box-shadow:0 0 0 1px var(--mint-strong),0 26px 50px -30px #2f8a5a80;background:linear-gradient(180deg,var(--mint-soft),var(--card) 40%)}
.plan-card.current{outline:2px solid var(--mint-line);outline-offset:3px}
.plan-flag{position:absolute;top:-11px;left:20px;padding:4px 10px;border-radius:999px;background:var(--mint-strong);color:#0f3a24;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.plan-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:14px;background:var(--mint-soft);color:var(--mint-ink);font-size:18px}
.plan-headliner .plan-mark{background:#fff4d6;color:#a87800}.plan-inner-circle .plan-mark{background:#eef3ff;color:#3b5bb5}
.plan-head h2{font:500 26px/1.1 var(--serif);letter-spacing:-.02em;margin:12px 0 4px}.plan-head p{margin:0;font-size:13px;color:var(--muted)}
.plan-price strong{font-size:30px;letter-spacing:-.03em}.plan-price small{margin-left:4px;color:var(--muted);font-size:13px}.plan-save{color:var(--mint-ink);font-size:12px;font-weight:600;margin-top:-8px}
.plan-list{list-style:none;margin:0;padding:0;display:grid;gap:8px;flex:1}.plan-list li{display:flex;gap:8px;align-items:flex-start;font-size:13px;line-height:1.45}.plan-list .icon{width:15px;height:15px;flex:none;color:var(--mint-strong);margin-top:2px}
.plan-current{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;border-radius:999px;background:var(--surface);font-weight:600;font-size:13px;color:var(--mint-ink)}.plan-current .icon{width:15px;height:15px}
.plan-compare{margin-top:34px}
.ticket-pane{border-color:#f0dca8;background:linear-gradient(160deg,#fffaf0,var(--card) 60%)}.ticket-pane .eyebrow{display:flex;align-items:center;gap:6px;color:#8a6400}.ticket-pane .eyebrow .icon{width:14px;height:14px}
.ticket-pane.teaser{background:var(--card);border-color:var(--line)}
.inline-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0}.inline-form label{font-size:13px;font-weight:600}.inline-form input{width:110px}

/* ===== Habits, streaks and recap ===== */
.habit-pane .eyebrow{color:var(--mint-ink)}.habit-pane.is-on{background:linear-gradient(160deg,var(--mint-soft),var(--card) 65%);border-color:var(--mint-line)}
.streak-chip{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:999px;background:#fff1e0;color:#9a4a00;font-size:11.5px;font-weight:700;vertical-align:middle}
.streak-chip.big{font-size:13px;padding:5px 12px}
.regular-chip{display:inline-flex;align-items:center;gap:4px;padding:5px 12px;border-radius:999px;background:var(--mint-soft);color:var(--mint-ink);font-size:12.5px;font-weight:600}
.crew-habits{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.recap-hero{padding:34px clamp(22px,4vw,46px);border-radius:var(--radius-xl);background:radial-gradient(70% 90% at 90% 0%,#86deae55,transparent 60%),radial-gradient(60% 70% at 0% 100%,#f7bcd355,transparent 60%),var(--card);border:1px solid var(--line);margin:8px 0 18px}
.recap-hero h1{font:500 clamp(36px,6vw,64px)/1.02 var(--serif);letter-spacing:-.03em;margin:8px 0 10px}.recap-hero h1 em{color:var(--mint-ink)}.recap-hero p{font-size:16px;color:var(--muted);max-width:620px}.recap-hero .button{margin-top:10px}
.recap-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:10px}
.recap-stat{padding:18px;border-radius:20px;background:var(--card);border:1px solid var(--line)}.recap-stat strong{display:block;font-size:34px;font-weight:650;line-height:1.05;letter-spacing:-.04em;margin-bottom:6px}.recap-stat span{font-size:12.5px;color:var(--muted)}
.recap-people{display:grid;gap:8px}.recap-person{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;background:var(--card);border:1px solid var(--line)}.recap-person b{width:22px;color:var(--muted);font:italic 600 15px var(--serif)}.recap-person>span{flex:1;min-width:0}.recap-person strong{display:block}.recap-person small{color:var(--muted);font-size:12px}
.recap-note{display:flex;align-items:center;gap:8px;font-size:14px;margin:16px 0}.recap-note .icon{width:16px;height:16px;color:var(--mint-strong)}
.recap-mini{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:20px;background:linear-gradient(135deg,#fff7ec,var(--card));border:1px solid #f4e3c8;margin-bottom:16px}.recap-mini>span:nth-child(2){flex:1}.recap-mini strong{display:block;font-size:14px}.recap-mini small{color:var(--muted);font-size:12px}.recap-mini .icon{width:16px;height:16px;color:var(--muted)}.recap-mini-icon{font-size:20px}

/* ===== Push, quick join, account ===== */
.toggle-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--line);font-size:13.5px;cursor:pointer}.toggle-row:first-child{border-top:0}
.toggle-row input{width:18px;height:18px;min-height:0;accent-color:var(--mint-strong)}
.push-prefs{margin-top:12px;display:grid}.push-prefs .button{justify-self:start;margin-top:10px}
.push-prompt{display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:20px;background:var(--card);border:1px solid var(--mint-line);margin:0 0 24px;box-shadow:var(--shadow-soft)}.push-prompt>.icon{width:22px;height:22px;color:var(--mint-strong);flex:none}.push-prompt>div{flex:1;min-width:0}.push-prompt strong{display:block;font-size:14px}.push-prompt small{color:var(--muted);font-size:12.5px}
.quick-join{display:grid;gap:10px;text-align:left;margin-top:10px}.quick-join .checkbox{font-size:13px}.quick-join .small-note{text-align:center;margin:0}
.quick-or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12px;margin:14px 0}.quick-or::before,.quick-or::after{content:"";flex:1;height:1px;background:var(--line)}
.claim-pane{border-color:var(--mint-line);background:linear-gradient(160deg,var(--mint-soft),var(--card) 60%)}

/* ===== Lounges ===== */
.lounge-card{display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:24px;background:linear-gradient(135deg,#fff8ee,var(--card) 60%);border:1px solid #f1e2c9;margin:0 0 20px}
.lounge-card.is-live{background:linear-gradient(135deg,var(--mint-soft),var(--card) 60%);border-color:var(--mint-line)}
.lounge-mark{font-size:30px;width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:var(--card);box-shadow:var(--shadow-soft);flex:none}
.lounge-copy{flex:1;min-width:0}.lounge-copy .eyebrow{display:flex;align-items:center;gap:6px}.lounge-copy h3{margin:4px 0 2px;font-size:17px}.lounge-copy p{margin:0;font-size:13px;color:var(--muted)}
.lounge-strip{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 22px}
.lounge-pill{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:18px;border:1px solid var(--mint-line);background:var(--mint-soft);cursor:pointer;font:inherit;color:var(--ink);text-align:left}.lounge-pill strong{display:block;font-size:13.5px}.lounge-pill small{font-size:12px;color:var(--muted)}.lounge-pill .icon{width:15px;height:15px;color:var(--mint-ink)}

/* ===== Activities Kit ===== */
.kit-stage{padding:0!important}.kit-frame-wrap{display:grid;grid-template-rows:auto 1fr;width:100%;min-height:620px}
.kit-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--card);font-size:13px}.kit-bar small{color:var(--muted)}
.kit-frame{width:100%;height:100%;min-height:580px;border:0;background:#fff;display:block}
.kit-app-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:var(--mint-soft);font-size:21px;flex:none}
.kit-bar .kit-app-icon{width:28px;height:28px;font-size:15px;border-radius:9px}
.kit-apps{display:grid;gap:8px;margin:14px 0}
.kit-app{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:18px;background:var(--card);cursor:pointer;font:inherit;color:var(--ink);text-align:left}.kit-app:hover{border-color:var(--mint-strong)}
.kit-app-copy{flex:1;min-width:0}.kit-app strong{display:block}.kit-app small{display:block;color:var(--muted);font-size:12px}.kit-app em{display:block;font-style:normal;font-size:12.5px;margin-top:2px}.kit-app>.icon{width:16px;height:16px;color:var(--muted)}
.kit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.kit-card{display:flex;gap:14px;align-items:flex-start;padding:18px;border-radius:22px;background:var(--card);border:1px solid var(--line)}.kit-card>div{flex:1;min-width:0}.kit-card h3{font-size:16px;margin:0 0 2px}.kit-card small{color:var(--muted);font-size:12px}.kit-card p{font-size:13px;color:var(--muted);margin:6px 0 0}
.kit-card.dev{background:linear-gradient(160deg,var(--surface),var(--card));border-style:dashed}

/* ===== Party games ===== */
.party-pick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
.party-option{display:grid;gap:4px;text-align:left;padding:16px;border-radius:20px;border:1px solid var(--line);background:var(--card);cursor:pointer;font:inherit;color:var(--ink);transition:border-color .15s,transform .15s}
.party-option:not([disabled]):hover{border-color:var(--mint-strong);transform:translateY(-1px)}.party-option[disabled]{opacity:.6;cursor:default}
.party-option.suggested{border-color:var(--mint-strong);box-shadow:0 0 0 2px var(--mint-line)}
.party-emoji{font-size:28px}.party-option strong{font-size:15px}.party-option small{font-size:12.5px;color:var(--muted);line-height:1.4}
.party-word.hot{background:linear-gradient(160deg,#fff1e6,var(--card));border-color:#f6d5bd}.party-word.hot small{color:#a14a00}.party-word.hot strong{color:#5a2a00;font-size:clamp(22px,3.6vw,32px)}
.party-spot{display:grid;gap:2px;padding:16px 18px;border-radius:18px;background:var(--surface)}.party-spot small{font-size:10.5px;letter-spacing:.14em;font-weight:700;color:var(--muted)}.party-spot strong{font:500 22px var(--serif)}.party-spot span{font-size:13px;color:var(--muted)}
.truths-form{display:grid;gap:8px}.truth-row{display:flex;align-items:center;gap:10px;padding:6px 8px 6px 12px;border:1px solid var(--line);border-radius:16px}
.truth-row input[type=radio]{width:18px;height:18px;min-height:0;accent-color:#d4588f}.truth-row span{font-size:11px;font-weight:700;color:#b0477a;text-transform:uppercase;letter-spacing:.08em}.truth-row input[type=text]{flex:1;min-width:0;border:0;min-height:40px;padding:4px 6px}
.truths-form .button{justify-self:start}
.take-form{display:grid;gap:12px}.take-choice{display:grid;grid-template-columns:1fr 1fr;gap:10px}.take-choice label{position:relative}.take-choice input{position:absolute;opacity:0;width:1px;height:1px}
.take-choice span{display:grid;place-items:center;min-height:58px;border-radius:18px;border:1px solid var(--line);font-size:16px;font-weight:600;cursor:pointer}.take-choice input:checked+span{background:var(--mint);border-color:var(--mint);color:#0f2a1b}.take-choice input:focus-visible+span{outline:2px solid var(--mint-strong);outline-offset:2px}
.take-predict{display:flex;align-items:center;gap:10px;font-size:14px}.take-predict select{width:auto}.take-form .button{justify-self:start}
.take-meter{display:flex;height:42px;border-radius:999px;overflow:hidden;background:#fde2e2;font-weight:700;font-size:13px}.take-meter span{display:flex;align-items:center;padding:0 14px;background:var(--mint);color:#0f2a1b;white-space:nowrap;min-width:64px}.take-meter i{flex:1;display:flex;align-items:center;justify-content:flex-end;padding:0 14px;font-style:normal;color:#7a1f1f}
.party-vote.wit{grid-template-columns:minmax(0,1fr)}.party-vote.wit .ai-answer span{font-size:15px}
.gain{font-style:normal;color:var(--mint-ink);font-weight:700}
.rematch-row{display:flex;justify-content:center;margin:14px 0 4px}

/* ===== Game night page ===== */
.game-grid.party-four{grid-template-columns:repeat(4,minmax(0,1fr))}
.card-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px}
.also-row{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:14px;font-size:13px;color:var(--muted)}.also-row span{display:flex;align-items:center;gap:6px}.also-row .icon{width:15px;height:15px;color:var(--mint-strong)}.also-row strong{color:var(--ink)}
.board-wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:14px}
.lb-table{list-style:none;margin:0;padding:8px;border-radius:22px;background:var(--card);border:1px solid var(--line);display:grid;gap:2px}
.lb-table li{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px}.lb-table li.me{background:var(--mint-soft)}.lb-table li.leader{background:linear-gradient(90deg,#fff5dc,transparent)}
.lb-table b{width:26px;text-align:center;font:italic 600 15px var(--serif);color:var(--muted)}.lb-table span{flex:1;min-width:0;font-weight:600;font-size:14px}.lb-table small{color:var(--muted);font-size:12px}.lb-table strong{min-width:36px;text-align:right;font-size:18px;letter-spacing:-.02em}
.rivals{display:grid;gap:8px;align-content:start}
.rival{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;background:var(--card);border:1px solid var(--line)}.rival>div{flex:1;min-width:0}.rival strong{display:block;font-size:14px}.rival small{color:var(--muted);font-size:12px}
.rival-score{font-weight:700;font-size:16px;letter-spacing:.02em;padding:4px 10px;border-radius:999px;background:var(--surface)}.rival-score.up{background:var(--mint-soft);color:var(--mint-ink)}.rival-score.down{background:#fdeaea;color:#8a2a2a}

/* ===== Room themes and reactions ===== */
body:not([data-theme=dark]) .room-stage.theme-sunset{background:radial-gradient(80% 70% at 50% 0%,#ffd6b4aa,transparent 62%),linear-gradient(180deg,#fff8f0,#ffeadb)}
body:not([data-theme=dark]) .room-stage.theme-lagoon{background:radial-gradient(80% 70% at 50% 0%,#a8e3f5aa,transparent 62%),linear-gradient(180deg,#f3fbfe,#ddf1f9)}
body:not([data-theme=dark]) .room-stage.theme-sakura{background:radial-gradient(circle at 15% 20%,#ffd6e6 0 8px,transparent 9px),radial-gradient(circle at 85% 30%,#ffc7dc 0 6px,transparent 7px),radial-gradient(circle at 70% 80%,#ffe0ec 0 10px,transparent 11px),linear-gradient(180deg,#fff7fa,#ffe9f1)}
body:not([data-theme=dark]) .room-stage.theme-arcade{background:linear-gradient(transparent 95%,#f49ac133 95%) 0 0/28px 28px,linear-gradient(90deg,transparent 95%,#7cc6f233 95%) 0 0/28px 28px,linear-gradient(180deg,#fdfbff,#f2f6ff);border-color:#e6d9ff}
body:not([data-theme=dark]) .room-stage.theme-cinema{background:linear-gradient(90deg,#e9c2c2 0 18px,transparent 18px calc(100% - 18px),#e9c2c2 calc(100% - 18px)),radial-gradient(70% 60% at 50% 0%,#ffe9c7aa,transparent 60%),#fffaf3;border-color:#efd6c7}
body:not([data-theme=dark]) .room-stage.theme-aurora{background:linear-gradient(120deg,#d9f7ea,#d8ebff 35%,#ebe0ff 65%,#ffe4f1)}
body:not([data-theme=dark]) .room-stage.theme-garden{background:radial-gradient(circle at 10% 90%,#bfeccf 0 40px,transparent 41px),radial-gradient(circle at 92% 85%,#d6f3c0 0 54px,transparent 55px),linear-gradient(180deg,#fbfff6,#eef9e6)}
.theme-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 4px}
.theme-swatch{display:grid;gap:6px;padding:8px;border:1px solid var(--line);border-radius:18px;background:var(--card);cursor:pointer;font:inherit;color:var(--ink);text-align:left}.theme-swatch:hover,.theme-swatch.selected{border-color:var(--mint-strong)}
.theme-swatch>span{height:52px;border-radius:12px;border:1px solid var(--line);background:radial-gradient(70% 70% at 50% 0%,#86deae40,transparent 62%),var(--surface)}
.theme-swatch.theme-sunset>span{background:linear-gradient(180deg,#fff8f0,#ffd6b4)}.theme-swatch.theme-lagoon>span{background:linear-gradient(180deg,#f3fbfe,#a8e3f5)}.theme-swatch.theme-sakura>span{background:linear-gradient(180deg,#fff7fa,#ffc7dc)}.theme-swatch.theme-arcade>span{background:linear-gradient(transparent 90%,#f49ac155 90%) 0 0/12px 12px,linear-gradient(90deg,transparent 90%,#7cc6f255 90%) 0 0/12px 12px,#fdfbff}
.theme-swatch.theme-cinema>span{background:linear-gradient(90deg,#e9c2c2 0 10px,#fffaf3 10px calc(100% - 10px),#e9c2c2 calc(100% - 10px))}.theme-swatch.theme-aurora>span{background:linear-gradient(120deg,#d9f7ea,#d8ebff,#ebe0ff,#ffe4f1)}.theme-swatch.theme-garden>span{background:linear-gradient(180deg,#fbfff6,#cdeeb9)}
.theme-swatch strong{font-size:12.5px}.theme-swatch small{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--muted)}.theme-swatch small .icon{width:11px;height:11px}
.reaction-btn.more{font-size:18px;color:var(--mint-ink)}.reaction-btn.super{font-size:16px;color:#a87800}.reaction-btn.super.on{background:#fff1c9;box-shadow:inset 0 0 0 1px #f2c94c}
.floating-reaction.super b{font-size:52px;filter:drop-shadow(0 8px 16px #f2c94c66)}
.theme-chip{margin-left:auto}

/* ===== Confetti and intro ===== */
.confetti-layer{position:fixed;inset:0;pointer-events:none;z-index:90;overflow:hidden}
.confetti-layer i{position:absolute;top:-14px;width:8px;height:12px;border-radius:2px;animation:confetti-fall linear forwards}
@keyframes confetti-fall{to{transform:translate(var(--dx),110vh) rotate(var(--rot))}}
.intro{position:fixed;inset:0;z-index:100;pointer-events:none;display:grid;place-items:center;background:radial-gradient(60% 60% at 50% 45%,#ebf8f1,#fff 70%);animation:intro-in .35s ease-out both}
.intro.out{animation:intro-out .6s ease-in forwards}
.intro-stage{position:relative;width:min(400px,80vw);aspect-ratio:1;display:grid;place-items:center;margin-top:-12vh}
.intro-glow{position:absolute;inset:18%;border-radius:50%;background:radial-gradient(circle,#86deae66,transparent 70%);animation:intro-breathe 2s ease-in-out infinite}
.intro-orbit{position:absolute;inset:0;animation:intro-spin 2.2s cubic-bezier(.2,.8,.2,1) both}
.intro-face{position:absolute;width:46px;height:46px;border-radius:30%;display:grid;place-items:center;font-weight:700;font-size:15px;color:#17432a;background:#fff;box-shadow:0 0 0 3px #86deae,0 10px 24px -10px #17432a55;animation:intro-gather 1.6s cubic-bezier(.2,.8,.2,1) .2s both}
.intro-face.f0{left:46%;top:2%}.intro-face.f1{left:84%;top:24%}.intro-face.f2{left:84%;top:64%}.intro-face.f3{left:46%;top:86%}.intro-face.f4{left:6%;top:64%}.intro-face.f5{left:6%;top:24%}
.intro-face.f1,.intro-face.f4{box-shadow:0 0 0 3px #f2b84b,0 10px 24px -10px #17432a55}.intro-face.f2,.intro-face.f5{box-shadow:0 0 0 3px #7cc6f2,0 10px 24px -10px #17432a55}
.intro-room{position:absolute;width:52%;aspect-ratio:16/10;border-radius:18px;background:linear-gradient(160deg,#fff,#ebf8f1);border:1px solid #c4eed7;box-shadow:0 30px 60px -30px #17432a66;display:flex;align-items:flex-end;gap:6px;padding:12px;animation:intro-pop .7s cubic-bezier(.2,1.3,.4,1) .55s both}
.intro-room i{flex:1;height:30%;border-radius:8px;background:#c4eed7}.intro-room i:nth-of-type(2){height:55%;background:#86deae}.intro-room i:nth-of-type(3){height:40%}
.intro-live{position:absolute;top:10px;right:10px;padding:2px 8px;border-radius:999px;background:#5fcb92;color:#fff;font-size:9px;font-weight:800;letter-spacing:.1em}
.intro-room b{position:absolute;bottom:40%;font-size:22px;animation:intro-float 1.4s ease-out both}.intro-room b:nth-of-type(1){left:18%;animation-delay:.9s}.intro-room b:nth-of-type(2){left:48%;animation-delay:1.05s}.intro-room b:nth-of-type(3){left:74%;animation-delay:1.2s}
.intro-word{position:absolute;bottom:-17%;font-weight:800;font-size:clamp(30px,7vw,44px);letter-spacing:-.04em;color:#151515;animation:intro-rise .6s ease-out .9s both}
.intro-word span{display:inline-grid;place-items:center;padding:2px 7px;margin-right:4px;border-radius:9px;background:#86deae;color:#0f2a1b;font-size:.62em;vertical-align:.18em}.intro-word em{font-style:normal;color:#5fcb92}
.intro-line{position:absolute;bottom:-29%;width:max-content;max-width:90vw;text-align:center;font-size:15px;color:#4c5550;animation:intro-rise .6s ease-out 1.15s both}.intro-line b{color:#1f5a3a}
@keyframes intro-in{from{opacity:0}to{opacity:1}}@keyframes intro-out{to{opacity:0;transform:scale(1.03)}}
@keyframes intro-spin{from{transform:rotate(-40deg) scale(1.15)}to{transform:rotate(0) scale(1)}}
@keyframes intro-gather{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
@keyframes intro-pop{from{opacity:0;transform:scale(.6) translateY(16px)}to{opacity:1;transform:none}}
@keyframes intro-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes intro-float{0%{opacity:0;transform:translateY(10px) scale(.6)}30%{opacity:1;transform:translateY(-6px) scale(1.1)}100%{opacity:0;transform:translateY(-60px) scale(1)}}
@keyframes intro-breathe{50%{transform:scale(1.12);opacity:.7}}

/* ===== Responsive ===== */
@media(max-width:1200px){.plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.game-grid.party-four{grid-template-columns:repeat(2,minmax(0,1fr))}.recap-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
 .plan-grid,.game-grid.party-four,.board-wrap,.kit-grid,.party-pick{grid-template-columns:minmax(0,1fr)}
 .theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .lounge-card{flex-wrap:wrap}.lounge-card .button{width:100%}
 .push-prompt{flex-wrap:wrap}.style-swatch{width:68px}
 .recap-stat strong{font-size:28px}.theme-chip{margin-left:0}
 .rival{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){.avatar[data-ring]::after,.avatar[data-ring=pulse],.style-preview-art i{animation:none}.intro{display:none}}
body[data-theme=dark] .lounge-card,body[data-theme=dark] .recap-mini,body[data-theme=dark] .ticket-pane{background:var(--card);border-color:var(--line)}
body[data-theme=dark] .streak-chip{background:#3a2a17;color:#ffcf99}

/* ===== 0.7 — animated emoji ===== */
.aemoji{display:inline-block;width:1.3em;height:1.3em;vertical-align:-.28em;object-fit:contain;user-select:none;-webkit-user-drag:none}
.aemoji.inline{width:1.4em;height:1.4em;margin:0 .02em}.aemoji.bar{width:26px;height:26px;vertical-align:middle}.aemoji.float{width:54px;height:54px}
.aemoji.jumbo{width:72px;height:72px}.aemoji.preview{width:44px;height:44px}
.emoji-motion{display:inline-block;line-height:1;transform-origin:50% 70%;animation:em-bob 2.4s ease-in-out infinite}
.emoji-motion.float{font-size:42px}.emoji-motion.jumbo{font-size:56px}.emoji-motion.preview{font-size:34px}.emoji-motion.bar{font-size:20px;animation-play-state:paused}
[data-anim-host]:hover .emoji-motion,[data-anim-host]:focus-visible .emoji-motion{animation-play-state:running}
.m-wave{animation-name:em-wave;transform-origin:70% 80%}.m-beat{animation-name:em-beat;animation-duration:1.2s}.m-sway{animation-name:em-sway}.m-wobble{animation-name:em-wobble}
.m-bounce{animation-name:em-bounce;animation-duration:1.4s}.m-drift{animation-name:em-drift;animation-duration:3s}.m-float{animation-name:em-float;animation-duration:3s}.m-pulse{animation-name:em-pulse;animation-duration:1.8s}
@keyframes em-bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-6%) rotate(-4deg)}}
@keyframes em-wave{0%,60%,100%{transform:rotate(0)}10%,30%{transform:rotate(16deg)}20%,40%{transform:rotate(-10deg)}}
@keyframes em-beat{0%,40%,100%{transform:scale(1)}15%{transform:scale(1.18)}30%{transform:scale(1.06)}}
@keyframes em-sway{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
@keyframes em-wobble{0%,100%{transform:rotate(0)}25%{transform:rotate(-8deg) scale(1.04)}75%{transform:rotate(8deg) scale(1.04)}}
@keyframes em-bounce{0%,100%{transform:translateY(0)}40%{transform:translateY(-16%)}60%{transform:translateY(0) scaleY(.92)}}
@keyframes em-drift{0%,100%{transform:translateX(-5%)}50%{transform:translateX(5%) translateY(-4%)}}
@keyframes em-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8%)}}
@keyframes em-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.12);opacity:.85}}
.emoji-pop{grid-template-rows:auto auto 1fr auto}
.emoji-preview{display:flex;align-items:center;gap:10px;padding:8px 12px;border-top:1px solid var(--line);background:var(--surface);font-size:11.5px;color:var(--muted);min-height:58px}
.emoji-preview .ep-name{line-height:1.35}
.emoji-cell:hover{animation:em-wobble .6s ease-in-out}
.jumbo-emoji{display:inline-flex;gap:6px;align-items:flex-end;padding:2px 0}
.bubble:has(.jumbo-emoji),.room-message p:has(.jumbo-emoji){background:transparent!important;box-shadow:none!important;padding-left:0;padding-right:0}
.floating-reaction b .aemoji,.floating-reaction b .emoji-motion{filter:drop-shadow(0 8px 14px #17432a33)}
.floating-reaction.super b .aemoji.float{width:84px;height:84px}
.reaction-btn{display:inline-grid;place-items:center}

/* ===== 0.7 — the reading room ===== */
.rd-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:28px;align-items:center;padding:40px clamp(22px,4vw,48px);border-radius:var(--radius-xl);border:1px solid var(--line);background:radial-gradient(60% 80% at 100% 0%,#f7e7c955,transparent 60%),radial-gradient(60% 80% at 0% 100%,#86deae33,transparent 60%),var(--card);margin:8px 0 18px}
.rd-hero h1{font:500 clamp(42px,6vw,72px)/1 var(--serif);letter-spacing:-.03em;margin:10px 0 12px}.rd-hero h1 em{color:var(--mint-ink)}.rd-hero p{font-size:16px;color:var(--muted);max-width:520px}
.rd-hero .eyebrow{display:flex;align-items:center;gap:6px}.rd-hero .eyebrow .icon{width:14px;height:14px}
.rd-now{display:flex;gap:20px;align-items:center;padding:18px;border-radius:24px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-soft)}
.rd-now h2{font:500 24px/1.15 var(--serif);margin:6px 0 2px}.rd-now p{margin:0 0 10px;color:var(--muted);font-size:13px}.rd-now small{display:block;margin:6px 0 12px;color:var(--muted);font-size:12px}
.rd-stack{position:relative;height:250px}.rd-stack .bk-cover{position:absolute;top:14px;left:50%;width:136px;box-shadow:0 30px 40px -24px #17432a66}
.rd-stack .bk-cover:nth-child(1){transform:translateX(-118%) rotate(-8deg)}.rd-stack .bk-cover:nth-child(2){transform:translateX(-50%) translateY(-8px);z-index:2}.rd-stack .bk-cover:nth-child(3){transform:translateX(16%) rotate(7deg)}
.rd-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 8px}
.rd-stat{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:20px;background:var(--card);border:1px solid var(--line)}.rd-stat strong{display:block;font-size:17px}.rd-stat small{color:var(--muted);font-size:12px}
.rd-stat .toggle-row{border:0;padding:0}.rd-stat .toggle-row strong{font-size:14px}.rd-stat .text-button{font-size:12px;padding:0;min-height:0}
.rd-flame{font-size:24px;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#fff4e6}
.rd-ring{width:52px;height:52px;flex:none}.rd-ring circle{fill:none;stroke-width:6}.rd-ring .track{stroke:var(--surface-2)}.rd-ring .fill{stroke:var(--mint-strong);stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dashoffset .6s}.rd-ring text{font:700 15px var(--font,inherit);fill:var(--ink)}
.bk-cover{position:relative;aspect-ratio:2/3;border-radius:6px 14px 14px 6px;padding:14px 12px;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;overflow:hidden;box-shadow:inset 6px 0 0 #00000014,0 14px 26px -18px #17432a80;background:var(--bk-bg);color:var(--bk-ink);isolation:isolate}
.bk-cover::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--bk-pat);opacity:.55}
.bk-cover strong{font:600 15px/1.15 var(--serif);letter-spacing:-.01em}.bk-cover small{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;opacity:.8}
.bk-orn{position:absolute;top:14px;left:12px;width:26px;height:3px;border-radius:2px;background:currentColor;opacity:.5}
.bk-cover.sm{width:44px;padding:5px;border-radius:3px 7px 7px 3px}.bk-cover.sm strong,.bk-cover.sm small,.bk-cover.sm .bk-orn{display:none}
.bk-cover.lg{width:150px}.bk-cover.lg strong{font-size:17px}.bk-cover.xl{width:190px;flex:none}.bk-cover.xl strong{font-size:20px}
.pal-0{--bk-bg:linear-gradient(160deg,#dff6ea,#9fe3bf);--bk-ink:#17432a}.pal-1{--bk-bg:linear-gradient(160deg,#ffe9d2,#f7b98e);--bk-ink:#5a2c0b}.pal-2{--bk-bg:linear-gradient(160deg,#dcf1fb,#93cdea);--bk-ink:#0f3c57}.pal-3{--bk-bg:linear-gradient(160deg,#ffe6ef,#f2a9c4);--bk-ink:#5c1730}
.pal-4{--bk-bg:linear-gradient(160deg,#f6efdf,#e2cfa4);--bk-ink:#4a3a12}.pal-5{--bk-bg:linear-gradient(160deg,#ece6ff,#c3b3f1);--bk-ink:#2f2163}.pal-6{--bk-bg:linear-gradient(160deg,#e6f3df,#b7d9a5);--bk-ink:#26421a}.pal-7{--bk-bg:linear-gradient(160deg,#fff3c9,#f4cf6b);--bk-ink:#4f3a00}
.pat-0{--bk-pat:repeating-linear-gradient(135deg,#ffffff66 0 2px,transparent 2px 14px)}.pat-1{--bk-pat:radial-gradient(circle at 20% 20%,#ffffff88 0 3px,transparent 4px) 0 0/22px 22px}
.pat-2{--bk-pat:radial-gradient(circle at 100% 0,#ffffff70 0 30%,transparent 31%),radial-gradient(circle at 0 100%,#ffffff55 0 22%,transparent 23%)}.pat-3{--bk-pat:linear-gradient(#ffffff55 1px,transparent 1px) 0 0/100% 16px}
.bk-cover-link{display:block}
.bk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:18px}
.bk-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(150px,170px);gap:16px;overflow-x:auto;padding:4px 2px 12px;scrollbar-width:thin}
.bk-card{display:grid;gap:10px;align-content:start}.bk-card .bk-cover{transition:transform .2s}.bk-card:hover .bk-cover{transform:translateY(-4px) rotate(-.6deg)}
.bk-meta h3{font-size:14px;line-height:1.3;margin:0}.bk-meta small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.bk-bar{height:6px;border-radius:999px;background:var(--surface-2);overflow:hidden;margin:8px 0 4px}.bk-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--mint-strong),var(--mint))}
.bk-pct{font-size:11.5px;color:var(--muted)}.bk-done{display:inline-block;margin-top:6px;font-size:12px;font-weight:600;color:var(--mint-ink)}
.bk-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:8px}.bk-actions .text-button{font-size:12px;min-height:0;padding:0}
.club-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.club-card{display:flex;gap:16px;padding:16px;border-radius:22px;background:var(--card);border:1px solid var(--line);color:var(--ink);text-decoration:none;transition:border-color .2s,box-shadow .2s}
.club-card:hover{border-color:var(--mint-line);box-shadow:var(--shadow-soft)}.club-card .bk-cover{width:84px;flex:none;padding:8px}.club-card .bk-cover strong{font-size:11px}.club-card .bk-cover small{font-size:8px}
.club-card>div{flex:1;min-width:0}.club-card h3{font:500 19px var(--serif);margin:4px 0 2px}.club-card p{margin:0;color:var(--muted);font-size:12.5px}
.club-faces{display:flex;gap:4px;margin:10px 0 2px}
.club-card.new{flex-direction:column;align-items:flex-start;justify-content:center;border-style:dashed;background:var(--surface);cursor:pointer;font:inherit;text-align:left}
.club-card.new span{width:40px;height:40px;border-radius:14px;display:grid;place-items:center;background:var(--mint-soft);color:var(--mint-ink)}.club-card.new strong{font-size:15px}.club-card.new small{color:var(--muted);font-size:12.5px}
.pal-list{display:grid;gap:8px}.pal-row{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:18px;background:var(--card);border:1px solid var(--line)}.pal-row>div{flex:1;min-width:0}.pal-row strong{display:block;font-size:14px}.pal-row small{color:var(--muted);font-size:12.5px}
.rd-search{display:flex;align-items:center;gap:10px;padding:6px 6px 6px 16px;border-radius:999px;border:1px solid var(--line);background:var(--card);max-width:680px}.rd-search input{flex:1;min-width:0;border:0;min-height:42px;background:transparent}.rd-search>.icon{width:18px;height:18px;color:var(--muted)}
.rd-moods{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 18px}.rd-moods .chip{cursor:pointer;background:var(--card)}
.rd-together{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;padding:30px clamp(22px,4vw,40px);border-radius:var(--radius-xl);background:linear-gradient(135deg,#fff7ec,var(--mint-soft));border:1px solid #f1e2c9;margin:30px 0 10px}
.rd-together h2{font:500 32px var(--serif);margin:8px 0}.rd-together p{color:var(--muted);max-width:560px}.rd-together .eyebrow{display:flex;gap:6px;align-items:center}.rd-together .eyebrow .icon{width:14px;height:14px}
.rd-together-art{display:flex;gap:10px;font-size:46px}.rd-together-art span{animation:em-float 3.5s ease-in-out infinite}.rd-together-art span:nth-child(2){animation-delay:.6s}.rd-together-art span:nth-child(3){animation-delay:1.2s}
/* Reader */
body[data-page=reader] .main-shell{padding-top:0}
.rd-reader{--rd-bg:#fff;--rd-ink:#1d211f;--rd-soft:#69706c;--rd-line:#e9ece9;margin:0 -8px;border-radius:24px;background:var(--rd-bg);color:var(--rd-ink);border:1px solid var(--rd-line);min-height:80vh}
.rd-reader.theme-sepia{--rd-bg:#fbf4e6;--rd-ink:#3b2f1e;--rd-soft:#7a6a52;--rd-line:#efe2c8}.rd-reader.theme-mint{--rd-bg:#f3fbf6;--rd-ink:#183a29;--rd-soft:#557463;--rd-line:#d6eedf}.rd-reader.theme-dusk{--rd-bg:#eef1f6;--rd-ink:#26303f;--rd-soft:#5d6878;--rd-line:#dce2ec}
.rd-bar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--rd-line);background:color-mix(in srgb,var(--rd-bg) 88%,transparent);backdrop-filter:blur(10px);border-radius:24px 24px 0 0}
.rd-back{display:flex;align-items:center;gap:4px;font-size:13px;color:var(--rd-soft)}.rd-back .icon{width:16px;height:16px}
.rd-title{flex:1;min-width:0;text-align:center}.rd-title strong{display:block;font:600 14px var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rd-title small{display:block;font-size:11.5px;color:var(--rd-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rd-tools{display:flex;gap:4px}.rd-tools .button{min-height:36px;padding:6px 10px;background:transparent;border-color:transparent;color:var(--rd-ink)}.rd-tools .button:hover{background:color-mix(in srgb,var(--rd-ink) 6%,transparent)}.rd-tools .button.on{background:var(--mint-soft);color:var(--mint-ink)}
.rd-tools .icon{width:16px;height:16px}.rd-aa{font:700 14px var(--serif)}
.rd-progress{position:absolute;left:0;right:0;bottom:-1px;height:3px;background:transparent}.rd-progress i{display:block;height:100%;background:var(--mint-strong);border-radius:0 3px 3px 0;transition:width .4s}
.rd-page{max-width:680px;margin:0 auto;padding:clamp(28px,6vw,64px) clamp(18px,4vw,24px) 40px;font-family:var(--serif);font-size:var(--rd-size,19px);line-height:var(--rd-leading,1.75)}
.font-sans .rd-page{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
.rd-chapter-head{text-align:center;margin:0 0 36px}.rd-chapter-head .eyebrow{color:var(--rd-soft)}.rd-chapter-head h1{font:500 clamp(28px,4.5vw,40px)/1.15 var(--serif);letter-spacing:-.02em;margin:12px 0 0}
.rd-page p{margin:0 0 1.05em;white-space:pre-line;hyphens:auto;-webkit-hyphens:auto;text-wrap:pretty}
.rd-chapter-head+p::first-letter{float:left;font-size:3.6em;line-height:.85;padding:.06em .1em 0 0;color:var(--mint-ink);font-weight:600}
.rd-page p.speaking{background:color-mix(in srgb,var(--mint) 22%,transparent);border-radius:8px;box-shadow:0 0 0 8px color-mix(in srgb,var(--mint) 22%,transparent)}
mark.hl{color:inherit;border-radius:3px;padding:0 1px;cursor:pointer}.hl-mint{background:#c9f1db}.hl-sun{background:#ffe7a1}.hl-rose{background:#ffd1df}.hl-sky{background:#cde6ff}
mark.hl.shared{background:transparent;border-bottom:2px dotted var(--mint-strong)}mark.hl.shared::after{content:attr(data-who);font:600 9px var(--font,sans-serif);letter-spacing:.04em;margin-left:3px;padding:1px 5px;border-radius:999px;background:var(--mint-soft);color:var(--mint-ink);vertical-align:super}
mark.hl.noted::after{content:"✎";font-size:.7em;margin-left:2px;color:var(--mint-ink)}
.rd-chapter-nav{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:48px 0 20px;font-family:-apple-system,BlinkMacSystemFont,sans-serif}
.rd-credits{font-family:-apple-system,BlinkMacSystemFont,sans-serif;font-size:12px;color:var(--rd-soft);text-align:center}.rd-credits .text-button{font-size:12px;padding:0;min-height:0}
.rd-pop{position:fixed;z-index:70;display:flex;align-items:center;gap:4px;padding:6px;border-radius:14px;background:var(--card);border:1px solid var(--line);box-shadow:0 18px 40px -16px #17432a55}
.rd-pop[hidden]{display:none}.rd-pop button{min-height:32px;padding:4px 10px;border:0;border-radius:10px;background:transparent;font:600 12px inherit;color:var(--ink);cursor:pointer;display:flex;align-items:center;gap:4px}.rd-pop button:hover{background:var(--surface)}.rd-pop .icon{width:14px;height:14px}
.rd-pop .rd-dot{width:24px;height:24px;min-height:0;padding:0;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--line)}
.rd-swatch{display:inline-block;width:12px;height:12px;border-radius:50%}
.rd-quote{margin:0 0 12px;padding:10px 14px;border-left:3px solid var(--mint-strong);border-radius:0 12px 12px 0;background:var(--surface);font:16px/1.6 var(--serif)}
.rd-quote.hl-sun{border-color:#f2c94c}.rd-quote.hl-rose{border-color:#ec8fae}.rd-quote.hl-sky{border-color:#7cb8f2}.rd-note{font-size:14px}
.rd-notes{display:grid;gap:10px;max-height:60vh;overflow:auto}.rd-note-item{display:block;padding:10px 12px;border-radius:14px;border:1px solid var(--line);color:var(--ink)}.rd-note-item small{color:var(--muted);font-size:11.5px}.rd-note-item p{margin:0;font-size:13px}
.rd-toc{list-style:none;margin:0;padding:0;display:grid;gap:2px;max-height:65vh;overflow:auto}.rd-toc a{display:flex;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:12px;color:var(--ink)}.rd-toc a:hover{background:var(--surface)}.rd-toc .current a{background:var(--mint-soft);font-weight:600}.rd-toc small{color:var(--muted)}
.rd-settings{display:grid;gap:14px}.rd-set-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.rd-set-row>span{width:96px;font-size:13px;font-weight:600}.rd-set-row b{min-width:44px;text-align:center}.rd-set-row .chip{cursor:pointer}
.rd-theme-dot{min-height:34px;padding:6px 12px;border-radius:999px;border:1px solid var(--line);font:600 12px inherit;cursor:pointer}.rd-theme-dot.active{box-shadow:0 0 0 2px var(--mint-strong)}
.rd-theme-dot.theme-paper{background:#fff;color:#1d211f}.rd-theme-dot.theme-sepia{background:#fbf4e6;color:#3b2f1e}.rd-theme-dot.theme-mint{background:#f3fbf6;color:#183a29}.rd-theme-dot.theme-dusk{background:#eef1f6;color:#26303f}
.rd-pre{white-space:pre-wrap;font-size:11.5px;max-height:40vh;overflow:auto;background:var(--surface);padding:12px;border-radius:12px}
.rd-stars{display:flex;gap:6px;margin:12px 0 16px}.rd-stars button{font-size:28px;line-height:1;min-height:0;padding:2px;border:0;background:transparent;color:#d8ddda;cursor:pointer}.rd-stars button.on,.rd-stars button:hover{color:#f2b84b}
/* Book clubs */
.club-hero{display:flex;gap:28px;align-items:center;padding:28px clamp(20px,4vw,40px);border-radius:var(--radius-xl);background:radial-gradient(70% 90% at 100% 0%,#86deae33,transparent 60%),var(--card);border:1px solid var(--line);margin:8px 0 20px}
.club-hero h1{font:500 clamp(30px,4.5vw,48px)/1.05 var(--serif);letter-spacing:-.02em;margin:8px 0}.club-hero p{color:var(--muted)}.club-hero em{color:var(--ink)}
.club-week{display:inline-flex;gap:8px;align-items:baseline;flex-wrap:wrap;padding:8px 14px;border-radius:14px;background:var(--mint-soft);color:var(--mint-ink);font-size:13.5px;margin:4px 0 14px}.club-week small{color:var(--muted)}
.club-chapters{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px}.club-chapters .chip{min-height:32px;min-width:38px;justify-content:center;padding:4px 10px}.club-chapters .chip.locked{opacity:.55}
.club-post{display:flex;gap:12px;padding:14px 16px;border-radius:18px;background:var(--card);border:1px solid var(--line);margin-bottom:10px}.club-post>div{flex:1;min-width:0}.club-post strong{font-size:14px}.club-post small{margin-left:8px;color:var(--muted);font-size:11.5px}.club-post p{margin:6px 0 0;font-size:14.5px;line-height:1.55}
.club-composer textarea{min-height:90px}.club-locked{margin-top:14px;padding:12px 16px;border-radius:16px;background:var(--surface);font-size:13px;color:var(--muted)}.club-locked p{margin:4px 0}
.club-member{display:flex;gap:10px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}.club-member:first-of-type{border-top:0}.club-member>div{flex:1;min-width:0}.club-member strong{display:block;font-size:13.5px}.club-member small{color:var(--muted);font-size:12px}
/* Reading together in a room */
.read-stage{padding:0!important;align-items:stretch!important}#rm-read{width:100%}
.rd-quiet{display:grid;justify-items:center;text-align:center;gap:8px;padding:40px 20px;background:radial-gradient(60% 80% at 50% 0%,#f7e7c966,transparent 60%),linear-gradient(180deg,#fffaf2,#f3fbf6);min-height:420px;align-content:center}
.rd-clock{font:300 clamp(64px,12vw,120px)/1 var(--serif);letter-spacing:-.04em;color:var(--mint-dark);font-variant-numeric:tabular-nums}
.rd-quiet p{max-width:460px;color:var(--muted)}
.rd-along{padding:20px clamp(16px,3vw,32px);background:var(--rd-bg,#fff);color:var(--rd-ink,#1d211f)}.rd-along.theme-sepia{--rd-bg:#fbf4e6;--rd-ink:#3b2f1e}.rd-along.theme-mint{--rd-bg:#f3fbf6;--rd-ink:#183a29}.rd-along.theme-dusk{--rd-bg:#eef1f6;--rd-ink:#26303f}
.rd-along-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin-bottom:12px}.rd-along-head h2{font:500 24px var(--serif);margin:0}.rd-along-head small{color:var(--muted)}.rd-along-head .toggle-row{border:0;margin-left:auto;padding:0}
.rd-along-text{max-height:440px;overflow:auto;font:18px/1.75 var(--serif);padding-right:8px}.rd-along-text p{margin:0 0 1em;white-space:pre-line;transition:background .3s}
.rd-along-text p.rd-current{background:color-mix(in srgb,var(--mint) 26%,transparent);border-radius:8px;box-shadow:0 0 0 6px color-mix(in srgb,var(--mint) 26%,transparent)}
@media(max-width:1000px){.rd-hero{grid-template-columns:minmax(0,1fr)}.rd-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.rd-stack{display:none}}
@media(max-width:760px){.rd-stats{grid-template-columns:minmax(0,1fr)}.rd-now{flex-direction:column;align-items:flex-start}.club-hero{flex-direction:column;align-items:flex-start}.bk-cover.xl{width:150px}.rd-together{grid-template-columns:minmax(0,1fr)}.rd-together-art{display:none}
 .rd-tools .button span{display:none}.rd-title{text-align:left}.rd-reader{margin:0 -12px;border-radius:0;border-left:0;border-right:0}.rd-bar{border-radius:0}.bk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.club-grid{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.emoji-motion,.rd-together-art span,.emoji-cell:hover{animation:none}}
.rd-pop .rd-dot.hl-mint{background:#c9f1db}.rd-pop .rd-dot.hl-sun{background:#ffe7a1}.rd-pop .rd-dot.hl-rose{background:#ffd1df}.rd-pop .rd-dot.hl-sky{background:#cde6ff}
.rd-pop .rd-dot:hover{transform:scale(1.12)}
@media(max-width:760px){.rd-back span{display:none}.rd-bar{gap:8px;padding:10px 12px}.rd-tools{gap:0}.rd-tools .button{padding:6px 8px}}
/* ===== Discover: match profile checklist and quiz ===== */
.match-card{padding:22px 24px;border-radius:24px;background:linear-gradient(135deg,var(--mint-soft),var(--card) 60%);border:1px solid var(--mint-line);box-shadow:var(--shadow-soft);margin:0 0 20px}
.match-head{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.match-head>div{flex:1;min-width:240px}.match-head h2{font-size:22px;margin:4px 0}.match-head p{margin:0;color:var(--muted);font-size:14px}
.match-head .rd-ring{width:64px;height:64px}.match-head .rd-ring text{font-size:13px}
.match-steps{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.match-steps a{display:flex;gap:10px;align-items:flex-start;height:100%;padding:12px 14px;border-radius:16px;background:var(--card);border:1px solid var(--line);color:var(--ink);text-decoration:none}
.match-steps b{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--surface);font-size:12px}.match-steps b .icon{width:14px;height:14px}
.match-steps strong{display:block;font-size:13.5px;line-height:1.3}.match-steps small{display:block;color:var(--muted);font-size:12px;margin-top:3px;line-height:1.4}.match-steps a>.icon{width:15px;height:15px;color:var(--muted);flex:none;margin-left:auto}
.match-steps li.done a{background:var(--mint-soft);border-color:var(--mint-line)}.match-steps li.done b{background:var(--mint-strong);color:#fff}
.match-steps li.next a{border-color:var(--mint-strong);box-shadow:0 0 0 2px var(--mint-line)}
.match-done{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:16px;background:var(--mint-soft);color:var(--mint-ink);margin:0 0 18px;font-size:14px}.match-done .icon{width:16px;height:16px}.match-done span{flex:1}
.match-nudge{background:linear-gradient(160deg,#fff6ea,var(--card) 70%);border:1px solid #f1e2c9}.match-nudge .eyebrow{display:flex;align-items:center;gap:6px}.match-nudge .eyebrow .icon{width:13px;height:13px}
.quiz-progress{display:flex;align-items:center;gap:12px;margin:4px 0 16px;font-size:12.5px;font-weight:600;color:var(--mint-ink)}.quiz-progress>div{flex:1;height:8px;border-radius:999px;background:var(--surface-2);overflow:hidden}.quiz-progress i{display:block;height:100%;background:linear-gradient(90deg,var(--mint-strong),var(--mint));border-radius:inherit;transition:width .4s}
.quiz-intro{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:18px;background:var(--mint-soft);border:1px solid var(--mint-line);margin:0 0 14px}.quiz-emoji{font-size:30px}.quiz-intro strong{display:block;font-size:15px}.quiz-intro p{margin:4px 0 0;font-size:13.5px;color:var(--muted)}
@media(max-width:1000px){.match-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.match-steps{grid-template-columns:minmax(0,1fr)}}
.party-decks{margin-top:18px}.party-decks .eyebrow{font-size:9.5px;color:var(--mint-ink)}.party-option.deck{background:linear-gradient(160deg,var(--mint-soft),var(--card) 70%)}
/* ---------- Friends feed (Home): only what friends already share with you ---------- */
.friends-feed{margin:0 0 30px}.friends-feed:empty{display:none}
.feed-filters{display:flex;flex-wrap:wrap;gap:6px;margin:-4px 0 12px}
.feed-filters .chip{min-height:32px;padding:5px 13px;border:1px solid var(--line);background:var(--card);color:var(--muted);cursor:pointer;font:inherit;font-size:12px}
.feed-filters .chip:hover{border-color:var(--mint-strong);color:var(--mint-ink)}
.feed-filters .chip.active{background:var(--mint);border-color:var(--mint);color:#0f2a1b;font-weight:650}
.feed-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.feed-item{display:flex;gap:14px;padding:14px 16px;border-radius:20px;background:var(--card);border:1px solid var(--line);animation:feed-in .35s both;transition:border-color .2s}
.feed-item:hover{border-color:var(--mint-line)}
.feed-item.k-room{border-color:var(--mint-strong);box-shadow:0 0 0 3px var(--mint-soft)}
.feed-avatar{position:relative;flex:none;align-self:flex-start}
.feed-avatar .avatar{width:44px;height:44px;margin:0;font-size:13px}
.feed-badge{position:absolute;right:-7px;bottom:-6px;display:grid;place-items:center;width:23px;height:23px;border-radius:8px;background:var(--card);border:1px solid var(--line);font-style:normal;font-size:12px;line-height:1;box-shadow:var(--shadow-soft)}
.feed-body{flex:1;min-width:0;display:grid;gap:4px;justify-items:start}
.feed-line{margin:0;font-size:14px;line-height:1.45;color:var(--muted)}.feed-line b{font-weight:650;color:var(--ink)}
.feed-by{color:var(--muted);font-size:12.5px}
.feed-stars{color:#d99a1e;letter-spacing:1px;font-size:12px;white-space:nowrap}
.feed-meta{font-size:11.5px;color:var(--muted)}
.feed-status{display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:8px 12px;border-radius:14px 14px 14px 4px;background:var(--mint-soft);border:1px solid var(--mint-line);font-size:14px;color:var(--ink);overflow-wrap:anywhere}
.feed-plan{display:flex;align-items:center;gap:12px;max-width:100%;padding:10px 14px;border-radius:14px;background:var(--surface);margin-top:4px}
.feed-plan>span{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:10px;background:var(--card);color:var(--mint-ink)}.feed-plan>span .icon{width:17px;height:17px}
.feed-plan>div{display:grid;min-width:0}.feed-plan strong{font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feed-plan small{font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:5px}
.feed-quote{position:relative;justify-self:stretch;margin:4px 0 0;padding:10px 14px;border-left:3px solid var(--mint-strong);border-radius:0 14px 14px 0;background:var(--surface);font:italic 14.5px/1.55 var(--serif);color:var(--ink);white-space:pre-wrap;overflow-wrap:anywhere}
.feed-quote.spoiler span{filter:blur(6px);user-select:none}
.feed-reveal{position:absolute;inset:0;margin:auto;width:max-content;height:max-content;padding:7px 12px;border-radius:999px;border:1px solid var(--line);background:var(--card);font:600 12px/1.2 system-ui,sans-serif;color:var(--ink);cursor:pointer;box-shadow:var(--shadow-soft)}
.feed-note{margin:2px 0 0;font-size:13px;color:var(--muted)}
.feed-locked{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);padding:9px 12px;border-radius:12px;background:var(--surface)}.feed-locked .icon{width:14px;height:14px}
.feed-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;justify-self:stretch}
.feed-cheers{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.cheer-pill,.cheer-quick,.cheer-more,.cheer-tray button{display:inline-flex;align-items:center;gap:5px;min-height:30px;padding:3px 10px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-size:12px;cursor:pointer;transition:border-color .15s,background .15s,transform .15s}
.cheer-pill:hover,.cheer-quick:hover,.cheer-more:hover,.cheer-tray button:hover{border-color:var(--mint-strong);transform:translateY(-1px)}
.cheer-pill.mine{background:var(--mint-soft);border-color:var(--mint-strong);color:var(--mint-ink);font-weight:650}
.cheer-quick{color:var(--muted)}.cheer-more{padding:3px 8px;color:var(--muted)}.cheer-more .icon{width:14px;height:14px}
.cheer-tray{display:inline-flex;gap:2px;padding:2px;border-radius:999px;background:var(--surface);border:1px solid var(--line);animation:feed-in .2s both}
.cheer-tray button{border:0;background:transparent;padding:3px 6px}
.feed-cheers .aemoji.inline{width:18px;height:18px}
.feed-empty{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:18px 20px;border-radius:20px;border:1px dashed var(--mint-line);background:linear-gradient(160deg,var(--mint-soft),var(--card) 70%)}
.feed-empty>div{flex:1;min-width:200px}.feed-empty h3{margin:0 0 4px;font-size:16px}.feed-empty p{margin:0;font-size:13px;color:var(--muted)}
.feed-empty.quiet{background:var(--card);border-style:solid;border-color:var(--line)}
.feed-empty-art{font-size:34px;line-height:1}.feed-empty-art .aemoji{width:44px;height:44px}
.feed-more{margin:12px auto 0;display:flex}
.feed-off{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:10px 0 0}.feed-off .icon{width:14px;height:14px}
@keyframes feed-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.feed-item,.cheer-tray{animation:none}.cheer-pill:hover,.cheer-quick:hover{transform:none}}
@media(max-width:760px){.feed-item{padding:12px;gap:12px}.feed-avatar .avatar{width:38px;height:38px}.feed-actions{justify-content:flex-start}}
/* Friends feed, part two: its own page, posts, "Who's in?", comments, the unread count and a one-line room banner on Home */
.nav-link{position:relative}
.nav-count{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:999px;display:inline-grid;place-items:center;background:var(--mint);color:#0f2a1b;font:700 10.5px/1 system-ui,sans-serif;font-style:normal}
.nav-count[hidden]{display:none}
.mobile-nav .nav-count{position:absolute;top:2px;left:calc(50% + 4px);min-width:17px;height:17px;padding:0 4px;font-size:9.5px;margin:0;box-shadow:0 0 0 2px var(--card)}
.home-quick{display:flex;align-items:center;gap:16px;padding:16px 20px;margin:0 0 26px;border-radius:22px;border:1px solid var(--mint-line);background:linear-gradient(120deg,var(--mint-soft),var(--card) 62%)}
.home-quick-icon{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:14px;background:var(--card);color:var(--mint-ink);box-shadow:var(--shadow-soft)}
.home-quick-icon .icon{width:22px;height:22px}
.home-quick-copy{flex:1;min-width:0;display:grid;gap:2px}.home-quick-copy strong{font-size:16px;letter-spacing:-.01em}
.home-quick-copy em{font-family:var(--serif);font-weight:500;color:var(--mint-ink)}.home-quick-copy small{font-size:12.5px;color:var(--muted)}
.home-quick-actions{display:flex;gap:8px;flex:none}
.feed-open{font-size:13px;font-weight:650;color:var(--mint-ink);text-decoration:none;white-space:nowrap}
.feed-new{color:var(--mint-ink);font-weight:750}
.feed-quick{display:flex;align-items:center;gap:12px;padding:10px 12px 10px 10px;margin:0 0 12px;border-radius:18px;border:1px solid var(--line);background:var(--card);color:var(--muted);text-decoration:none;transition:border-color .15s,box-shadow .15s}
.feed-quick:hover{border-color:var(--mint-strong);box-shadow:0 0 0 3px var(--mint-soft)}
.feed-quick-av .avatar{width:36px;height:36px;margin:0;font-size:12px}
.feed-quick-text{flex:1;min-width:0;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feed-quick-ask{flex:none;padding:6px 12px;border-radius:999px;background:var(--mint-soft);color:var(--mint-ink);font-size:12px;font-weight:650}
.feed-head .button .icon{width:16px;height:16px}
.feed-page{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
.feed-main{min-width:0}
.feed-loading{padding:40px;text-align:center;color:var(--muted)}
.feed-composer{display:grid;gap:10px;padding:14px 16px;margin:0 0 16px;border-radius:22px;border:1px solid var(--mint-line);background:var(--card);box-shadow:0 18px 40px -30px #17432a55}
.feed-composer-top{display:flex;gap:12px;align-items:flex-start}
.feed-composer textarea{flex:1;min-width:0;min-height:58px;resize:vertical;border:0;outline:0;background:transparent;font:inherit;font-size:15.5px;line-height:1.5;color:var(--ink);padding:6px 0}
.feed-composer textarea::placeholder{color:var(--muted)}
.feed-composer:focus-within{border-color:var(--mint-strong);box-shadow:0 0 0 3px var(--mint-soft)}
.feed-composer-asks{display:flex;flex-wrap:wrap;gap:6px}
.feed-composer-asks .chip{min-height:32px;padding:5px 12px;border:1px solid var(--line);background:var(--card);color:var(--muted);cursor:pointer;font:inherit;font-size:12.5px}
.feed-composer-asks .chip.active{background:var(--mint-soft);border-color:var(--mint-strong);color:var(--mint-ink);font-weight:650}
.feed-composer-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding-top:10px;border-top:1px solid var(--line)}
.feed-moods{display:flex;flex-wrap:wrap;gap:2px}
.feed-mood-pick{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;border:1px solid transparent;background:transparent;cursor:pointer;transition:background .15s,transform .15s}
.feed-mood-pick:hover{background:var(--surface);transform:translateY(-1px)}
.feed-mood-pick.on{background:var(--mint-soft);border-color:var(--mint-strong)}
.feed-mood-pick .aemoji.inline{width:22px;height:22px}
.feed-composer-send{display:flex;align-items:center;gap:8px;margin-left:auto}
.feed-composer-send select{min-height:38px;padding:6px 30px 6px 12px;border-radius:12px;border:1px solid var(--line);background-color:var(--card);font:inherit;font-size:13px;color:var(--ink)}
.feed-composer .form-error:empty{display:none}
.feed-line .feed-to{display:inline-flex;align-items:center;gap:3px;color:var(--ink);font-weight:600}.feed-line .feed-to .icon{width:13px;height:13px;color:var(--muted)}
.feed-asking{color:var(--mint-ink);font-weight:600}
.feed-post{display:flex;align-items:flex-start;gap:10px;justify-self:stretch;margin-top:2px}
.feed-post p{margin:0;font-size:15px;line-height:1.55;color:var(--ink);white-space:pre-wrap;overflow-wrap:anywhere}
.feed-mood{flex:none;line-height:1}.feed-mood .aemoji{width:34px;height:34px}
.feed-item.is-ask{border-color:var(--mint-line);background:linear-gradient(165deg,var(--mint-soft),var(--card) 46%)}
.feed-ask{justify-self:stretch;display:grid;gap:8px;margin-top:6px;padding:12px 14px;border-radius:16px;background:var(--card);border:1px solid var(--mint-line)}
.feed-ask.closed{border-color:var(--line);background:var(--surface);opacity:.85}
.feed-ask-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.feed-ask-head strong{font-size:13.5px}.feed-ask-head small{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--muted)}
.feed-ins{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.feed-ins small,.feed-ins-none{font-size:12.5px;color:var(--muted)}
.feed-faces{display:flex}
.feed-face{margin-left:-6px;border-radius:11px;box-shadow:0 0 0 2px var(--card)}.feed-face:first-child{margin-left:0}
.feed-face .avatar{width:28px;height:28px;margin:0;font-size:10px}
.feed-face.more{display:grid;place-items:center;width:28px;height:28px;background:var(--surface);font-size:10.5px;font-weight:650;color:var(--muted)}
.feed-ask-go{display:flex;flex-wrap:wrap;gap:8px}
.button.in{background:var(--mint-soft);border:1px solid var(--mint-strong);color:var(--mint-ink);font-weight:650}
.feed-cta{display:inline-flex;align-items:center;gap:6px;margin-left:auto}
.feed-more-btn{display:inline-grid;place-items:center;width:32px;height:32px;padding:0;border-radius:10px;color:var(--muted)}.feed-more-btn:hover{background:var(--surface);color:var(--ink)}
.feed-comments{justify-self:stretch;display:grid;gap:8px;margin-top:6px;padding-top:10px;border-top:1px solid var(--line)}
.feed-comments ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.feed-comment{display:flex;gap:9px;align-items:flex-start}
.feed-comment-av .avatar{width:28px;height:28px;margin:0;font-size:10px}
.feed-comment>div{min-width:0;display:grid;gap:1px}
.feed-comment p{margin:0;padding:7px 11px;border-radius:4px 14px 14px 14px;background:var(--surface);font-size:13.5px;line-height:1.45;color:var(--ink);overflow-wrap:anywhere}
.feed-comment p b{font-weight:650;margin-right:2px}
.feed-comment small{padding-left:11px;font-size:11px;color:var(--muted)}.feed-comment .text-button{font-size:11px;padding:0;min-height:0}
.feed-all{justify-self:start;font-size:12.5px;padding:0}
.feed-comment-form{display:flex;gap:8px;align-items:center}
.feed-comment-form input{flex:1;min-width:0;min-height:38px;padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:var(--card);font:inherit;font-size:13.5px;color:var(--ink)}
.feed-comment-form input:focus{outline:0;border-color:var(--mint-strong);box-shadow:0 0 0 3px var(--mint-soft)}
.feed-comment-form .button{width:38px;height:38px;min-height:38px;padding:0;border-radius:999px;display:grid;place-items:center}
.feed-aside{display:grid;gap:14px;position:sticky;top:18px}
.feed-aside .side-panel{margin:0;padding:18px;border-radius:20px}
.feed-aside h3{margin:6px 0 4px;font-size:15px}.feed-aside .small-note{margin:0 0 10px}
.feed-free-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line)}.feed-free-row:first-of-type{border-top:0}
.feed-free-row .avatar{width:34px;height:34px;margin:0;font-size:11px}
.feed-free-row>div{flex:1;min-width:0;display:grid}.feed-free-row strong{font-size:13.5px}.feed-free-row small{font-size:11.5px;color:var(--muted)}
.feed-free-row .button.icon-only{width:34px;height:34px;min-height:34px;padding:0;display:grid;place-items:center}
.feed-privacy{display:grid;gap:8px;background:var(--surface)!important;border-color:transparent!important}
.feed-privacy>.icon{width:18px;height:18px;color:var(--mint-ink)}.feed-privacy p{margin:0;font-size:12.5px;color:var(--muted)}
@media(max-width:1100px){.feed-page{grid-template-columns:1fr}.feed-aside{position:static;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}}
@media(max-width:760px){
 .home-quick{flex-wrap:wrap;padding:14px;gap:12px}.home-quick-actions{width:100%}.home-quick-actions .button{flex:1;justify-content:center}
 .feed-composer{padding:12px}.feed-composer-send{width:100%}.feed-composer-send select{flex:1;min-width:0}
 .feed-aside{grid-template-columns:1fr}.feed-cta{margin-left:0}
 .feed-quick-ask{display:none}
}
.party-decks+.small-note{margin-top:12px}

/* ---------- AI Studio: two crews (chat crew + build crew) ---------- */
.tint-ivy{--a-bg:#e8f7ee;--a-line:#c4eed7;--a-accent:#3dbb7c;--a-ink:#1f5a3a}
.tint-remy{--a-bg:#fff1e7;--a-line:#fbd9bd;--a-accent:#ec8a4e;--a-ink:#8a3d12}
.tint-wren{--a-bg:#eef1fd;--a-line:#d3dbf5;--a-accent:#6a7ee0;--a-ink:#2e3a85}
.tint-sunny{--a-bg:#fff8db;--a-line:#f3e2a0;--a-accent:#dcab17;--a-ink:#6e5200}
.tint-custom{--a-bg:#f4eefc;--a-line:#e0d3f6;--a-accent:#9a6ee0;--a-ink:#4b2c85}
.tint-max{--a-bg:#ffeef0;--a-line:#fbd0d6;--a-accent:#e25c6b;--a-ink:#8a1f2c}
.tint-juno{--a-bg:#e6f6f7;--a-line:#bfe7ea;--a-accent:#2fa7b3;--a-ink:#12555c}
.tint-poe{--a-bg:#f1edfc;--a-line:#dcd2f7;--a-accent:#8a6be0;--a-ink:#452b8a}
.tint-tess{--a-bg:#eef8e3;--a-line:#d3ecbb;--a-accent:#6fb33a;--a-ink:#335c14}
body[data-theme=dark] [class*="tint-"]{--a-bg:#1d2a23;--a-line:#2e4a3b;--a-ink:#cfeedd}
.crew-face{display:inline-grid;place-items:center;flex:none;border-radius:30%;background:var(--a-bg,var(--mint-soft));border:1px solid var(--a-line,var(--mint-line));line-height:1;overflow:hidden}
.crew-face .aemoji{width:66%;height:66%;margin:0}
.crew-face.xs{width:26px;height:26px;font-size:15px}.crew-face.xs .aemoji{width:78%;height:78%}.crew-face.sm{width:34px;height:34px;font-size:18px}.crew-face.md{width:46px;height:46px;font-size:24px}
.crew-face.lg{width:60px;height:60px;font-size:31px}.crew-face.xl{width:84px;height:84px;font-size:44px;border-radius:28%}.crew-face.ghost{visibility:hidden}
@keyframes crew-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes crew-bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-4px) rotate(-2deg)}}
@keyframes crew-pulse{0%,100%{box-shadow:0 0 0 3px #3dbb7c33}50%{box-shadow:0 0 0 6px #3dbb7c14}}
.crew-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(24px,4vw,52px);align-items:center;padding:clamp(24px,4vw,52px);border-radius:var(--radius-xl);background:radial-gradient(55% 75% at 100% 0%,#86deae2e,transparent 62%),radial-gradient(45% 60% at 0% 100%,#86deae14,transparent 64%),var(--card);border:1px solid var(--line);overflow:hidden;isolation:isolate;box-shadow:0 30px 70px -48px #17432a59}
.crew-hero::after{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(#17432a0b 1px,transparent 1px),linear-gradient(90deg,#17432a0b 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(70% 80% at 80% 30%,#000,transparent 75%);-webkit-mask-image:radial-gradient(70% 80% at 80% 30%,#000,transparent 75%)}
.crew-hero .stage-copy h1{font-size:clamp(34px,4.2vw,56px)}
.crew-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#3dbb7c;animation:crew-pulse 2s infinite}
.crew-switch{display:inline-flex;gap:4px;margin-top:24px;padding:4px;border-radius:999px;background:var(--surface);border:1px solid var(--line)}
.crew-switch button{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;border:0;border-radius:999px;background:transparent;font:inherit;font-size:13.5px;font-weight:600;color:var(--muted);cursor:pointer;transition:background .2s,color .2s,box-shadow .2s}
.crew-switch button .icon{width:16px;height:16px}
.crew-switch button.active{background:var(--card);color:var(--ink);box-shadow:0 1px 2px #15151514,0 6px 16px -10px #17432a59}
.crew-hero[data-mode=chat] [data-for=build],.crew-hero[data-mode=build] [data-for=chat]{display:none}
.crew-mode{animation:crew-in .35s both}
.crew-ask,.bx-brief{margin-top:14px;padding:12px 12px 10px 18px;border-radius:22px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-lift);transition:border-color .2s,box-shadow .2s}
.crew-ask:focus-within,.bx-brief:focus-within{border-color:var(--mint-strong);box-shadow:0 0 0 4px var(--mint-soft),var(--shadow-lift)}
.crew-ask textarea,.bx-brief textarea{display:block;width:100%;min-height:58px;border:0;background:transparent;resize:none;padding:6px 0;font-size:16.5px;line-height:1.5;color:var(--ink);box-shadow:none}
.crew-ask textarea:focus,.bx-brief textarea:focus{outline:none;box-shadow:none}
.crew-ask textarea::placeholder,.bx-brief textarea::placeholder{color:#9aa19d}
.crew-ask-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:6px}
.crew-ask-to{display:flex;align-items:center;gap:4px;flex-wrap:wrap;min-width:0}
.crew-ask-label{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-right:4px}
.crew-to{position:relative}.crew-to input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.crew-to span{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 3px;border-radius:999px;border:1px solid transparent;font-size:12.5px;font-weight:550;color:var(--muted);cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.crew-to span:hover{background:var(--surface)}
.crew-to input:checked+span{background:var(--a-bg);border-color:var(--a-line);color:var(--a-ink);font-weight:650}
.crew-to input:focus-visible+span{outline:2px solid var(--mint-strong);outline-offset:2px}
.crew-ask-go{flex:none}
.crew-try,.crew-panel-try{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.crew-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;border:1px solid var(--line);background:var(--card);font:inherit;font-size:12.5px;color:var(--muted);cursor:pointer;transition:border-color .15s,color .15s,background .15s,transform .15s}
.crew-chip:hover{border-color:var(--mint-strong);color:var(--mint-ink);background:var(--mint-soft);transform:translateY(-1px)}
.bx-kinds{display:flex;gap:6px;overflow-x:auto;padding:2px 24px 10px 0;margin:2px 0 0;scrollbar-width:none;mask-image:linear-gradient(90deg,#000 88%,transparent);-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent)}.bx-kinds::-webkit-scrollbar{display:none}
.bx-kind{position:relative;flex:none}.bx-kind input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.bx-kind span{display:inline-flex;align-items:center;gap:5px;padding:6px 11px;border-radius:999px;border:1px solid var(--line);font-size:12.5px;color:var(--muted);cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,color .15s}
.bx-kind input:checked+span{background:var(--mint);border-color:var(--mint);color:#0f2a1b;font-weight:650}
.bx-kind input:focus-visible+span{outline:2px solid var(--mint-strong);outline-offset:2px}
.bx-row{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:10px}
.bx-field{display:grid;gap:4px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.bx-field select{min-height:38px;padding:6px 30px 6px 10px;border-radius:12px;font-size:13px;letter-spacing:0;text-transform:none;color:var(--ink);background-color:var(--surface);border:1px solid var(--line)}
.bx-go{margin-left:auto}
.crew-hero-side,.crew-hero-copy,.crew-mode{position:relative;min-width:0}
.crew-lineup{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.crew-tile{position:relative;display:grid;justify-items:start;gap:3px;padding:18px;border-radius:22px;background:linear-gradient(160deg,var(--a-bg),var(--card) 90%);border:1px solid var(--a-line);color:var(--ink);text-decoration:none;transition:transform .25s,box-shadow .25s}
.crew-tile:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift)}
.crew-tile .crew-face{margin-bottom:10px;animation:crew-bob 5s ease-in-out infinite;animation-delay:calc(var(--i,0)*-1.2s)}
.crew-tile strong{font-size:17px;letter-spacing:-.01em}.crew-tile small{font-size:12.5px;color:var(--muted)}
.crew-tile-on{position:absolute;top:14px;right:14px;display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:650;color:var(--a-ink)}
.crew-tile-on::before{content:"";width:7px;height:7px;border-radius:50%;background:#3dbb7c;box-shadow:0 0 0 3px #3dbb7c2e}
.crew-pipeline{list-style:none;margin:0;padding:0;display:grid;gap:10px;position:relative}
.crew-pipeline::before{content:"";position:absolute;left:37px;top:30px;bottom:30px;width:2px;background:repeating-linear-gradient(var(--mint-line) 0 6px,transparent 6px 12px)}
.crew-pipeline li{position:relative;display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:18px;background:var(--card);border:1px solid var(--line);animation:crew-in .4s both;animation-delay:calc(var(--i,0)*.08s)}
.crew-pipeline li>div{display:grid;gap:2px;min-width:0}
.crew-pipeline strong{font-size:14.5px}.crew-pipeline strong small{font-weight:600;color:var(--a-ink,var(--mint-ink));font-size:11.5px;margin-left:4px}
.crew-pipeline li>div>span{font-size:12.5px;color:var(--muted);line-height:1.4}
.crew-pipeline li.crew-pipeline-out{background:var(--mint-soft);border-color:var(--mint-line);animation-delay:.32s}
.crew-pipeline-out>span:first-child{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:30%;background:var(--mint);color:#0f2a1b}.crew-pipeline-out>span:first-child .icon{width:20px;height:20px}
.crew-status{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;margin:14px 6px 0;font-size:12.5px;color:var(--muted)}
.crew-status>span{display:inline-flex;align-items:center;gap:6px}.crew-status .icon{width:14px;height:14px;color:var(--mint-strong)}
.crew-online{font-weight:650;color:var(--mint-ink)}.crew-online i{width:8px;height:8px;border-radius:50%;background:#3dbb7c;animation:crew-pulse 2s infinite}
.crew-status .text-button{font-size:12.5px;padding:0;min-height:0}
.crew-setup.setup-pane{display:block;margin-top:18px;padding:clamp(22px,3vw,34px);border-radius:var(--radius-xl);border:1px solid var(--mint-line);background:linear-gradient(135deg,var(--mint-soft),var(--card) 60%)}
.crew-setup-head h2{font-size:clamp(22px,2.6vw,30px);letter-spacing:-.03em;margin:8px 0 6px}
.crew-setup-head h2 em{font-family:var(--serif);font-style:italic;font-weight:500;color:var(--mint-dark)}
.crew-setup-head p{margin:0;color:var(--muted);max-width:640px;line-height:1.55}
.crew-steps{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr);gap:12px}
.crew-steps li{display:flex;gap:12px;padding:18px;border-radius:20px;background:var(--card);border:1px solid var(--line)}
.crew-steps li.now{border-color:var(--mint-strong);box-shadow:0 0 0 4px #86deae33}
.crew-steps li>b{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:10px;background:var(--mint-soft);color:var(--mint-ink);font-size:14px}
.crew-steps li.now>b{background:var(--mint);color:#0f2a1b}
.crew-steps li>div{min-width:0;flex:1}.crew-steps h3{font-size:15px;margin:4px 0 4px}.crew-steps p{margin:0 0 10px;font-size:13px;color:var(--muted);line-height:1.5}
.crew-key{margin:6px 0 8px}.crew-key-row{display:flex;gap:8px}.crew-key-row input{flex:1;min-width:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}
.crew-setup-notes{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;margin-top:16px;font-size:12px;color:var(--muted)}
.crew-setup-notes>span{display:inline-flex;align-items:center;gap:6px}.crew-setup-notes .icon{width:14px;height:14px;color:var(--mint-strong)}
.crew-setup-notes summary{cursor:pointer;color:var(--mint-ink);font-weight:600}.crew-setup-notes details p{margin:6px 0 0}
.crew-setup-remote{display:flex;gap:8px;align-items:center;margin:16px 0 0;font-size:14px}.crew-setup-remote .icon{width:16px;height:16px;color:var(--mint-ink)}
.bx-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:12px}
.bx-card{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:20px;background:var(--card);border:1px solid var(--line);color:var(--ink);text-decoration:none;transition:border-color .2s,box-shadow .2s,transform .2s}
.bx-card:hover{border-color:var(--mint-line);box-shadow:var(--shadow-lift);transform:translateY(-2px)}
.bx-card-art{display:grid;place-items:center;flex:none;width:52px;height:52px;border-radius:30%;background:var(--surface);font-size:26px}.bx-card-art .aemoji{width:34px;height:34px}
.bx-card-copy{flex:1;min-width:0;display:grid;gap:2px}
.bx-card-copy strong{font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bx-card-copy small{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bx-card-meta{font-size:11px;color:var(--muted)}
.bx-state{flex:none;display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:650;padding:5px 9px;border-radius:999px;white-space:nowrap}
.bx-state.ok{background:var(--mint-soft);color:var(--mint-ink)}.bx-state.ok .icon{width:12px;height:12px}
.bx-state.run{background:#fff8db;color:#6e5200}.bx-state.fail{background:#fff0f0;color:#9a2b2b}
.f-mystery{background:#f1edfc!important}.f-trivia{background:#eef1fd!important}.f-party-game{background:#fff1e7!important}.f-challenge{background:#fff8db!important}.f-story{background:#ffeef0!important}.f-creative{background:#e6f6f7!important}.f-outdoor{background:#eef8e3!important}.f-other{background:var(--mint-soft)!important}
.bx-ideas{display:flex;flex-wrap:wrap;gap:10px}
.bx-idea{display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;border-radius:999px;border:1px dashed var(--mint-line);background:var(--card);font:inherit;font-size:13.5px;color:var(--ink);cursor:pointer;transition:background .15s,border-color .15s,transform .15s}
.bx-idea:hover{border-style:solid;border-color:var(--mint-strong);background:var(--mint-soft);transform:translateY(-1px)}
.bx-idea>span{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:var(--surface);font-size:17px}.bx-idea .aemoji{width:22px;height:22px}
.crew-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.crew-tab{display:inline-flex;align-items:center;gap:8px;padding:5px 14px 5px 5px;border-radius:999px;border:1px solid var(--line);background:var(--card);font:inherit;font-size:13.5px;font-weight:600;color:var(--muted);cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.crew-tab:hover{border-color:var(--a-line);color:var(--ink)}
.crew-tab.active{background:var(--a-bg);border-color:var(--a-accent);color:var(--a-ink)}
.crew-tab.add{padding:5px 14px;border-style:dashed;color:var(--mint-ink)}.crew-tab.add .icon{width:15px;height:15px}
.crew-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,3vw,36px);padding:clamp(20px,3vw,34px);border-radius:var(--radius-xl);border:1px solid var(--a-line);background:radial-gradient(80% 100% at 0% 0%,var(--a-bg),transparent 70%),var(--card);animation:crew-in .35s both}
.crew-panel-info h3{font-size:clamp(26px,3vw,34px);letter-spacing:-.035em;margin:16px 0 2px}
.crew-panel-role{font-size:13px;font-weight:650;color:var(--a-ink)}
.crew-panel-info>p{font-size:15px;line-height:1.6;color:var(--muted);margin:12px 0 16px;max-width:460px}
.crew-can{list-style:none;padding:0;margin:0;display:grid;gap:9px}
.crew-can li{display:flex;align-items:center;gap:10px;font-size:14px}
.crew-can .icon{flex:none;width:22px;height:22px;padding:4px;border-radius:8px;background:var(--a-bg);color:var(--a-ink)}
.crew-panel-try .eyebrow{width:100%;font-size:9.5px;margin-bottom:-2px}
.crew-panel-cta{display:flex;align-items:center;gap:14px;margin-top:20px}
.crew-demo{display:flex;flex-direction:column;align-self:start;min-width:0;border-radius:22px;background:var(--surface);border:1px solid var(--line);overflow:hidden}
.crew-demo-head{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);background:var(--card)}
.crew-demo-head b{font-size:14px}.crew-demo-head>span:last-child{margin-left:auto;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.crew-demo-log{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;padding:16px}
.crew-demo-msg{max-width:88%;padding:10px 13px;border-radius:16px 16px 16px 6px;background:var(--card);border:1px solid var(--line);font-size:13.5px;line-height:1.5;animation:crew-in .4s both;animation-delay:calc(var(--d,0)*.35s + .1s)}
.crew-demo-msg.you{align-self:flex-end;border-radius:16px 16px 6px 16px;background:var(--mint);border-color:var(--mint);color:#0f2a1b}
.crew-demo-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 14px;border-radius:16px;background:var(--card);border:1.5px dashed var(--a-accent);animation:crew-in .4s both;animation-delay:calc(var(--d,0)*.35s + .1s)}
.crew-demo-card>span{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--a-bg);color:var(--a-ink)}.crew-demo-card>span .icon{width:18px;height:18px}
.crew-demo-card small{display:block;font-size:9px;letter-spacing:.12em;color:var(--a-ink)}
.crew-demo-card b{display:block;font-size:13.5px;margin-top:2px}.crew-demo-card em{display:block;font-style:normal;font-size:11.5px;color:var(--muted)}
.crew-demo-card i{font-style:normal;font-size:11.5px;font-weight:650;padding:7px 11px;border-radius:999px;background:var(--mint);color:#0f2a1b}
.crew-demo-own{padding:22px}.crew-demo-own blockquote{margin:10px 0;padding:14px 16px;border-left:3px solid var(--a-accent);border-radius:0 14px 14px 0;background:var(--card);font:italic 15px/1.55 var(--serif)}
.crew-yours.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}
.crew-threads,.crew-decks{display:grid;gap:8px}
.crew-thread,.crew-deck{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:16px;border:1px solid var(--line);background:var(--card);color:var(--ink);text-decoration:none;transition:border-color .2s}
.crew-thread:hover{border-color:var(--mint-strong)}
.crew-thread>span:nth-child(2),.crew-deck>span:nth-child(2){flex:1;min-width:0;display:grid}
.crew-thread strong,.crew-deck strong{font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.crew-thread small,.crew-deck small{font-size:11.5px;color:var(--muted)}
.crew-thread>.icon{width:16px;height:16px;color:var(--muted)}
.crew-deck-art{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:30%;background:#fff1e7;font-size:18px}.crew-deck-art .aemoji{width:22px;height:22px}
.host-dream{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 16px;padding:8px 8px 8px 18px;border-radius:999px;border:1px solid var(--line);background:var(--card);box-shadow:var(--shadow-soft)}
.host-dream:focus-within{border-color:var(--mint-strong)}
.host-dream input[type=text]{flex:1 1 260px;min-width:0;border:0;box-shadow:none;background:transparent;font-size:15px;padding:8px 0}
.host-dream input[type=text]:focus{outline:none;box-shadow:none}
.host-kinds{display:flex;gap:6px;flex-wrap:wrap}.host-kinds .choice-chip span{padding:7px 12px;font-size:12.5px}
.crew-promises{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:28px;align-items:center;margin-top:34px;padding:clamp(20px,3vw,32px);border-radius:var(--radius-xl);background:var(--surface);border:1px solid var(--line)}
.crew-promises h2{font-size:clamp(22px,2.4vw,28px);letter-spacing:-.03em;margin:6px 0 0}
.crew-promises ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 22px}
.crew-promises li{display:flex;gap:10px;font-size:13px;color:var(--muted);line-height:1.5}
.crew-promises li .icon{flex:none;width:32px;height:32px;padding:7px;border-radius:10px;background:var(--card);color:var(--mint-ink);border:1px solid var(--line)}
.crew-promises b{color:var(--ink);font-weight:650}
.cb-presets{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}.cb-presets .eyebrow{width:100%;font-size:9.5px}
.cb-top{display:flex;align-items:flex-end;gap:14px}.cb-top .field-row{flex:1}.cb-top .crew-face{margin-bottom:16px}
/* chat */
.ac2{display:grid;grid-template-columns:232px minmax(0,1fr);gap:18px;height:calc(100dvh - 148px);min-height:560px}
.ac2-rail{display:flex;flex-direction:column;gap:6px;min-height:0;overflow-y:auto;padding:4px 2px 4px 0}
.ac2-rail .eyebrow{font-size:9.5px;margin:14px 8px 4px}
.ac2-back{display:inline-flex;align-items:center;gap:6px;padding:6px 8px;font-size:13px;color:var(--muted);text-decoration:none}.ac2-back .icon{width:15px;height:15px}
.ac2-crew{display:grid;gap:4px}
.ac2-agent{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:14px;color:var(--ink);text-decoration:none;border:1px solid transparent;transition:background .15s}
.ac2-agent:hover{background:var(--surface)}.ac2-agent.active{background:var(--card);border-color:var(--line);box-shadow:var(--shadow-soft)}
.ac2-agent>span:last-child{display:grid;min-width:0}.ac2-agent strong{font-size:13.5px}.ac2-agent small{font-size:11.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ac2-add,.ac2-newchat{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:14px;border:1px dashed var(--line);background:transparent;font:inherit;font-size:13px;font-weight:600;color:var(--mint-ink);cursor:pointer;text-decoration:none}
.ac2-add:hover,.ac2-newchat:hover{border-color:var(--mint-strong);background:var(--mint-soft)}.ac2-add .icon,.ac2-newchat .icon{width:15px;height:15px}
.ac2-history{display:grid;gap:2px}
.ac-past{display:grid;padding:8px 10px;border-radius:12px;color:var(--ink);text-decoration:none}.ac-past:hover,.ac-past.active{background:var(--surface)}
.ac-past strong{font-size:12.5px;font-weight:550;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ac-past small{font-size:11px;color:var(--muted)}
.ac2-main{display:flex;flex-direction:column;min-width:0;min-height:0;border:1px solid var(--line);border-radius:26px;background:var(--card);overflow:hidden;box-shadow:var(--shadow-soft)}
.ac2-strip{display:none;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.ac2-strip-back{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:12px;color:var(--muted)}.ac2-strip-back .icon{width:17px;height:17px}
.ac2-strip-face{flex:none;border-radius:32%;padding:2px;border:2px solid transparent;line-height:0}.ac2-strip-face.active{border-color:var(--a-accent)}
.ac-head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line);background:var(--card)}
.ac-head>div{display:grid;min-width:0}.ac-head h1{font-size:19px;letter-spacing:-.02em;margin:0;line-height:1.15}.ac-head>div>span{font-size:12px;color:var(--a-ink);font-weight:600}
.ac2-state{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.ac2-state i{width:8px;height:8px;border-radius:50%;background:#c3c9c5}.ac2-state.on{color:var(--mint-ink)}.ac2-state.on i{background:#3dbb7c;box-shadow:0 0 0 3px #3dbb7c2e}
.ac2-new{flex:none}
.ac-log{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding:22px clamp(14px,3vw,28px) 14px;background:linear-gradient(180deg,var(--a-bg) 0%,var(--card) 260px)}
.ac-msg{display:flex;gap:10px;align-items:flex-end;max-width:min(86%,660px);animation:crew-in .3s both}
.ac-msg.you{align-self:flex-end}.ac-msg.cont{margin-top:-4px}
.ac-bubble{padding:11px 15px;border-radius:20px 20px 20px 6px;background:var(--card);border:1px solid var(--line);font-size:14.5px;line-height:1.6;overflow-wrap:anywhere;box-shadow:0 1px 2px #1515150a}
.ac-msg.you .ac-bubble{border-radius:20px 20px 6px 20px;background:var(--mint);border-color:var(--mint);color:#0f2a1b;white-space:pre-wrap}
.ac-bubble p{margin:0}.ac-bubble p+p,.ac-bubble ul+p,.ac-bubble ol+p,.ac-bubble p+ul,.ac-bubble p+ol{margin-top:8px}.ac-bubble ul,.ac-bubble ol{margin:0;padding-left:20px;display:grid;gap:3px}
.ac-steps{display:flex;flex-wrap:wrap;gap:6px;margin-left:44px}
.ac-tool{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--a-ink);padding:4px 10px;border-radius:999px;background:var(--a-bg);border:1px solid var(--a-line);animation:crew-in .3s both}
.ac-tool .icon{width:13px;height:13px}.ac-tool.fail{color:#8a5a1c;background:#fff6e8;border-color:#f3dcb4}
.ac-working .ac-bubble{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13.5px}
.ac-elapsed{font-size:11px;color:#9aa19d;font-variant-numeric:tabular-nums}
.ac-dots{display:inline-flex;gap:4px}.ac-dots i{width:6px;height:6px;border-radius:50%;background:var(--a-accent,var(--mint-strong));animation:ac-dot 1.2s infinite ease-in-out}
.ac-dots i:nth-child(2){animation-delay:.15s}.ac-dots i:nth-child(3){animation-delay:.3s}
@keyframes ac-dot{0%,80%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.ac-card{margin-left:44px;max-width:min(560px,calc(100% - 44px));padding:16px;border-radius:20px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-soft);animation:crew-in .35s both}
.ac-card.proposal.pending{border:1.5px dashed var(--a-accent)}
.ac-card.proposal.done{border-color:var(--mint-line);background:linear-gradient(160deg,var(--mint-soft),var(--card) 60%)}
.ac-card.proposal.declined{opacity:.65}
.pc-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.pc-label{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--a-ink)}.pc-label .icon{width:14px;height:14px}
.pc-state{font-size:10.5px;font-weight:650;padding:4px 9px;border-radius:999px;background:var(--surface);color:var(--muted)}
.pc-state.wait{background:#fff8db;color:#6e5200}.pc-state.ok{background:var(--mint);color:#0f2a1b}
.pc-title{display:block;font-size:17px;letter-spacing:-.01em;line-height:1.3}
.pc-meta{display:block;font-size:12.5px;color:var(--muted);margin-top:3px}.pc-meta .icon{width:13px;height:13px;vertical-align:-2px}
.pc-room,.pc-plan{display:flex;gap:14px;align-items:flex-start}.pc-room>div,.pc-plan>div:last-child{min-width:0;flex:1}
.pc-icon{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:14px;background:var(--a-bg);color:var(--a-ink)}.pc-icon .icon{width:22px;height:22px}
.pc-date{display:grid;justify-items:center;flex:none;width:58px;padding:7px 0;border-radius:14px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-soft);line-height:1.1}
.pc-date small{font-size:9.5px;font-weight:700;letter-spacing:.1em;color:var(--a-ink)}.pc-date b{font-size:24px;letter-spacing:-.03em}
.pc-people{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:12.5px}.pc-people.none{color:var(--muted)}
.pc-face{display:inline-grid;place-items:center;flex:none;width:26px;height:26px;margin-right:-14px;border-radius:30%;background:#d9eee1;color:#274a35;font-size:10px;font-weight:700;border:2px solid var(--card)}
.pc-people .pc-face:nth-last-child(2){margin-right:0}
.pc-msg .pc-bubble{width:fit-content;max-width:92%;margin:8px 0 0 auto;padding:10px 14px;border-radius:18px 18px 6px 18px;background:var(--mint);color:#0f2a1b;font-size:14px;line-height:1.5;white-space:pre-wrap}
.ac-quote{margin:8px 0 0;padding:10px 12px;border-left:3px solid var(--a-accent);border-radius:0 12px 12px 0;background:var(--surface);font:italic 14px/1.5 var(--serif);white-space:pre-wrap}
.ac-reason{margin:12px 0 0;padding-top:10px;border-top:1px dashed var(--line);font-size:12.5px;color:var(--muted)}
.ac-card .actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.ac-rights{margin-top:12px;font-size:12px}
.ac-done{margin-top:12px;display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--mint-ink)}.ac-done .icon{width:15px;height:15px}
.ac-declined{margin-top:12px;font-size:12px;color:var(--muted)}
.ac-card.deck{display:flex;align-items:center;gap:16px}.ac-card.deck>div{flex:1;min-width:0}
.deck-stack{position:relative;flex:none;width:50px;height:58px}
.deck-stack i,.deck-stack span{position:absolute;inset:0;border-radius:10px;border:1px solid var(--line);background:var(--card)}
.deck-stack i:nth-child(1){transform:rotate(-10deg)}.deck-stack i:nth-child(2){transform:rotate(7deg)}
.deck-stack span{display:grid;place-items:center;background:#fff1e7;font-size:24px}.deck-stack .aemoji{width:30px;height:30px}
.ac-empty{margin:auto;text-align:center;max-width:540px;display:grid;justify-items:center;gap:8px;padding:20px 0}
.ac-empty .crew-face{animation:crew-bob 5s ease-in-out infinite}
.ac-empty h2{font-size:24px;letter-spacing:-.03em;margin:10px 0 0}.ac-empty>p{margin:0 0 10px;font-size:14.5px;color:var(--muted);line-height:1.55}
.ac-starters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%}
.ac-starter{display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;padding:13px 14px;border-radius:16px;border:1px solid var(--line);background:var(--card);font:inherit;font-size:13.5px;line-height:1.4;color:var(--ink);cursor:pointer;transition:border-color .15s,transform .15s,box-shadow .15s}
.ac-starter:hover{border-color:var(--a-accent);transform:translateY(-1px);box-shadow:var(--shadow-soft)}.ac-starter .icon{flex:none;width:16px;height:16px;color:var(--a-ink)}
.ac-connect{display:flex;align-items:center;gap:12px;text-align:left;padding:14px 16px;border-radius:18px;border:1px solid var(--mint-line);background:var(--mint-soft)}
.ac-connect>div{display:grid}.ac-connect span{font-size:12.5px;color:var(--muted)}.ac-connect>.icon{width:22px;height:22px;color:var(--mint-ink)}
.ac-compose{display:flex;align-items:flex-end;gap:8px;margin:10px 14px 4px;padding:6px 6px 6px 16px;border:1px solid var(--line);border-radius:24px;background:var(--card);box-shadow:var(--shadow-soft);transition:border-color .2s,box-shadow .2s}
.ac-compose:focus-within{border-color:var(--a-accent);box-shadow:0 0 0 4px var(--a-bg)}
.ac-compose textarea{flex:1;min-height:40px;max-height:160px;border:0;background:transparent;box-shadow:none;resize:none;padding:9px 0;font-size:15px;line-height:1.45;color:var(--ink)}
.ac-compose textarea:focus{outline:none;box-shadow:none}
.ac-send{display:grid;place-items:center;flex:none;width:42px;height:42px;border:0;border-radius:16px;background:var(--mint);color:#0f2a1b;cursor:pointer;box-shadow:var(--mint-glow);transition:transform .15s,opacity .15s}
.ac-send:hover:not(:disabled){transform:translateY(-1px)}.ac-send:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.ac-send .icon{width:18px;height:18px}
.ac-compose.busy .ac-send{opacity:.45;pointer-events:none}
.ac-note{display:flex;align-items:center;gap:6px;margin:0;padding:2px 20px 12px;font-size:11.5px;color:var(--muted)}.ac-note .icon{width:13px;height:13px;color:var(--mint-strong)}
/* build crew: progress, the finished experience, presenter */
.bx-head{position:relative;padding:clamp(22px,3vw,36px);border-radius:var(--radius-xl);border:1px solid var(--line);background:radial-gradient(60% 90% at 100% 0%,#86deae29,transparent 65%),var(--card);margin-bottom:16px}
.bx-head h1{font:500 clamp(26px,3.2vw,40px)/1.15 var(--serif);letter-spacing:-.02em;margin:12px 0;max-width:820px}
.bx-chips{display:flex;flex-wrap:wrap;gap:8px}
.bx-chips span{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font-size:12.5px;color:var(--ink)}.bx-chips .icon{width:14px;height:14px;color:var(--mint-ink)}
.bx-progress{display:grid;gap:8px;margin-top:20px;max-width:640px;font-size:12.5px;color:var(--muted)}
.bx-bar{height:8px;border-radius:999px;background:var(--surface);overflow:hidden}
.bx-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--mint-strong),var(--mint),var(--mint-strong));background-size:200% 100%;transition:width .6s ease}
.bx-head.running .bx-bar i{animation:bx-shine 1.6s linear infinite}.bx-head.failed .bx-bar i{background:#e8a3a3}
@keyframes bx-shine{to{background-position:-200% 0}}
.bx-crew{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.bx-step{position:relative;display:flex;flex-direction:column;gap:12px;padding:18px;border-radius:22px;background:var(--card);border:1px solid var(--line);transition:border-color .3s,box-shadow .3s,opacity .3s}
.bx-step.waiting{opacity:.6}.bx-step.working{border-color:var(--a-accent);box-shadow:0 0 0 4px var(--a-bg),var(--shadow-lift)}
.bx-step.working .crew-face{animation:crew-bob 1.6s ease-in-out infinite}
.bx-step.done{border-color:var(--a-line);background:linear-gradient(170deg,var(--a-bg),var(--card) 55%)}.bx-step.stuck{border-color:#f0c4c4}
.bx-step-head{display:grid;gap:1px}.bx-step-head strong{font-size:16px}.bx-step-head>span{font-size:12px;color:var(--a-ink);font-weight:600}
.bx-step-head em{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font-style:normal;font-size:12px;font-weight:650;color:var(--muted)}
.bx-step.done .bx-step-head em{color:var(--mint-ink)}.bx-step.working .bx-step-head em{color:var(--a-ink)}.bx-step-head em .icon{width:14px;height:14px}
.bx-step-sum{margin:2px 0 0;font-size:13px;line-height:1.5}.bx-step-sum.muted{color:var(--muted)}
.bx-note{margin:10px 0 0;padding:10px 12px;border-radius:14px 14px 14px 4px;background:var(--card);border:1px solid var(--a-line);font-size:12.5px;line-height:1.5;color:var(--ink);animation:crew-in .4s both}
.bx-retry{margin-top:16px}
.bx-cover{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:clamp(18px,3vw,34px);align-items:start;padding:clamp(22px,3.5vw,44px);border-radius:var(--radius-xl);border:1px solid var(--line);background:radial-gradient(60% 80% at 100% 0%,#86deae2b,transparent 62%),var(--card);box-shadow:0 30px 70px -48px #17432a59}
.bx-cover-art{display:grid;place-items:center;width:clamp(76px,9vw,112px);aspect-ratio:1;border-radius:28%;font-size:56px;border:1px solid var(--line)}.bx-cover-art .aemoji{width:62%;height:62%}
.bx-cover h1{font:500 clamp(30px,4vw,52px)/1.05 var(--serif);letter-spacing:-.025em;margin:10px 0 6px}
.bx-tagline{font-size:17px;color:var(--ink);margin:0 0 14px}
.bx-pitch{font-size:15px;line-height:1.65;color:var(--muted);max-width:700px;margin:16px 0 0}
.bx-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.bx-score{display:grid;justify-items:center;gap:6px;font-size:11px;color:var(--muted);text-align:center}
.bx-ring{--p:0;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:86px;height:86px;border-radius:50%;background:conic-gradient(var(--mint-strong) calc(var(--p)*1%),var(--surface-2) 0)}
.bx-ring::before{content:"";position:absolute;inset:8px;border-radius:50%;background:var(--card)}
.bx-ring b,.bx-ring small{position:relative;line-height:1}.bx-ring b{font-size:26px;letter-spacing:-.03em}.bx-ring small{font-size:10px;color:var(--muted)}
.bx-made{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0}
.bx-made-card{position:relative;display:flex;gap:10px;padding:14px;border-radius:18px;background:linear-gradient(170deg,var(--a-bg),var(--card) 70%);border:1px solid var(--a-line)}
.bx-made-card>div{min-width:0}.bx-made-card strong{font-size:13.5px}.bx-made-card strong small{font-weight:600;color:var(--a-ink);font-size:11px;margin-left:3px}
.bx-made-card p{margin:4px 0 0;font-size:12.5px;line-height:1.5;color:var(--muted)}
.bx-made-arrow{position:absolute;right:-13px;top:50%;transform:translateY(-50%);z-index:1;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--card);border:1px solid var(--line);color:var(--muted)}.bx-made-arrow .icon{width:12px;height:12px}
.bx-tabs{position:sticky;top:0;z-index:5;display:flex;gap:6px;overflow-x:auto;padding:10px 0;margin:8px 0 6px;background:var(--bg);scrollbar-width:none}
.bx-tabs button{flex:none;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--card);font:inherit;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer}
.bx-tabs button:hover{border-color:var(--mint-strong);color:var(--mint-ink)}
.bx-sec{margin-top:16px;padding:clamp(18px,3vw,30px);border-radius:24px;border:1px solid var(--line);background:var(--card);scroll-margin-top:70px}
.bx-sec h2{font-size:22px;letter-spacing:-.03em;margin:0 0 16px}.bx-sec h3{font-size:14px;margin:18px 0 8px}
.bx-script{list-style:none;margin:0;padding:0;display:grid}
.bx-script li{display:grid;grid-template-columns:62px minmax(0,1fr);gap:16px;padding:14px 0;border-top:1px solid var(--line)}.bx-script li:first-child{border-top:0;padding-top:0}
.bx-min{display:grid;place-items:center;align-content:center;width:56px;height:56px;border-radius:16px;background:var(--mint-soft);color:var(--mint-ink);font-size:18px;font-weight:700;line-height:1}
.bx-min small{font-size:9.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.bx-script strong{font-size:15px}.bx-say{margin:6px 0 0;font:italic 15.5px/1.55 var(--serif);color:var(--ink)}
.bx-do{display:flex;gap:6px;align-items:flex-start;margin:6px 0 0;font-size:13px;color:var(--muted)}.bx-do .icon{flex:none;width:14px;height:14px;margin-top:2px;color:var(--mint-strong)}
.bx-win{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:16px;background:#fff8db}
.bx-win>.icon{flex:none;width:22px;height:22px;color:#a07a00}.bx-win small{font-size:10px;letter-spacing:.12em;font-weight:700;color:#6e5200}.bx-win p{margin:2px 0 0;font-size:15px}
.bx-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.bx-cols ol,.bx-cols ul{margin:0;padding-left:20px;display:grid;gap:6px;font-size:14px;line-height:1.5}
.bx-materials{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.bx-materials h3{width:100%}.bx-materials span{padding:6px 11px;border-radius:999px;background:var(--surface);font-size:12.5px}
.bx-read{margin:0 0 16px;padding:16px 18px;border-left:4px solid var(--mint-strong);border-radius:0 18px 18px 0;background:var(--surface);font:italic 16px/1.6 var(--serif)}
.bx-read small{display:block;font:700 9.5px/1 system-ui,sans-serif;letter-spacing:.14em;color:var(--mint-ink);margin-bottom:8px}
.bx-round{padding:16px 0;border-top:1px solid var(--line)}
.bx-round header{display:flex;align-items:center;gap:12px}.bx-round header>div{flex:1;min-width:0}.bx-round h3{margin:0;font-size:16px}.bx-round header small{font-size:12px;color:var(--muted)}
.bx-round-n{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:11px;background:var(--mint);color:#0f2a1b;font-weight:700}
.bx-round>p{margin:10px 0;font-size:14px;color:var(--muted)}
.bx-items{margin:0;padding-left:22px;display:grid;gap:10px}.bx-items li{font-size:14px;line-height:1.5}.bx-items li>span{display:block}
.bx-answer{display:inline-block;margin-top:3px;font-style:normal;font-size:13px;color:transparent;text-shadow:0 0 7px #1f5a3a99;transition:color .2s,text-shadow .2s;user-select:none}
.bx-items.show .bx-answer{color:var(--mint-ink);text-shadow:none;user-select:auto}
.bx-items small{display:block;font-size:12px;color:var(--muted)}
.bx-roles{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.bx-role{display:grid;gap:6px;align-content:start;padding:16px;border-radius:18px;border:1px solid var(--line);background:linear-gradient(170deg,var(--surface),var(--card) 70%)}
.bx-role strong{font:500 18px var(--serif)}.bx-role p{margin:0;font-size:13.5px;color:var(--muted)}
.bx-role small{display:flex;gap:6px;align-items:flex-start;font-size:12.5px}.bx-role small .icon{flex:none;width:13px;height:13px;margin-top:2px;color:#a07a00}
.bx-secret{margin-top:6px;padding:10px 12px;border-radius:12px;border:1px dashed var(--line);background:var(--card);font:inherit;font-size:13px;line-height:1.45;text-align:left;cursor:pointer;color:transparent;text-shadow:0 0 7px #15151570;transition:color .2s,text-shadow .2s}
.bx-secret.open{color:var(--ink);text-shadow:none}
.bx-secret{position:relative}.bx-secret:not(.open)::after{content:"Tap to peek";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:4px 10px;border-radius:999px;background:var(--card);border:1px solid var(--line);color:var(--ink);font-size:11px;font-weight:650;text-shadow:none;white-space:nowrap}
.bx-verdict{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;background:linear-gradient(170deg,#eef8e3,var(--card) 70%);border:1px solid #d3ecbb}
.bx-verdict>div{display:grid}.bx-verdict strong{font-size:15.5px}.bx-verdict small{font-size:12px;color:var(--muted)}
.bx-fixes{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.bx-fixes li{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:12px;align-items:center;padding:10px 14px;border-radius:14px;background:var(--surface);font-size:13px}
.bx-fixes li>span:first-child{color:var(--muted);text-decoration:line-through;text-decoration-color:#d08c8c}.bx-fixes .icon{width:14px;height:14px;color:var(--mint-strong)}
.bx-tips{margin:0;padding-left:20px;display:grid;gap:6px;font-size:14px}
.bx-foot{display:flex;justify-content:center;margin:26px 0 8px}
.bx-deal{display:grid;gap:10px}
.bx-deal-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,180px) auto;gap:10px;align-items:center;padding:10px 12px;border-radius:14px;border:1px solid var(--line)}
.bx-deal-row>div{display:grid;min-width:0}.bx-deal-row small{font-size:12px;color:var(--muted)}
.bp-invite{border:0;padding:0;margin:12px 0}.bp-invite legend{font-size:13px;font-weight:600;margin-bottom:6px}
body.bx-presenting{overflow:hidden}
.bx-present{position:fixed;inset:0;z-index:300;display:grid;grid-template-rows:auto minmax(0,1fr) auto;background:radial-gradient(70% 90% at 50% 0%,#86deae33,transparent 70%),var(--bg);outline:none}
.ps-top{display:flex;align-items:center;gap:14px;padding:16px clamp(16px,3vw,32px);border-bottom:1px solid var(--line)}
.ps-top strong{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.ps-count{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.ps-clock{display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:700;color:var(--mint-ink);font-variant-numeric:tabular-nums}.ps-clock .icon{width:16px;height:16px}
.ps-stage{display:grid;place-items:center;padding:clamp(20px,5vw,64px);overflow:auto}
.ps-center,.ps-card,.ps-read,.ps-rules{max-width:980px;width:100%;text-align:center;animation:crew-in .35s both}
.ps-kicker{display:inline-block;margin-bottom:18px;padding:6px 12px;border-radius:999px;background:var(--mint-soft);color:var(--mint-ink);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.ps-center h1{font:500 clamp(40px,7vw,96px)/1.02 var(--serif);letter-spacing:-.03em;margin:0 0 18px}
.ps-center p{font-size:clamp(18px,2.2vw,26px);line-height:1.5;color:var(--ink);margin:0 auto 14px;max-width:780px}
.ps-center small{display:block;font-size:15px;color:var(--muted);margin-bottom:24px}
.ps-art{display:inline-grid;place-items:center;width:110px;height:110px;margin-bottom:18px;border-radius:30%;background:var(--mint-soft);font-size:60px}.ps-art .aemoji{width:70%;height:70%}
.ps-card h2{font-size:clamp(28px,4.4vw,58px);line-height:1.15;letter-spacing:-.03em;margin:0 0 28px}
.ps-answer{display:inline-block;padding:16px 26px;border-radius:20px;background:var(--mint);color:#0f2a1b;font-size:clamp(20px,2.6vw,32px);font-weight:650;animation:crew-in .3s both}
.ps-note{display:block;margin-top:18px;font-size:14px;color:var(--muted)}
.ps-read p{font:italic clamp(22px,3vw,38px)/1.5 var(--serif);margin:0}
.ps-rules h2{font-size:clamp(24px,3.4vw,42px);letter-spacing:-.03em;margin:0 0 20px}
.ps-rules ul{margin:0 auto;max-width:760px;display:grid;gap:12px;padding-left:24px;font-size:clamp(17px,2vw,24px);line-height:1.45;text-align:left}
.ps-nav{display:flex;align-items:center;gap:16px;padding:16px clamp(16px,3vw,32px);border-top:1px solid var(--line)}
.ps-bar{flex:1;height:6px;border-radius:999px;background:var(--surface);overflow:hidden}.ps-bar i{display:block;height:100%;background:var(--mint-strong);transition:width .3s}
@media(max-width:1100px){.bx-crew,.bx-made{grid-template-columns:repeat(2,minmax(0,1fr))}.bx-made-arrow{display:none}}
@media(max-width:1000px){.crew-hero,.crew-panel,.crew-promises,.crew-yours.two,.bx-cover{grid-template-columns:minmax(0,1fr)}.crew-lineup{grid-template-columns:repeat(4,minmax(0,1fr))}.crew-steps{grid-template-columns:minmax(0,1fr)}.ac2{grid-template-columns:minmax(0,1fr)}.ac2-rail{display:none}.ac2-strip{display:flex}.bx-score{grid-auto-flow:column;justify-content:start;align-items:center;gap:12px}}
@media(max-width:760px){
 .crew-lineup{display:flex;overflow-x:auto;gap:10px;scrollbar-width:none;padding:2px}.crew-lineup::-webkit-scrollbar{display:none}.crew-tile{flex:0 0 138px;padding:14px}.crew-tile .crew-face{width:48px;height:48px}.crew-tile-on{top:10px;right:10px}
 .crew-switch{display:flex}.crew-switch button{flex:1;justify-content:center;padding:9px 10px}
 .crew-ask-row{flex-direction:column;flex-wrap:nowrap;align-items:stretch}.crew-ask-to{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.crew-ask-go{justify-content:center}
 .bx-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.bx-go{grid-column:1/-1;margin-left:0;justify-content:center}.bx-field select{width:100%}
 .crew-promises ul,.bx-crew,.bx-made,.bx-cols{grid-template-columns:minmax(0,1fr)}
 .bx-fixes li{grid-template-columns:minmax(0,1fr)}.bx-fixes li .icon{transform:rotate(90deg)}.bx-deal-row{grid-template-columns:minmax(0,1fr)}
 .host-dream{border-radius:22px;padding:12px}
 .ac2{display:block;height:auto;min-height:0}
 .ac2-main{height:calc(100dvh - 200px);min-height:420px;border-radius:22px}
 .ac-compose{margin:8px 10px 10px}.ac-note{display:none}
 .ac-msg{max-width:100%}.ac-steps,.ac-card{margin-left:0;max-width:100%}.ac-starters{grid-template-columns:minmax(0,1fr)}
 .ac-head{padding:12px 14px}.ac2-new span{display:none}
 .ps-top a.button,.ps-count{display:none}
}
@media(prefers-reduced-motion:reduce){.crew-tile .crew-face,.ac-empty .crew-face,.bx-step.working .crew-face,.crew-dot,.crew-online i,.bx-head.running .bx-bar i,.ac-dots i{animation:none}.crew-mode,.crew-panel,.crew-demo-msg,.crew-demo-card,.ac-tool,.ac-card,.ac-msg,.bx-note,.crew-pipeline li,.ps-center,.ps-card,.ps-read,.ps-rules,.ps-answer{animation:none}.crew-tile:hover,.bx-card:hover,.crew-chip:hover,.bx-idea:hover,.ac-starter:hover{transform:none}}

/* ===== Trust & safety: verified badge, phone verification ===== */
.verified-mark{display:inline-flex;align-items:center;justify-content:center;flex:none;width:16px;height:16px;margin-left:5px;border-radius:999px;background:var(--mint-strong);vertical-align:-2px}
.verified-mark svg{width:11px;height:11px;fill:none;stroke:#0f2a1b;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
h1 .verified-mark{width:22px;height:22px;margin-left:10px;vertical-align:3px}h1 .verified-mark svg{width:15px;height:15px}
h3 .verified-mark{width:18px;height:18px}
.verify-page{display:flex;justify-content:center;padding:18px 0 40px}
.verify-card{width:min(560px,100%);padding:36px;border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--card);box-shadow:var(--shadow-soft)}
.verify-icon{display:grid;place-items:center;width:56px;height:56px;border-radius:30%;background:var(--mint-soft);color:var(--mint-ink);margin-bottom:18px}
.verify-card h1{margin:8px 0 10px}.verify-card .lede{margin-bottom:22px}
.verify-form{display:grid;gap:10px}.verify-form label{font-weight:600}
.verify-form input{width:100%;font-size:18px;padding:13px 15px;border-radius:14px;border:1px solid var(--line);background:var(--bg);color:var(--ink)}
#phone-code{font-size:24px;letter-spacing:6px;font-variant-numeric:tabular-nums}
.verify-form .hint{color:var(--muted);font-size:12.5px}
.verify-form .actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.test-code{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:var(--mint-soft);color:var(--mint-ink);font-size:13px}.test-code .icon{width:18px;height:18px}
.verify-done{display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:16px;background:var(--mint-soft);color:var(--mint-ink)}.verify-done small{display:block;color:var(--muted)}
.verify-why{list-style:none;padding:0;margin:24px 0 8px;display:grid;gap:14px}.verify-why li{display:flex;gap:12px;align-items:flex-start}
.verify-why .icon{color:var(--mint-ink);margin-top:2px}.verify-why small{display:block;color:var(--muted)}
.verify-skip{display:inline-block;margin-top:10px}
.verify-gate{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;align-items:start}.verify-gate>.pane{margin:0}.verify-gate .verify-why{margin-top:0}
.verify-reason{margin-bottom:16px}
.trust-pane .trust-head{display:flex;gap:14px;align-items:flex-start;margin-bottom:14px}.trust-pane h3{display:flex;align-items:center}.trust-links{margin-top:14px}
.admin-entry{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--mint-ink)}.admin-entry .icon{width:16px;height:16px}.admin-entry[hidden]{display:none}
/* In the menu footer, Admin is its own small button on its own line, above Beta settings & feedback. */
.rail-footer .admin-entry:not([hidden]){display:flex;width:max-content;margin:0 0 12px;padding:6px 12px 6px 9px;border-radius:999px;background:var(--mint-soft);border:1px solid var(--mint-line);font-size:11.5px;line-height:1.2}
.rail-footer .admin-entry:hover{border-color:var(--mint-strong)}.rail-footer .admin-entry .icon{width:15px;height:15px}
.rail-footer>a[href="#beta-settings"]{display:block}

/* ===== Clubs ===== */
.oc-verify-banner{display:flex;align-items:center;gap:14px;padding:14px 18px;margin:0 0 22px;border:1px solid var(--mint-line);border-radius:18px;background:var(--mint-soft);color:var(--mint-ink)}.oc-verify-banner>span{flex:1}
.oc-list-head{align-items:flex-end;gap:14px}
.oc-search{display:flex;align-items:center;gap:8px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:var(--card);min-width:min(280px,100%)}
.oc-search input{flex:1;border:0;background:transparent;padding:10px 0;width:100%;color:var(--ink)}.oc-search input:focus{outline:none}.oc-search:focus-within{border-color:var(--mint-strong)}
.oc-filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}.oc-filters .chip{display:inline-flex;align-items:center;gap:6px}.oc-filters .icon{width:16px;height:16px}
.oc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px;margin-bottom:28px}
.oc-card{display:flex;gap:14px;padding:16px;border:1px solid var(--line);border-radius:22px;background:var(--card);transition:border-color .15s,transform .15s,box-shadow .15s}
.oc-card:hover{border-color:var(--mint-strong);transform:translateY(-2px);box-shadow:var(--shadow-soft)}
.oc-emoji{display:grid;place-items:center;flex:none;width:52px;height:52px;border-radius:30%;background:var(--mint-soft);font-size:26px;line-height:1}
.oc-emoji.large{width:88px;height:88px;font-size:46px}.oc-emoji.small{width:40px;height:40px;font-size:20px}
.oc-card-body{display:grid;gap:4px;min-width:0;flex:1}
.oc-card-top{display:flex;align-items:flex-start;gap:8px;justify-content:space-between}.oc-card-top strong{font-size:16px;line-height:1.3}
.oc-when{display:flex;align-items:center;gap:5px;color:var(--mint-ink);font-weight:600}.oc-when .icon{width:15px;height:15px}
.oc-about{color:var(--muted);font-size:13.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.oc-meta{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:4px;font-size:12.5px;color:var(--muted)}.oc-meta>span{display:inline-flex;align-items:center;gap:4px}.oc-meta .icon{width:14px;height:14px}
.oc-hero{display:flex;gap:22px;align-items:center;padding:26px;margin:6px 0 22px;border:1px solid var(--mint-line);border-radius:var(--radius-xl);background:linear-gradient(135deg,var(--mint-soft),var(--card) 70%)}
.oc-hero h1{margin:4px 0 6px}.oc-hero-copy{min-width:0}
.oc-meet{border-color:var(--mint-line)}.oc-meet.live{background:var(--mint-soft)}.oc-meet h2{margin:6px 0 4px}.oc-meet .actions{margin-top:14px;align-items:center}
.host-tools .actions{margin:10px 0}
.clubs-home:empty{display:none}.clubs-home{margin-bottom:10px}.oc-grid.compact{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.oc-empty-home{display:flex;align-items:center;gap:14px;padding:16px;border:1px dashed var(--mint-line);border-radius:20px;margin-bottom:24px}.oc-empty-home>div{flex:1}.oc-empty-home small{display:block;color:var(--muted)}
.share-url{width:100%}

/* ===== Admin ===== */
.admin-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:0 0 18px}
.admin-stats>div{padding:14px 16px;border:1px solid var(--line);border-radius:18px;background:var(--card)}
.admin-stats strong{display:block;font-size:24px;letter-spacing:-.6px}.admin-stats strong small{font-size:14px;color:var(--muted)}.admin-stats span{font-size:12.5px;color:var(--muted)}
.admin-tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--line);margin:0 0 18px}.admin-tabs::-webkit-scrollbar{display:none}
.admin-tab{display:inline-flex;align-items:center;gap:6px;padding:10px 14px;margin-bottom:-1px;border-bottom:2px solid transparent;color:var(--muted);font-weight:600;white-space:nowrap}
.admin-tab.active{color:var(--ink);border-color:var(--mint-strong)}
.admin-count{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--mint-strong);color:#0f2a1b;font-size:11.5px;font-style:normal;font-weight:700}
.admin-sub{display:flex;gap:8px;margin:0 0 14px}
.admin-list{display:grid;gap:14px}
.admin-card{padding:18px;border:1px solid var(--line);border-radius:20px;background:var(--card)}.admin-card.urgent{border-color:var(--danger)}
.admin-card header{margin-bottom:12px}.admin-tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.admin-tags small{color:var(--muted);margin-left:4px}
.admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:12px}.admin-grid>div{display:grid;gap:2px;min-width:0;align-content:start}
.admin-label{display:block;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.admin-person{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px 6px;font-weight:600}.admin-person small{color:var(--muted);font-weight:500}
.admin-preview{margin:0 0 12px;padding:12px 14px;border-left:3px solid var(--mint-strong);border-radius:0 12px 12px 0;background:var(--surface);color:var(--ink);white-space:pre-wrap;word-break:break-word;max-height:220px;overflow:auto}
.admin-details{margin-bottom:12px;color:var(--ink)}
.admin-choices{display:grid;gap:8px;margin:4px 0 12px;padding:0;border:0}.admin-choices label{display:flex;gap:10px;align-items:center;justify-content:flex-start;font-weight:500;cursor:pointer}
.admin-choices input,#admin-person-form .checkbox input{width:18px;height:18px;min-height:0;margin:0;padding:0;flex:none;accent-color:var(--mint-strong);box-shadow:none}.admin-ban{padding-left:28px;font-size:13px;color:var(--muted)}
.admin-resolve-form textarea,#admin-person-form textarea,#admin-club-form textarea{width:100%}
.admin-resolution{padding:10px 12px;border-radius:12px;background:var(--mint-soft);color:var(--mint-ink);font-size:13.5px}.admin-resolution span{color:var(--ink)}
.badge.danger-badge{background:#fde8e8;color:#8f1f1f}.danger-note{color:var(--danger)}
.admin-intro{margin:0 0 14px}
/* Feedback from testers (Admin → Feedback) */
.admin-feedback header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.admin-feedback-text{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.55}
.admin-row-actions{display:flex;gap:8px;align-items:center;flex:none}.admin-row-actions:empty{display:none}.admin-row-actions .text-button.small{white-space:nowrap}
.admin-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.admin-photo{margin:0;padding:12px;border:1px solid var(--line);border-radius:22px;background:var(--card)}
.admin-photo img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:30%}
.admin-photo figcaption{display:grid;gap:4px;margin-top:10px}.admin-photo small{color:var(--muted)}.admin-photo .actions{margin-top:6px}
.admin-search{display:flex;align-items:center;gap:8px;max-width:520px;margin:0 0 14px;padding:6px 6px 6px 14px;border:1px solid var(--line);border-radius:999px;background:var(--card)}
.admin-search input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);padding:6px 0}.admin-search input:focus{outline:none}
.admin-people .line-item,.admin-clubs .line-item,.admin-log .line-item{align-items:center}.admin-log small{color:var(--muted)}
.admin-money{margin-bottom:16px}.admin-pane-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}

/* ===== Hosting & earnings ===== */
.payout-pane{display:flex;gap:16px;align-items:flex-start;margin-bottom:18px}.payout-pane>div{flex:1;min-width:0}.payout-pane h3{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.payout-pane.ready{border-color:var(--mint-line);background:var(--mint-soft)}.payout-pane .field-row{max-width:380px;margin-top:12px}
.earn-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 20px}
.earn-stats>div{padding:16px;border:1px solid var(--line);border-radius:18px;background:var(--card)}.earn-stats strong{display:block;font-size:24px;letter-spacing:-.6px;word-break:break-word}.earn-stats span{font-size:12.5px;color:var(--muted)}
.earn-amount{display:grid;justify-items:end;text-align:right;flex:none}.earn-amount small{color:var(--muted)}.earn-amount.refunded strong{text-decoration:line-through;color:var(--muted)}
.earn-how{display:grid;gap:6px;margin:8px 0 0;padding-left:18px;color:var(--muted)}
body[data-theme=dark] .badge.danger-badge{background:#4a1d1d;color:#ffb4b4}
@media(max-width:1000px){.verify-gate{grid-template-columns:minmax(0,1fr)}.admin-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){
 .verify-card{padding:24px 20px;border-radius:24px}
 .oc-hero{flex-direction:column;align-items:flex-start;padding:20px}.oc-emoji.large{width:68px;height:68px;font-size:36px}
 .oc-grid,.oc-grid.compact{grid-template-columns:minmax(0,1fr)}
 .oc-list-head{flex-direction:column;align-items:stretch}.oc-search{min-width:0}
 .oc-filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}.oc-filters::-webkit-scrollbar{display:none}.oc-filters .chip{flex:none}
 .oc-verify-banner{flex-direction:column;align-items:flex-start}
 .admin-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-stats>div:last-child:nth-child(odd){grid-column:1/-1}.admin-grid{grid-template-columns:minmax(0,1fr)}
 .admin-people .line-item,.admin-clubs .line-item{flex-wrap:wrap}.admin-clubs .actions{width:100%}.admin-people .admin-row-actions{flex-basis:100%;justify-content:flex-end}
 .earn-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.payout-pane{flex-direction:column}
}

/* ===== Events: public events anyone verified can join ===== */
.ev-filters{display:grid;gap:10px;margin:0 0 6px}.ev-filters .chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0}
.ev-filters .chip{display:inline-flex;align-items:center;gap:6px}.ev-filters .icon{width:16px;height:16px}
.ev-filter-row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.ev-area{width:auto;min-height:40px;padding:6px 10px}
.ev-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;margin-bottom:24px}
.ev-card{display:flex;gap:14px;padding:16px;border:1px solid var(--line);border-radius:22px;background:var(--card);transition:border-color .15s,transform .15s,box-shadow .15s}
.ev-card:hover{border-color:var(--mint-strong);transform:translateY(-2px);box-shadow:var(--shadow-soft)}
.ev-date{display:grid;align-content:center;justify-items:center;flex:none;width:58px;height:68px;border-radius:18px;background:var(--mint-soft);color:var(--mint-ink);line-height:1.15}
.ev-date strong{font-size:22px;letter-spacing:-.5px;color:var(--ink)}.ev-date small{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.ev-body{display:grid;gap:3px;min-width:0;flex:1}
.ev-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.ev-top strong{font-size:16px;line-height:1.3}
.ev-when,.ev-where{display:flex;align-items:center;gap:5px;color:var(--muted)}.ev-when{color:var(--mint-ink);font-weight:600}.ev-when .icon,.ev-where .icon{width:14px;height:14px}
.ev-meta{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:4px;font-size:12.5px;color:var(--muted)}.ev-meta>span{display:inline-flex;align-items:center;gap:4px}.ev-meta .icon{width:14px;height:14px}
.ev-hero{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:center;padding:22px;margin:6px 0 22px;border:1px solid var(--mint-line);border-radius:var(--radius-xl);background:linear-gradient(135deg,var(--mint-soft),var(--card) 70%)}
.ev-art{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:20px;background:var(--card)}
.ev-hero h1{margin:4px 0 6px}.ev-hero .actions{margin-top:14px;align-items:center}.ev-hero-copy{min-width:0}
.ev-listing{border-color:var(--mint-line)}.ev-listing.listed{background:var(--mint-soft)}.ev-listing select{max-width:380px}
.ev-foot{margin-top:18px;display:flex;gap:8px;align-items:flex-start}.ev-foot .icon{width:16px;height:16px;flex:none;margin-top:2px}
@media(max-width:760px){
 .ev-grid,.ev-grid.compact{grid-template-columns:minmax(0,1fr)}
 .ev-hero{grid-template-columns:minmax(0,1fr);padding:18px}.ev-art{max-height:170px}
 .ev-filters .chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}.ev-filters .chips::-webkit-scrollbar{display:none}.ev-filters .chip{flex:none}
 .ev-filter-row{flex-direction:column;align-items:stretch}
}

/* ===== Sandbox (test environment) banner and admin invitations ===== */
.sandbox-banner{position:relative;z-index:30;display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 16px;background:var(--mint-soft);border-bottom:1px solid var(--mint-line);color:var(--mint-ink);font-size:12.5px;line-height:1.4;text-align:center}
.sandbox-banner .icon{width:16px;height:16px;flex:none}
.main-shell>.sandbox-banner{margin:0 -36px}
.invite-made{border-color:var(--mint-line);background:var(--mint-soft)}
.reset-made p{margin:0 0 4px;color:var(--muted);line-height:1.5}
.invite-link{display:flex;gap:8px;align-items:center;margin:10px 0}.invite-link input{flex:1;min-width:0;font-size:13px}
.invite-form .field-row{max-width:420px}
@media(max-width:1200px){.main-shell>.sandbox-banner{margin:0 -26px}}
.sandbox-banner .sb-short{display:none}
@media(max-width:760px){.main-shell>.sandbox-banner{margin:0 -20px}.sandbox-banner .sb-long{display:none}.sandbox-banner .sb-short{display:inline}.invite-link{flex-direction:column;align-items:stretch}}

@media(min-width:1550px){.main-shell>.sandbox-banner{margin:0 -48px}}
/* Befrendle buttons next to club members and plan guests */
.member-actions{display:inline-flex;align-items:center;gap:8px;flex:none;margin-left:auto}
.line-item .button.small.glow{min-height:32px;padding:6px 12px;font-size:11.5px}.line-item .button.small.glow .icon{width:15px;height:15px}
@media(max-width:760px){.member-actions{gap:6px}}

/* v0.7 host tools: messages, stats, promo codes, roles; the year in review */
.ht-actions{margin-top:10px}
.ht-upsell{display:flex;gap:14px;align-items:flex-start;padding:16px;border:1px solid var(--mint-line);border-radius:18px;background:var(--mint-soft)}.ht-upsell h3{margin:0 0 4px}.ht-upsell p{margin:0 0 10px;color:var(--muted);line-height:1.5}
.ht-stats{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.ht-weeks{display:grid;grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:8px;margin:10px 0 18px}
.ht-week{display:grid;justify-items:start;gap:2px;padding:10px;border:1px solid var(--line);border-radius:14px;background:var(--card);position:relative;overflow:hidden;min-height:96px}
.ht-week strong{font-size:22px;position:relative}.ht-week small{font-size:11.5px;position:relative}.ht-week .muted{color:var(--muted)}
.ht-bar{position:absolute;left:0;right:0;bottom:0;height:var(--h,0%);background:var(--mint-soft);border-top:2px solid var(--mint)}
.ht-regulars{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 4px}
.ht-regular{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border:1px solid var(--line);border-radius:14px;background:var(--card)}.ht-regular small{color:var(--muted)}
.promo-row.off{opacity:.55}.promo-row code{font-size:14px;letter-spacing:.5px}
.promo-make{margin-top:16px;padding-top:12px;border-top:1px solid var(--line)}.promo-make h3{margin:0 0 8px}
.rh-role-picks,.rh-table-picks{display:grid;gap:8px;margin-top:12px}
.year-link{margin-top:10px}
.year-hero{padding:28px;border:1px solid var(--mint-line);border-radius:28px;background:linear-gradient(160deg,var(--mint-soft),var(--card) 70%);margin:0 0 20px}
.year-hero h1{margin:6px 0 8px;font-size:clamp(32px,5vw,52px);letter-spacing:-1.5px}.year-hero .lede{color:var(--muted);max-width:640px;line-height:1.55}
.year-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0}
.year-stats>div{padding:16px;border-radius:18px;background:var(--card);border:1px solid var(--line)}.year-stats strong{display:block;font-size:30px;letter-spacing:-.8px}.year-stats span{font-size:13px;color:var(--muted)}
.year-hero .actions{flex-wrap:wrap;align-items:center}
@media(max-width:760px){.year-hero{padding:20px;border-radius:22px}.year-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.ht-upsell{flex-direction:column}}
.admin-video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-bottom:14px}
.admin-video h3{margin:4px 0 8px}.admin-video .cap-pill{margin-right:6px}
.admin-steps{display:grid;gap:6px;padding-left:20px;margin:10px 0;line-height:1.5}.admin-steps code{font-size:12px;word-break:break-all}
@media(max-width:1000px){.admin-video-grid{grid-template-columns:minmax(0,1fr)}}
/* v0.7 milestones and email */
.badge-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin-top:10px}
.milestone{display:grid;gap:2px;padding:12px;border:1px dashed var(--line);border-radius:16px;background:var(--card)}.milestone:not(.earned) .milestone-mark{filter:grayscale(1);opacity:.5}
.milestone.earned{border-style:solid;border-color:var(--mint-line);background:var(--mint-soft);opacity:1}
.milestone-mark{font-size:24px;line-height:1}.milestone strong{font-size:13.5px}.milestone small{font-size:12px;color:var(--muted)}
.email-pane .inline-form{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.email-pane .inline-form input{flex:1;min-width:200px}
.email-pane h3 .icon{color:var(--mint-strong);vertical-align:-3px}
.admin-stats.compact{grid-template-columns:repeat(3,minmax(0,1fr));margin:10px 0}
.admin-video-grid>.pane{margin:0}
/* You and someone: what you share. */
.person-link{color:inherit;text-decoration:none;border-radius:4px}.person-link:hover{color:var(--mint-ink);text-decoration:underline;text-underline-offset:3px}
.person-link:focus-visible{outline:2px solid var(--mint-strong);outline-offset:2px}
.request-why{display:block;margin-top:5px;font-size:12px;line-height:1.45;color:var(--ink)}.request-why .icon{width:13px;height:13px;color:var(--mint-strong);vertical-align:-2px}
.request-why .text-link{font-size:12px;margin-left:2px}
.person-head{display:flex;gap:22px;align-items:flex-start;margin:6px 0 24px}.person-head h1{font-size:30px;margin:0 0 4px}.person-head .muted{margin:0}
.person-status{display:inline-block;margin:10px 0 0;padding:4px 10px;border-radius:20px;background:var(--mint-soft);color:var(--mint-ink);font-size:12px;font-weight:600}
.person-bio{margin:12px 0 0;max-width:560px;line-height:1.55}.person-head .actions{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.common-card{border:1px solid var(--mint-line);background:var(--card);border-radius:18px;padding:24px;margin-bottom:18px}
.common-card .eyebrow{display:flex;align-items:center;gap:6px;color:var(--mint-ink)}.common-card .eyebrow .icon{width:15px;height:15px}
.common-card h2{margin:6px 0 8px}.common-why{font-size:16px;line-height:1.5;margin:0 0 6px;max-width:640px}.common-why.quiet{color:var(--muted);font-size:14px}
.common-row{padding:16px 0 4px;border-top:1px solid var(--line);margin-top:14px}.common-row h3{font-size:13px;margin:0 0 10px;font-weight:650}.common-row p{margin:6px 0;font-size:14px;line-height:1.5}
.common-row p .icon{width:15px;height:15px;color:var(--mint-strong);vertical-align:-3px;margin-right:4px}
.common-tag{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;border-radius:20px;background:var(--mint-soft);color:var(--mint-ink);border:1px solid var(--mint-line);font-size:13px;font-weight:600;text-transform:capitalize;text-decoration:none}
.common-tag .icon{width:14px;height:14px}.common-tag.linked{text-transform:none}.common-tag.linked:hover{border-color:var(--mint-strong)}
.common-people{display:flex;flex-wrap:wrap;gap:14px}.common-person{display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none;color:inherit;font-size:12px;width:58px;text-align:center}
.common-person:hover span{color:var(--mint-ink);text-decoration:underline}
.common-facts{margin-top:14px}.person-safety{display:flex;flex-wrap:wrap;gap:4px 14px;margin:8px 0 30px}.person-safety .text-button{font-size:12px;color:var(--muted)}
.person-safety .danger-text{color:var(--danger)}
@media(max-width:600px){.person-head{flex-direction:column;gap:14px}.person-head h1{font-size:25px}.common-card{padding:18px}.person-head .actions .button{flex:1 1 auto}}
/* After the hangout: "Same people, next week?" and the people you met. */
#after-hangout:empty{display:none}#after-hangout{display:grid;gap:14px;margin:0 0 22px}
.after-card{border:1px solid var(--mint-line);background:linear-gradient(180deg,var(--mint-soft),var(--card) 70%);border-radius:18px;padding:20px 22px}
.after-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.after-head h3{margin:6px 0 4px;font-size:19px}
.after-head .eyebrow{display:flex;align-items:center;gap:6px;color:var(--mint-ink)}.after-head .eyebrow .icon{width:15px;height:15px}
.after-again{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin-top:10px;padding:14px 16px;border-radius:14px;background:var(--card);border:1px solid var(--line)}
.after-again>span{font-weight:650;font-size:15px}.after-again .actions{display:flex;flex-wrap:wrap;gap:8px}
.after-again.done p{margin:0;flex:1;min-width:180px;font-size:14px;line-height:1.5}.after-again.done .icon{width:17px;height:17px;color:var(--mint-strong);vertical-align:-3px}
.after-met{margin-top:14px}.after-met h4{margin:0 0 8px;font-size:13px;font-weight:650;color:var(--muted)}
.after-person{display:flex;align-items:center;gap:10px;padding:6px 0}.after-person .avatar{flex:none}.after-name{flex:1;font-weight:600;font-size:14px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.after-on-plan{margin-top:6px}
@media(max-width:600px){.after-card{padding:16px}.after-again{flex-direction:column;align-items:stretch}.after-again .actions .button{flex:1 1 auto}}
/* Small tables before a big night. */
.plan-tables{margin-top:18px}.plan-tables h3{margin:6px 0 6px}.plan-tables p{margin:0 0 12px;line-height:1.55}
.plan-tables .eyebrow{display:flex;align-items:center;gap:6px;color:var(--mint-ink)}.plan-tables .eyebrow .icon{width:15px;height:15px}
.tables-host+.tables-mine{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.tables-host .inline-form,.tables-mine .inline-form{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.tables-host select{width:auto}
.table-plan{display:grid;gap:8px;margin:4px 0 14px}.table-row{display:grid;grid-template-columns:70px auto 1fr;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.table-row small{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.table-people{display:flex;flex-wrap:wrap;gap:8px 14px;margin:4px 0 12px}.table-person{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14px}
.table-chat{max-height:280px;overflow-y:auto;border:1px solid var(--line);border-radius:14px;padding:10px 12px;margin-bottom:10px;background:var(--surface)}
.table-msg{margin:6px 0;font-size:14px;line-height:1.45;overflow-wrap:anywhere}.table-msg small{color:var(--muted);font-size:11px;margin-left:4px}
.table-msg.mine strong{color:var(--mint-ink)}.table-msg .text-button.tiny{font-size:11px;padding:0 4px;margin-left:4px;color:var(--muted)}
.tables-mine .inline-form input{flex:1;min-width:180px}
@media(max-width:600px){.table-row{grid-template-columns:60px 1fr}.table-row small{grid-column:1/-1}}
/* For any plan: a message to everyone, questions when you say yes, and a shared album. */
.plan-tools{margin-top:18px;display:grid;gap:20px}.plan-tools>div+div{padding-top:18px;border-top:1px solid var(--line)}
.plan-tools h3{margin:6px 0 8px}.plan-tools .eyebrow{display:flex;align-items:center;gap:6px;color:var(--mint-ink)}.plan-tools .eyebrow .icon{width:15px;height:15px}
.plan-tools .actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:6px}
.tools-guest .field{margin-bottom:10px}.tools-guest form small{margin-left:8px}
.tools-album .section-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 0 10px}.tools-album .section-head h3{margin:0}
.album-add{cursor:pointer}.album-add input{display:none}
.album-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;margin-bottom:8px}
.album-thumb{padding:0;border:0;border-radius:12px;overflow:hidden;background:var(--surface);cursor:zoom-in;max-height:200px}
.album-thumb img{width:100%;height:100%;object-fit:cover;display:block}.album-thumb:focus-visible{outline:2px solid var(--mint-strong);outline-offset:2px}
.album-full{margin:0}.album-full img{width:100%;max-height:70vh;object-fit:contain;border-radius:12px;background:var(--surface)}.album-full figcaption{margin-top:8px;font-size:14px}
.answer-list{display:grid;gap:10px}.answer-card{border:1px solid var(--line);border-radius:12px;padding:12px 14px}.answer-card p{margin:8px 0 0;font-size:14px}
.after-photos{margin:12px 0 0}
/* The current menu tab: a green outline around its icon, instead of filling the whole tab. */
.rail .nav-link .icon,.mobile-nav .nav-link .icon{box-sizing:content-box;border-radius:30%;border:1.5px solid transparent;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease,color .15s ease}
.rail .nav-link .icon{padding:5px;margin:-7px 0}
.mobile-nav .nav-link .icon{padding:4px}
.rail .nav-link.active,body[data-theme=dark] .rail .nav-link.active,.mobile-nav .nav-link.active,body[data-theme=dark] .mobile-nav .nav-link.active{background:transparent;color:var(--ink);font-weight:650}
.rail .nav-link.active .icon,.mobile-nav .nav-link.active .icon{border-color:var(--mint-strong);background:var(--mint-soft);color:var(--mint-ink);box-shadow:0 0 0 3px color-mix(in srgb,var(--mint-strong) 16%,transparent)}
.rail .nav-link:active .icon,.mobile-nav .nav-link:active .icon{border-color:var(--mint-strong)}
/* Keyboard focus stays visible, on the icon too. */
.rail .nav-link:focus-visible,.mobile-nav .nav-link:focus-visible{outline:none}
.rail .nav-link:focus-visible .icon,.mobile-nav .nav-link:focus-visible .icon{border-color:var(--mint-strong);box-shadow:0 0 0 3px color-mix(in srgb,var(--mint-strong) 32%,transparent)}
/* Photos and voice notes in chats. */
.chat-attach{cursor:pointer;flex:none}.chat-attach input{display:none}
.bubble.has-media{max-width:min(320px,78vw)}
.chat-photo{display:block;padding:0;border:0;border-radius:14px;overflow:hidden;width:min(260px,64vw);max-height:340px;background:var(--surface);cursor:zoom-in;margin:4px 0}
.chat-photo img{width:100%;height:100%;object-fit:cover;display:block}
.voice-note{--p:0%;display:flex;align-items:center;gap:10px;min-width:200px;padding:8px 12px 8px 8px;margin:4px 0;border:1px solid var(--mint-line);border-radius:999px;background:var(--mint-soft);color:var(--mint-ink);font-weight:650;cursor:pointer}
.voice-note .icon{width:30px;height:30px;padding:7px;border-radius:30%;background:var(--mint);color:#11271c;flex:none}
.voice-note.loading .icon{opacity:.5}
.voice-bar{flex:1;height:6px;border-radius:6px;background:color-mix(in srgb,var(--mint-strong) 25%,transparent);overflow:hidden}.voice-bar i{display:block;height:100%;width:var(--p);background:var(--mint-strong);border-radius:6px;transition:width .2s linear}
.voice-time{font-size:12px;font-variant-numeric:tabular-nums}
.voice-recorder{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;margin:0 0 8px;border:1px solid var(--mint-line);border-radius:16px;background:var(--mint-soft);color:var(--ink);font-weight:600}
.voice-recorder>span:nth-child(2){flex:1}.voice-recorder time{font-variant-numeric:tabular-nums}
.rec-dot{width:10px;height:10px;border-radius:50%;background:#d64545;animation:rec-pulse 1.2s ease-in-out infinite}
@keyframes rec-pulse{50%{opacity:.35}}@media(prefers-reduced-motion:reduce){.rec-dot{animation:none}}
/* Your first week: Get started. */
.get-started{border:1px solid var(--mint-line);background:linear-gradient(180deg,var(--mint-soft),var(--card) 75%);border-radius:20px;padding:22px 24px;margin:0 0 24px}
.start-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.start-head h2{margin:6px 0 0;font-size:22px}
.start-head .eyebrow{display:flex;align-items:center;gap:6px;color:var(--mint-ink)}.start-head .eyebrow .icon{width:15px;height:15px}
.start-progress{height:6px;border-radius:6px;background:color-mix(in srgb,var(--mint-strong) 18%,transparent);margin:14px 0 6px;overflow:hidden}.start-progress i{display:block;height:100%;background:var(--mint-strong);border-radius:6px}
.start-steps{list-style:none;margin:0;padding:0;display:grid}
.start-step{display:grid;grid-template-columns:30px 1fr auto;gap:12px;align-items:center;padding:14px 0;border-top:1px solid var(--line)}.start-step:first-child{border-top:0}
.start-check{width:26px;height:26px;border-radius:30%;border:2px solid var(--mint-line);display:grid;place-items:center;background:var(--card)}
.start-step.done .start-check{background:var(--mint);border-color:var(--mint-strong)}.start-check .icon{width:15px;height:15px;color:#11271c}
.start-copy strong{display:block;font-size:15px}.start-copy small{color:var(--muted);font-size:12.5px;line-height:1.4}
.start-step.done .start-copy strong{color:var(--muted)}
.start-act{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.start-tags{border:0;padding:0;margin:0 0 12px}.start-tags legend{font-weight:650;font-size:13px;margin-bottom:6px}
@media(max-width:600px){.get-started{padding:18px}.start-step{grid-template-columns:28px 1fr}.start-act{grid-column:2;justify-content:flex-start}}
.home-week{margin:0 0 22px}
/* The menu's long tail, folded. */
.rail-more summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;user-select:none;border-radius:8px}
.rail-more summary::-webkit-details-marker{display:none}
.rail-more summary .icon{width:13px;height:13px;transition:transform .15s ease;transform:rotate(90deg)}.rail-more[open] summary .icon{transform:rotate(-90deg)}
.rail-more summary:focus-visible{outline:2px solid var(--mint-strong);outline-offset:2px}
/* The plan page: Plan, Photos and Host tools, with the chat one tap away. */
.plan-tabbar{display:flex;gap:4px;flex-wrap:wrap;align-items:center;margin:16px 0 14px;padding:5px;border:1px solid var(--line);border-radius:16px;background:var(--surface);width:max-content;max-width:100%}
.plan-tabbar .tab{display:inline-flex;align-items:center;gap:6px;min-height:0;padding:8px 14px;border-radius:12px;border:0;background:transparent;box-shadow:none;color:var(--muted);font-weight:600;font-size:13.5px;text-decoration:none;cursor:pointer}
.plan-tablist{display:flex;gap:4px;flex-wrap:wrap;align-items:center}.plan-tabbar .tab .icon{width:15px;height:15px}.plan-tabbar .tab:hover{color:var(--ink)}
.plan-tabbar .tab[aria-selected=true]{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--mint-strong)}
.plan-tabbar .tab[aria-selected=true] .icon{color:var(--mint-ink)}
.plan-panel{display:grid;gap:18px}.plan-panel:empty{display:none}
@media(max-width:600px){.plan-tabbar{width:100%;flex-wrap:nowrap;overflow-x:auto}.plan-tablist{flex-wrap:nowrap}.plan-tabbar .tab{flex:none}}
.plan-panel[hidden],.plan-tabbar [hidden]{display:none!important}
.start-done{display:flex;flex-wrap:wrap;gap:6px 8px;margin:10px 0 0}.start-done span{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:20px;background:var(--mint-soft);border:1px solid var(--mint-line);color:var(--mint-ink);font-size:12px;font-weight:600}
.start-done .icon{width:13px;height:13px}.start-step{padding:11px 0}
/* Profiles with personality. */
.about-card{margin-bottom:18px}.about-card .eyebrow{display:flex;align-items:center;gap:6px;color:var(--mint-ink);margin-bottom:10px}.about-card .eyebrow .icon{width:15px;height:15px}
.prompt-cards{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.prompt-card{border:1px solid var(--mint-line);background:var(--mint-soft);border-radius:16px;padding:14px 16px}
.prompt-card small{display:block;color:var(--mint-ink);font-weight:650;font-size:12.5px;margin-bottom:4px}.prompt-card p{margin:0;font-size:15.5px;line-height:1.45;overflow-wrap:anywhere}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin-top:12px}
.gallery-thumb,.gallery-item{position:relative;padding:0;border:0;border-radius:14px;overflow:hidden;background:var(--surface);max-height:220px;min-height:110px}
.gallery-thumb{cursor:zoom-in}.gallery-thumb img,.gallery-item img{width:100%;height:100%;object-fit:cover;display:block}
.gallery-item .badge{position:absolute;left:6px;bottom:6px}.gallery-item .icon-button{position:absolute;right:6px;top:6px;width:30px;height:30px;background:var(--card)}
.gallery-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:130px;border:2px dashed var(--mint-line);border-radius:14px;color:var(--mint-ink);font-weight:600;font-size:13px;cursor:pointer}
.gallery-add input{display:none}.about-edit h4{margin:18px 0 0;font-size:14px}
.prompt-edit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:8px;margin-bottom:8px}
@media(max-width:600px){.prompt-edit{grid-template-columns:1fr}}
/* Calmer notifications. */
.quiet-hours{display:grid;gap:6px;padding:10px 0;border-top:1px solid var(--line);margin-top:6px}.quiet-times{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px}
.quiet-times input{width:auto;padding:8px 10px}.note-more{color:var(--mint-ink);font-weight:650}
/* Instant chat: replies, reactions, "typing…", "Seen" and unread counts */
.bubble-wrap{position:relative}
.bubble-col{display:flex;flex-direction:column;align-items:flex-start;min-width:0;max-width:100%}
.mine .bubble-col{align-items:flex-end}
.msg-tools{display:flex;gap:2px;align-self:center;flex:none;opacity:0;transition:opacity .15s}
.mine .msg-tools{order:-1}
.bubble-wrap:hover .msg-tools,.bubble-wrap:focus-within .msg-tools{opacity:1}
.msg-tools .icon-button{width:30px;height:30px;min-height:0;border-radius:10px;background:transparent;border:0;color:var(--muted)}
.msg-tools .icon-button:hover,.msg-tools .icon-button:focus-visible{background:var(--surface);color:var(--ink)}
.msg-tools .icon{width:17px;height:17px}
@media(hover:none){.msg-tools{opacity:.6}}
.reply-quote{display:flex;align-items:flex-start;gap:6px;width:100%;min-width:140px;margin:0 0 8px;padding:6px 9px;border:0;border-left:3px solid var(--mint-strong);border-radius:8px;background:#00000009;color:inherit;font-size:12px;line-height:1.4;text-align:left;cursor:pointer}
.mine .reply-quote{border-left-color:#17432a66;background:#0000000d}
.reply-quote>span{overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
.reply-quote .icon{width:13px;height:13px;flex:none;margin-top:2px;opacity:.6}
.bubble .reply-quote strong{display:inline;font-size:12px;margin:0}
.reply-quote.gone{cursor:default;font-style:italic;opacity:.7}
.reaction-row{display:flex;flex-wrap:wrap;gap:4px;margin-top:-7px;padding:0 10px;position:relative;z-index:1}
.reaction-row[hidden]{display:none}
.reaction-chip{display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 8px;border-radius:13px;border:1px solid var(--line);background:var(--card);color:var(--ink);font-size:13px;line-height:1;box-shadow:0 1px 2px #0000000f;cursor:pointer}
.reaction-chip span{font-size:11px;font-weight:650;color:var(--muted)}
.reaction-chip.mine{border-color:var(--mint-strong);background:var(--mint-soft)}
.reaction-chip.mine span{color:var(--mint-ink)}
.react-pop{position:absolute;bottom:calc(100% - 2px);left:40px;z-index:30;display:flex;gap:2px;padding:5px;border-radius:14px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-lift)}
.mine .react-pop{left:auto;right:0}
.react-pop button{display:grid;place-items:center;width:38px;height:38px;border:0;border-radius:10px;background:transparent;font-size:21px;line-height:1;cursor:pointer;color:var(--muted)}
.react-pop button:hover,.react-pop button:focus-visible{background:var(--surface)}
.react-pop .react-more .icon{width:17px;height:17px}
.seen-line{display:flex;align-items:center;gap:4px;margin-top:5px;padding:0 4px;font-size:10.5px;color:var(--muted)}
.seen-line .icon{width:12px;height:12px;color:var(--mint-strong)}
.typing-line{display:flex;align-items:center;gap:8px;min-height:22px;padding:2px 4px 0;font-size:11.5px;color:var(--muted)}
.typing-line[hidden]{display:none}
.typing-dots{display:inline-flex;gap:3px}
.typing-dots i{width:5px;height:5px;border-radius:50%;background:currentColor;animation:bf-typing 1.2s infinite ease-in-out}
.typing-dots i:nth-child(2){animation-delay:.15s}.typing-dots i:nth-child(3){animation-delay:.3s}
@keyframes bf-typing{0%,60%,100%{opacity:.25;transform:none}30%{opacity:1;transform:translateY(-3px)}}
.reply-bar{display:flex;align-items:center;gap:10px;margin-top:6px;padding:8px 8px 8px 12px;border-radius:14px;background:var(--mint-soft);border:1px solid var(--mint-line);font-size:12px}
.reply-bar>.icon{width:15px;height:15px;flex:none;color:var(--mint-ink)}
.reply-bar>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reply-bar em{font-style:normal;color:var(--muted)}
.reply-bar .icon-button{width:30px;height:30px;min-height:0;flex:none}
.bubble-wrap.flash .bubble{animation:bf-flash 1.6s ease}
@keyframes bf-flash{0%,45%{box-shadow:0 0 0 3px var(--mint-strong)}100%{box-shadow:0 0 0 0 transparent}}
.connection-status{display:flex;align-items:center;justify-content:center;gap:6px}
.chat-row.unread strong{font-weight:700}
.chat-row.unread p{color:var(--ink)}
.unread-count{display:grid;place-items:center;flex:none;min-width:22px;height:22px;padding:0 6px;border-radius:8px;background:var(--mint);color:#0f2a1b;font:700 11px/1 system-ui,sans-serif;font-style:normal}
@media(prefers-reduced-motion:reduce){.typing-dots i,.bubble-wrap.flash .bubble{animation:none}}
/* City search: an approximate area, never an address */
.place-field{position:relative}
.place-box{position:relative;display:flex;align-items:center}
.place-box>.icon{position:absolute;left:14px;width:16px;height:16px;color:var(--muted);pointer-events:none}
.place-box input[data-place-input]{padding-left:38px;padding-right:44px}
.place-clear{position:absolute;right:6px;width:32px;height:32px;min-height:0;border:0;background:transparent;color:var(--muted)}
.place-clear[hidden]{display:none}
.place-list{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:40;margin:0;padding:6px;list-style:none;max-height:320px;overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-lift)}
.place-list[hidden]{display:none}
.place-list [role=option]{display:flex;flex-direction:column;gap:1px;padding:9px 11px;border-radius:10px;cursor:pointer}
.place-list [role=option] strong{font-size:14px;font-weight:600}
.place-list [role=option] small{font-size:11.5px;color:var(--muted)}
.place-list [role=option][aria-selected=true],.place-list [role=option]:hover{background:var(--mint-soft)}
.place-none{padding:10px 12px;font-size:12.5px;color:var(--muted)}
.place-unpicked input[data-place-input]{border-color:#e0b24a}
.place-unpicked .place-box::after{content:"Pick your city from the list";position:absolute;right:44px;font-size:11px;color:#8a6a1f;pointer-events:none}
.place-field.compact{margin:0;min-width:240px;max-width:340px;flex:1}
.place-field.compact input[data-place-input]{padding-top:9px;padding-bottom:9px;border-radius:999px}
.ev-near{display:flex;flex:1 1 260px}
/* The Chats page: filters, search, sorting, pins and an archive */
.list-tools{display:flex;gap:10px;align-items:center;margin-bottom:12px}
.list-search{flex:1}
.list-search .icon{width:16px;height:16px;color:var(--muted)}
.list-sort{position:relative;display:flex;align-items:center;flex:none;margin:0}
.list-sort>.icon{position:absolute;left:13px;width:16px;height:16px;color:var(--muted);pointer-events:none}
.list-sort select{width:auto;padding:10px 30px 10px 37px;border-radius:999px;font-size:13px;background-color:var(--card)}
.chat-filters{display:flex;gap:8px;margin:0 0 16px;flex-wrap:wrap}
.chip-count{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:7px;padding:0 5px;border-radius:7px;background:var(--surface);color:var(--muted);font:700 10.5px/1 system-ui,sans-serif}
.chip.active .chip-count{background:#ffffff8c;color:#0f2a1b}
.chat-list-page .chat-list{overflow:visible}
.chat-list-page .chat-row{position:relative;padding:0;gap:0}
.chat-list-page .chat-row:first-child{border-radius:23px 23px 0 0}.chat-list-page .chat-row:last-child{border-radius:0 0 23px 23px}.chat-list-page .chat-row:only-child{border-radius:23px}
.chat-link{display:flex;align-items:center;gap:15px;flex:1;min-width:0;padding:20px 6px 20px 22px;color:inherit;border-radius:inherit}
.chat-link:focus-visible{outline:2px solid var(--mint-strong);outline-offset:-2px}
.chat-link .item-copy{flex:1;min-width:0}
.chat-row .chat-more{flex:none;width:36px;height:36px;min-height:0;margin-right:12px;border:0;background:transparent;color:var(--muted)}
.chat-row .chat-more:hover,.chat-row .chat-more:focus-visible{background:var(--card);color:var(--ink)}
.pin-mark{display:inline-flex;vertical-align:-2px;margin-left:7px;color:var(--mint-strong)}.pin-mark .icon{width:14px;height:14px}
.chat-row strong .badge{margin-left:8px;font-size:10px;vertical-align:1px}
.list-section-label{display:flex;align-items:center;gap:6px;margin:18px 4px 8px;font-size:10.5px;font-weight:650;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.list-section-label .icon{width:14px;height:14px}
.list-section-label:first-child{margin-top:0}
.list-more{display:flex;margin:14px auto 0}
.chat-earlier{margin-top:20px}
.chat-earlier summary{display:flex;align-items:center;gap:8px;padding:10px 4px;font-size:13px;font-weight:600;list-style:none;cursor:pointer}
.chat-earlier summary::-webkit-details-marker{display:none}
.chat-earlier summary::before{content:"›";display:inline-block;width:12px;font-size:18px;line-height:1;transition:transform .15s}
.chat-earlier[open] summary::before{transform:rotate(90deg)}
.chat-earlier .small-note{margin:0 4px 10px}
.chat-menu{position:absolute;right:12px;top:calc(100% - 8px);z-index:30;min-width:200px;padding:6px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-lift)}
.chat-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:10px;background:transparent;color:var(--ink);font-size:13px;text-align:left;cursor:pointer}
.chat-menu button:hover,.chat-menu button:focus-visible{background:var(--mint-soft)}
.chat-menu .icon{width:16px;height:16px;color:var(--muted)}
.list-empty{display:flex;flex-direction:column;align-items:center;gap:10px;padding:40px 20px;border:1px dashed var(--line);border-radius:20px;color:var(--muted);text-align:center;font-size:13px}
.list-empty>.icon{width:26px;height:26px;color:var(--mint-strong)}
.list-empty strong{color:var(--ink)}
@media(max-width:700px){
 .list-tools{flex-wrap:wrap}.list-search{flex-basis:100%}
 .chat-filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-20px;padding-right:20px}.chat-filters::-webkit-scrollbar{display:none}
 .chat-filters .chip{flex:none}
 .chat-list-page .chat-link{gap:10px;padding:15px 2px 15px 14px}
 .chat-row .chat-more{margin-right:6px}
}

.chat-list-page.few .list-tools,.chat-list-page.few .chat-filters{display:none}
/* Your rooms: the same tools as Chats, with time sections */
.list-filters{display:flex;gap:8px;margin:0 0 16px;flex-wrap:wrap}
.list-filters .chip .live-dot{margin-right:2px}
.rooms-root.few .list-tools,.rooms-root.few .list-filters{display:none}
.rooms-root .list-section-label{gap:8px}
.rooms-root .room-list+.list-section-label{margin-top:24px}
.list-tools .list-sort select{max-width:190px}
@media(max-width:700px){
 .list-filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-20px;padding-right:20px}.list-filters::-webkit-scrollbar{display:none}
 .list-filters .chip{flex:none}
 .list-tools .list-sort{flex:1}.list-tools .list-sort select{width:100%;max-width:none}
}
/* After a hangout: a private word */
.after-word{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.after-word h4{display:flex;align-items:center;gap:6px;font-size:13px}
.after-word h4 .icon{width:14px;height:14px;color:var(--mint-strong)}
.after-word>.small-note{margin:4px 0 8px}
.word-row{display:flex;align-items:center;gap:10px;padding:7px 0;flex-wrap:wrap}
.word-row .avatar{flex:none}
.word-row .after-name{min-width:64px;font-size:13px;font-weight:600}
.word-options{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-left:auto}
.word-chip{height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink);font-size:12.5px;cursor:pointer}
.word-chip:hover{border-color:var(--mint-strong)}
.word-chip.chosen{background:var(--mint);border-color:var(--mint);color:#0f2a1b;font-weight:600}
.word-noshow{font-size:12px;color:var(--muted)}
.word-noshow.chosen{color:var(--ink);font-weight:600;text-decoration:underline}
/* Share my plan with someone I trust */
.trusted-card .trusted-shared{display:flex;align-items:center;gap:6px;margin:10px 0 0;font-size:12.5px;color:var(--mint-ink)}
.trusted-card .trusted-shared .icon{width:15px;height:15px}
.trusted-card .actions{margin-top:14px;flex-wrap:wrap}
.trusted-made .copy-row{display:flex;gap:8px;margin:12px 0}
.trusted-made .copy-row input{flex:1;font-size:13px}
.trusted-made .button.full{margin-top:4px}
.trusted-page{max-width:620px}
.trusted-page .trusted-brand{font-weight:700;color:var(--mint-ink)}
.trusted-page h1{margin:12px 0 14px}
.trusted-status{margin:18px 0;padding:14px 16px;border-radius:14px;background:var(--surface);font-size:14px}
.trusted-status.safe{background:var(--mint-soft);border:1px solid var(--mint-line);color:var(--mint-ink)}
.trusted-status.warn{background:#fff4dd;color:#6b4e12}
.trusted-facts{display:grid;grid-template-columns:auto 1fr;gap:10px 18px;margin:22px 0;padding:18px;border:1px solid var(--line);border-radius:16px}
.trusted-facts dt{font-size:11px;font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding-top:2px}
.trusted-facts dd{margin:0;font-size:14.5px}
.trusted-facts small{color:var(--muted)}
.trusted-page footer{margin-top:28px;font-size:12.5px;color:var(--muted);line-height:1.7}
@media(max-width:700px){.word-options{margin-left:0;width:100%}.trusted-facts{grid-template-columns:1fr;gap:4px}.trusted-facts dd{margin-bottom:10px}}

/* The phone apps (Capacitor, in mobile/) show this page edge to edge, under the status bar and above the home
   indicator. A strip the colour of the page sits under the status bar so content never scrolls beneath the clock. */
body.native-app::before{content:"";position:fixed;top:0;left:0;right:0;height:env(safe-area-inset-top,0px);background:var(--bg);z-index:60;pointer-events:none}
body.native-app .main-shell,body.native-app .auth-page{padding-top:env(safe-area-inset-top,0px)}
body.native-app .network-banner{top:env(safe-area-inset-top,0px)}
body.native-app{-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none}
body.native-app :is(.button,.icon-button,.nav-link,.chip,.mobile-nav a){-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
body.native-app [data-action=install-app]{display:none!important}

/* More ways to sign in (signin.js): Apple, Google and passkeys above the handle and password. */
.signin-options{display:grid;gap:10px;margin:4px 0 6px}
.provider-button{display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;border-radius:14px;font-weight:650;font-size:15px}
.provider-button .brand-logo{width:19px;height:19px;flex:none}
.provider-button.apple{background:#000;color:#fff;border:1px solid #000}
.provider-button.apple:hover{background:#1d1d1f}
.provider-button.google{background:#fff;color:#1f1f1f;border:1px solid #dadce0}
.provider-button.google:hover{background:#f8faf8}
body[data-theme=dark] .provider-button.apple{background:#fff;color:#000;border-color:#fff}
body[data-theme=dark] .provider-button.google{background:#131314;color:#e3e3e3;border-color:#8e918f}
.signin-divider{display:flex;align-items:center;gap:12px;margin:8px 0 2px;color:var(--muted);font-size:12px}
.signin-divider::before,.signin-divider::after{content:"";flex:1;height:1px;background:var(--line)}
.signin-pane .signin-method{align-items:center}
.signin-pane .signin-method>.icon,.signin-pane .signin-method>.brand-logo{width:22px;height:22px;flex:none}
.signin-pane .signin-method .brand-logo{color:var(--ink)}
.finish-signup{min-height:100dvh;background:var(--bg)}
.finish-signup .auth-form-side{min-height:100dvh}
body.native-app .finish-signup{padding-top:env(safe-area-inset-top,0px)}
.finish-signup .eyebrow .brand-logo{width:14px;height:14px;vertical-align:-2px;margin-right:4px}

/* Shareable moments (web/moments.js): story previews side by side, phone-shaped */
.moment-previews{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.moment-previews figure{margin:0;display:flex;flex-direction:column;gap:8px;align-items:center;width:min(220px,44%)}
.moment-previews img{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:16px;border:1px solid var(--line,#e3ece6);box-shadow:0 6px 18px rgba(0,0,0,.08)}
.tools-album .section-head .actions{display:flex;gap:8px;flex-wrap:wrap}
.contacts-find{margin-top:12px;display:flex;flex-direction:column;gap:8px}.contact-match{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:6px 0}

/* Admin → Growth (backend/analytics.py) */
.growth-table{width:100%;border-collapse:collapse;font-size:.95rem}.growth-table th,.growth-table td{padding:8px 10px;border-bottom:1px solid var(--line,#e3ece6);text-align:left;white-space:nowrap}
.growth-cell{position:relative;min-width:120px}.growth-bar{position:absolute;inset:0 auto 0 0;background:#d9f5e6;border-radius:6px;z-index:0}.growth-cell span:last-child{position:relative;z-index:1;padding-left:6px}
.table-scroll{overflow-x:auto}

/* The chat composer on small phones: photo, voice note and emoji wait behind + (a tray above the box when open) */
.composer-more{display:none}.composer-extras{display:contents}
@media (max-width:480px){
 .composer{position:relative;align-items:flex-end}.composer-more{display:inline-flex;flex:none}
 .composer>textarea{flex:1 1 0;width:auto;min-width:0}.composer>button[type=submit]{flex:none}
 .composer-extras{display:none;position:absolute;bottom:calc(100% + 8px);left:0;z-index:5;gap:10px;padding:8px;background:#fff;
  border:1px solid var(--line,#e3ece6);border-radius:18px;box-shadow:0 8px 24px rgba(17,39,28,.12)}
 .composer.extras-open .composer-extras{display:flex}
 .composer.extras-open .composer-more svg{transform:rotate(45deg)}.composer-more svg{transition:transform .15s}
}

/* The safety center at the top of Privacy & safety */
.safety-center{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-bottom:20px}
.safety-center h3{display:flex;align-items:center;gap:8px}.safety-tips{margin:8px 0 0;padding-left:18px;line-height:1.55}.safety-tips li{margin-bottom:6px}
/* A page heading the app moves the screen reader to: no ring, it isn't something to press. */
#view h1[tabindex="-1"]:focus{outline:none}
/* Choosing the language (web/i18n.js). */
.language-pick{display:flex;align-items:center;gap:10px;margin-top:14px;font-weight:600;font-size:14px}.language-pick select{margin-left:auto;min-width:150px}
.language-links{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px;margin-top:14px;font-size:13px}.language-links a{color:var(--muted);text-decoration:underline;text-underline-offset:3px}.language-links a[aria-current]{color:var(--ink);text-decoration:none;font-weight:600}
