:root{
  --bg:#F1C4E4; --band:#F0F4AE; --mauve:#D69DC5; --surface:#FFFBF2; --surface2:#F9E4F2;
  --ink:#4B1A42; --muted:#6B3D62; --line:#CB8FBA; --plum:#792C61; --stroke:#F0F4AE;
  --brand:#792C61; --brand-ink:#FFFBF2; --brand-soft:#EFB5DC;
  --teal:#7FC6B6; --coral:#E4614A;
  --ok:#1B6553; --ok-bg:#C7EADF; --care:#655000; --care-bg:#F7E9A6; --ask:#9F2E1C; --ask-bg:#FAD3C8; --avoid-bg:#4B1A42;
  --derm:#792C61; --derm-bg:#F0F4AE;
  --shadow:4px 4px 0 rgba(121,44,97,.38);
  --display:'Passion One','Arial Black',Impact,system-ui,sans-serif;
  --serif:'Fraunces',Georgia,'Times New Roman',serif;
  --hand:'Patrick Hand','Comic Sans MS','Segoe Print',cursive,sans-serif;
  --body:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  color-scheme:light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#2A1031; --band:#33371C; --mauve:#4D2758; --surface:#3A1B44; --surface2:#46224F;
    --ink:#F8E4F1; --muted:#D3AECB; --line:#6A3F76; --plum:#F1C4E4; --stroke:#F0F4AE;
    --brand:#F1C4E4; --brand-ink:#2A1031; --brand-soft:#54295F;
    --ok:#8FE0CB; --ok-bg:#17403A; --care:#F0F4AE; --care-bg:#4A461A; --ask:#FFA793; --ask-bg:#52251C; --avoid-bg:#B5346F;
    --derm:#F0F4AE; --derm-bg:#3F4220;
    --shadow:4px 4px 0 rgba(0,0,0,.4);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#2A1031; --band:#33371C; --mauve:#4D2758; --surface:#3A1B44; --surface2:#46224F;
  --ink:#F8E4F1; --muted:#D3AECB; --line:#6A3F76; --plum:#F1C4E4; --stroke:#F0F4AE;
  --brand:#F1C4E4; --brand-ink:#2A1031; --brand-soft:#54295F;
  --ok:#8FE0CB; --ok-bg:#17403A; --care:#F0F4AE; --care-bg:#4A461A; --ask:#FFA793; --ask-bg:#52251C; --avoid-bg:#B5346F;
  --derm:#F0F4AE; --derm-bg:#3F4220;
  --shadow:4px 4px 0 rgba(0,0,0,.4);
  color-scheme:dark;
}
html{scroll-padding-top:env(safe-area-inset-top,0px);-webkit-text-size-adjust:100%}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.02rem/1.6 var(--body);min-height:100%;overflow-x:hidden}
h1,h2{font-family:var(--display);font-weight:700;line-height:1;margin:0;letter-spacing:-.005em;color:var(--plum);text-wrap:balance}
h1{font-size:clamp(2.2rem,5.4vw,3.2rem)}
h2{font-size:clamp(1.7rem,4vw,2.3rem)}
h3{font-family:var(--body);font-weight:700;font-size:1.06rem;line-height:1.25;margin:0;color:var(--ink)}
p{margin:0}
a{color:var(--plum);text-underline-offset:3px}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--plum);outline-offset:2px;border-radius:4px}
.wrap{max-width:1100px;margin:0 auto;padding:0 22px}
.page{padding-top:32px;padding-bottom:70px}
main{outline:none;display:block}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* brush stroke */
.stroke{display:block;width:100%;height:16px;color:var(--stroke)}
.pagehead h1::after{content:"";display:block;height:12px;width:min(300px,62%);margin-top:12px;border-radius:8px;background:var(--stroke);transform:rotate(-.7deg)}

/* header */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:2px solid var(--plum)}
.top .wrap{display:flex;align-items:center;gap:18px;min-height:64px}
.brand{display:flex;align-items:center;text-decoration:none;color:var(--plum);font:700 1.4rem/1 var(--display);white-space:nowrap}
.brand svg{flex:none}
nav{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;margin-left:auto;padding:8px 0}
nav::-webkit-scrollbar{display:none}
nav a{white-space:nowrap;text-decoration:none;color:var(--ink);font-weight:600;padding:7px 11px;border-radius:999px}
nav a:hover{background:var(--surface)}
nav a[aria-current="page"]{background:var(--plum);color:var(--brand-ink)}
#acct{display:flex;align-items:center;gap:8px;flex:none}
@media (max-width:820px){.top .wrap{flex-wrap:wrap;gap:0 12px}.brand{padding:10px 0 0;flex:1}#acct{order:2;padding-top:8px}nav{order:3;width:100%;margin-left:-6px;padding-bottom:8px}}

/* buttons, pills */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:999px;border:2px solid var(--plum);background:transparent;color:var(--plum);font-weight:700;text-decoration:none;cursor:pointer}
.btn:hover{background:var(--surface)}
.btn.primary{background:var(--plum);border-color:var(--plum);color:var(--brand-ink)}
.btn.primary:hover{filter:brightness(1.15);background:var(--plum)}
.btn.ghost{border-color:transparent;text-decoration:underline}
.btn.small{min-height:38px;padding:0 15px;font-size:.92rem}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.pill{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:.8rem;line-height:1;padding:4px 10px 4px 5px;border-radius:999px;color:var(--c);background:var(--cb);white-space:nowrap}
.pill i{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:.72rem;background:var(--c);color:var(--cb)}
.lv-ok{--c:var(--ok);--cb:var(--ok-bg)}
.lv-care{--c:var(--care);--cb:var(--care-bg)}
.lv-ask{--c:var(--ask);--cb:var(--ask-bg)}
.lv-avoid{--c:#fff;--cb:var(--avoid-bg)}
.lv-none{--c:var(--muted);--cb:var(--surface2)}
.pill.lv-none{box-shadow:inset 0 0 0 1px var(--line);padding-left:10px}
.pill.lv-none i,.mini.lv-none i{display:none}
.tag{display:inline-block;font-size:.8rem;font-weight:600;padding:2px 9px;border-radius:6px;background:var(--surface2);border:1px solid var(--line);color:var(--muted)}
.tag.derm{background:var(--plum);border-color:var(--plum);color:var(--brand-ink);font-weight:700}

/* sections and waves */
.sec{position:relative}
.sec .wave{position:absolute;left:0;right:0;top:1px;width:100%;height:64px;transform:translateY(-100%);pointer-events:none;color:var(--sc)}
.sec--mauve{--sc:var(--mauve);background:var(--mauve)}
.sec--band{--sc:var(--band);background:var(--band);--stroke:var(--mauve)}
.sec--pink{--sc:var(--bg);background:var(--bg)}
.sec--mauve{--stroke:var(--bg)}

/* hero */
.hero{padding:44px 0 70px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:center}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr;gap:34px}}
.hero h1{font-size:clamp(3.6rem,11vw,7rem);line-height:.86;letter-spacing:-.01em}
.hero h1 .whats{display:block;font:italic 400 clamp(1.9rem,5vw,3rem)/1.1 var(--serif);letter-spacing:-.01em;margin-bottom:6px}
.hero .stroke{margin:22px 0 22px;max-width:520px}
.tagline{font-size:1.2rem;max-width:26em}
.cta-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.hero-art{position:relative;max-width:380px;width:100%;justify-self:center;padding:26px 0}
.hero-art .blob{position:absolute;left:4%;right:4%;top:0;bottom:0;width:92%;height:100%;color:var(--mauve)}
.bottle{display:block;width:78%;height:auto;position:relative;margin:0 auto}

/* try band */
.try-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center;padding-top:52px;padding-bottom:76px}
@media (max-width:860px){.try-grid{grid-template-columns:1fr;gap:26px;padding-top:34px;padding-bottom:60px}}
.sec .lede{margin-top:18px;max-width:30em}
.sec .stroke.s{margin-top:16px;max-width:300px}
.label{background:var(--surface);border:2px solid var(--plum);border-radius:6px;padding:22px 24px;box-shadow:5px 5px 0 rgba(121,44,97,.55)}
.label-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-bottom:2px solid var(--plum);padding-bottom:8px;margin-bottom:12px;font:700 1.6rem/1 var(--display);color:var(--plum)}
.label-h span{font:500 .82rem var(--body);color:var(--muted)}
.label p{font-size:1.05rem;line-height:2}
.ig{background:none;border:0;border-bottom:1.5px dotted var(--muted);padding:1px 3px;margin:0;cursor:pointer;color:var(--ink);font:inherit;border-radius:3px}
.ig:hover{background:var(--brand-soft)}
.ig[aria-pressed="true"]{background:var(--plum);color:var(--brand-ink);border-bottom-color:transparent}
.explain{margin-top:18px;padding:16px 18px;border-radius:10px;background:var(--surface);border:2px solid var(--plum);min-height:122px}
.explain h3{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin-bottom:6px;font-size:1.1rem}
.explain .hintline{color:var(--muted);font-size:.86rem;margin-top:10px}

/* why band */
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding-top:56px;padding-bottom:80px}
@media (max-width:860px){.why-grid{grid-template-columns:1fr;gap:34px;padding-top:40px;padding-bottom:64px}}
.blobwrap{position:relative;max-width:440px;width:100%;justify-self:center;padding:34px 30px}
.blobwrap .blob{position:absolute;inset:0;width:100%;height:100%;color:var(--mauve)}
.check-card{position:relative;background:var(--surface);border:2px solid var(--plum);border-radius:6px;padding:22px 24px 20px;box-shadow:5px 5px 0 rgba(121,44,97,.6);font-family:var(--hand)}
.check-card h3{font:400 1.7rem/1.05 var(--hand);text-align:center;color:var(--plum);margin-bottom:14px;text-transform:uppercase;letter-spacing:.02em}
.check-card ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.check-card label{display:flex;gap:12px;align-items:flex-start;font-size:1.12rem;line-height:1.25;cursor:pointer}
.check-card input{appearance:none;-webkit-appearance:none;flex:none;width:24px;height:24px;margin:0;border:2px solid var(--plum);border-radius:4px;background:var(--surface) center/18px no-repeat;cursor:pointer}
.check-card input:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.5 12.5l5.5 5.5L21 5' fill='none' stroke='%23E4614A' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.check-card input:focus-visible{outline:3px solid var(--plum);outline-offset:2px}
.why-copy p+p{margin-top:12px}
.why-copy .lede{font-size:1.12rem}

/* rest of home */
.rest{padding:64px 0 70px}
.rest .section:first-child{margin-top:0}
.section{margin-top:52px}
.section>h2{margin-bottom:16px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:32px}
@media (max-width:820px){.two{grid-template-columns:1fr}}
.legend{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media (max-width:900px){.legend{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.legend{grid-template-columns:1fr}}
.legend>div{background:var(--surface);border:1.5px solid var(--line);border-radius:10px;padding:14px}
.legend p{margin-top:10px;font-size:.93rem;color:var(--muted)}
.about{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:start}
@media (max-width:820px){.about{grid-template-columns:1fr;gap:18px}}
.about .ab{font:italic 400 2rem/1 var(--serif);color:var(--plum);display:block;margin-bottom:6px}
.about p+p{margin-top:12px}
.note{color:var(--muted);font-size:.9rem;margin-top:12px}
.empty{padding:22px;border:2px dashed var(--line);border-radius:12px;color:var(--muted);background:transparent}
.empty .btn{margin-top:12px}
.panel{background:var(--surface);border:2px solid var(--plum);border-radius:10px;padding:20px;box-shadow:var(--shadow)}
.pagehead{margin-bottom:24px}
.pagehead p{color:var(--muted);margin-top:14px;max-width:44em}
.crumb{display:inline-block;margin-bottom:12px;font-weight:600}

/* fields */
.field{display:block}
.field>span{display:block;font-weight:700;font-size:.9rem;margin-bottom:6px}
input[type=text],input[type=search],input[type=email],input[type=password],select,textarea{width:100%;background:var(--surface);border:2px solid var(--line);border-radius:10px;padding:10px 12px;min-height:46px}
textarea{resize:vertical;line-height:1.5}
input:focus,select:focus,textarea:focus{border-color:var(--plum)}
.field+.hint{margin-top:-6px}
.search{position:relative}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:640px){.row2{grid-template-columns:1fr}}
.check{display:flex;gap:10px;align-items:center;font-size:.95rem}
.check input{width:20px;height:20px;accent-color:var(--plum)}
.hint{font-size:.86rem;color:var(--muted)}
.stack>*+*{margin-top:14px}
.actions{display:flex;flex-wrap:wrap;gap:10px}

/* guide */
.group{margin-top:32px}
.group h2{margin-bottom:14px}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:12px}
.tile{display:flex;flex-direction:column;gap:8px;text-decoration:none;color:var(--ink);background:var(--surface);border:1.5px solid var(--line);border-radius:10px;padding:16px;min-height:134px}
.tile:hover{border-color:var(--plum);box-shadow:var(--shadow)}
.tile h3{font-size:1.06rem}
.tile p{font-size:.9rem;color:var(--muted)}
.tile .flags{margin-top:auto;display:flex;flex-wrap:wrap;gap:6px}
.mini{display:inline-flex;align-items:center;gap:5px;font-size:.78rem;font-weight:700;color:var(--c)}
.mini i{width:16px;height:16px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:.66rem;background:var(--cb);color:var(--c);box-shadow:inset 0 0 0 1.5px var(--c)}
.mini.lv-avoid{--c:var(--plum);--cb:var(--surface)}
.ings{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ing{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 14px;padding:12px 14px;border-radius:10px;background:var(--surface);border:1.5px solid var(--line);border-left:6px solid var(--c,var(--line))}
.ing.lv-avoid{--c:var(--avoid-bg)}
.ing b{font-weight:700}
.ing .pill{align-self:start}
.ing p{grid-column:1/-1;color:var(--muted);font-size:.93rem}
.ing .also{font-size:.82rem}
@media (max-width:520px){.ing{grid-template-columns:1fr}.ing .pill{justify-self:start}}
.watch{margin:0;padding-left:1.1em}
.watch li+li{margin-top:8px}
.brands{display:grid;gap:8px}
.brand-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center;background:var(--surface);border:1.5px solid var(--line);border-radius:10px;padding:10px 12px}
.brand-row .bar{grid-column:1/-1;height:7px;border-radius:4px;background:var(--surface2);overflow:hidden}
.brand-row .bar i{display:block;height:100%;background:var(--plum);border-radius:4px}
.brand-row .cnt{font-size:.82rem;color:var(--muted)}
.btn[aria-pressed="true"]{background:var(--brand-soft);border-color:var(--plum);color:var(--plum)}
.addbrand{display:flex;gap:10px;margin-top:12px}
.addbrand input{flex:1}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:2px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 14px;cursor:pointer;font-weight:600;min-height:38px}
.chip[aria-pressed="true"]{background:var(--plum);color:var(--brand-ink);border-color:var(--plum)}
.cols{display:grid;grid-template-columns:1.4fr 1fr;gap:28px;align-items:start}
@media (max-width:900px){.cols{grid-template-columns:1fr}}

/* community */
.toolbar{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:12px;margin:18px 0 12px}
@media (max-width:760px){.toolbar{grid-template-columns:1fr}}
.threads{display:grid;gap:10px;margin-top:14px}
.thread{display:grid;grid-template-columns:56px minmax(0,1fr);gap:8px;background:var(--surface);border:1.5px solid var(--line);border-radius:10px;padding:12px 14px 12px 8px}
.thread:hover{border-color:var(--plum)}
.votes{display:flex;flex-direction:column;align-items:center;gap:2px}
.vote{width:40px;height:40px;border-radius:10px;border:2px solid var(--line);background:var(--surface2);cursor:pointer;font-size:.95rem;color:var(--muted)}
.vote[aria-pressed="true"]{background:var(--plum);border-color:var(--plum);color:var(--brand-ink)}
.votes b{font-size:.95rem}
.t-main{display:block;text-decoration:none;color:var(--ink);min-width:0}
.t-main h3{margin-bottom:4px}
.snip{color:var(--muted);font-size:.93rem;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.meta{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;margin-top:8px;font-size:.84rem;color:var(--muted)}
.post{background:var(--surface);border:2px solid var(--plum);border-radius:10px;padding:20px;box-shadow:var(--shadow)}
.post .body{margin-top:12px;overflow-wrap:anywhere}
.answer{background:var(--derm-bg);border:2px solid var(--plum);border-left:8px solid var(--plum);border-radius:10px;padding:16px 18px}
.answer .who{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin-bottom:8px;font-size:.9rem;color:var(--derm)}
.answer .body{overflow-wrap:anywhere}
.reply{border-left:3px solid var(--line);padding:4px 0 4px 14px}
.reply .who{font-size:.86rem;color:var(--muted);margin-bottom:4px;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center}
.reply .body{overflow-wrap:anywhere}
.linkbtn{background:none;border:0;padding:0;color:var(--muted);cursor:pointer;text-decoration:underline;font-size:.84rem}
.linkbtn.arm{color:var(--ask);font-weight:700}
.pinned{border:2px solid var(--plum);background:var(--band);border-radius:10px;padding:16px 18px}
.pinned h3{margin-bottom:6px}
.pinned ul{margin:8px 0 0;padding-left:1.1em}
.banner{padding:12px 16px;border-radius:10px;background:var(--care-bg);color:var(--care);font-weight:600;margin-bottom:14px}

/* scan */
.tabs{display:inline-flex;background:var(--surface2);border:2px solid var(--plum);border-radius:999px;padding:4px;gap:4px;margin-bottom:16px}
.tabs button{border:0;background:none;border-radius:999px;padding:8px 16px;font-weight:700;cursor:pointer;color:var(--ink);min-height:38px}
.tabs button[aria-selected="true"]{background:var(--plum);color:var(--brand-ink)}
.drop{display:grid;place-items:center;text-align:center;gap:6px;border:2px dashed var(--plum);border-radius:14px;padding:26px 16px;background:var(--surface2);cursor:pointer;min-height:150px}
.drop:hover,.drop:focus-within{background:var(--brand-soft)}
.drop img{max-width:100%;max-height:240px;border-radius:8px}
.result h2{margin-bottom:8px}
.summary{display:flex;flex-wrap:wrap;gap:8px 16px;margin:12px 0}
.aitag{font-size:.74rem;font-weight:700;color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:1px 6px;margin-left:8px;white-space:nowrap}
details.all{margin-top:18px}
details.all summary{cursor:pointer;font-weight:700;min-height:44px;display:flex;align-items:center}
.spin{display:inline-block;width:16px;height:16px;border:2.5px solid var(--line);border-top-color:var(--plum);border-radius:50%;animation:sp .8s linear infinite;vertical-align:-3px;margin-right:8px}
@keyframes sp{to{transform:rotate(360deg)}}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--plum);color:var(--brand-ink);padding:12px 18px;border-radius:12px;font-weight:600;z-index:50;max-width:calc(100% - 32px);box-shadow:var(--shadow)}
footer{position:relative;background:var(--mauve);padding:34px 0 46px;color:var(--ink);font-size:.9rem}
footer .org{font:700 1.15rem/1.3 var(--body);text-transform:uppercase;color:var(--plum);margin-bottom:12px;max-width:26em}
footer p{max-width:60em}

.toolbar.four{grid-template-columns:1.3fr 1fr 1fr 1fr}
@media (max-width:900px){.toolbar.four{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.toolbar.four{grid-template-columns:1fr}}
.thread{grid-template-columns:56px minmax(0,1fr) auto}
.pthumb{width:84px;height:84px;object-fit:cover;border-radius:10px;border:1.5px solid var(--line);align-self:start}
@media (max-width:520px){.pthumb{width:64px;height:64px}}
.tag.fl{border-color:transparent;color:var(--ink);font-weight:700}
.fl-question{background:var(--brand-soft)}
.fl-review{background:var(--ok-bg);color:var(--ok)!important}
.fl-experience{background:#E3D1F3;color:#410D68!important}
.fl-tip{background:var(--care-bg);color:var(--care)!important}
.fl-ingredient{background:var(--ask-bg);color:var(--ask)!important}
.qip{display:flex;align-items:center;gap:12px;margin-top:10px}
.qthumb{width:96px;height:96px;object-fit:cover;border-radius:10px;border:1.5px solid var(--line)}
.pimg{display:block;max-width:100%;max-height:520px;margin-top:14px;border-radius:12px;border:2px solid var(--line)}
.cmt{padding:4px 0 6px}
.cmt .who{font-size:.86rem;color:var(--muted);margin-bottom:4px;display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
.cmt .body{overflow-wrap:anywhere}
.cmt .acts{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:4px}
.cmt.dr{background:var(--derm-bg);border:2px solid var(--plum);border-left:8px solid var(--plum);border-radius:10px;padding:14px 16px;margin-top:10px}
.cmt.dr .who{color:var(--derm)}
.kids{margin:10px 0 0 6px;padding-left:14px;border-left:3px solid var(--line);display:grid;gap:8px}
.kids.flat{margin-left:0;padding-left:0;border-left:0}
.rbox{margin-top:8px;display:grid;gap:8px}
.camwrap{position:relative;border-radius:14px;overflow:hidden;background:#111;aspect-ratio:4/3;max-height:62vh;width:100%}
.camwrap video{width:100%;height:100%;object-fit:cover;display:block}
.camwrap .frame{position:absolute;inset:12% 8%;border:3px dashed rgba(255,255,255,.85);border-radius:14px;pointer-events:none}
.shots{display:flex;flex-wrap:wrap;gap:12px;margin-top:14px}
.shot{display:grid;gap:4px;justify-items:start}
.shot img{width:110px;height:110px;object-fit:cover;border-radius:10px;border:2px solid var(--line)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* account menu, dialog, admin */
.menu{position:relative}
.menu summary{list-style:none;cursor:pointer;font-weight:700;color:var(--plum);padding:8px 14px;border:2px solid var(--plum);border-radius:999px;max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:38px;display:flex;align-items:center}
.menu summary::-webkit-details-marker{display:none}
.menu-pop{position:absolute;right:0;top:calc(100% + 6px);z-index:30;min-width:210px;background:var(--surface);border:2px solid var(--plum);border-radius:12px;padding:10px;box-shadow:var(--shadow);display:grid;gap:2px}
.menu-pop a,.menu-pop button{display:block;text-align:left;background:none;border:0;padding:9px 10px;border-radius:8px;color:var(--ink);font-weight:600;cursor:pointer;text-decoration:none;font-size:1rem}
.menu-pop a:hover,.menu-pop button:hover{background:var(--surface2)}
.menu-pop .danger{color:var(--ask)}
dialog{border:2px solid var(--plum);border-radius:14px;padding:22px;max-width:440px;width:calc(100% - 28px);background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}
dialog::backdrop{background:rgba(42,16,49,.6)}
.dlghead{display:flex;justify-content:space-between;align-items:center;gap:12px}
.dlghead h2{font-size:1.7rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.prose h2{font-size:1.5rem;margin-top:8px}
.prose ul,.prose ol{margin:0;padding-left:1.2em}
.prose li+li{margin-top:8px}
.statgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.stat{background:var(--surface);border:2px solid var(--plum);border-radius:10px;padding:14px;display:grid;gap:2px}
.stat b{font:700 2rem/1 var(--display);color:var(--plum)}
.stat span{color:var(--muted);font-size:.9rem}
.urow{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px 14px;align-items:center;background:var(--surface);border:1.5px solid var(--line);border-radius:10px;padding:12px 14px}
.urow.done{opacity:.6}
.urow p{margin-top:4px;overflow-wrap:anywhere}
@media (max-width:640px){.urow{grid-template-columns:1fr}}