@font-face{font-family:"DM Serif Display";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/dm-serif-display-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/space-grotesk-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/space-grotesk-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/space-grotesk-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Martian Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/martian-400.woff2) format("woff2")}
/* events.loneforge.ai: The Floor. The same app as The Letter, in the dark:
   plum and black, neon pink and turquoise, the mirror ball, wristbands in
   beads, the reel of real nights. No inline styles (CSP). */
:root{--paper:#0b0710;--plum:#1c0f24;--card:#221434;--ink:#fff3ea;--mute:#d4bdc6;--dim:#9d8aa0;--line:rgba(255,220,220,.14);--field:rgba(255,255,255,.07);--pink:#ff5e9c;--orange:#ff9a3c;--turq:#3ee0cf;--gold:#ffd23f;--violet:#8a5cff;--silver:#e8e6f2;--red:#ff5e9c;--green:#3ee0cf;--btn-ink:#2a0012;--pad:clamp(18px,4vw,40px);--font:"Space Grotesk",system-ui,sans-serif;--display:"DM Serif Display",Georgia,serif;--mono:"Martian Mono",monospace;--a:255,94,156}
.w-music{--a:255,94,156;--b:138,92,255;--c2:62,224,207}.w-food{--a:255,154,60;--b:255,210,63;--c2:196,81,43}.w-photo{--a:62,224,207;--b:244,241,246;--c2:138,92,255}.w-venue{--a:255,210,63;--b:255,154,60;--c2:255,94,156}.w-beauty{--a:255,94,156;--b:255,179,209;--c2:244,241,246}.w-rent{--a:138,92,255;--b:62,224,207;--c2:255,210,63}.w-host{--a:255,210,63;--b:255,94,156;--c2:244,241,246}.w-house{--a:255,94,156}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.55 var(--font);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{font-family:var(--display);font-weight:500;letter-spacing:-.01em;line-height:1.05;margin:0 0 16px}
h1{font-size:clamp(38px,6vw,68px);max-width:14ch}h2{font-size:clamp(28px,3.8vw,44px);max-width:20ch}h3{font-size:24px;margin-top:32px}
p{margin:0 0 14px;max-width:64ch}a{color:inherit}
[hidden]{display:none!important}
.skip{position:absolute;left:-999px;top:0}.skip:focus{left:8px;top:8px;background:var(--pink);color:var(--btn-ink);padding:8px;z-index:99}
.eyebrow,.kicker{font:600 12px/1 var(--font);letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin:0 0 14px}
.lede,.sub{font-size:clamp(18px,1.5vw,21px);color:var(--mute)}
.fine{font-size:14px;color:var(--mute)}
.aside{font-size:15.5px;color:var(--mute);border-left:3px solid var(--red);padding-left:14px}
/* top bar */
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px var(--pad);border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(11,7,16,.86);backdrop-filter:blur(6px);z-index:20}
.brand{font-family:var(--display);font-size:21px;text-decoration:none;white-space:nowrap}.brand span{font:500 11px var(--font);color:var(--mute);margin-left:8px;letter-spacing:.06em;text-transform:uppercase}.brand .brand-w{font:inherit;color:inherit;margin:0;letter-spacing:0;text-transform:none}
.top-nav{display:flex;gap:4px;align-items:center}.top-nav a,.top-nav button{font:600 14px var(--font);text-decoration:none;padding:8px 12px;border:1px solid transparent;border-radius:99px;color:var(--ink);background:none;cursor:pointer}
.top-nav a:hover,.top-nav button:hover,.top-nav a[aria-current]{border-color:var(--line)}
.top-nav .top-cta{background:var(--turq);border-color:var(--turq);color:var(--btn-ink)}.cta-s{display:none}.top-nav .top-switch{color:var(--mute);font-weight:500;margin-left:6px}.top-nav .top-switch:hover{color:var(--ink)}.foot-switch{margin-top:10px}.top-nav .top-in{border-color:var(--line)}.top-nav .pnav.on{background:var(--pink);color:var(--btn-ink)}
/* layout */
main{max-width:1100px;margin:0 auto;padding:0 var(--pad)}main.narrow{max-width:820px}
.part{padding:clamp(36px,6vw,72px) 0;border-top:1px solid var(--line)}.part-first{border-top:0}
.hero{padding:clamp(36px,6vw,80px) 0 36px;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:end}
.hero h1{grid-column:1}.hero-pic{grid-column:2;grid-row:1/4;margin:0}figcaption{font-size:14px;color:var(--mute);margin-top:10px}
.doors{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}
.door{display:grid;gap:4px;padding:18px 20px;border:2px solid var(--pink);border-radius:14px;text-decoration:none;background:var(--pink);color:var(--btn-ink);box-shadow:0 8px 40px rgba(255,94,156,.25)}
.door b{font-size:20px;font-family:var(--display);font-weight:500}.door span{font-size:14px;opacity:.75}.door-alt{background:rgba(11,7,16,.55);border-color:var(--turq);color:var(--ink);box-shadow:none;backdrop-filter:blur(6px)}.door:hover{transform:translateY(-2px)}
.steps{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.steps li{display:grid;grid-template-columns:44px 1fr;gap:12px}.steps .n{width:40px;height:40px;border-radius:50%;background:var(--red);color:var(--btn-ink);display:grid;place-items:center;font-weight:700}
.steps b{display:block;font-size:20px;font-family:var(--display);font-weight:500;margin-bottom:6px}.steps p{font-size:16px;color:var(--mute)}
.deal{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin:28px 0}.deal-3{grid-template-columns:repeat(3,1fr)}
.deal div{border-top:2px solid var(--pink);padding-top:12px}.deal dt{font-family:var(--display);font-size:32px;line-height:1;margin-bottom:8px}.deal dd{margin:0;font-size:15px;color:var(--mute)}
.math{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px 24px;margin:24px 0}
.math table{width:100%;border-collapse:collapse;font-size:17px}.math td{padding:8px 0;border-bottom:1px dashed var(--line)}.math td:last-child{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.math .sub td{font-size:14px;color:var(--mute);padding-left:18px}.math .plus td{color:var(--green);border-bottom:0}
.part-me{display:grid;grid-template-columns:.8fr 1.2fr;gap:36px;align-items:center}.me{border-radius:14px}.contact a{font-weight:600}
.foot{padding:30px var(--pad) 90px;border-top:1px solid var(--line);font-size:14px;color:var(--mute);text-align:center}.foot p{max-width:none}.foot-small{font-size:13px}
/* buttons and fields */
.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--red);color:var(--btn-ink);text-decoration:none;font:600 15px var(--font);padding:12px 20px;border-radius:99px;border:1px solid var(--red);cursor:pointer}
.btn.big{padding:14px 24px;font-size:16px}.btn.small{padding:8px 14px;font-size:13px}.btn.ghost{background:transparent;color:var(--ink);border-color:rgba(255,255,255,.4)}.btn.danger{color:var(--red);border-color:var(--red)}
.btn.in{background:var(--turq);border-color:var(--turq);color:var(--btn-ink)}.btn:disabled{opacity:.5}
.cta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:22px}.cta span{color:var(--mute);font-size:15px}
.f{display:grid;gap:6px}.f>span{font:600 12px var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.f input,.f select,.f textarea{width:100%;min-height:46px;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:var(--field);color:var(--ink);font:400 16px var(--font)}
.f textarea{resize:vertical}.f-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.f .count{float:right;font-style:normal;color:var(--dim);text-transform:none;letter-spacing:0}
.hp{position:absolute;left:-9999px}
.a-msg{font-size:15px;color:var(--mute)}.a-msg.err{color:var(--red)}
.join,.book,.login-form{display:grid;gap:14px;margin-top:22px}
.night-pick{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end;margin:6px 0 26px}
.free{padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--card);margin-bottom:28px}.free-h{font-size:16px}
/* squares */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;margin-top:22px}.tiles-small{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.tile{display:grid;gap:3px;text-decoration:none;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card);color:var(--ink);border-top:4px solid rgb(var(--a))}
.tile:hover{border-color:rgba(255,255,255,.4);border-top-color:rgb(var(--a));box-shadow:0 10px 40px rgba(var(--a),.22)}
.tile-img{display:block;aspect-ratio:4/3;overflow:hidden;background:#2a1a3a}.tile-img img{width:100%;height:100%;object-fit:cover}
.tile-kind{font:600 11px var(--font);letter-spacing:.08em;text-transform:uppercase;color:rgb(var(--a));padding:10px 12px 0}
.tile-name{font-family:var(--display);font-weight:500;font-size:20px;line-height:1.1;padding:0 12px}.tile-sub{font-size:13px;color:var(--mute);padding:0 12px 12px}
.tile-live .tile-kind::before{content:"real";background:var(--green);color:var(--btn-ink);border-radius:99px;padding:2px 6px;margin-right:6px;font-size:9px}
.tile-open{border-style:dashed;background:transparent}.tile-open .tile-img{display:grid;place-items:center;background:transparent}.tile-plus{font:300 64px var(--display);color:var(--red)}
.filter{display:flex;flex-wrap:wrap;gap:6px;margin:18px 0}.chip{font:600 14px var(--font);padding:8px 14px;border-radius:99px;border:1px solid var(--line);background:transparent;cursor:pointer;color:var(--ink)}.chip.on{background:var(--pink);color:var(--btn-ink);border-color:var(--pink)}
.group{margin-bottom:36px}.group-h{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;font-size:30px}.group-h span{font:400 15px var(--font);color:var(--mute)}.group-live{font:600 12px var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--green)}
.group-note{font-size:15px;color:var(--mute);margin-top:-6px}
/* my night */
.night-bar{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:30;display:flex;gap:8px;align-items:center;padding:12px 18px;border-radius:99px;background:var(--pink);color:var(--btn-ink);text-decoration:none;font-size:14px;box-shadow:0 12px 40px rgba(0,0,0,.25);white-space:nowrap;max-width:calc(100vw - 32px)}
.night-bar em{font-style:normal;color:var(--btn-ink);font-weight:700;text-decoration:underline}
.picked{display:grid;gap:8px;margin-bottom:8px}.pick{display:grid;grid-template-columns:56px 1fr auto;gap:10px;align-items:center;padding:8px;border:1px solid var(--line);border-radius:10px;background:var(--card)}
.pick img{width:56px;height:42px;object-fit:cover;border-radius:6px}.pick b{display:block;font-size:15px}.pick small{color:var(--mute)}.pick button{border:0;background:none;font-size:22px;color:var(--mute);cursor:pointer}
.empty{font-size:15px;color:var(--mute);padding:12px;border:1px dashed var(--line);border-radius:10px}.empty-cart{display:grid;gap:8px;justify-items:start;padding:18px 16px;text-align:left}.empty-cart b{color:var(--ink);font-size:17px}.empty-cart span{line-height:1.45}.empty-cart .btn{margin-top:4px}
.key-card{background:var(--card);border:2px solid var(--turq);border-radius:16px;padding:26px 28px;margin-top:22px}
.key-box{margin:6px 0 14px}.key-box code{display:inline-block;font:600 22px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;padding:14px 18px;border:2px dashed var(--red);border-radius:10px;background:var(--paper)}
/* a resident's page */
.draft-note{margin:0;padding:10px var(--pad);background:var(--gold);color:var(--btn-ink);font-size:14px;text-align:center}.draft-note a{color:var(--btn-ink)}
.res{max-width:1100px;margin:0 auto;padding:0 var(--pad) 70px}
.rp-bar{display:flex;align-items:center;gap:14px;padding:16px 0;font-size:14px}.rp-back{text-decoration:none;font-weight:600;white-space:nowrap}.rp-tag{font:600 11px var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--mute);border:1px dashed var(--mute);padding:5px 10px;border-radius:99px}.rp-tag-live{color:var(--green);border-style:solid;border-color:var(--green)}
.rp-cover{position:relative;height:min(52vh,520px);border-radius:16px;overflow:hidden;background:#2a1a3a}.rp-cover img{width:100%;height:100%;object-fit:cover}
.rp-collage{display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:1fr 1fr;gap:4px;height:min(60vh,600px);background:var(--paper)}
.rp-collage .cg{position:relative;overflow:hidden;min-width:0;min-height:0}.rp-collage .cg img{width:100%;height:100%;object-fit:cover}
.rp-collage .cg0{grid-column:1/7;grid-row:1/3}.rp-collage .cg1{grid-column:7/10;grid-row:1}.rp-collage .cg2{grid-column:10/13;grid-row:1}.rp-collage .cg3{grid-column:7/10;grid-row:2}.rp-collage .cg4{grid-column:10/13;grid-row:2}
.rp-body{display:grid;grid-template-columns:1.25fr .75fr;gap:40px;padding-top:28px;align-items:start}
.rp-kind{font:600 12px var(--font);letter-spacing:.14em;text-transform:uppercase;color:rgb(var(--a));margin:0 0 10px}
.rp-name{font-size:clamp(40px,5.5vw,72px);max-width:none;margin:0 0 14px}.rp-bio{font-size:clamp(17px,1.4vw,19px);color:var(--mute);max-width:62ch}.rp-muted{color:var(--dim);font-size:14.5px}
.rp-offers{list-style:none;margin:0 0 10px;padding:0}.rp-offers li{display:grid;grid-template-columns:1fr auto;gap:2px 16px;padding:12px 0;border-bottom:1px solid var(--line)}
.rp-offers b{font-size:17px}.rp-offers span{grid-column:1;font-size:14.5px;color:var(--mute)}.rp-offers em{grid-column:2;grid-row:1/3;font:400 22px var(--display);text-align:right;white-space:nowrap}
.rp-gal{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.rp-gal img{border-radius:10px;aspect-ratio:4/3;object-fit:cover}
.rp-side{position:sticky;top:76px;display:grid;gap:14px}
.rp-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;display:grid;gap:10px}.rp-yours{background:transparent}.rp-y-h{font-family:var(--display);font-size:22px;margin:0}
.rp-price{font:400 26px var(--display);margin:0}.rp-avail{margin:0;font-weight:600}.rp-avail.ok{color:var(--green)}.rp-avail.no{color:var(--red)}
.rp-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;font:500 12px var(--font)}.rp-cal b{text-align:center;color:var(--mute);font-weight:500;font-size:11px}
.rp-cal span{aspect-ratio:1;display:grid;place-items:center;border-radius:6px;background:rgba(62,224,207,.16);color:#c9fff7}.rp-cal .bk{background:rgba(255,94,156,.2);color:#ffb3d1;text-decoration:line-through}.rp-cal .pa{background:rgba(255,255,255,.05);color:#6f6278}.rp-cal .td{box-shadow:inset 0 0 0 2px var(--ink)}.rp-cal .sel{outline:3px solid var(--red);outline-offset:-1px}
.rp-key{font-size:12px;color:var(--mute);display:flex;gap:10px;align-items:center;margin:0}.rp-key span{width:12px;height:12px;border-radius:3px;display:inline-block;margin-right:4px;background:rgba(62,224,207,.16)}.rp-key .bk{background:rgba(255,94,156,.2)}.rp-key .pa{background:rgba(255,255,255,.05)}
.rp-card .btn{text-align:center}
.rp-side .fine a{font-weight:600}
.plain{padding:80px 0}
/* portal */
.portal{min-height:100vh}
.p-login{display:grid;place-items:center;min-height:calc(100vh - 64px);padding:40px var(--pad)}
.login-card{width:min(520px,100%);padding:clamp(24px,4vw,40px);border-radius:20px;background:var(--card);border:1px solid var(--line)}
.login-card h1{font-size:clamp(38px,5vw,56px)}
.portal-me{display:flex;align-items:center;gap:8px;margin-left:auto}.me-email{font-size:13px;color:var(--mute)}
.p-editor{max-width:1440px;margin:0 auto;padding:26px var(--pad) 80px}
.ed-bar{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:14px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.ed-title h1{font-size:clamp(28px,3.2vw,44px)}.ed-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.ed-status{font-size:13px;color:var(--mute)}
.pill{display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border-radius:99px;background:rgba(255,255,255,.1);color:var(--mute);font:600 12px var(--font)}.pill.live{background:rgba(62,224,207,.16);color:var(--green)}
.ed-tabs{display:none;gap:6px;margin:14px 0 0}.ed-tabs button{flex:1;border:1px solid var(--line);background:none;color:var(--mute);font:600 14px var(--font);padding:10px;border-radius:10px;cursor:pointer}.ed-tabs button.on{background:var(--pink);border-color:var(--pink);color:var(--btn-ink)}
.ed-grid{display:grid;grid-template-columns:minmax(360px,480px) minmax(0,1fr);gap:clamp(18px,3vw,40px);margin-top:20px;align-items:start}
.ed-form{display:grid;gap:14px}
.ed-sec{margin:0;padding:18px;border:1px solid var(--line);border-radius:16px;background:var(--card);display:grid;gap:12px;min-width:0;scroll-margin-top:84px}
.ed-sec legend{display:flex;align-items:center;gap:10px;padding:0 6px;font:500 22px var(--display);color:var(--ink)}
.ed-sec legend i{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--red);color:var(--btn-ink);font:700 12px var(--font);font-style:normal}
.ed-sec legend small{font:600 11px var(--font);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.sec-why{margin:-4px 0 2px;font-size:14px;line-height:1.5;color:var(--mute)}.sec-tools{margin:0}
.money-in,.slug-in{display:flex;align-items:center;border:1px solid var(--line);border-radius:10px;background:var(--field);overflow:hidden}
.money-in i,.slug-in i{padding-left:12px;font-style:normal;color:var(--dim);white-space:nowrap}.slug-in i{font-size:13px}.money-in input,.slug-in input{border:0;background:none;min-width:0;flex:1;outline:none}
.money-in:focus-within,.slug-in:focus-within{border-color:var(--red);box-shadow:0 0 0 2px rgba(255,94,156,.2)}
@keyframes ed-flash{0%{box-shadow:0 0 0 0 rgba(255,94,156,.7)}100%{box-shadow:0 0 0 14px rgba(255,94,156,0)}}.ed-sec.flash{border-color:var(--red);animation:ed-flash 1.4s ease-out}
.ed-steps{padding:16px 18px;border-radius:16px;background:var(--card);border:2px solid var(--turq);display:grid;gap:10px}
.steps-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.steps-head b{font:500 20px var(--display)}.steps-n{font:600 11px var(--font);letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
.steps-bar{height:6px;border-radius:99px;background:var(--paper);overflow:hidden}.steps-bar i{display:block;height:100%;width:0;border-radius:99px;background:var(--red);transition:width .4s}
.todo{list-style:none;margin:0;padding:0;display:grid;gap:2px}.todo button{display:flex;align-items:center;gap:10px;width:100%;padding:7px 6px;border:0;border-radius:8px;background:none;color:var(--ink);font:500 14px var(--font);text-align:left;cursor:pointer}.todo button:hover{background:var(--paper)}
.todo button i{flex:none;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;font-style:normal;font-size:12px}.todo li.ok button i{background:var(--green);border-color:var(--green);color:var(--btn-ink)}.todo li.ok button span{color:var(--mute);text-decoration:line-through}
.todo button span{flex:1}.todo button span small{font:600 10px var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-left:6px}.todo button em{font:600 12px var(--font);font-style:normal;color:var(--red);white-space:nowrap}.todo li.opt button em{color:var(--mute)}
.band-ways{display:flex;flex-wrap:wrap;gap:6px}.way{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:99px;border:1px solid var(--line);background:var(--card);font:600 13px var(--font);color:var(--ink);cursor:pointer}
.way.on{border-color:var(--turq);box-shadow:inset 0 0 0 1px var(--turq)}.way-auto{border-style:dashed}.way-dots{display:inline-flex;gap:2px}.way-dots i{width:9px;height:9px;border-radius:50%;background:rgb(var(--a))}.way-dots i:nth-child(2){opacity:.7}.way-dots i:nth-child(3){opacity:.45}
.offers{display:grid;gap:8px}.offer{display:grid;grid-template-columns:1.1fr 1.4fr 110px 32px;gap:6px;align-items:center}
.offer input{min-height:40px;padding:6px 10px;border-radius:8px;border:1px solid var(--line);background:var(--field);color:var(--ink);font:400 14px var(--font);width:100%}
.offer-p{display:flex;align-items:center;border:1px solid var(--line);border-radius:8px;background:var(--field)}.offer-p i{padding-left:8px;font-style:normal;color:var(--dim)}.offer-p input{border:0;background:none;min-width:0}.offer-x{border:0;background:none;color:var(--mute);font-size:20px;cursor:pointer}
.drop{display:grid;place-items:center;min-height:90px;border:2px dashed var(--red);border-radius:14px;background:rgba(255,94,156,.04);color:var(--mute);font:600 14px var(--font);cursor:pointer;position:relative}.drop.over{background:rgba(255,94,156,.1)}.drop input{position:absolute;inset:0;opacity:0;cursor:pointer}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}.thumb{position:relative;aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:#2a1a3a}.thumb img{width:100%;height:100%;object-fit:cover}
.cover-tag{position:absolute;left:6px;top:6px;padding:3px 7px;border-radius:6px;background:var(--gold);color:var(--btn-ink);font:700 10px var(--font);letter-spacing:.06em;text-transform:uppercase}
.cover-btn{position:absolute;left:6px;top:6px;padding:4px 8px;border:0;border-radius:6px;background:rgba(0,0,0,.6);color:#fff;font:600 10px var(--font);cursor:pointer;opacity:0}.thumb:hover .cover-btn,.thumb:focus-within .cover-btn{opacity:1}@media (hover:none){.cover-btn{opacity:1}}
.thumb-acts{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:flex-end;gap:4px;padding:6px;background:linear-gradient(transparent,rgba(0,0,0,.7))}.thumb-acts button{width:28px;height:28px;border:0;border-radius:6px;background:rgba(255,255,255,.25);color:#fff;font-size:14px;cursor:pointer}.thumb-acts button:disabled{opacity:.3}.thumb.armed [data-rm]{background:var(--red)}
.switch{display:flex;align-items:center;gap:12px;cursor:pointer}.switch input{position:absolute;opacity:0;width:1px;height:1px}
.sw{width:48px;height:28px;border-radius:99px;background:var(--line);position:relative;flex:none;transition:background .2s}.sw::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--card);transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.switch input:checked+.sw{background:var(--green)}.switch input:checked+.sw::after{transform:translateX(20px)}.switch input:focus-visible+.sw{outline:2px solid var(--red);outline-offset:2px}
.sw-l{display:grid}.sw-l b{font-size:16px}.sw-l small{color:var(--mute)}.ed-publish{border-color:var(--green)}
.ed-preview{position:sticky;top:76px;min-width:0}.prev-k{margin:0 0 8px;font:600 11px var(--font);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}.prev-k span{color:var(--dim)}
/* the preview stands on a stage, at a desktop's, a tablet's or a phone's real
   width (portal.js scales it to fit and sizes the frame) */
.prev-stage{display:grid;justify-items:center;gap:12px;padding:12px;border:1px solid var(--line);border-radius:18px;background:radial-gradient(90% 60% at 50% 0%,rgba(138,92,255,.16),transparent 70%),#07040b}
.device-controls{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--line);border-radius:99px;background:var(--card)}
.device-controls button{min-height:30px;padding:0 14px;border:0;border-radius:99px;background:none;color:var(--mute);font:600 13px var(--font);cursor:pointer}
.device-controls button:hover{color:var(--ink)}.device-controls button.active{background:var(--pink);color:var(--btn-ink);box-shadow:0 0 18px rgba(255,94,156,.4)}.device-controls button:focus-visible{outline:2px solid var(--turq);outline-offset:2px}
.prev-frame{border-radius:10px;overflow:hidden;background:var(--paper);box-shadow:0 0 0 1px rgba(255,220,220,.16),0 18px 50px rgba(0,0,0,.6)}
.prev-stage[data-device=tablet] .prev-frame{border-radius:16px}.prev-stage[data-device=phone] .prev-frame{border-radius:24px}
.prev-scale{transform-origin:0 0}.prev-scale iframe{display:block;width:100%;height:100%;border:0}
/* inside the frame (portal.js marks its html): no scrollbar taking width, as on
   a phone, and a gutter over the cover where the page has its top bar */
html.lfe-preview{scrollbar-width:none}html.lfe-preview::-webkit-scrollbar{display:none}.lfe-preview .res{padding-top:var(--pad);padding-bottom:40px}
.res-embed [data-ed]{cursor:pointer}.res-embed [data-ed]:hover:not(:has([data-ed]:hover)){outline:2px dashed var(--red);outline-offset:5px;border-radius:4px}.res-embed .rp-cover[data-ed]:hover:not(:has([data-ed]:hover)){outline-offset:-3px}
.res-embed [data-ed]{position:relative}.res-embed [data-ed]:hover:not(:has([data-ed]:hover))::after{content:"Edit";position:absolute;right:-6px;top:-16px;z-index:2;padding:2px 8px;border-radius:99px;background:var(--red);color:var(--btn-ink);font:700 11px var(--font);text-transform:none;pointer-events:none}
.res-embed .rp-cover[data-ed]:hover:not(:has([data-ed]:hover))::after{right:12px;top:12px}
.res-embed .rp-add{padding:14px 16px;border:1px dashed var(--line);border-radius:10px;color:var(--mute)}.res-embed .rp-add::before{content:"+ ";color:var(--red);font-weight:700}.res-embed [data-add]{pointer-events:none}
@media (max-width:900px){.ed-grid{grid-template-columns:1fr}.ed-tabs{display:flex}.ed-grid[data-pane=form] .ed-preview{display:none}.ed-grid[data-pane=preview] .ed-form{display:none}.ed-preview{position:static}.prev-stage{padding:10px;border-radius:14px}}
@media (min-width:901px){.ed-grid[data-pane]{grid-template-columns:minmax(360px,480px) minmax(0,1fr)}}
.p-admin{padding:30px 0 80px}.p-admin .wrap{max-width:1100px;margin:0 auto;padding:0 var(--pad)}.p-admin h1{font-size:clamp(36px,5vw,56px)}
.app-card{margin-top:14px;padding:16px 18px;border-radius:14px;background:var(--card);border:1px solid var(--line);display:grid;gap:8px}.app-card.done{opacity:.7}
.app-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:12px}.app-head b{font:500 22px var(--display)}.app-line{font-size:14.5px;color:var(--mute)}.app-line a{color:var(--ink)}
.app-notes{padding:10px 12px;border-radius:8px;background:var(--paper);font-size:14px;color:var(--mute);white-space:pre-wrap}
.make{display:grid;gap:10px;padding-top:6px;border-top:1px dashed var(--line)}.make .f-row{grid-template-columns:1fr 1fr 1fr}
.invite-box{margin-top:10px;padding:14px 16px;border-radius:12px;background:rgba(255,210,63,.12);border:1px solid var(--gold);display:grid;gap:10px;font-size:14.5px}.invite-box .key-box code{font-size:14px;letter-spacing:0}
.req-cta{display:flex;gap:8px;flex-wrap:wrap;margin:0}
.new-res{margin-top:18px;padding:14px 18px;border-radius:14px;background:var(--card);border:1px solid var(--line)}.new-res summary{cursor:pointer;font:600 15px var(--font)}
.res-table{width:100%;margin-top:18px;border-collapse:collapse;font-size:14px}.res-table th{text-align:left;font:600 11px var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--dim);padding:8px;border-bottom:1px solid var(--line)}.res-table td{padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:middle}.res-acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:80;padding:12px 18px;border-radius:99px;background:var(--turq);color:var(--btn-ink);font:600 14px var(--font);box-shadow:0 10px 40px rgba(0,0,0,.3)}.toast.bad{background:var(--red);color:var(--btn-ink)}
dialog.req{border:0;border-radius:18px;padding:0;max-width:min(520px,calc(100vw - 32px));background:var(--card);color:var(--ink)}dialog.req::backdrop{background:rgba(0,0,0,.65)}
.req-form{padding:26px 28px;position:relative;display:grid;gap:10px}.req-x{position:absolute;right:12px;top:10px;border:0;background:none;font-size:26px;cursor:pointer;color:var(--mute)}.req-sub{color:var(--mute);margin:0}
/* portal: inbox and the request cards (the thread, the answer) */
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pnav-badge{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;margin-left:6px;border-radius:99px;background:var(--turq);color:var(--btn-ink);font:700 11px/1 var(--font);vertical-align:1px}.pnav.on .pnav-badge{background:var(--btn-ink);color:var(--ink)}
.inbox-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 4px}
.inbox{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px}
.ib-btn{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:2px 12px;align-items:baseline;width:100%;text-align:left;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);font:400 15px/1.45 var(--font);cursor:pointer}
.ib-btn:hover{border-color:var(--pink)}.ib-btn:focus-visible{outline:2px solid var(--turq);outline-offset:2px}
.ib-dot{grid-row:1/4;align-self:start;margin-top:5px;width:10px;height:10px;border-radius:50%;background:transparent;border:1px solid var(--line)}.ib-item.unread .ib-dot{background:var(--turq);border-color:var(--turq);box-shadow:0 0 10px rgba(62,224,207,.6)}
.ib-kind{font:600 11px var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}.ib-item.unread .ib-kind{color:var(--turq)}
.ib-time{grid-column:3;grid-row:1;font-size:12.5px;color:var(--dim);white-space:nowrap}
.ib-title{grid-column:2/4;font-weight:500;font-size:16.5px}.ib-item.unread .ib-title{font-weight:700}
.ib-body{grid-column:2/4;font-size:14.5px;color:var(--mute);overflow-wrap:anywhere}
.ib-item:not(.unread) .ib-btn{opacity:.72}.ib-item:not(.unread) .ib-btn:hover{opacity:1}
.rq-card{scroll-margin-top:84px}.rq-card.here{border-color:var(--red);animation:ed-flash 1.4s ease-out}
.rq-vendors{list-style:none;margin:2px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.rq-v{display:inline-flex;align-items:center;gap:8px;padding:3px 3px 3px 12px;border:1px solid var(--line);border-radius:99px;background:var(--paper);font:600 13.5px var(--font)}.rq-v.me{border-color:var(--turq)}.rq-v small{font-weight:500;color:var(--mute)}
.pill.st-new{background:rgba(255,255,255,.1);color:var(--mute)}.pill.st-yes{background:rgba(62,224,207,.16);color:var(--green)}.pill.st-no{background:rgba(255,94,156,.18);color:var(--red)}
.rq-answer{display:grid;gap:10px;margin-top:4px;padding:14px 16px;border:1px dashed var(--pink);border-radius:12px;background:rgba(255,94,156,.06)}
.rq-q{margin:0;font:500 19px var(--display)}.rq-answer .f textarea{min-height:44px;font-size:15px}.rq-answer .f>span em{font-style:normal;font-weight:500;text-transform:none;letter-spacing:0;color:var(--dim)}
.rq-admin{border-style:solid;border-color:var(--line);background:var(--paper)}.rq-answer-btns{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0}.rq-admin .f-row{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}
.rq-said{max-width:none;margin:4px 0 0;padding:10px 14px;border-radius:10px;font-weight:600;background:var(--paper)}.rq-said.yes{color:var(--green)}.rq-said.no{color:var(--red)}.rq-said small{display:block;font-weight:400;color:var(--mute);font-size:13.5px}
.rq-thread{margin-top:4px;border-top:1px dashed var(--line);padding-top:10px}
.rq-thread summary{display:flex;align-items:center;gap:10px;flex-wrap:wrap;cursor:pointer;list-style:none;font:600 15px var(--font)}.rq-thread summary::-webkit-details-marker{display:none}
.rq-thread summary::before{content:"";width:7px;height:7px;border-right:2px solid var(--mute);border-bottom:2px solid var(--mute);transform:rotate(-45deg);margin:0 4px 0 2px;transition:transform .15s}.rq-thread[open] summary::before{transform:rotate(45deg);margin-bottom:3px}
.rq-new{display:inline-flex;align-items:center;min-height:22px;padding:0 9px;border-radius:99px;background:var(--turq);color:var(--btn-ink);font:700 11px var(--font)}
.pt-wrap{display:grid;gap:10px;padding-top:12px}
.pt-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.pt-msg{max-width:min(78%,560px);justify-self:start;padding:10px 14px;border-radius:14px 14px 14px 4px;background:var(--paper);border:1px solid var(--line)}
.pt-msg.mine{justify-self:end;background:var(--pink);color:var(--btn-ink);border-color:var(--pink);border-radius:14px 14px 4px 14px}
.pt-msg.from-admin:not(.mine){border-color:var(--gold);background:rgba(255,210,63,.1)}.pt-msg.from-resident:not(.mine){background:var(--plum)}
.pt-who{display:block;font:600 12px var(--font);color:var(--mute);margin-bottom:3px}.pt-who time{font-weight:400;color:var(--dim);margin-left:4px}.pt-msg.mine .pt-who,.pt-msg.mine .pt-who time{color:var(--btn-ink);opacity:.8}
.pt-body{margin:0;font-size:15px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.pt-empty{font-size:14.5px;color:var(--mute);padding:10px 12px;border:1px dashed var(--line);border-radius:10px}
.pt-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}.pt-form .f textarea{min-height:46px;font-size:15px}.pt-form [data-thread-msg]{grid-column:1/-1;min-height:0;font-size:13.5px}.pt-form [data-thread-msg]:empty{display:none}
@media (max-width:820px){.rq-card{scroll-margin-top:132px}.pt-msg{max-width:92%}.rq-admin .f-row{grid-template-columns:1fr}.ib-time{font-size:12px}.ib-btn{padding:12px 14px}.inbox-tools{margin-top:-6px}}
@media (max-width:820px){h1{font-size:clamp(34px,9vw,48px)}.hero{grid-template-columns:1fr}.hero-pic{grid-column:1;grid-row:auto}.doors{grid-template-columns:1fr}.steps{grid-template-columns:1fr}.deal,.deal-3{grid-template-columns:1fr 1fr}.part-me{grid-template-columns:1fr}.night-pick{grid-template-columns:1fr}.f-row{grid-template-columns:1fr}.rp-body{grid-template-columns:1fr}.rp-side{position:static}.rp-gal{grid-template-columns:1fr 1fr}.rp-collage{grid-template-columns:1fr 1fr;grid-template-rows:1.5fr 1fr 1fr;height:60vh}.rp-collage .cg0{grid-column:1/3;grid-row:1}.rp-collage .cg1{grid-column:1;grid-row:2}.rp-collage .cg2{grid-column:2;grid-row:2}.rp-collage .cg3{grid-column:1;grid-row:3}.rp-collage .cg4{grid-column:2;grid-row:3}.brand{font-size:19px}.brand span{display:none}.cta-l{display:none}.cta-s{display:inline}.top{gap:8px;padding:10px 14px}.top-nav{gap:2px}.top-nav a{padding:7px 8px;font-size:12px;white-space:nowrap}.top-nav .top-in{display:none}.top-nav .top-switch{display:none}.top-nav .top-cta{padding:7px 10px}.make .f-row{grid-template-columns:1fr}.res-table thead{display:none}.res-table tr{display:grid;gap:4px;padding:10px 0}.res-table td{border:0;padding:2px 0}.portal-nav{position:fixed;left:0;right:0;top:57px;display:flex;padding:6px var(--pad);background:rgba(11,7,16,.96);border-bottom:1px solid var(--line);z-index:19}.portal{padding-top:50px}.me-email{display:none}.offer{grid-template-columns:1fr 1fr}.offer input[data-o=d]{grid-column:1/-1}.ed-sec{scroll-margin-top:132px}}

/* ---- The Floor's own pieces ---- */
h1,h2,h3{font-weight:400}h2{max-width:26ch}h1 em,h2 em{font-style:normal;color:var(--pink);text-shadow:0 0 22px rgba(255,94,156,.45)}
.eyebrow,.kicker{font:400 12px var(--mono);letter-spacing:.16em;color:var(--turq)}
.top{border-bottom:0;background:linear-gradient(rgba(11,7,16,.85),rgba(11,7,16,0));backdrop-filter:none}.top.is-solid{background:rgba(11,7,16,.86);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
.brand{font-size:23px}.brand .brand-star{color:var(--orange);text-shadow:0 0 12px var(--orange);margin:0 8px 0 0;font:inherit;letter-spacing:0;text-transform:none}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 30px rgba(255,94,156,.35)}.btn.ghost:hover{box-shadow:none;border-color:#fff}
.aside{border-left-color:var(--turq)}
/* the stage: sunset, mirror ball, the words */
.stage{position:relative;min-height:100vh;min-height:100svh;margin:-64px calc(50% - 50vw) 0;padding:0 var(--pad);overflow:hidden;display:grid;align-items:end;background:linear-gradient(180deg,#140a1a 0%,#2b1236 42%,#6a2248 70%,#c4473f 88%,#ff9a3c 100%)}
.stage .sky{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,#07050c,#150d2a 60%,rgba(11,7,16,0));opacity:.55}
.stage .spots{position:absolute;inset:0;z-index:2;width:100%;height:100%;opacity:.8}.stage::after{content:"";position:absolute;left:0;right:0;bottom:0;height:240px;z-index:4;pointer-events:none;background:linear-gradient(rgba(11,7,16,0) 0%,rgba(11,7,16,.35) 40%,rgba(11,7,16,.8) 75%,var(--paper) 100%)}
.ball-wrap{position:absolute;z-index:3;left:50%;top:9vh;width:min(22vw,230px);height:min(22vw,230px);transform:translateX(-50%)}
.ball{width:100%;height:100%;display:block;filter:drop-shadow(0 0 30px rgba(255,255,255,.25))}
.ball-chain{position:absolute;left:50%;bottom:100%;width:2px;height:12vh;background:linear-gradient(#ccc,rgba(204,204,204,0));transform:translateX(-50%)}
.scene{position:relative;z-index:6;max-width:1100px;margin:0 auto;width:100%;padding:34vh 0 clamp(70px,10vh,120px);text-align:center}
.scene .est{margin:0 0 14px;font:500 12px/1.4 var(--font);letter-spacing:.3em;text-transform:uppercase;color:var(--silver)}
.scene h1{max-width:none;font-size:clamp(56px,10vw,140px);line-height:.92;text-shadow:0 0 2px #fff,0 0 22px rgba(255,94,156,.5),0 4px 40px rgba(10,6,20,.8)}
.scene h1 span{color:#fff}.scene h1 em{display:block;color:#fff3d6;text-shadow:0 0 2px #fff,0 0 22px rgba(62,224,207,.7),0 4px 40px rgba(10,6,20,.8)}
.scene .lede{max-width:620px;margin:22px auto 26px;color:#ffe9de;text-shadow:0 2px 16px rgba(10,6,20,.85)}
.scene .doors{max-width:720px;margin:0 auto}
/* the reel of real nights */
.reel{padding:56px 0 0;margin:0 calc(50% - 50vw);overflow:hidden}.reel-head{max-width:1100px;margin:0 auto 22px;padding:0 var(--pad)}
.reel-rows{display:grid;gap:10px;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.reel-row{display:flex;gap:10px;width:max-content;animation:reel 90s linear infinite}.reel-row.rev{animation-direction:reverse;animation-duration:110s}.reel-rows:hover .reel-row{animation-play-state:paused}
.reel-row img{height:clamp(150px,22vw,240px);width:auto;aspect-ratio:4/3;object-fit:cover;border-radius:10px;background:var(--card);filter:saturate(1.04)}
@keyframes reel{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.reel-row{animation:none}.reel-rows{overflow-x:auto;mask-image:none;-webkit-mask-image:none}}
/* the collage drifts */
.rp-cover{background:#000}.rp-cover:not(.rp-collage) img{filter:saturate(1.05)}
.rp-collage{gap:3px;background:#000}.rp-collage .cg{background:#0b0710}.rp-collage .cg img{transform-origin:50% 50%;animation:cg-drift 26s ease-in-out infinite alternate;filter:saturate(1.05) contrast(1.04)}
.rp-collage .cg1 img{animation-delay:-7s;animation-duration:31s}.rp-collage .cg2 img{animation-delay:-13s;animation-duration:24s;animation-direction:alternate-reverse}.rp-collage .cg3 img{animation-delay:-19s;animation-duration:29s;animation-direction:alternate-reverse}.rp-collage .cg4 img{animation-delay:-4s;animation-duration:34s}
@keyframes cg-drift{from{transform:scale(1.06) translate(-1.5%,-1%)}to{transform:scale(1.14) translate(1.5%,1.2%)}}
.cg-veil{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(11,7,16,.32),rgba(11,7,16,0) 30%,rgba(11,7,16,.05) 60%,var(--paper)),radial-gradient(60% 50% at 0% 100%,rgba(255,94,156,.22),transparent 70%),radial-gradient(50% 45% at 100% 0%,rgba(62,224,207,.16),transparent 70%)}
@media (prefers-reduced-motion:reduce){.rp-collage .cg img{animation:none}}
.rp-cover img,.rp-cover .cg{border-radius:16px}.rp-collage{border-radius:16px;overflow:hidden}
/* the wristband opens the name's column, clear of the cover: level with the
   booking card on a wide screen, its beads lined up with the name (the canvas
   is wider than the ring), and centered over the name at 820 and under. The
   canvas keeps room around the ring for a tilt and for the beads dropping in,
   so it tucks into the gap under the cover without reaching it. A sideways
   drag spins it; an up or down swipe still scrolls the page. */
.rp-band{width:300px;margin:-24px 0 -8px -50px}
.rp-band .band-cv{width:100%;height:auto;aspect-ratio:10/7;display:block}.rp-band .band-live-cv{cursor:grab;touch-action:pan-y}.rp-band .band-live-cv.grab{cursor:grabbing}
.res-embed .rp-band{pointer-events:auto}.res-embed .rp-band canvas{pointer-events:none}
.foot-switch a{color:var(--turq)}
@media (max-width:820px){.rp-band{width:min(270px,72vw);margin:-24px auto -6px}.brand{font-size:18px}.top-nav a{padding:7px 6px}.top-nav .top-cta{padding:7px 9px}.stage{margin:-52px calc(50% - 50vw) 0;min-height:92vh;min-height:92svh}.scene{padding-top:30vh}.ball-wrap{top:7vh;width:120px;height:120px}}

/* the portal nav scrolls sideways on phones instead of widening the page (six tabs for admins) */
@media (max-width:820px){.portal-nav{overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap}.portal-nav::-webkit-scrollbar{display:none}.portal-nav .pnav{flex:none;white-space:nowrap}}

/* the LoneForge Events logo at the top of every footer (transparent version, made for dark grounds) */
.foot-logo{display:inline-block;margin:0 auto 10px;line-height:0;opacity:.92;transition:opacity .15s}.foot-logo:hover{opacity:1}.foot-logo:focus-visible{outline:2px solid var(--turq);outline-offset:4px}.foot-logo img{display:block;width:180px;height:auto}

/* long words people type (a name with no spaces, a pasted link, emoji runs) wrap instead of pushing the page sideways */
.rp-name,.rp-bio,.rp-kind,.tile-name,.pk-t,.pk-d,.nd-name,.pt-body,.pt-who,.app-line,.app-notes,.cq-who,.cq-v,.cq-card,.rq-vendors b,.fb-body{overflow-wrap:anywhere}
/* the narrowest phones (360 and below): the header row keeps the logo, the two links and Join free on one line */
@media (max-width:380px){.top{gap:6px;padding-left:10px;padding-right:10px}.brand{font-size:16px}.top-nav{gap:0;min-width:0}.top-nav a{padding:6px 5px;font-size:12px}.top-nav .top-cta{padding:6px 8px}}

/* The admin area (/admin: src/admin.html, src/admin.js) on The Floor.
   The shapes match themes/letter/admin.css line for line; the tokens below
   and "The Floor's own touches" at the end are The Floor's. Nothing here is
   fixed to the bottom of the screen except the toast (data-dock="float",
   from app.css); the page keeps 96px under its last row so the Feedback
   button never covers it. Layers: the header is the top bar (20). */
.adm-top,.adm{--adm-card:var(--card);--adm-sunk:rgba(255,255,255,.035);--adm-hover:rgba(255,255,255,.055);--adm-ring:var(--turq);--adm-strong:var(--pink);--adm-strong-ink:var(--btn-ink);
  --p-gray:rgba(255,255,255,.09);--p-gray-ink:var(--mute);--p-red:rgba(255,94,156,.17);--p-red-ink:#ffa3c8;--p-green:rgba(62,224,207,.15);--p-green-ink:#86f3e7;--p-gold:rgba(255,210,63,.15);--p-gold-ink:#ffdb6b;--p-blue:rgba(138,92,255,.25);--p-blue-ink:#d4c6ff;--p-warn-line:rgba(255,210,63,.55);
  --p-accent:var(--pink);--p-accent-ink:var(--btn-ink);--adm-bad:var(--pink);--adm-good:var(--turq);--adm-shadow:none;
  --adm-search:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239d8aa0' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M20 20l-4.8-4.8'/%3E%3C/svg%3E")}

/* ---- the header: brand, the six screens, who's signed in ---- */
.adm-top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px 18px;padding:10px var(--pad)}
.adm-brand{grid-column:1;white-space:nowrap}
.brand .adm-tag{display:inline-block;margin-left:10px;padding:4px 8px 3px;vertical-align:4px;border-radius:99px;background:var(--adm-strong);color:var(--adm-strong-ink);font:700 10.5px/1 var(--font);letter-spacing:.12em;text-transform:uppercase}
.adm-nav{grid-column:2;display:flex;align-items:center;gap:2px;min-width:0;overflow-x:auto;scrollbar-width:none;padding:2px}
.adm-nav::-webkit-scrollbar{display:none}
.adm-nav a{flex:none;display:inline-flex;align-items:center;min-height:36px;padding:0 12px;border:1px solid transparent;border-radius:99px;font:600 14px var(--font);color:var(--mute);text-decoration:none;white-space:nowrap}
.adm-nav a:hover{color:var(--ink);border-color:var(--line)}
.adm-nav a[aria-current]{background:var(--adm-strong);border-color:var(--adm-strong);color:var(--adm-strong-ink)}
.adm-nav a:focus-visible{outline:2px solid var(--adm-ring);outline-offset:-2px}
.adm-badge{display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 5px;margin-left:7px;border-radius:99px;background:var(--turq);color:var(--btn-ink);font:700 11px/1 var(--font)}
.adm-badge.bad{background:var(--adm-bad);color:var(--btn-ink)}
.adm-nav a[aria-current] .adm-badge{background:var(--btn-ink);color:var(--turq)}.adm-nav a[aria-current] .adm-badge.bad{background:var(--btn-ink);color:var(--pink)}
.adm-me{grid-column:3;display:flex;align-items:center;gap:4px 14px;justify-self:end;white-space:nowrap}
.adm-email{max-width:230px;overflow:hidden;text-overflow:ellipsis;font-size:13px;color:var(--mute)}
.adm-me-link{padding:6px 2px;border:0;background:none;color:var(--ink);font:600 13.5px var(--font);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px;cursor:pointer}
.adm-me-link:hover{text-decoration-color:currentColor}
.adm-me-link:focus-visible{outline:2px solid var(--adm-ring);outline-offset:2px;border-radius:4px}

/* ---- the page ---- */
.adm{max-width:1280px;margin:0 auto;padding:20px var(--pad) 96px;outline:none}
.adm-boot{margin:48px 0;color:var(--mute);font-size:15px}
.adm-view h1,.adm p{max-width:none}
.adm .adm-lede,.adm .fbl-body,.adm .vr-bio{max-width:80ch}
.adm-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 20px;flex-wrap:wrap;margin:6px 0 14px}
.adm-head h1{font-size:clamp(30px,3.2vw,42px);margin:0}
.adm-head .kicker{margin-bottom:10px}
.adm-view h1:focus,.adm-view h1:focus-visible{outline:none}
.adm-lede{margin:-4px 0 14px;font-size:15px;color:var(--mute)}.adm-lede b{color:var(--ink);font-weight:600}
.adm-bad{color:var(--adm-bad)}
.adm-link{padding:0;border:0;background:none;color:inherit;font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* sign in, and the refusal */
.adm-gate{display:grid;place-items:center;min-height:calc(100vh - 170px);padding:24px 0}
.adm-gate h1{font-size:clamp(34px,4.4vw,52px)}
.adm-cta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:6px 0 0}

/* ---- tools: segmented filters, search, selects ---- */
.adm-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;margin:0 0 10px}
.adm-seg{display:inline-flex;flex-wrap:wrap;gap:3px;padding:3px;border:1px solid var(--line);border-radius:13px;background:var(--adm-card)}
.adm-seg button{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px;padding:0 12px;border:0;border-radius:10px;background:none;color:var(--mute);font:600 14px var(--font);white-space:nowrap;cursor:pointer}
.adm-seg button:hover{color:var(--ink);background:var(--adm-hover)}
.adm-seg button b{min-width:22px;padding:2px 7px;border-radius:99px;background:var(--p-gray);color:var(--ink);font:700 12px/1.2 var(--font);text-align:center}
.adm-seg button b:empty{display:none}
.adm-seg button.on{background:var(--adm-strong);color:var(--adm-strong-ink)}.adm-seg button.on b{background:rgba(42,0,18,.16);color:var(--adm-strong-ink)}
.adm-seg button:focus-visible{outline:2px solid var(--adm-ring);outline-offset:1px}
/* the pipeline: All | New > Waiting > All answered */
.adm-pipe [data-stage=all]{margin-right:9px}.adm-pipe [data-stage=all]::after{content:"";position:absolute;right:-7px;top:9px;bottom:9px;width:1px;background:var(--line)}
.adm-pipe [data-stage=new],.adm-pipe [data-stage=waiting]{margin-right:12px}
.adm-pipe [data-stage=new]::after,.adm-pipe [data-stage=waiting]::after{content:"\203A";position:absolute;right:-11px;top:50%;transform:translateY(-54%);color:var(--dim);font:500 18px/1 var(--font);pointer-events:none}
.adm-search{flex:1 1 280px;min-width:0;display:flex;max-width:460px}
.adm-search input{width:100%;min-width:0;min-height:44px;padding:8px 12px 8px 38px;border:1px solid var(--line);border-radius:12px;background:var(--field) var(--adm-search) no-repeat 13px 50%;color:var(--ink);font:400 15.5px var(--font)}
.adm-search input::-webkit-search-cancel-button{filter:grayscale(1);opacity:.6;cursor:pointer}
.adm-search input:focus{outline:none;border-color:var(--adm-ring);box-shadow:0 0 0 3px rgba(62,224,207,.22)}
.adm-check{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 4px;font:500 14px var(--font);color:var(--mute);cursor:pointer}
.adm-check input{width:17px;height:17px;margin:0;accent-color:var(--red)}
.adm-selects{display:flex;flex-wrap:wrap;gap:8px}
.adm-select{display:inline-flex;align-items:center;gap:4px;padding-left:11px;border:1px solid var(--line);border-radius:12px;background:var(--adm-card)}
.adm-select:focus-within{border-color:var(--adm-ring)}
.adm-select span{font:700 10.5px var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.adm-select select{min-height:40px;padding:0 10px 0 4px;border:0;border-radius:12px;background:transparent;color:var(--ink);font:600 14px var(--font);cursor:pointer;outline:none}
.adm-tools-v .adm-search{flex-basis:100%;max-width:none}
.adm-sum{min-height:1.5em;margin:0 0 10px;font-size:14px;color:var(--mute)}
.adm-more{margin:16px 0 0;text-align:center}
.adm-test{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0 0 0 auto}.adm-test .a-msg{font-size:14px}

/* ---- states: loading, empty, error, busy ---- */
.adm-loading{display:grid;gap:8px}
.adm-skel{display:grid;align-content:center;gap:9px;height:66px;padding:0 18px;border:1px solid var(--line);border-radius:14px;background:var(--adm-card);animation:adm-pulse 1.3s ease-in-out infinite}
.adm-skel i{display:block;width:34%;height:10px;border-radius:99px;background:var(--p-gray)}.adm-skel i+i{width:62%;opacity:.7}
@keyframes adm-pulse{50%{opacity:.55}}
.adm-empty{display:grid;gap:4px;padding:16px 18px;border:1px dashed var(--line);border-radius:12px;font-size:14.5px;line-height:1.5;color:var(--mute)}
.adm-empty b{font-size:15.5px;color:var(--ink)}
.adm-error{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;padding:14px 16px;border:1px solid var(--adm-bad);border-radius:12px;background:var(--p-red);color:var(--ink)}.adm-error p{margin:0}
.adm-busy{opacity:.5;pointer-events:none;transition:opacity .15s}
.adm-gone{padding:24px 0}.adm-gone h1{font-size:clamp(30px,3.2vw,42px)}

/* ---- pills: one color per meaning, on every screen ---- */
.adm .pill{min-height:24px;padding:0 9px;white-space:nowrap;font:600 12px var(--font);background:var(--p-gray);color:var(--p-gray-ink)}
.adm .pill.sg-new,.adm .pill.ap-new,.adm .pill.fb-new{background:var(--p-accent);color:var(--p-accent-ink)}
.adm .pill.sg-waiting,.adm .pill.an-wait,.adm .pill.ap-contacted{background:var(--p-gold);color:var(--p-gold-ink)}
.adm .pill.sg-done,.adm .pill.an-yes,.adm .pill.pub-on,.adm .pill.ap-vendor,.adm .pill.em-ok{background:var(--p-green);color:var(--p-green-ink)}
.adm .pill.an-no,.adm .pill.em-bad,.adm .pill.fk-bug{background:var(--p-red);color:var(--p-red-ink)}
.adm .pill.fk-idea,.adm .pill.vi-house{background:var(--p-blue);color:var(--p-blue-ink)}
.adm .pill.warn{background:transparent;box-shadow:inset 0 0 0 1px var(--p-warn-line);color:var(--p-gold-ink)}
.adm .pill.em-k{background:transparent;box-shadow:inset 0 0 0 1px var(--line);color:var(--mute)}
.adm .pill.sg-spam,.adm .pill.ap-declined,.adm .pill.fb-done,.adm .pill.pub-off,.adm .pill.fk-other{background:var(--p-gray);color:var(--p-gray-ink)}

/* ---- cards and rows (Today, a request, a vendor) ---- */
.adm-card{min-width:0;padding:16px 18px 18px;border:1px solid var(--line);border-radius:16px;background:var(--adm-card);box-shadow:var(--adm-shadow)}
.adm-card-h{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;margin:0 0 8px}
.adm-card-h h2,.adm-h2{max-width:none;margin:0;font:500 19px/1.2 var(--display);letter-spacing:-.005em}
.adm-h2{display:flex;align-items:center;gap:10px;margin:0 0 10px}
.adm-h3{margin:16px 0 4px;font:700 11px var(--font);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.adm-n{display:inline-grid;place-items:center;min-width:26px;height:24px;padding:0 8px;border-radius:99px;background:var(--p-gray);color:var(--mute);font:700 12.5px/1 var(--font)}
.adm-n.hot{background:var(--p-accent);color:var(--p-accent-ink)}
.adm-card-a{margin-left:auto;font:600 13.5px var(--font);color:var(--red);text-decoration:none;white-space:nowrap}.adm-card-a:hover{text-decoration:underline}
.adm-card-sub{margin:-4px 0 10px;font-size:13.5px;color:var(--mute)}
.adm-card-more{margin:8px 0 0;font-size:13.5px;color:var(--mute)}.adm-card-more a{color:var(--ink);font-weight:600}
.adm-rows{list-style:none;margin:0;padding:0}
.adm-rows li+li{border-top:1px solid var(--line)}
.adm-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 14px;align-items:baseline;margin:0 -10px;padding:10px;border-radius:10px;color:var(--ink);text-decoration:none}
.adm-row:hover{background:var(--adm-hover)}
.adm-row:focus-visible{outline:2px solid var(--adm-ring);outline-offset:-2px}
.adm-row-t{min-width:0;font-size:15px;line-height:1.4;overflow-wrap:anywhere}.adm-row-t b{font-weight:650}.adm-row-t .pill{vertical-align:1px;margin-right:4px}
.adm-row-s{grid-column:1;min-width:0;font-size:13.5px;line-height:1.45;color:var(--mute);overflow-wrap:anywhere}.adm-row-s .pill{margin-right:4px}
.adm-row-x{grid-column:2;grid-row:1;font-size:12.5px;color:var(--dim);white-space:nowrap;text-align:right}

/* ---- Today ---- */
.adm-stat{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:end;gap:8px 36px;margin:0 0 16px;padding:18px 22px;border:1px solid var(--line);border-radius:18px;background:var(--adm-card);box-shadow:var(--adm-shadow)}
.adm-stat-k{grid-column:1/-1;margin:0;font:700 11px var(--font);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.adm-stat-n{display:flex;align-items:baseline;gap:12px;margin:0}.adm-stat-n b{font:500 64px/.95 var(--display);letter-spacing:-.02em}.adm-stat-n span{font-size:14px;color:var(--mute)}
.adm-stat-vs{display:grid;margin:0;padding-left:24px;border-left:1px solid var(--line)}.adm-stat-vs span{font-size:13px;color:var(--mute);white-space:nowrap}.adm-stat-vs b{font:500 32px/1.1 var(--display);color:var(--mute)}
.adm-stat-note{margin:0;justify-self:end;text-align:right;font-size:14px;color:var(--mute)}.adm-stat-note a{display:inline-block;margin-left:6px;color:var(--red);font-weight:600;text-decoration:none;white-space:nowrap}.adm-stat-note a:hover{text-decoration:underline}
.adm-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:stretch}
.adm-grid #t-nights{grid-column:1/-1}
.adm-nights{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px;align-items:start}
.adm-night{display:grid;grid-template-columns:58px minmax(0,1fr);gap:12px;align-items:start;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--adm-sunk)}
.adm-night-d{display:grid;justify-items:center;gap:1px;padding:7px 0;border-radius:10px;background:var(--adm-card);border:1px solid var(--line)}
.adm-night-d b{font:700 11px var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--red)}.adm-night-d span{font:500 17px/1.1 var(--display)}
.adm-night-r{list-style:none;margin:0;padding:2px 0 0;display:grid;gap:8px}
.adm-night-r li{display:grid;gap:4px}
.adm-night-r a{color:var(--ink);text-decoration:none;font-size:14.5px;line-height:1.35}.adm-night-r a b{font-weight:650}.adm-night-r a:hover{text-decoration:underline}
.adm-night-r a:focus-visible{outline:2px solid var(--adm-ring);outline-offset:2px;border-radius:4px}
.adm-night-v{display:flex;flex-wrap:wrap;gap:4px}

/* ---- lists: requests and vendors ---- */
.adm-items{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.adm-item{display:grid;align-items:center;gap:6px 20px;padding:14px 18px;border:1px solid var(--line);border-radius:14px;background:var(--adm-card);color:var(--ink);text-decoration:none;box-shadow:var(--adm-shadow);transition:border-color .12s,background .12s}
.adm-item:hover{border-color:var(--ink)}
.adm-item:focus-visible{outline:2px solid var(--adm-ring);outline-offset:2px}
.rq-item{grid-template-columns:128px minmax(0,1fr) 170px}
.ri-night{display:grid;gap:2px}.ri-night b{font:500 18px/1.15 var(--display)}.ri-night small{font-size:13px;color:var(--mute)}
.ri-main{display:grid;gap:4px;min-width:0}
.ri-who{font-size:16px;min-width:0;overflow-wrap:anywhere}.ri-who b{font-weight:650}.ri-who span{margin-left:6px;font-size:13.5px;color:var(--mute)}
.ri-contact{font-size:13px;color:var(--dim);overflow-wrap:anywhere}.ri-contact:empty{display:none}
.ri-vendors{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.ri-side{display:grid;justify-items:end;gap:3px;text-align:right}.ri-side .pill{margin-bottom:3px}.ri-side small{font-size:12.5px;color:var(--dim)}.ri-side small:empty{display:none}
.vchip{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:3px 10px 3px 8px;border:1px solid var(--line);border-radius:99px;background:var(--adm-sunk);font:600 12.5px/1.3 var(--font);color:var(--ink)}
.vchip i{flex:none;width:8px;height:8px;border-radius:50%;background:var(--dim)}.vchip small{font-weight:500;color:var(--mute)}
.vchip.an-wait i{background:var(--gold)}.vchip.an-yes i{background:var(--green)}.vchip.an-no i{background:var(--red)}.vchip.an-none{color:var(--mute);font-weight:500}
.vd-item{grid-template-columns:56px minmax(0,1fr) auto}
.vi-pic{display:grid;place-items:center;width:56px;height:56px;overflow:hidden;border-radius:12px;background:rgba(var(--a),.14)}
.vi-pic img{width:100%;height:100%;object-fit:cover}.vi-pic i{font:500 24px/1 var(--display);font-style:normal;color:rgb(var(--a))}
.vi-main{display:grid;gap:2px;min-width:0}
.vi-name{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:16.5px}.vi-name b{font-weight:650;overflow-wrap:anywhere}
.vi-kind{font:600 12px var(--font);letter-spacing:.06em;text-transform:uppercase;color:rgb(var(--a))}
.vi-meta{font-size:13px;color:var(--dim);overflow-wrap:anywhere}
.vi-side{display:grid;justify-items:end;gap:6px}.vi-pills{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px}.vi-side small{font-size:12.5px;color:var(--dim)}

/* ---- one request, one vendor ---- */
.adm-back{margin:0 0 12px}.adm-back a{font:600 14px var(--font);color:var(--mute);text-decoration:none}.adm-back a:hover{color:var(--ink);text-decoration:underline}
.rd-head{margin:0 0 16px}.rd-head h1{margin:0 0 10px;font-size:clamp(30px,3.2vw,42px)}
.rd-pills{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:0;font-size:14px;color:var(--mute)}
.rd-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,390px);gap:16px;align-items:start}
.rd-main,.rd-side{display:grid;gap:16px;min-width:0}
.rd-vendors{list-style:none;margin:0;padding:0}
.rd-v{padding:12px 0}.rd-v+.rd-v{border-top:1px solid var(--line)}.rd-v:first-child{padding-top:2px}
.rd-v-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.rd-v-top a{color:var(--ink);text-underline-offset:3px}.rd-v-top b{font-size:16.5px;font-weight:650}.rd-v-top small{color:var(--mute)}
.rd-v-meta{margin:3px 0 0;font-size:13.5px;color:var(--mute)}.rd-v-meta a{color:var(--mute)}
.rd-v-picks{margin:6px 0 0;font-size:14px}.rd-v-picks span{margin-right:4px;font:700 11px var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.rd-dl{display:grid;margin:0}
.rd-dl>div{display:grid;grid-template-columns:92px minmax(0,1fr);gap:10px;padding:8px 0;border-top:1px solid var(--line)}.rd-dl>div:first-child{border-top:0;padding-top:0}
.rd-dl dt{padding-top:3px;font:700 11px var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.rd-dl dd{margin:0;font-size:15px;overflow-wrap:anywhere}.rd-dl dd a{color:var(--ink)}
.rd-notes{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:var(--adm-sunk);font-size:14.5px;white-space:pre-wrap;overflow-wrap:anywhere}
.rd-answer,.rd-reply{display:grid;gap:10px}
.rd-answer .f textarea,.rd-reply .f textarea{min-height:48px;font-size:15px}
.rd-answer .f>span em{font-style:normal;font-weight:500;text-transform:none;letter-spacing:0;color:var(--dim)}
.rd-reply{margin-top:12px;padding-top:12px;border-top:1px dashed var(--line)}
.rd-btns{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:0}.rd-btns .a-msg{font-size:14px}
.rd-hint{font-size:12.5px;color:var(--dim)}
.rd-mails{list-style:none;margin:0;padding:0}
.rd-mails li{display:grid;gap:1px;padding:7px 0;border-top:1px solid var(--line)}.rd-mails li:first-child{border-top:0;padding-top:0}
.rd-mail-t{font-size:14px;overflow-wrap:anywhere}.rd-mail-s{font-size:13px;color:var(--mute)}.rd-mails .bad .rd-mail-s{color:var(--adm-bad)}
.adm .pt-list{margin-top:2px}.adm .pt-msg.from-customer:not(.mine){background:var(--adm-sunk)}
.vr-head{display:flex;align-items:center;gap:18px;margin:0 0 14px}
.vr-pic{width:84px;height:84px;border-radius:18px;flex:none}.vr-pic i{font-size:36px}
.vr-title{min-width:0}.vr-title .kicker{color:rgb(var(--a));margin-bottom:8px}.vr-title h1{margin:0 0 8px;font-size:clamp(30px,3.2vw,42px);overflow-wrap:anywhere}
.vr-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 14px}
.vr-rm{display:inline-flex;flex-wrap:wrap;gap:8px;margin-left:auto}
.adm .btn.danger.armed{background:var(--pink);border-color:var(--pink);color:var(--btn-ink)}
.vr-armed{margin:0 0 14px;padding:12px 14px;border:1px solid var(--adm-bad);border-radius:12px;background:var(--p-red);font-size:14.5px;color:var(--ink);max-width:none}
.vr-invite,.adm-invite{display:grid;gap:10px;margin:0 0 14px;padding:14px 16px;border:1px solid rgba(255,210,63,.6);border-radius:14px;background:rgba(255,210,63,.08);font-size:14.5px}.vr-invite p,.adm-invite p{margin:0;max-width:none}
.adm-copy{display:flex;gap:8px;min-width:0}
.adm-copy input{flex:1;min-width:0;min-height:40px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--field);color:var(--ink);font:500 13px ui-monospace,SFMono-Regular,Menlo,monospace}
.vr-pics{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 4px}.vr-pics img{width:96px;height:72px;object-fit:cover;border-radius:8px;background:var(--adm-sunk)}
.vr-more{display:grid;place-items:center;width:72px;height:72px;border-radius:8px;background:var(--adm-sunk);font:600 14px var(--font);color:var(--mute)}
.vr-bio{margin:12px 0 0;font-size:15px;line-height:1.55;color:var(--mute);white-space:pre-wrap;max-width:none}
.vr-offers{list-style:none;margin:0;padding:0}
.vr-offers li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 14px;padding:8px 0;border-top:1px solid var(--line)}.vr-offers li:first-child{border-top:0}
.vr-offers b{font-size:15px;font-weight:650}.vr-offers span{grid-column:1;font-size:13.5px;color:var(--mute)}.vr-offers em{grid-column:2;grid-row:1/3;font:500 18px var(--display);font-style:normal}
.vr-booked{margin:0 0 12px;font-size:14.5px;color:var(--mute)}.vr-booked b{margin-right:4px;font:500 30px/1 var(--display);color:var(--ink)}
.adm-cal{max-width:360px}.adm-cal .rp-cal .op,.adm-cal .rp-cal .sel{cursor:default}
.vr-next{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:14px 0 0}.vr-next span{margin-right:2px;font:700 11px var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.adm-chip{padding:5px 10px;border:1px solid var(--line);border-radius:99px;background:var(--adm-card);color:var(--ink);font:600 12.5px var(--font);cursor:pointer}.adm-chip:hover{border-color:var(--ink)}
.adm-chip:focus-visible{outline:2px solid var(--adm-ring);outline-offset:2px}

/* ---- applications and feedback: one card each ---- */
.adm-cards{display:grid;gap:12px}
.ap-card,.fbl-card{display:grid;gap:10px;scroll-margin-top:120px}
.ap-card.here{border-color:var(--red);animation:ed-flash 1.4s ease-out}
.ap-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}.ap-head h2{max-width:none;margin:0;font:500 22px/1.15 var(--display)}
.ap-kind{font:700 11.5px var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--red)}.ap-head .fine{font-size:13.5px}
.ap-contact{margin:0;font-size:14.5px;color:var(--mute);overflow-wrap:anywhere}.ap-contact a{color:var(--ink)}.ap-contact:empty{display:none}
.ap-notes,.fbl-body{margin:0;padding:10px 12px;border-radius:10px;background:var(--adm-sunk);font-size:14.5px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;max-width:none}
.ap-note>span em{margin-left:6px;font-style:normal;font-weight:500;text-transform:none;letter-spacing:0;color:var(--dim)}
.ap-saved{float:right;font-style:normal;font-weight:600;text-transform:none;letter-spacing:0;color:var(--dim)}.ap-saved.ok{color:var(--adm-good)}.ap-saved.err{color:var(--adm-bad)}
.ap-note textarea{min-height:56px;font-size:15px}
.ap-acts{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.ap-made{margin:0;font-size:14.5px;color:var(--mute)}.ap-made a{color:var(--ink);font-weight:600}
.ap-make{display:grid;gap:10px;margin-top:10px;padding:14px;border:1px dashed var(--line);border-radius:12px;background:var(--adm-sunk)}
.ap-make-h{margin:0;font:500 18px var(--display)}
.ap-make-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ap-moved{margin:0 0 8px;font:600 13.5px var(--font);color:var(--adm-good)}
.fbl-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}.fbl-head .fine{font-size:13.5px}
.fbl-body{background:transparent;padding:0;font-size:15.5px;color:var(--ink)}
.fbl-where{margin:0;font-size:14px;color:var(--mute);overflow-wrap:anywhere}.fbl-where a{color:var(--ink)}
.fbl-ua{margin:0;font-size:12px;color:var(--dim);overflow-wrap:anywhere}
.fbl-acts{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0}.fbl-acts .ap-moved{margin:0}
.fbl-card.is-done{background:var(--adm-sunk)}
/* wide screens: the action sits at the right of the card, level with its head */
@media (min-width:821px){.fbl-card{grid-template-columns:minmax(0,1fr) auto;column-gap:24px}.fbl-card>*{grid-column:1}.fbl-card>.fbl-acts{grid-column:2;grid-row:1/span 4;align-self:start;justify-content:flex-end}}

/* ---- the email log ---- */
.em-rows{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:14px;background:var(--adm-card);overflow:hidden}
.em-row{display:grid;grid-template-columns:150px 104px minmax(0,1fr) minmax(0,1.5fr) minmax(170px,.9fr);gap:12px;align-items:start;padding:11px 16px;font-size:14px;border-top:1px solid var(--line)}
.em-row:first-child{border-top:0}.em-row.bad{background:rgba(255,94,156,.07)}
.em-h{padding-top:9px;padding-bottom:9px;background:var(--adm-sunk);font:700 11px var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.em-when{font-size:13px;color:var(--mute);white-space:nowrap}
.em-to{overflow-wrap:anywhere}.em-subj{overflow-wrap:anywhere;color:var(--mute)}.em-subj a{color:inherit;text-decoration-color:var(--line);text-underline-offset:3px}.em-subj a:hover{color:var(--ink);text-decoration-color:currentColor}
.em-res{display:grid;justify-items:start;gap:4px}.em-err{font-size:12.5px;line-height:1.4;color:var(--adm-bad);overflow-wrap:anywhere}

/* ---- narrower screens ---- */
@media (max-width:1180px){
  .adm-top{grid-template-columns:auto minmax(0,1fr)}
  .adm-nav{grid-column:1/-1;grid-row:2;margin:0 calc(-1 * var(--pad));padding:2px var(--pad) 4px}
  .adm-me{grid-column:2;grid-row:1}
  .rq-item{grid-template-columns:120px minmax(0,1fr) 150px}
}
@media (max-width:900px){
  .rd-grid{grid-template-columns:minmax(0,1fr)}
  .rd-main,.rd-side{display:contents}
  .rd-c-customer{order:1}.rd-c-vendors{order:2}.rd-c-answer{order:3}.rd-c-thread{order:4}.rd-c-mails{order:5}
  .adm-stat{grid-template-columns:auto minmax(0,1fr);gap:10px 24px}
  .adm-stat-note{grid-column:1/-1;justify-self:start;text-align:left}
  .em-row{grid-template-columns:minmax(0,1fr) auto;gap:4px 12px}.em-h{display:none}
  .em-when{grid-column:1;grid-row:1}.em-kind{grid-column:2;grid-row:1;justify-self:end}.em-to{grid-column:1/-1}.em-subj{grid-column:1/-1}.em-res{grid-column:1/-1}
}
@media (max-width:820px){
  .adm-top{padding:8px 14px 0;gap:4px 10px}
  .adm-top .adm-brand .adm-tag{display:inline-block}
  .adm-nav{margin:0 -14px;padding:2px 14px 8px}
  .adm-email{display:none}
  .adm-me{gap:12px}
  .adm{padding-top:14px}
  .adm-grid{grid-template-columns:minmax(0,1fr)}
  .adm-seg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  #vd-pub{grid-template-columns:repeat(3,minmax(0,1fr))}
  .adm-pipe [data-stage]{margin-right:0}.adm-pipe [data-stage]::after{display:none}
  .adm-search{flex-basis:100%;max-width:none}
  .adm-selects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  .adm-select{min-width:0}.adm-select select{min-width:0;width:100%}
  .adm-test{margin-left:0}
  .adm-item{padding:13px 14px}
  .rq-item{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px}
  .ri-night{grid-column:1;grid-row:1}.ri-side{grid-column:2;grid-row:1;align-self:start}.ri-side small:not(:first-of-type){display:none}
  .ri-main{grid-column:1/-1}
  .vd-item{grid-template-columns:52px minmax(0,1fr);gap:8px 14px}.vd-item .vi-pic{width:52px;height:52px}
  .vi-side{grid-column:1/-1;justify-items:start}.vi-pills{justify-content:flex-start}
  .adm-stat{padding:16px 18px}.adm-stat-n b{font-size:54px}
  .adm-nights{grid-template-columns:minmax(0,1fr)}
  .vr-head{gap:14px}.vr-pic{width:64px;height:64px;border-radius:14px}
  .vr-rm{margin-left:0}
  .ap-make-row{grid-template-columns:minmax(0,1fr)}
  .adm-copy{flex-wrap:wrap}.adm-copy .btn{flex:none}
  .rd-dl>div{grid-template-columns:84px minmax(0,1fr)}
  .rd-hint{display:none}
}
@media (max-width:400px){
  .adm-me-link{font-size:13px}
  .brand.adm-brand{font-size:18px}
}
@media (prefers-reduced-motion:reduce){.adm-skel{animation:none}.ap-card.here{animation:none}}

/* the portal's header link to here (src/portal.html #to-admin, admins only):
   where the portal's header is tight it says "Admin" and the admin's own
   email steps aside for it (the admin area's header shows it); on a phone
   the three buttons stay on one line */
#to-admin .ta-s{display:none}
@media (max-width:1280px){#to-admin .ta-l{display:none}#to-admin .ta-s{display:inline}.portal-me:has(#to-admin:not([hidden])) .me-email{display:none}}
@media (max-width:820px){.portal-me .btn{white-space:nowrap}}

/* ---- The Floor's own touches ---- */
.adm-stat-k,.adm-h3,.adm-select span,.rd-dl dt,.vr-next span,.rd-v-picks span,.em-h,.adm-night-d b{font-family:var(--mono);font-weight:400;font-size:10.5px;letter-spacing:.1em}
.adm-stat-k{color:var(--turq)}
.adm-stat-n b{color:#fff;text-shadow:0 0 2px rgba(255,255,255,.55),0 0 26px rgba(255,94,156,.45)}
.adm-stat-vs b{color:var(--mute)}
.adm-card-a,.adm-stat-note a,.ap-kind,.adm-card-more a{color:var(--turq)}
.adm-night-d b{color:var(--pink)}
.adm-item:hover{border-color:rgba(255,255,255,.36);box-shadow:0 10px 34px rgba(255,94,156,.12)}
.adm-chip:hover,.adm-nav a:hover{border-color:rgba(255,255,255,.3)}
.brand .adm-tag{box-shadow:0 0 16px rgba(255,94,156,.4)}
.adm-nav a[aria-current],.adm-seg button.on{box-shadow:0 6px 22px rgba(255,94,156,.28)}
.adm-me-link{text-decoration-color:rgba(255,255,255,.3)}
.adm-search input,.adm-copy input{color-scheme:dark}
.adm-select select{color-scheme:dark;background:transparent}
.adm-select select option{background:var(--plum);color:var(--ink)}
.adm .pt-msg.from-customer:not(.mine){background:var(--plum)}
.vi-pic{background:rgba(var(--a),.18)}

/* The Floor: the guided page builder in the portal (src/builder*.js,
   BUILDER.md "The guided builder"). Plum and black, neon pink, turquoise.
   themes/letter/builder.css has the same rules in the same order; only the
   tokens at the top and the skin notes at the very end differ, so a change
   here goes there too. No inline styles (CSP): the scripts set only custom
   properties and positions through the CSSOM.
   Layers (START-HERE.md): the bar under the site header 18, the steps rail
   and the preview 2, the photo tray 5 (24 on phones), the phone tabs 25, the
   Move bar 32, sheets 60, the drag ghost 86. */
:root{--gb-acc:#ff5e9c;--gb-acc-rgb:255,94,156;--gb-acc-ink:#2a0012;--gb-on:#ff5e9c;--gb-on-ink:#2a0012;--gb-inv:#2b1840;--gb-inv-ink:#fff3ea;--gb-tb:#140b1b;--gb-tb-ink:#fff3ea;--gb-panel:#1a1023;--gb-page:#100a16;--gb-sheet:#130b1a;--gb-white:#2b1c3b;--gb-sunk:#0c0711;--gb-stage:#07040b;--gb-soft:rgba(255,255,255,.06);--gb-line2:rgba(255,220,220,.3);--gb-xb:rgba(0,0,0,.2);--gb-togoff:#4a3a56;--gb-chipbg:rgba(20,10,28,.9);--gb-veil:linear-gradient(rgba(11,7,16,.2),rgba(11,7,16,.82) 40%);--gb-ok:#3ee0cf;--gb-ok-rgb:62,224,207;--gb-ok-bg:rgba(62,224,207,.12);--gb-warn:#ffd23f;--gb-warn-rgb:255,210,63;--gb-warn-bg:rgba(255,210,63,.11);--gb-warn-line:rgba(255,210,63,.34);--gb-bad:#ff5e9c;--gb-bad-rgb:255,94,156;--gb-bad-bg:rgba(255,94,156,.13);--gb-bad-line:rgba(255,94,156,.42);--gb-on-status:#1a0d12;--gb-gold-rgb:255,210,63;--gb-tip-bg:rgba(255,255,255,.05);--gb-barbg:rgba(11,7,16,.93);--gb-shadow:0 1px 2px rgba(0,0,0,.35),0 14px 34px -16px rgba(0,0,0,.8);--gb-pop:0 22px 60px rgba(0,0,0,.65);--gb-scrim:rgba(5,2,8,.68);--gb-ph:linear-gradient(135deg,#2c1d3d,#402754);--gb-s-photo:#3a2850;--gb-s-photof:#2e2040;--gb-s-hill:#5f4380;--gb-s-sun:#ffd23f;--gb-s-text:#5a4868;--gb-s-line:rgba(255,220,220,.2);--gb-s-chip:#6d5a7a;--gb-s-open:#2a1d36}

/* ================= the frame of the builder ================= */
main.portal{max-width:none;padding-left:0;padding-right:0}
/* the builder scrolls on purpose (a step from its top, the page kept still under an edit): no glide unless asked */
html:has(#view-editor:not([hidden])),html.lfe-preview{scroll-behavior:auto}
.gb.p-editor{max-width:1560px;padding:0 var(--pad) 40px}
.gb button{font-family:var(--font)}
.gb-i{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.gb-i-dots{fill:currentColor;stroke:none}
.gb [data-pick]{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.gb-pimg{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--fx,50%) var(--fy,50%)}

/* the bar: the page's name, how you edit, Undo, health, save */
.gb-bar.ed-bar{position:sticky;top:var(--gb-top,0px);z-index:18;display:flex;align-items:center;flex-wrap:nowrap;gap:14px;margin:0 calc(var(--pad) * -1);padding:12px var(--pad);border-bottom:1px solid var(--line);background:var(--gb-barbg);backdrop-filter:blur(8px)}
.gb-title{min-width:0;flex:1 1 auto}
.gb-title .kicker{margin:0 0 4px;font-size:11px}
.gb-title h1{margin:0;max-width:none;font-size:clamp(22px,2vw,28px);line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gb-mode{display:inline-flex;flex:none;padding:3px;border:1px solid var(--line);border-radius:99px;background:var(--gb-panel)}
.gb-mode button{min-height:32px;padding:0 14px;border:0;border-radius:99px;background:none;color:var(--mute);font:600 13.5px var(--font);cursor:pointer;white-space:nowrap}
.gb-mode button:hover{color:var(--ink)}
.gb-mode button[aria-pressed=true]{background:var(--gb-on);color:var(--gb-on-ink)}
.gb-mode-m{display:none}
.gb-acts.ed-actions{flex:none;flex-wrap:nowrap;gap:8px}
.gb-ur{display:inline-flex;gap:2px}
.gb-ic{display:inline-grid;place-items:center;width:36px;height:36px;padding:0;border:1px solid transparent;border-radius:10px;background:none;color:var(--ink);cursor:pointer}
.gb-ic:hover:not(:disabled){border-color:var(--line);background:var(--gb-panel)}
.gb-ic:disabled{opacity:.3;cursor:default}
.gb .ed-status{min-width:72px;font-size:12.5px;color:var(--mute);text-align:right;white-space:nowrap}
.gb-health{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:4px 12px 4px 5px;border:1px solid var(--line);border-radius:99px;background:var(--gb-panel);color:var(--ink);cursor:pointer;text-align:left}
.gb-health:hover{border-color:var(--ink)}
.gb-health-t{display:grid;line-height:1.15}
.gb-health-t b{font-size:13.5px;white-space:nowrap}
.gb-health-t small{font-size:11.5px;color:var(--mute);white-space:nowrap}
.gb .pill{white-space:nowrap}

/* the health ring */
.gb-ring{position:relative;display:inline-grid;place-items:center;flex:none;width:34px;height:34px}
.gb-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.gb-ring circle{fill:none;stroke-width:4}
.gb-ring-bg{stroke:var(--gb-sunk)}
.gb-ring-fg{stroke:var(--gb-ok);stroke-linecap:round;transition:stroke-dashoffset .5s cubic-bezier(.2,.8,.2,1)}
.gb-ring-mid .gb-ring-fg{stroke:var(--gb-warn)}.gb-ring-low .gb-ring-fg{stroke:var(--gb-bad)}
.gb-ring em{position:relative;font:700 11.5px/1 var(--font);font-style:normal;color:var(--ink)}
.gb-ring-big{width:58px;height:58px}.gb-ring-big em{font-size:17px}

/* three columns: the steps, the panel, the page */
.gb-main{display:grid;grid-template-columns:176px minmax(360px,480px) minmax(0,1fr);gap:clamp(18px,2vw,32px);align-items:start;padding-top:20px}
.gb-rail{position:sticky;top:calc(var(--gb-top,0px) + var(--gb-bar,64px) + 20px);z-index:2}
.gb-rail-l{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.gb-rail-l li{position:relative}
.gb-rail-l li:not(:last-child)::after{content:"";position:absolute;left:21px;top:34px;bottom:-8px;width:2px;border-radius:2px;background:var(--line)}
.gb-stp{position:relative;display:flex;align-items:center;gap:10px;width:100%;min-height:42px;padding:5px 8px 5px 6px;border:0;border-radius:12px;background:none;color:var(--mute);font:500 14.5px var(--font);text-align:left;cursor:pointer}
.gb-stp:hover{background:var(--gb-soft);color:var(--ink)}
.gb-stp i{position:relative;z-index:1;display:inline-grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;border:1.5px solid var(--line);background:var(--gb-page);font:700 12.5px var(--font);font-style:normal;color:var(--mute)}
.gb-stp i .gb-i{width:15px;height:15px;stroke-width:2.6}
.gb-stp.done i{border-color:var(--gb-ok);background:var(--gb-ok);color:var(--gb-on-status)}
.gb-stp.warn i{border-color:var(--gb-warn);background:var(--gb-warn-bg);color:var(--gb-warn)}
.gb-stp.cur{background:var(--gb-panel);color:var(--ink);font-weight:700;box-shadow:var(--gb-shadow)}
.gb-stp.cur i{border-color:var(--gb-acc);background:var(--gb-acc);color:var(--gb-acc-ink)}
.gb-rail-t{margin:14px 0 0 8px;font-size:12.5px;color:var(--dim)}
.gb-col{min-width:0;display:flex;flex-direction:column}
.gb-form.ed-form{display:block;min-width:0}
.gb-pv{position:sticky;top:calc(var(--gb-top,0px) + var(--gb-bar,64px) + 20px);z-index:2;display:flex;flex-direction:column;gap:10px;min-width:0;height:calc(100vh - var(--gb-top,0px) - var(--gb-bar,64px) - 20px - 72px);min-height:420px}

/* ================= a step ================= */
.gb-step,.gb-all{display:grid;gap:16px;min-width:0}
.gb-sh{display:grid;gap:6px}
.gb-eb{margin:0;font:700 11.5px var(--font);letter-spacing:.14em;text-transform:uppercase;color:var(--gb-acc)}
.gb-sh h2{margin:0;max-width:none;font-size:clamp(26px,2.3vw,34px);outline:none}
.gb-sub{margin:0;font-size:15.5px;line-height:1.5;color:var(--mute)}
.gb-h3{margin:6px 0 0;font:600 12px var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.gb-h3 small{margin-left:6px;font-size:12px;letter-spacing:0;text-transform:none;color:var(--dim)}
.gb-card{display:grid;gap:14px;min-width:0;padding:18px;border:1px solid var(--line);border-radius:16px;background:var(--gb-panel)}
.gb-hint{margin:0;font-size:13.5px;line-height:1.45;color:var(--mute)}
.gb-inline:empty{display:none}
.gb-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px;padding-top:16px;border-top:1px solid var(--line)}
.gb-foot-t{font-size:12.5px;color:var(--dim);text-align:center}
.gb-foot .btn,.gb-foot .gb-btn{gap:8px}
.gb-classic{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 16px;padding:12px 14px;border:1px solid var(--gb-warn-line);border-radius:14px;background:var(--gb-warn-bg)}
.gb-classic p{flex:1 1 240px;margin:0;font-size:14px;line-height:1.45}

/* fields */
.gb-f{display:grid;gap:6px;min-width:0}
.gb-l{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0;font:600 14px var(--font);color:var(--ink)}
.gb-l>span{min-width:0}
.gb-count,.gb-opt{flex:none;font:500 12.5px var(--font);font-style:normal;color:var(--dim)}
.gb-count.near{color:var(--gb-warn)}.gb-count.good{color:var(--gb-ok)}
.gb-f>input,.gb-f>select,.gb-f>textarea,.gb-townadd input{width:100%;min-height:46px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--field);color:var(--ink);font:400 16px var(--font)}
.gb-f>textarea{resize:vertical;line-height:1.5}
.gb-f>input:focus,.gb-f>select:focus,.gb-f>textarea:focus,.gb-townadd input:focus{outline:none;border-color:var(--gb-acc);box-shadow:0 0 0 3px rgba(var(--gb-acc-rgb),.16)}
.gb .money-in input,.gb .slug-in input{min-height:44px;padding:10px 12px 10px 6px;font:400 16px var(--font);color:var(--ink)}
.gb-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.gb-meter{position:relative;display:block;height:6px;margin-top:2px;border-radius:99px;background:var(--gb-sunk);overflow:hidden}
.gb-meter b{position:absolute;top:0;bottom:0;background:rgba(var(--gb-ok-rgb),.2)}
.gb-meter i{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:var(--dim);transition:width .3s}
.gb-meter.good i{background:var(--gb-ok)}.gb-meter.long i{background:var(--gb-warn)}
.gb-start{display:flex}
.gb-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.gb-chips-l{margin-right:2px;font-size:13px;color:var(--mute)}
.gb-chip{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 13px;border:1px solid var(--line);border-radius:99px;background:var(--gb-panel);color:var(--ink);font:600 13px var(--font);cursor:pointer}
.gb-chip:hover{border-color:var(--ink)}
.gb-chip[aria-pressed=true]{border-color:var(--gb-on);background:var(--gb-on);color:var(--gb-on-ink)}
.gb-chip[aria-disabled=true]{opacity:.5}
.gb-chip small{font-weight:500;opacity:.75}
.gb-chip .gb-i{width:15px;height:15px}

/* buttons */
.gb-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:0 14px;border:1px solid var(--line);border-radius:99px;background:var(--gb-panel);color:var(--ink);font:600 13.5px var(--font);text-decoration:none;cursor:pointer;white-space:nowrap}
.gb-btn:hover{border-color:var(--ink)}
.gb-btn .gb-i{width:16px;height:16px}
.gb .btn{gap:8px}
.gb .btn .gb-i{width:17px;height:17px}
.gb-link{display:inline;padding:4px 2px;border:0;background:none;color:var(--gb-acc);font:600 14px var(--font);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.gb-mini{display:inline-grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--gb-panel);color:var(--ink);cursor:pointer}
.gb-mini:hover:not(:disabled){border-color:var(--ink)}
.gb-mini:disabled{opacity:.35;cursor:default}
.gb-mini .gb-i{width:15px;height:15px}
.gb-rm.armed{border-color:var(--gb-bad);background:var(--gb-bad);color:var(--gb-on-status)}
.gb-mini[aria-pressed=true]{border-color:var(--gb-acc);background:var(--gb-acc);color:var(--gb-acc-ink)}
.gb-btns{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.gb-addrow{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:0}
.gb-close{display:inline-grid;place-items:center;flex:none;width:40px;height:40px;margin-left:auto;padding:0;border:0;border-radius:50%;background:none;color:var(--mute);font-size:26px;line-height:1;cursor:pointer}
.gb-close:hover{background:var(--gb-soft);color:var(--ink)}
.gb :focus-visible{outline:2px solid var(--gb-acc);outline-offset:2px}

/* notes, badges, tags */
.gb-note{display:grid;gap:8px;padding:14px 16px;border-radius:14px;font-size:14.5px;line-height:1.5}
.gb-note p{margin:0}
.gb-note-ok{display:flex;align-items:flex-start;gap:10px;background:var(--gb-ok-bg);color:var(--ink)}
.gb-note-ok .gb-i{margin-top:2px;color:var(--gb-ok);stroke-width:2.4}
.gb-note-new{border:1px solid var(--gb-warn-line);background:var(--gb-warn-bg)}
.gb-badge{position:absolute;left:10px;top:10px;z-index:2;padding:4px 9px;border-radius:99px;background:var(--gb-acc);color:var(--gb-acc-ink);font:700 11px var(--font);letter-spacing:.02em;box-shadow:0 4px 12px rgba(0,0,0,.18)}
.gb-tag{display:inline-flex;align-items:center;min-height:22px;padding:0 9px;border-radius:99px;background:var(--gb-sunk);color:var(--mute);font:700 11px var(--font)}
.gb-good{display:flex;align-items:center;gap:10px;margin:0;padding:14px;border-radius:14px;background:var(--gb-ok-bg);font-size:14.5px}
.gb-good .gb-i{color:var(--gb-ok);stroke-width:2.4}
.gb-empty{display:grid;justify-items:center;gap:12px;padding:28px 20px;border:1.5px dashed var(--line);border-radius:16px;text-align:center;color:var(--mute)}
.gb-empty>.gb-i{width:34px;height:34px;color:var(--dim)}
.gb-empty p{margin:0;max-width:40ch;font-size:14.5px}
.gb-empty b{display:block;margin-bottom:4px;color:var(--ink);font-size:15.5px}
.gb-empty-s{margin:0;padding:16px;border:1.5px dashed var(--line);border-radius:14px;font-size:14px;color:var(--mute)}
@keyframes gb-hl{0%{box-shadow:0 0 0 0 rgba(var(--gb-acc-rgb),.55)}100%{box-shadow:0 0 0 14px rgba(var(--gb-acc-rgb),0)}}
.gb-hl{animation:gb-hl 1.3s ease-out}

/* the parts only a style can do, on a page still in its original layout */
.gb-dz{display:grid;gap:14px;min-width:0}
.gb-locked{position:relative;min-height:120px}
.gb-locked>:not(.gb-dz-cover){opacity:.4;filter:grayscale(.6)}
.gb-dz-cover{position:absolute;inset:0;z-index:3;display:grid;place-items:start center;padding:48px 16px 0;border:0;border-radius:16px;background:var(--gb-veil);cursor:pointer}
.gb-dz-cover span{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:99px;background:var(--gb-inv);color:var(--gb-inv-ink);font:600 14px var(--font);box-shadow:var(--gb-pop)}
.gb-dz-cover .gb-i{width:16px;height:16px}

/* health items (the drawer, a step's own, the dots' note) */
.gb-his{display:grid;gap:8px}
.gb-hi{display:grid;grid-template-columns:24px minmax(0,1fr);gap:4px 10px;padding:12px 14px;border-radius:12px;background:var(--gb-tip-bg)}
.gb-hi p{margin:0;font-size:14px;line-height:1.45}
.gb-hi-i{display:inline-grid;place-items:center;width:22px;height:22px;margin-top:1px;border-radius:50%;background:var(--dim);color:var(--gb-on-status);font:700 12px var(--font);font-style:italic}
.gb-hi-must{background:var(--gb-bad-bg)}.gb-hi-must .gb-hi-i{background:var(--gb-bad);font-style:normal}
.gb-hi-fix{background:var(--gb-warn-bg)}.gb-hi-fix .gb-hi-i{background:var(--gb-warn);font-style:normal}
.gb-hi .gb-hi-a{grid-column:2;display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.gb-hi .gb-btn{min-height:32px;padding:0 12px;font-size:13px}
.gb-fix{border-color:var(--gb-on);background:var(--gb-on);color:var(--gb-on-ink)}
.gb-fix:hover{border-color:var(--gb-on);filter:brightness(1.12)}

/* ================= Style ================= */
.gb-tpls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.gb-tpl{position:relative;display:grid;gap:10px;align-content:start;padding:8px 8px 14px;border:1px solid var(--line);border-radius:16px;background:var(--gb-panel);color:var(--ink);text-align:left;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s}
.gb-tpl:hover{border-color:var(--ink);transform:translateY(-1px)}
.gb-tpl[aria-pressed=true]{border-color:var(--gb-acc);box-shadow:inset 0 0 0 1.5px var(--gb-acc)}
.gb-tpl-t{display:grid;gap:2px;padding:0 6px}
.gb-tpl-t b{font:500 19px/1.15 var(--display)}
.gb-tpl-t small{font:700 11px var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--gb-acc)}
.gb-tpl-t span{margin-top:2px;font-size:13px;line-height:1.4;color:var(--mute)}
.gb-tpl-on{display:inline-flex;align-items:center;gap:5px;margin:0 6px;justify-self:start;padding:3px 10px 3px 7px;border-radius:99px;background:var(--gb-acc);color:var(--gb-acc-ink);font:700 11.5px var(--font)}
.gb-tpl-on .gb-i{width:13px;height:13px;stroke-width:2.8}
.gb-back-classic{display:grid;gap:4px;margin:4px 0 0}
.gb-back-classic .gb-link{justify-self:start;padding-left:0}
/* the little page each style is, drawn with your photos */
.gb-wire{display:flex;flex-direction:column;gap:5px;aspect-ratio:4/3;padding:6px;border:1px solid var(--line);border-radius:11px;background:var(--gb-page);overflow:hidden}
.gb-w-cov{display:block;flex:none;border-radius:5px;overflow:hidden;background:var(--gb-sunk)}
.gb-w-full{aspect-ratio:16/6}.gb-w-pano{aspect-ratio:4/1}
.gb-w-framed{aspect-ratio:16/6;padding:4px 20%;background:transparent}.gb-w-framed .gb-w-img,.gb-w-framed .gb-w-ph{border-radius:2px;box-shadow:0 0 0 3px var(--gb-white),0 3px 8px rgba(0,0,0,.25)}
.gb-w-coll{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:2px;aspect-ratio:16/6;background:transparent}.gb-w-coll>:first-child{grid-row:1/3}
.gb-w-img{display:block;width:100%;height:100%;object-fit:cover}
.gb-w-ph{display:block;width:100%;height:100%;background:var(--gb-ph)}
.gb-w-body{display:grid;grid-template-columns:minmax(0,1fr) 30%;gap:6px;flex:1;min-height:0}
.gb-w-main{display:flex;flex-direction:column;gap:3px;min-width:0;min-height:0;overflow:hidden}
.gb-w-main>i{display:block;flex:none;height:3px;border-radius:2px;background:var(--line)}
.gb-w-main>.gb-w-k{width:32%;background:var(--gb-acc)}.gb-w-main>.gb-w-h{width:74%;height:7px;background:var(--ink)}.gb-w-main>.gb-w-l{width:92%}
.gb-w-side{display:flex;flex-direction:column;gap:3px;align-self:start;padding:4px;border:1px solid var(--line);border-radius:5px;background:var(--gb-white)}
.gb-w-side i{display:block;height:3px;border-radius:2px;background:var(--line)}.gb-w-side i:first-child{width:60%;height:5px;background:var(--ink)}
.gb-w-side b{display:block;height:7px;margin-top:2px;border-radius:4px;background:var(--gb-acc)}
.gb-w-g{display:grid;flex:none;gap:2px;margin-top:3px}
.gb-w-g>*{border-radius:2px;overflow:hidden;min-width:0}
.gb-w-grid{grid-template-columns:repeat(3,1fr)}.gb-w-grid>*{aspect-ratio:4/3}
.gb-w-mas{grid-template-columns:repeat(3,1fr);align-items:start}.gb-w-mas>*{aspect-ratio:3/4}.gb-w-mas>:nth-child(2){aspect-ratio:4/3}
.gb-w-car{grid-template-columns:3fr 1fr}.gb-w-car>*{aspect-ratio:3/2}
.gb-w-feat{grid-template-columns:1fr}.gb-w-feat>:first-child{aspect-ratio:16/7}
.gb-w-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}.gb-w-strip>*{aspect-ratio:1;border-radius:2px;overflow:hidden}
.gb-w-menu,.gb-w-cards,.gb-w-hl{display:grid;flex:none;gap:2px;margin-top:3px}
.gb-w-menu i{display:block;height:4px;border-bottom:1px solid var(--line)}
.gb-w-cards{grid-template-columns:repeat(3,1fr)}.gb-w-cards i{display:block;height:12px;border:1px solid var(--line);border-radius:3px;background:var(--gb-white)}
.gb-w-hl{grid-template-columns:repeat(3,1fr)}.gb-w-hl i{display:block;height:8px;border-radius:2px;background:rgba(var(--gb-acc-rgb),.35)}
.gb-w-vid{display:block;flex:none;height:18px;margin-top:3px;border-radius:3px;background:var(--ink)}
.gb-w-ab{display:grid;flex:none;grid-template-columns:30% 1fr;gap:4px;margin-top:3px}.gb-w-ab>:first-child{aspect-ratio:4/5;border-radius:2px;overflow:hidden}.gb-w-ab span{display:grid;align-content:start;gap:3px}.gb-w-ab span i{display:block;height:3px;background:var(--line)}
.gb-w-cal{display:block;flex:none;height:16px;margin-top:3px;border-radius:3px;background:repeating-linear-gradient(90deg,var(--line) 0 5px,transparent 5px 7px)}
.gb-w-lines{display:grid;flex:none;gap:3px;margin-top:3px}.gb-w-lines i{display:block;height:3px;background:var(--line)}

/* ================= option tiles (banner styles, layouts, looks) ================= */
.gb-opts{display:grid;gap:10px}
.gb-opts-2{grid-template-columns:repeat(2,minmax(0,1fr))}.gb-opts-3{grid-template-columns:repeat(3,minmax(0,1fr))}.gb-opts-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.gb-opt-t{position:relative;display:grid;align-content:start;gap:8px;min-width:0;padding:7px 7px 10px;border:1px solid var(--line);border-radius:14px;background:var(--gb-panel);color:var(--ink);text-align:left;cursor:pointer;transition:border-color .15s}
.gb-opt-t:hover{border-color:var(--ink)}
.gb-opt-t[aria-pressed=true]{border-color:var(--gb-acc);box-shadow:inset 0 0 0 1.5px var(--gb-acc)}
.gb-opt-t.is-off{cursor:not-allowed}.gb-opt-t.is-off .gb-opt-th{opacity:.45;filter:grayscale(.7)}
.gb-opt-t .gb-badge{left:auto;right:8px;top:8px;font-size:10px;padding:3px 7px}
.gb-opt-th{position:relative;display:block;aspect-ratio:16/10;border-radius:9px;overflow:hidden;background:var(--gb-sunk)}
.gb-opt-tx{display:grid;gap:2px;padding:0 3px;min-width:0}
.gb-opt-tx b{font-size:14px;line-height:1.25}
.gb-opt-tx small{font-size:12.5px;line-height:1.35;color:var(--mute)}
.gb-why{display:flex;align-items:flex-start;gap:4px;color:var(--gb-warn)!important}
.gb-why .gb-i{width:13px;height:13px;margin-top:1px}
/* banner style thumbnails */
.gb-ct{position:absolute;left:8%;right:8%;top:10%;height:52%;display:block;border-radius:5px;overflow:hidden;background:var(--gb-ph)}
.gb-ct>i{display:block;width:100%;height:100%;background:var(--gb-ph)}
.gb-ct-framed{left:26%;right:26%;top:8%;height:56%;border-radius:2px;box-shadow:0 0 0 4px var(--gb-white),0 4px 10px rgba(0,0,0,.25)}
.gb-ct-pano{top:14%;height:30%}
.gb-ct-coll{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:2px;background:transparent}.gb-ct-coll>:first-child{grid-row:1/3}
.gb-ct-coll>*{min-width:0;min-height:0;overflow:hidden}
.gb-ct-l{position:absolute;left:8%;right:30%;bottom:12%;display:grid;gap:4px}
.gb-ct-l i{display:block;height:4px;border-radius:2px;background:var(--line)}.gb-ct-l i:first-child{width:60%;height:6px;background:var(--ink)}
/* gallery layout thumbnails, in your photos */
.gb-lt{position:absolute;inset:8%;display:grid;gap:3px}
.gb-lt>*,.gb-lt-strip>*,.gb-lt [class^=gb-lt-m]{display:block;min-width:0;min-height:0;border-radius:2px;overflow:hidden;background:var(--gb-ph)}
.gb-lt-grid{grid-template-columns:repeat(3,1fr);grid-template-rows:1fr 1fr}
.gb-lt-mas{display:block;columns:3;column-gap:3px}.gb-lt-mas>span{margin-bottom:3px;break-inside:avoid}.gb-lt-mas .gb-lt-m0{height:44%}.gb-lt-mas .gb-lt-m1{height:30%}.gb-lt-mas .gb-lt-m2{height:38%}
.gb-lt-car{grid-template-columns:4fr 1fr;inset:14% 0 14% 8%}
.gb-lt-feat{grid-template-rows:2fr 1fr}.gb-lt-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;background:none!important}
.gb-lt-coll{grid-template-columns:2fr 1fr 1fr;grid-template-rows:1fr 1fr}.gb-lt-coll>:first-child{grid-row:1/3}
.gb-lt-duo{grid-template-columns:1fr 1fr;inset:8% 20%}
/* package layout thumbnails */
.gb-pt{position:absolute;inset:12% 10%;display:grid;gap:5px}
.gb-pt i{display:block;border-radius:3px}
.gb-pt-menu i{border-bottom:1.5px solid var(--line);background:linear-gradient(90deg,var(--ink) 0 38%,transparent 38% 78%,var(--gb-acc) 78% 92%,transparent 92%) no-repeat 0 40%/100% 4px}
.gb-pt-cards{grid-template-columns:1fr 1fr}.gb-pt-cards i{border:1px solid var(--line);background:var(--gb-white)}
.gb-pt-cmp{grid-template-columns:repeat(3,1fr);align-items:end}.gb-pt-cmp i{height:78%;border:1px solid var(--line);background:var(--gb-white)}.gb-pt-cmp i:nth-child(2){height:100%;border-color:var(--gb-acc);box-shadow:0 0 0 1px var(--gb-acc)}

/* ================= Banner ================= */
.gb-sizes{display:grid;gap:12px;align-items:start}
.gb-size{display:grid;gap:9px;min-width:0}
.gb-size-b{display:block;width:100%;padding:0;border:0;border-radius:10px;background:none;outline:2px solid transparent;outline-offset:3px;cursor:pointer}
.gb-size-b:hover{outline-color:var(--line)}
.gb-size.is-sel .gb-size-b{outline-color:var(--gb-acc)}
.gb-size-img{position:relative;display:block;width:100%;border-radius:10px;overflow:hidden;background:var(--gb-sunk)}
.gb-bcv{display:block;width:100%;height:100%}
.gb-bcoll{display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:1fr 1fr;gap:2px;width:100%;height:100%}
.gb-bcell{position:relative;min-width:0;min-height:0;padding:0;border:0;overflow:hidden;background:var(--gb-sunk);cursor:grab}
.gb-bcell:nth-child(1){grid-column:1/7;grid-row:1/3}.gb-bcell:nth-child(2){grid-column:7/10;grid-row:1}.gb-bcell:nth-child(3){grid-column:10/13;grid-row:1}.gb-bcell:nth-child(4){grid-column:7/10;grid-row:2}.gb-bcell:nth-child(5){grid-column:10/13;grid-row:2}
.gb-warn{position:absolute;right:6px;top:6px;z-index:2;display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--gb-bad);color:var(--gb-on-status);font:800 13px var(--font);box-shadow:0 2px 6px rgba(0,0,0,.3)}
.gb-warn-soft{background:var(--gb-warn);font-style:italic}
.gb-size-cap{display:grid;justify-items:start;gap:4px;min-width:0;font-size:13px}
.gb-size-n{display:flex;align-items:center;gap:5px;min-width:0;white-space:nowrap}
.gb-size-cap .gb-i{width:15px;height:15px;color:var(--mute)}
.gb-st{padding:2px 8px;border-radius:99px;background:var(--gb-sunk);color:var(--mute);font:700 11px var(--font);font-style:normal}
.gb-st-crop{background:rgba(var(--gb-acc-rgb),.12);color:var(--gb-acc)}.gb-st-own{background:var(--gb-ok-bg);color:var(--gb-ok)}
.gb-sizes-h{margin-top:-4px}
.gb-bdet{gap:12px}
.gb-bdet-h{display:flex;align-items:center;gap:12px}
.gb-bdet-h b{display:block;font-size:15.5px}.gb-bdet-h small{display:block;font-size:13px;color:var(--mute)}
.gb-dev{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--gb-sunk)}
.gb-bbig{position:relative;justify-self:center;width:100%;max-height:360px;border-radius:12px;overflow:hidden;background:var(--gb-sunk)}
.gb-bbig[data-ar=m]{width:auto;height:340px}
.gb-bbig[data-ar=t]{width:auto;height:320px;max-width:100%}
.gb-bq{margin:0;font-size:13.5px}.gb-q-good{color:var(--gb-ok)}.gb-q-soft{color:var(--gb-warn)}.gb-q-bad{color:var(--gb-bad)}
.gb-bpick{display:grid;gap:8px;padding:12px;border-radius:12px;background:var(--gb-soft)}
.gb-prow{display:flex;flex-wrap:wrap;gap:8px}
.gb-pbtn{position:relative;display:inline-grid;place-items:center;gap:2px;width:64px;height:64px;padding:0;border:2px solid transparent;border-radius:10px;overflow:hidden;background:var(--gb-sunk);color:var(--mute);font:600 11px var(--font);cursor:pointer}
.gb-pbtn:hover{border-color:var(--ink)}
.gb-pbtn.is-on{border-color:var(--gb-acc)}
.gb-pup{border:1.5px dashed var(--line);background:var(--gb-panel)}
.gb-pup .gb-i{width:18px;height:18px}

/* ================= Photos ================= */
.gb-drop{position:relative;display:grid;place-items:center;min-height:96px;padding:16px;border:2px dashed rgba(var(--gb-acc-rgb),.55);border-radius:16px;background:rgba(var(--gb-acc-rgb),.04);text-align:center;cursor:pointer}
.gb-drop.over,.gb-drop:hover{background:rgba(var(--gb-acc-rgb),.09)}
.gb-drop input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.gb-drop-t{display:grid;gap:2px;pointer-events:none}.gb-drop-t b{font-size:16px}.gb-drop-t span{font-size:13.5px;color:var(--mute)}
.gb-msg{margin:0;font-size:14px}.gb-msg:empty{display:none}
.gb-libh{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:6px 12px}
.gb-libh .gb-h3{margin:0}
.gb-classic-h{margin-top:-6px}
.gb-plib{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:12px 10px;margin-top:10px}
.gb-ptile{position:relative;display:grid;gap:5px;min-width:0;border-radius:12px}
.gb-ptile-b,.gb-gt-b{position:relative;display:block;width:100%;aspect-ratio:1;padding:0;border:0;border-radius:12px;overflow:hidden;background:var(--gb-sunk);cursor:pointer}
.gb-ptile-b:hover img,.gb-gt-b:hover img{transform:scale(1.03)}
.gb-ptile-b img,.gb-gt-b img{transition:transform .3s}
.gb-ptile-u{padding:0 2px;font-size:12px;line-height:1.3;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gb-ptile .gb-mv,.gb-gt .gb-mv{position:absolute;right:6px;top:6px}
.gb-ptile .gb-rm{position:absolute;right:6px;top:40px}
.gb-gt .gb-rm{position:absolute;right:6px;bottom:6px}
.gb-ptile .gb-mini,.gb-gt .gb-mini{width:28px;height:28px;border-color:transparent;background:var(--gb-chipbg);box-shadow:0 1px 4px rgba(0,0,0,.2)}
/* armed: the next tap removes the photo for good, and the button says so */
.gb-ptile .gb-rm.armed{display:inline-flex;align-items:center;gap:4px;width:auto;padding:0 10px 0 7px;border-radius:99px;border-color:var(--gb-bad);background:var(--gb-bad);color:var(--gb-on-status)}
.gb-ptile .gb-rm.armed::after{content:"Remove?";font:700 12px/1 var(--font)}
.gb-pn{position:absolute;left:6px;top:6px;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:rgba(28,26,23,.74);color:#fff;font:700 11px/20px var(--font);text-align:center;pointer-events:none}
.gb-q{position:absolute;left:6px;bottom:6px;width:12px;height:12px;border-radius:50%;border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.gb-q-soft.gb-q{background:var(--gb-warn)}.gb-q-bad.gb-q{background:var(--gb-bad)}
@media (hover:hover){.gb-ptile .gb-mini,.gb-gt .gb-mini{opacity:0;transition:opacity .15s}.gb-ptile:hover .gb-mini,.gb-ptile:focus-within .gb-mini,.gb-gt:hover .gb-mini,.gb-gt:focus-within .gb-mini,.gb-mini.armed,.gb-mini[aria-pressed=true]{opacity:1}}

/* ================= Layout ================= */
.gb-gal{gap:14px}
.gb-gal-h{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.gb-gal-h .gb-h3{margin:0;margin-right:auto;font:500 21px var(--display);letter-spacing:0;text-transform:none;color:var(--ink)}
.gb-warn-t{padding:10px 12px;border-radius:10px;background:var(--gb-warn-bg);color:var(--ink)}
.gb-gboard{display:grid;grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:8px}
.gb-gt{position:relative;min-width:0}
.gb-gt-add{display:grid;place-items:center;align-content:center;gap:4px;aspect-ratio:1;padding:0;border:1.5px dashed var(--line);border-radius:12px;background:var(--gb-panel);color:var(--mute);font:600 13px var(--font);cursor:pointer}
.gb-gt-add:hover,.gb-gt-add[aria-expanded=true]{border-color:var(--ink);color:var(--ink)}
.gb-sub-f{max-width:320px}

/* ================= Packages ================= */
.gb-pkgs{display:grid;gap:12px}
.gb-pk{gap:12px}
.gb-pk-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.gb-pk-top b{font:600 12px var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.gb-pk-acts{display:inline-flex;gap:6px}
.gb-pk-p{max-width:220px}

/* ================= Dates ================= */
.gb-calcard{padding:14px}
.gb-dates-more{display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.gb-dates-more .gb-i{color:var(--gb-ok);stroke-width:2.4}

/* ================= Extras ================= */
#gb-extras{gap:10px}
.gb-x{gap:0;padding:0;overflow:hidden}
.gb-x-h{display:flex;align-items:center;gap:12px;padding:14px 16px}
.gb-x-t{display:grid;gap:2px;flex:1;min-width:0}
.gb-x-t b{display:flex;align-items:center;gap:8px;font-size:15.5px}
.gb-x-t small{font-size:13px;line-height:1.35;color:var(--mute)}
.gb-rec{padding:2px 8px;border-radius:99px;background:rgba(var(--gb-acc-rgb),.1);color:var(--gb-acc);font:700 10.5px var(--font)}
.gb-x-st{justify-self:start;margin-top:3px;padding:2px 9px;border-radius:99px;background:var(--gb-sunk);color:var(--mute);font:600 11.5px var(--font);font-style:normal}
.gb-x-st.is-on{background:var(--gb-ok-bg);color:var(--gb-ok)}.gb-x-st.is-empty{background:var(--gb-warn-bg);color:var(--gb-warn)}
.gb-x.is-on{border-color:var(--gb-line2)}
.gb-x-edit{min-height:34px}
.gb-x-b{display:grid;gap:14px;padding:16px;border-top:1px solid var(--line);background:var(--gb-xb)}
.gb-tog{position:relative;flex:none;width:46px;height:28px;padding:0;border:0;border-radius:99px;background:var(--gb-togoff);cursor:pointer;transition:background .2s}
.gb-tog::after{content:"";position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .2s}
.gb-tog[aria-checked=true]{background:var(--gb-ok)}.gb-tog[aria-checked=true]::after{transform:translateX(18px)}
.gb-layout-chips{padding-bottom:2px}
.gb-chip-shuf{border-style:dashed}
.gb-xab{display:grid;grid-template-columns:132px minmax(0,1fr);gap:14px;align-items:start}
.gb-xab-t{display:grid;gap:12px;min-width:0}
.gb-spotw{display:grid;gap:8px;justify-items:start}
.gb-spot{position:relative;display:grid;place-items:center;align-content:center;gap:6px;width:132px;aspect-ratio:4/5;padding:0;border:1.5px solid var(--line);border-radius:12px;overflow:hidden;background:var(--gb-sunk);color:var(--mute);font:600 12px var(--font);text-align:center;cursor:pointer}
.gb-spot.is-empty{border-style:dashed;background:var(--gb-panel);padding:10px}
.gb-spot.is-empty .gb-i{width:24px;height:24px}
.gb-spot-a{display:flex;flex-wrap:wrap;gap:6px}
.gb-spot-a .gb-btn{min-height:32px;padding:0 11px;font-size:12.5px}
.gb-xrow{display:grid;gap:8px;align-items:end}
.gb-xrow-hl{grid-template-columns:110px minmax(0,1fr) 30px}
.gb-xrow-hl .gb-rm{margin-bottom:8px}
.gb-xq{gap:10px;padding:14px;background:var(--gb-panel)}
.gb-xq-top{display:flex;align-items:center;justify-content:space-between}
.gb-xq-top b{font:600 12px var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.gb-xadd{justify-self:start}
.gb-towns{display:flex;flex-wrap:wrap;gap:6px}
.gb-town{display:inline-flex;align-items:center;gap:2px;min-height:32px;padding:0 4px 0 12px;border-radius:99px;background:var(--gb-inv);color:var(--gb-inv-ink);font:600 13px var(--font)}
.gb-town button{display:inline-grid;place-items:center;width:26px;height:26px;padding:0;border:0;border-radius:50%;background:none;color:inherit;cursor:pointer}
.gb-town button .gb-i{width:13px;height:13px}
.gb-townadd{display:flex;gap:8px}
.gb-x-more{margin-top:4px}

/* ================= Look ================= */
.gb-ways{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px}
.gb-way{display:grid;gap:5px;align-content:start;padding:7px 7px 10px;border:1px solid var(--line);border-radius:14px;background:var(--gb-panel);color:var(--ink);text-align:left;cursor:pointer}
.gb-way:hover{border-color:var(--ink)}
.gb-way[aria-checked=true]{border-color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.gb-way b{padding:0 3px;font-size:13px;line-height:1.25}.gb-way small{padding:0 3px;font-size:11.5px;color:var(--mute)}
.gb-way-auto{border-style:dashed}
.gb-way-pg{position:relative;display:grid;gap:3px;padding:5px;border-radius:9px;background:var(--gb-page);aspect-ratio:1/1;align-content:start;overflow:hidden}
.gb-way-cov{display:block;height:38%;border-radius:4px;overflow:hidden;background:var(--gb-ph)}
.gb-way-pg>i{display:block;height:3px;border-radius:2px;background:var(--line)}
.gb-way-pg>.gb-way-k{width:40%;margin-top:2px;background:rgb(var(--a))}.gb-way-pg>.gb-way-n{width:78%;height:6px;background:var(--ink)}.gb-way-pg>.gb-way-l{width:90%}
.gb-way-pg>.gb-way-b{width:52%;height:9px;margin-top:3px;border-radius:99px;background:rgb(var(--a))}
.gb-way-dots{position:absolute;right:6px;bottom:6px;display:flex;gap:2px}.gb-way-dots i{width:7px;height:7px;border-radius:50%;background:rgb(var(--a))}.gb-way-dots i:nth-child(2){opacity:.65}.gb-way-dots i:nth-child(3){opacity:.35}
.gb-band{gap:8px}
.gb-spc{position:absolute;inset:12% 16%;display:flex;flex-direction:column}
.gb-spc i{display:block;flex:none;height:14%;border-radius:3px;background:var(--gb-ph)}
.gb-spc-airy{justify-content:space-between}.gb-spc-snug{gap:5%}
.gb-fr{position:absolute;inset:16% 24%;display:block}
.gb-fr>img,.gb-fr>i{display:block;width:100%;height:100%;object-fit:cover;background:var(--gb-ph)}
.gb-fr-line{outline:1px solid var(--ink);outline-offset:3px;border-radius:5px}.gb-fr-line>img{border-radius:4px}
.gb-fr-round>img,.gb-fr-round>i{border-radius:14px}
.gb-fr-mat{padding:4px;background:var(--gb-white);box-shadow:0 3px 8px rgba(60,40,20,.25)}
.gb-fr-skin{padding:3px 3px 9px;background:var(--gb-white);box-shadow:0 3px 8px rgba(60,40,20,.3);transform:rotate(-2deg)}

/* ================= Publish ================= */
.gb-pubsum{display:flex;align-items:center;gap:16px}
.gb-pubsum b{font:500 22px var(--display)}.gb-pubsum p{margin:2px 0 0;font-size:14px;color:var(--mute)}
.gb-musts{display:grid;gap:8px}
.gb-must{display:flex;align-items:center;gap:10px;min-height:48px;padding:8px 10px 8px 12px;border:1px solid var(--line);border-radius:12px;background:var(--gb-panel);font-size:14.5px}
.gb-must>span:nth-child(2){flex:1}
.gb-must-i{display:inline-grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;background:var(--gb-ok);color:var(--gb-on-status);font:800 13px var(--font)}
.gb-must-i .gb-i{width:14px;height:14px;stroke-width:2.8}
.gb-must.is-bad{border-color:var(--gb-bad-line);background:var(--gb-bad-bg)}.gb-must.is-bad .gb-must-i{background:var(--gb-bad)}
.gb-must .gb-btn{min-height:32px}
.gb-pubcard{border-color:var(--gb-ok);border-width:1.5px}
.gb-switch input:disabled+.sw{opacity:.45}
.gb-gate{color:var(--gb-bad)}
.gb-url{margin:0;font-size:16px;font-weight:600;word-break:break-all}
.gb-pubh{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.gb-pubh .gb-h3{margin:0}
.gb-polish-s .gb-i,.gb-polish .gb-i{color:var(--gold)}

/* ================= All sections ================= */
.gb-all .gb-note{margin-top:-4px}
.gb-rows,.gb-rows-on{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.gb-rows-mid{list-style:none}
.gb-srow{position:relative;display:flex;align-items:center;gap:10px;min-height:58px;padding:8px 10px 8px 6px;border:1px solid var(--line);border-radius:14px;background:var(--gb-panel);transition:box-shadow .15s}
.gb-srow.is-off{background:transparent}.gb-srow.is-off .gb-srow-t{opacity:.6}
.gb-srow.is-fixed{border-style:dashed;background:transparent}
.gb-srow.is-drag{z-index:3;box-shadow:var(--gb-pop);border-color:var(--ink)}
.gb-handle{display:inline-grid;place-items:center;flex:none;width:30px;height:42px;padding:0;border:0;border-radius:8px;background:none;color:var(--dim);cursor:grab;touch-action:none}
.gb-handle:hover{background:var(--gb-soft);color:var(--ink)}
.gb-handle-off{cursor:default}.gb-handle-off:hover{background:none;color:var(--dim)}
.gb-handle .gb-i{width:17px;height:17px}
.gb-srow-t{display:grid;flex:1;min-width:0}
.gb-srow-t b{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gb-srow-t small{font-size:12.5px;line-height:1.35;color:var(--mute)}
.gb-srow-a{display:flex;align-items:center;gap:6px;flex:none}
.gb-fixed{font:600 11.5px var(--font);color:var(--dim);white-space:nowrap}
.gb-all-locked #gb-rows-on,.gb-all-locked .gb-rows:not(#gb-rows){opacity:.5}

/* the section library */
.gb-lg{display:grid;gap:10px}
.gb-lg+.gb-lg{margin-top:8px}
.gb-lg>.gb-h3{margin:0}
.gb-lc{display:grid;gap:10px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--gb-panel)}
.gb-lc.is-max{background:transparent}
.gb-lc-h{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px}
.gb-lc-h b{font:500 19px var(--display)}
.gb-lc-h span{flex-basis:100%;font-size:13.5px;color:var(--mute)}
.gb-good-b,.gb-onpage{display:inline-flex;align-items:center;gap:4px;padding:2px 9px 2px 6px;border-radius:99px;font:700 11px var(--font);font-style:normal}
.gb-good-b{background:var(--gb-ok-bg);color:var(--gb-ok)}.gb-good-b .gb-i{width:12px;height:12px;stroke-width:3}
.gb-onpage{padding-left:9px;background:var(--gb-sunk);color:var(--mute)}
.gb-lvs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.gb-lv{display:grid;gap:6px;align-content:start;padding:7px 7px 9px;border:1px solid var(--line);border-radius:12px;background:var(--gb-page);color:var(--ink);text-align:left;cursor:pointer}
.gb-lv:hover:not([aria-disabled=true]){border-color:var(--gb-acc);box-shadow:inset 0 0 0 1px var(--gb-acc)}
.gb-lv[aria-disabled=true]{cursor:not-allowed}.gb-lv[aria-disabled=true] .gb-sv{opacity:.45}
.gb-lv b{padding:0 3px;font-size:13.5px}
.gb-lv small{padding:0 3px;font-size:12px}
.gb-lc-n{margin:0;font-size:13.5px;color:var(--mute)}
.gb-sv{display:block;width:100%;height:auto;border-radius:8px;background:var(--gb-white)}
.gb-sv .s-p rect{fill:var(--gb-s-photo)}.gb-sv .s-pf rect{fill:var(--gb-s-photof)}.gb-sv .s-pm{fill:var(--gb-s-hill)}.gb-sv .s-ps{fill:var(--gb-s-sun)}
.gb-sv .s-h{fill:var(--ink)}.gb-sv .s-t{fill:var(--gb-s-text)}.gb-sv .s-a{fill:var(--gb-acc)}.gb-sv .s-c{fill:var(--gb-white);stroke:var(--gb-s-line)}.gb-sv .s-ca{stroke:var(--gb-acc);stroke-width:1.2}
.gb-sv .s-pp{fill:var(--gb-s-photo)}.gb-sv .s-d{fill:var(--gb-s-text)}.gb-sv .s-w{fill:var(--gb-acc-ink)}.gb-sv .s-cb{fill:none;stroke:var(--gb-s-chip)}.gb-sv .s-l{fill:var(--gb-s-line)}.gb-sv .s-q{fill:var(--gb-acc);font-family:Georgia,serif}
.gb-sv .s-bk{fill:rgba(var(--gb-acc-rgb),.28)}.gb-sv .s-op{fill:var(--gb-s-open)}

/* ================= the preview ================= */
.gb-pvbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex:none}
.gb-try{display:inline-flex;align-items:center;gap:6px;flex:none;min-height:36px;padding:0 16px;white-space:nowrap;border:1px solid var(--ink);border-radius:99px;background:none;color:var(--ink);font:600 13.5px var(--font);cursor:pointer}
.gb-try:hover{background:var(--gb-soft)}
.gb-try[aria-pressed=true]{border-color:var(--gb-on);background:var(--gb-on);color:var(--gb-on-ink)}
.gb-trynote{display:flex;align-items:center;gap:10px;flex:none;margin:0;padding:8px 8px 8px 14px;border-radius:12px;background:var(--gb-ok-bg);font-size:13.5px}
.gb-trynote span{flex:1}
.gb .prev-stage{position:relative;flex:1;min-height:0;align-content:start;overflow:hidden;background:var(--gb-stage)}
.gb .prev-frame{position:relative}
.gb-over{position:absolute;inset:0;z-index:3;pointer-events:none}
.gb-over>*{pointer-events:auto}
.gb-tb{position:absolute;left:0;top:0;display:flex;align-items:center;gap:2px;padding:4px;border-radius:12px;background:var(--gb-tb);color:var(--gb-tb-ink);font:600 13px var(--font);white-space:nowrap;box-shadow:0 10px 28px rgba(0,0,0,.3)}
.gb-tb button{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:32px;min-width:32px;padding:0 8px;border:0;border-radius:8px;background:none;color:inherit;font:inherit;cursor:pointer}
.gb-tb button:hover:not(:disabled){background:rgba(255,255,255,.14)}
.gb-tb button:disabled{opacity:.3;cursor:default}
.gb-tb .gb-i{width:16px;height:16px}
.gb-tb-n{max-width:150px;padding:0 6px 0 8px;overflow:hidden;text-overflow:ellipsis;opacity:.75}
.gb-tb-shuf em{font-style:normal;font-weight:500;opacity:.7}
.gb-tb .gb-tb-edit{background:var(--gb-acc);color:var(--gb-acc-ink)}
.gb-tb .gb-tb-edit:hover{background:var(--gb-acc)!important;filter:brightness(1.1)}
@keyframes gb-ping{0%{box-shadow:0 0 0 0 rgba(var(--gb-warn-rgb),.55)}70%,100%{box-shadow:0 0 0 10px rgba(var(--gb-warn-rgb),0)}}
@keyframes gb-ping-bad{0%{box-shadow:0 0 0 0 rgba(var(--gb-bad-rgb),.55)}70%,100%{box-shadow:0 0 0 10px rgba(var(--gb-bad-rgb),0)}}
.gb-dot{position:absolute;width:18px;height:18px;padding:0;border:2.5px solid #fff;border-radius:50%;background:var(--gb-warn);box-shadow:0 1px 4px rgba(0,0,0,.35);cursor:pointer;animation:gb-ping 2.4s ease-out infinite}
.gb-dot-must{background:var(--gb-bad);animation-name:gb-ping-bad}
.gb-pop{position:absolute;display:grid;gap:8px;width:320px;max-width:calc(100% - 12px);max-height:70%;overflow:auto;padding:10px;border:1px solid var(--line);border-radius:14px;background:var(--gb-panel);box-shadow:var(--gb-pop)}
.gb-pop .gb-hi{padding:10px 12px}

/* ================= the photo tray, Move mode, dragging ================= */
.gb-tray{position:sticky;bottom:0;z-index:5;display:grid;gap:8px;margin-top:18px;padding:10px 12px 12px;border:1px solid var(--line);border-bottom:0;border-radius:16px 16px 0 0;background:var(--gb-panel);box-shadow:0 -12px 30px -20px rgba(60,40,20,.45)}
.gb-tray-h{display:flex;align-items:center;gap:10px}
.gb-tray-h b{font-size:14px}
.gb-tray-t{flex:1;min-width:0;font-size:12.5px;line-height:1.3;color:var(--mute)}
.gb-tray-up{min-height:32px;padding:0 12px;font-size:12.5px}
.gb-tray-l{display:flex;gap:8px;overflow-x:auto;overscroll-behavior-x:contain;padding:2px 2px 4px;scrollbar-width:thin}
.gb-tp{flex:none;display:grid;gap:4px;width:70px}
.gb-tp-b{position:relative;display:block;width:70px;height:70px;padding:0;border:0;border-radius:10px;overflow:hidden;background:var(--gb-sunk);cursor:grab;touch-action:pan-x pan-y}
.gb-tp-b .gb-pn{left:4px;top:4px;min-width:18px;height:18px;font-size:10.5px;line-height:18px}
.gb-tp.is-picked .gb-tp-b{outline:3px solid var(--gb-acc);outline-offset:2px}
.gb-tp-u{font-size:11px;line-height:1.2;color:var(--mute);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gb-tp-u.is-free{color:var(--dim)}
.gb-pick{position:fixed;left:50%;top:calc(var(--gb-top,0px) + 10px);z-index:32;display:flex;align-items:center;gap:12px;width:max-content;max-width:calc(100vw - 24px);padding:8px;border-radius:16px;background:var(--gb-inv);color:var(--gb-inv-ink);box-shadow:0 16px 44px rgba(0,0,0,.32);transform:translateX(-50%)}
.gb-pick-im{flex:none;width:44px;height:44px;border-radius:9px;overflow:hidden}
.gb-pick p{margin:0;font-size:14px;line-height:1.35}
.gb-pick p span{opacity:.82}
.gb-pick .gb-btn{border-color:rgba(255,255,255,.4);background:none;color:inherit}
.gb-pick .gb-btn:hover{border-color:#fff}
.gb-ghost{position:fixed;left:0;top:0;z-index:86;display:grid;justify-items:center;gap:8px;margin:-38px 0 0 -38px;pointer-events:none}
.gb-ghost.is-touch{margin-top:-118px}
.gb-ghost-im{display:block;width:76px;height:76px;border-radius:12px;overflow:hidden;background:var(--gb-sunk);box-shadow:0 0 0 3px #fff,0 20px 44px rgba(0,0,0,.35);transform:rotate(-3deg);transition:transform .15s,box-shadow .15s}
.gb-ghost.is-on .gb-ghost-im{transform:scale(.9);box-shadow:0 0 0 3px var(--gb-acc),0 12px 26px rgba(0,0,0,.3)}
.gb-ghost-t{padding:5px 11px;border-radius:99px;background:var(--gb-inv);color:var(--gb-inv-ink);font:700 12.5px var(--font);white-space:nowrap}
.gb-ghost-t:empty{display:none}
html.gb-dragging,html.gb-dragging *{cursor:grabbing!important;-webkit-user-select:none!important;user-select:none!important}
html.gb-picking .gb [data-drop]:not([inert] *),html.gb-dragging .gb [data-drop]:not([inert] *){outline:2px dashed rgba(var(--gb-acc-rgb),.7);outline-offset:2px}
html.gb-picking .gb [data-drop]{cursor:copy}
.gb .gb-drop-on{outline:3px solid var(--gb-acc)!important;outline-offset:2px}
.gb .gb-drop-b{box-shadow:-7px 0 0 -2px var(--gb-acc)}
.gb .gb-drop-a{box-shadow:7px 0 0 -2px var(--gb-acc)}
.gb .gb-src{opacity:.4}

/* ================= sheets: the health drawer, the library, the ask ================= */
html.gb-sheet-open{overflow:hidden}
.gb-sheet{position:fixed;inset:0;z-index:60;display:flex;justify-content:flex-end}
.gb-scrim{position:absolute;inset:0;background:var(--gb-scrim);opacity:0;transition:opacity .2s}
.gb-sheet.on .gb-scrim{opacity:1}
.gb-sheet-p{position:relative;display:flex;flex-direction:column;width:min(460px,100%);height:100%;background:var(--gb-sheet);box-shadow:-24px 0 60px rgba(0,0,0,.18);outline:none;opacity:0;transform:translateX(28px);transition:transform .22s cubic-bezier(.2,.8,.2,1),opacity .2s}
.gb-sheet.on .gb-sheet-p{opacity:1;transform:none}
.gb-sheet-wide,.gb-sheet-ask{align-items:center;justify-content:center;padding:28px}
.gb-sheet-wide .gb-sheet-p{width:min(880px,100%);height:auto;max-height:calc(100vh - 56px);border-radius:22px;transform:translateY(16px)}
.gb-sheet-ask .gb-sheet-p{width:min(470px,100%);height:auto;border-radius:22px;transform:translateY(16px)}
.gb-sheet-h{display:flex;align-items:center;gap:14px;flex:none;padding:18px 18px 16px 22px;border-bottom:1px solid var(--line)}
.gb-sheet-h h2{margin:0;font-size:25px;outline:none}
.gb-sheet-h p{margin:3px 0 0;font-size:14px;line-height:1.4;color:var(--mute)}
.gb-sheet-b{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;display:grid;align-content:start;gap:12px;padding:16px 22px 22px}
.gb-sheet-f{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;flex:none;padding:14px 22px 18px;border-top:1px solid var(--line)}
.gb-sheet-b>.gb-h3{margin:6px 0 -2px}
.gb-ask-pick{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.gb-ask-more{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0}

/* ================= the toast, with its Undo ================= */
.gb-toast{display:flex;align-items:center;gap:14px;max-width:min(580px,calc(100vw - 32px));width:max-content;border-radius:16px;line-height:1.35}
/* the tray stays reachable: the toast sits above it */
@media (min-width:701px){html:has(#view-editor.gb-trayon:not([hidden])) .toast{bottom:calc(var(--gb-trayd,140px) + 14px)}}
.toast-u{flex:none;padding:6px 4px;border:0;background:none;color:inherit;font:800 14px var(--font);text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* ================= tablets: an icon rail; phones: Edit, Preview, Health ================= */
.gb-tabs{display:none}
.gb-strip{display:none}
@media (max-width:1180px) and (min-width:701px){
  .gb-main{grid-template-columns:62px minmax(340px,440px) minmax(0,1fr)}
  .gb-stp{justify-content:center;padding:6px}.gb-stp>span:not(.vh){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .gb-rail-l li:not(:last-child)::after{left:50%;margin-left:-1px}
  .gb-rail-t{display:none}
  .gb-health-t small,.gb .pill{display:none}
}
@media (max-width:900px) and (min-width:701px){
  .gb.p-editor{padding:0 16px 40px}
  .gb-bar.ed-bar{gap:8px;margin:0 -16px;padding:10px 16px}
  .gb-title .kicker,.gb-health-t,.gb-view{display:none}
  .gb-title h1{font-size:20px}
  .gb-health{padding:3px}
  .gb-bar>.gb-mode button{padding:0 10px}
  .gb-main{grid-template-columns:52px minmax(0,1fr) minmax(0,1fr);gap:14px;padding-top:14px}
  .gb-rail,.gb-pv{top:calc(var(--gb-top,0px) + var(--gb-bar,64px) + 14px)}
  .gb-pv{height:calc(100vh - var(--gb-top,0px) - var(--gb-bar,64px) - 14px - 72px)}
  .gb-stp i{width:28px;height:28px}
  .gb-rail-l li:not(:last-child)::after{top:32px}
  .gb-tpls,.gb-row,.gb-xab{grid-template-columns:minmax(0,1fr)}
  .gb-opts-3{grid-template-columns:repeat(2,minmax(0,1fr))}.gb-opts-5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .gb-sh h2{font-size:26px}
  .gb-pvbar{flex-wrap:wrap}
}
@media (max-width:700px){
  /* room under the last step, so a line that closes near the bottom (the calendar's Undo) doesn't pull the page under a finger */
  .gb.p-editor{padding:0 16px calc(var(--gb-tabs,60px) + var(--gb-trayh,0px) + 160px)}
  .gb-bar.ed-bar{gap:8px;margin:0 -16px;padding:8px 16px}
  .gb-title .kicker{display:none}
  .gb-title h1{font-size:19px}
  .gb-bar>.gb-mode,.gb-health-t,.gb .pill,.gb-view{display:none}
  .gb-health{min-height:40px;padding:3px}
  .gb .ed-status{min-width:0;font-size:12px}
  .gb-bar #ed-save{padding:7px 12px}
  .gb-mode-m{display:flex;margin:0 0 12px}
  .gb-mode-m button{flex:1}
  .gb-main{grid-template-columns:minmax(0,1fr);gap:0;padding-top:12px}
  .gb-rail{display:none}
  .gb-main[data-tab=edit] .gb-pv{display:none}
  .gb-main[data-tab=preview] .gb-form{display:none}
  .gb-pv{position:static;height:auto;min-height:0}
  .gb .prev-stage{flex:none;padding:10px}
  .gb-strip{position:relative;display:block;margin:0 -16px 16px;padding:0 16px}
  .gb-strip-l{position:relative;display:flex;gap:4px;overflow-x:auto;list-style:none;margin:0;padding:2px 0 10px;scrollbar-width:none}
  .gb-strip-l::-webkit-scrollbar{display:none}
  .gb-strip-l li{flex:none}
  .gb-strip .gb-stp{min-height:38px;padding:4px 12px 4px 4px;border:1px solid var(--line);border-radius:99px;font-size:13.5px;white-space:nowrap}
  .gb-strip .gb-stp i{width:28px;height:28px}
  .gb-strip .gb-stp.cur{border-color:var(--gb-acc)}
  .gb-prog{position:absolute;left:16px;right:16px;bottom:0;display:block;height:3px;border-radius:99px;background:var(--gb-sunk);overflow:hidden}
  .gb-prog i{display:block;height:100%;border-radius:99px;background:var(--gb-acc);transition:width .35s}
  .gb-sh h2{font-size:27px}
  .gb-foot-t{display:none}
  .gb-tabs{position:fixed;left:0;right:0;bottom:0;z-index:25;display:flex;gap:4px;padding:6px 8px calc(6px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--gb-barbg);backdrop-filter:blur(10px)}
  .gb-tabs button{display:grid;flex:1;justify-items:center;gap:1px;min-height:48px;padding:4px;border:0;border-radius:12px;background:none;color:var(--mute);cursor:pointer}
  .gb-tabs b{font-size:14.5px}.gb-tabs small{font-size:11px;color:var(--dim);white-space:nowrap}
  .gb-tabs button[aria-pressed=true]{background:var(--gb-on);color:var(--gb-on-ink)}.gb-tabs button[aria-pressed=true] small{color:inherit;opacity:.75}
  .gb-tray{position:fixed;left:0;right:0;bottom:var(--gb-tabs,60px);z-index:24;margin:0;padding:8px 12px 8px;border-radius:14px 14px 0 0;border-left:0;border-right:0}
  .gb-tray{gap:6px}
  .gb-tray-h b{font-size:13px}
  .gb-tray-t{font-size:11.5px}
  .gb-tray-up{min-height:30px;padding:0 10px}
  .gb-tp,.gb-tp-b{width:56px}.gb-tp-b{height:56px}
  .gb-tp-u{font-size:10.5px}
  html:has(#view-editor:not([hidden])) .toast{bottom:calc(var(--gb-tabs,0px) + var(--gb-trayh,0px) + 12px)}
  .gb-sheet-p{width:100%;transform:translateY(24px)}
  .gb-sheet-wide,.gb-sheet-ask{padding:0}
  .gb-sheet-wide .gb-sheet-p,.gb-sheet-ask .gb-sheet-p{height:100%;max-height:none;border-radius:0}
  .gb-sheet-h{padding:14px 12px 12px 16px}
  .gb-sheet-b{padding:14px 16px 18px}
  .gb-sheet-f{padding:12px 16px calc(14px + env(safe-area-inset-bottom))}
  .gb-pick{top:calc(var(--gb-top,0px) + 6px);gap:8px;width:calc(100vw - 16px);padding:6px}
  .gb-pick p{font-size:13px}
  .gb-pick-im{width:38px;height:38px}
}
@media (max-width:560px){
  .gb-row{grid-template-columns:minmax(0,1fr)}
  .gb-opts-3{grid-template-columns:repeat(2,minmax(0,1fr))}.gb-opts-5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .gb-tpl-t b{font-size:17px}.gb-tpl-t span{font-size:12.5px}
  .gb-tpls{gap:10px}
  .gb-xab{grid-template-columns:minmax(0,1fr)}
  .gb-spot{width:118px}
  .gb-xrow-hl{grid-template-columns:84px minmax(0,1fr) 30px}
  .gb-plib{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 8px}
  .gb-gboard{grid-template-columns:repeat(4,minmax(0,1fr))}
  .gb-lvs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gb-bar .gb-ur .gb-ic{width:34px;height:34px}
  .gb-card{padding:15px}
  .gb-foot .gb-btn span{display:none}
}
@media (prefers-reduced-motion:reduce){
  .gb *,.gb-sheet *,.gb-ghost *{transition:none!important;animation:none!important}
  .gb-dot{animation:none}
}

/* ================= inside the preview frame ================= */
/* a page with a style: the section toolbar names what's under the pointer,
   so the old "Edit" tag stays on the name, the story and the card */
html.lfe-preview .res-d [data-ed^="block:"]:hover::after,html.lfe-preview .res-d .rp-cover[data-ed]:hover::after{content:none!important}
html.lfe-preview .res-d [data-ed^="block:"]:hover{outline-offset:8px;border-radius:10px}
html.lfe-preview .res-embed [data-slot]{cursor:pointer}
html.lfe-preview .gb-sel{outline:2px solid var(--gb-acc)!important;outline-offset:8px;border-radius:10px}
@keyframes gb-flash{0%{outline-color:rgba(var(--gb-acc-rgb),.95)}100%{outline-color:rgba(var(--gb-acc-rgb),0)}}
html.lfe-preview .gb-flash{outline:3px solid rgba(var(--gb-acc-rgb),0);outline-offset:8px;border-radius:10px;animation:gb-flash 1.4s ease-out}
@keyframes gb-spark{0%{box-shadow:0 0 0 0 rgba(var(--gb-gold-rgb),.7)}100%{box-shadow:0 0 0 22px rgba(var(--gb-gold-rgb),0)}}
html.lfe-preview .gb-spark{animation:gb-spark 1.1s ease-out;border-radius:10px}
html.gb-picking .res-embed [data-slot],html.gb-dragging .res-embed [data-slot]{outline:2px dashed rgba(var(--gb-acc-rgb),.8);outline-offset:-3px;cursor:copy}
html.gb-picking .res-embed .blk-gallery,html.gb-dragging .res-embed .blk-gallery{outline:2px dashed rgba(var(--gb-acc-rgb),.45);outline-offset:6px;border-radius:10px}
html.gb-picking .res-embed:not(.res-d) .rp-gal img,html.gb-picking .res-embed:not(.res-d) .rp-cover{outline:2px dashed rgba(var(--gb-acc-rgb),.8);outline-offset:-3px;cursor:copy}
html.lfe-preview .gb-has{box-shadow:0 0 0 3px rgba(var(--gb-acc-rgb),.45)}
html.lfe-preview .gb-drop-on{outline:4px solid var(--gb-acc)!important;outline-offset:-4px!important}
html.lfe-preview .gb-drop-b{box-shadow:-8px 0 0 -2px var(--gb-acc)!important}
html.lfe-preview .gb-drop-a{box-shadow:8px 0 0 -2px var(--gb-acc)!important}
html.lfe-preview .gb-src{opacity:.4}
html.lfe-preview.gb-dragging,html.lfe-preview.gb-dragging *{cursor:grabbing!important;-webkit-user-select:none!important;user-select:none!important}
/* Try it: the page as a customer gets it, no editing marks */
html.gb-trying .res-embed [data-ed],html.gb-trying .res-embed [data-slot]{cursor:auto}
html.gb-trying .res-embed [data-ed]:hover{outline:none!important}
html.gb-trying .res-embed [data-ed]:hover::after{content:none!important}
html.gb-trying .res-embed .gi-lb{cursor:zoom-in}

/* ================= The Floor only ================= */
.gb-tpl-t b,.gb-lc-h b,.gb-pubsum b,.gb-gal-h .gb-h3,.gb-sh h2,.gb-sheet-h h2{font-weight:400}
.gb-stp.cur i{box-shadow:0 0 16px rgba(255,94,156,.55)}
.gb-stp.cur{background:linear-gradient(90deg,rgba(255,94,156,.12),rgba(255,94,156,.02))}
.gb-tpl[aria-pressed=true],.gb-opt-t[aria-pressed=true]{box-shadow:inset 0 0 0 1.5px var(--gb-acc),0 0 26px -8px rgba(255,94,156,.6)}
.gb-mode button[aria-pressed=true],.gb-tabs button[aria-pressed=true]{box-shadow:0 0 18px rgba(255,94,156,.35)}
.gb .prev-stage{border-color:var(--line);background:radial-gradient(90% 60% at 50% 0%,rgba(138,92,255,.16),transparent 70%),var(--gb-stage)}
.gb-way[aria-checked=true]{border-color:var(--gb-acc);box-shadow:inset 0 0 0 1.5px var(--gb-acc)}
.gb-pn{background:rgba(11,7,16,.8)}
.gb-f>input,.gb-f>select,.gb-f>textarea,.gb-townadd input{color-scheme:dark}
.gb-f>select option,.gb-f>select optgroup{background:#1a1023;color:var(--ink)}
.gb-sv .s-q{fill:var(--gb-acc)}
.gb-ring em{color:var(--ink)}

/* the X on every message, and in the page builder messages sit at the top of the
   screen, so they never cover Next, Back or the photo tray */
.toast-x{flex:none;display:grid;place-items:center;width:32px;height:32px;margin:-6px -8px -6px 0;padding:0;border:0;border-radius:50%;background:none;color:inherit;cursor:pointer;opacity:.8}
.toast-x:hover,.toast-x:focus-visible{opacity:1;background:rgba(127,127,127,.22)}
html:has(#view-editor:not([hidden])) .toast.gb-toast{top:calc(12px + env(safe-area-inset-top));bottom:auto}

/* The Floor: calendar colors (turquoise for open, neon pink for booked, on plum) */
.pc,.rp-cal-box{--cal-op:rgba(62,224,207,.16);--cal-op-ink:#c9fff7;--cal-op-hover:rgba(62,224,207,.3);--cal-bk:rgba(255,94,156,.24);--cal-bk-ink:#ffb3d1;--cal-pa:rgba(255,255,255,.05);--cal-pa-ink:#6f6278;--cal-chip:rgba(255,255,255,.04);--cal-note:rgba(255,210,63,.12);--cal-paint:var(--gold);--cal-focus:var(--turq)}
/* the calendar: the portal's two-year editor (.pc) and the month on a
   resident's page (.rp-cal-box). Colors come from the tokens at the top. */
.ed-cal,.pc,.pc>*{min-width:0}.pc{display:grid;gap:12px}
.pc-months{display:flex;align-items:stretch;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;scroll-behavior:smooth;padding:2px 2px 8px;margin:0 -2px;scrollbar-width:thin}
.pc-yr{flex:none;align-self:center;writing-mode:vertical-rl;transform:rotate(180deg);font:600 10px var(--font);letter-spacing:.12em;color:var(--dim);padding:0 1px}
.pc-mo{flex:none;display:grid;justify-items:center;align-content:center;gap:1px;min-width:46px;min-height:44px;padding:5px 6px;border-radius:10px;border:1px solid var(--line);background:var(--cal-chip);color:var(--ink);font:600 13px var(--font);cursor:pointer}
.pc-mo i{font:700 10px var(--font);font-style:normal;min-height:13px;color:var(--dim)}.pc-mo.has i{color:var(--cal-bk-ink)}
.pc-mo:hover{border-color:var(--ink)}.pc-mo.on{background:var(--ink);border-color:var(--ink);color:var(--paper)}.pc-mo.on i{color:var(--paper)}
.pc-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.pc-title{font:500 20px var(--display);color:var(--ink)}
.pc-nav{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:none;color:var(--ink);font:500 24px/1 var(--font);cursor:pointer;display:grid;place-items:center;padding:0 0 3px}.pc-nav:hover{border-color:var(--ink)}.pc-nav:disabled{opacity:.3;cursor:default;border-color:var(--line)}
.pc-grid{display:grid;gap:4px;user-select:none;-webkit-user-select:none}
.pc-row{display:grid;grid-template-columns:24px repeat(7,minmax(0,1fr));gap:4px}
.pc-row>span{display:block;min-width:0}
.pc-wd{height:28px;border:0;border-radius:6px;background:none;color:var(--mute);font:700 12px var(--font);cursor:pointer}.pc-wd:hover{background:var(--cal-chip);color:var(--ink)}
.pc-wk{height:42px;width:24px;border:0;border-radius:6px;background:none;color:var(--dim);font:500 18px/1 var(--font);cursor:pointer;padding:0 0 2px}.pc-wk:hover{background:var(--cal-chip);color:var(--ink)}.pc-wk:disabled{opacity:.25;cursor:default;background:none}
.pc-grid [data-iso]{width:100%;height:42px;border:0;border-radius:7px;font:600 14px var(--font);cursor:pointer;touch-action:pan-y;padding:0;background:var(--cal-op);color:var(--cal-op-ink)}
.pc-grid .op:hover{background:var(--cal-op-hover)}
.pc-grid .bk{background:var(--cal-bk);color:var(--cal-bk-ink);text-decoration:line-through;text-decoration-thickness:1.5px}.pc-grid .bk:hover{filter:brightness(.97)}
.pc-grid .pa{background:var(--cal-pa);color:var(--cal-pa-ink);cursor:default}
.pc-grid .td{box-shadow:inset 0 0 0 2px var(--ink)}
.pc-grid .painting{box-shadow:inset 0 0 0 2px var(--cal-paint)}
.pc-grid button:focus-visible,.pc-mo:focus-visible,.pc-nav:focus-visible,.pc-link:focus-visible,.pc-dow input:focus-visible+span{outline:2px solid var(--cal-focus);outline-offset:2px}
.pc-undo{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0;padding:8px 12px;border-radius:10px;background:var(--cal-note);font-size:14px;color:var(--ink)}
.pc-link{border:0;background:none;padding:4px 2px;color:var(--red);font:600 14px var(--font);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.pc-bulk{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.pc-repeat{border:1px solid var(--line);border-radius:12px;padding:0 12px}
.pc-repeat summary{cursor:pointer;padding:11px 0;font:600 14px var(--font);color:var(--ink)}
.pc-rep-body{display:grid;gap:12px;padding:0 0 12px}
.pc-dows{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;max-width:360px}
.pc-dow{position:relative;cursor:pointer}.pc-dow input{position:absolute;opacity:0;width:1px;height:1px}
.pc-dow span{display:grid;place-items:center;height:36px;padding:0 2px;border-radius:99px;border:1px solid var(--line);font:600 13px var(--font);color:var(--mute)}
.pc-dow input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.pc-range{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.pc-range .f,.pc-range input{min-width:0;width:100%}
.pc-sum{margin:0;font-size:14px;color:var(--ink)}
.pc-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 14px}
.pc-clear.armed{color:var(--btn-ink);background:var(--red);border-radius:8px;padding:4px 10px;text-decoration:none}
@media (max-width:420px){.pc-row{grid-template-columns:22px repeat(7,minmax(0,1fr));gap:3px}.pc-grid{gap:3px}.pc-wk{width:22px}.pc-grid [data-iso]{height:40px;font-size:13px}.pc-range{grid-template-columns:minmax(0,1fr)}}

/* the month on a resident's page */
.rp-cal-box{display:grid;gap:8px}
.rp-cal-head{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:32px}
.rp-cal-m{font:600 14px var(--font);color:var(--ink);flex:1;text-align:center}
.rp-cal-nav{width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:none;color:var(--ink);font:500 20px/1 var(--font);cursor:pointer;display:grid;place-items:center;padding:0 0 3px}.rp-cal-nav:hover{border-color:var(--ink)}.rp-cal-nav:disabled{opacity:.3;cursor:default}.rp-cal-nav:focus-visible{outline:2px solid var(--cal-focus);outline-offset:2px}
.rp-cal .nx{background:none}
.rp-cal .op,.rp-cal .sel{cursor:pointer}

/* Feedback: the colors for The Floor; the shape is the same on both skins */
:root{--fb-bg:var(--plum);--fb-ink:var(--ink);--fb-line:rgba(255,220,220,.22);--fb-accent:var(--turq);--fb-accent-ink:var(--btn-ink);--fb-panel:var(--plum);--fb-hover:rgba(255,255,255,.08);--fb-scrim:rgba(5,2,8,.6);--fb-shadow:0 8px 28px rgba(0,0,0,.45);--fb-shadow-big:0 24px 80px rgba(0,0,0,.7)}
/* The Feedback button and its form (src/feedback.js). The button owns the
   bottom-right corner; the rules for sharing the bottom of the screen are in
   START-HERE.md. --fb-bottom is set by feedback.js when a bar (data-dock)
   reaches the corner: the button rides just above it. */
.fb-btn{position:fixed;right:16px;bottom:max(calc(16px + env(safe-area-inset-bottom)),var(--fb-bottom,0px));z-index:40;display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px 0 13px;border:1px solid var(--fb-line);border-radius:99px;background:var(--fb-bg);color:var(--fb-ink);font:600 13.5px var(--font);letter-spacing:.01em;box-shadow:var(--fb-shadow);cursor:pointer;transition:bottom .2s ease,opacity .15s ease,transform .15s ease,visibility 0s}
.fb-btn:hover{border-color:var(--fb-accent)}
.fb-btn:focus-visible{outline:3px solid var(--fb-accent);outline-offset:3px}
.fb-btn .fb-i{flex:none;color:var(--fb-accent)}
.fb-btn.fb-away,html.nd-open .fb-btn,html.fb-open .fb-btn,html.pe-open .fb-btn,html.lb-open .fb-btn,html.gb-sheet-open .fb-btn{opacity:0;visibility:hidden;transform:translateY(8px);pointer-events:none;transition:bottom .2s ease,opacity .15s ease,transform .15s ease,visibility 0s linear .15s}
html.lfe-preview .fb-btn,html.lfe-preview .fb{display:none}

.fb{position:fixed;inset:0;z-index:90}
.fb[hidden]{display:none}
.fb-scrim{position:absolute;inset:0;background:var(--fb-scrim);opacity:0;transition:opacity .2s ease}
.fb.on .fb-scrim{opacity:1}
.fb-panel{position:absolute;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));width:min(420px,calc(100vw - 32px));max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:auto;padding:20px 22px 22px;border:1px solid var(--fb-line);border-radius:18px;background:var(--fb-panel);color:var(--ink);box-shadow:var(--fb-shadow-big);opacity:0;transform:translateY(12px);transition:opacity .2s ease,transform .2s ease;outline:none}
.fb.on .fb-panel{opacity:1;transform:none}
.fb-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.fb-head h2{margin:0 0 4px;font:500 24px/1.15 var(--display)}
.fb-sub{margin:0;font-size:14.5px;line-height:1.45;color:var(--mute)}
.fb-x{flex:none;width:36px;height:36px;margin:-4px -6px 0 0;border:0;border-radius:50%;background:transparent;color:var(--mute);font:400 26px/1 var(--font);cursor:pointer}
.fb-x:hover{color:var(--ink);background:var(--fb-hover)}
.fb-x:focus-visible{outline:2px solid var(--fb-accent)}
.fb-form{display:grid;gap:14px}
.fb-kinds{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;border:0}
.fb-leg{margin-bottom:8px;padding:0;font:600 12px var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.fb-kinds label{position:relative;cursor:pointer}
.fb-kinds input{position:absolute;opacity:0;width:1px;height:1px}
.fb-kinds span{display:inline-block;padding:8px 13px;border:1px solid var(--fb-line);border-radius:99px;font-size:14px;color:var(--ink);transition:background .15s,border-color .15s}
.fb-kinds label:hover span{border-color:var(--fb-accent)}
.fb-kinds input:checked+span{background:var(--fb-accent);border-color:var(--fb-accent);color:var(--fb-accent-ink)}
.fb-kinds input:focus-visible+span{outline:2px solid var(--fb-accent);outline-offset:2px}
.fb-form textarea{min-height:120px;resize:vertical;line-height:1.45}
.fb-fine{margin:0;font-size:13px;line-height:1.45;color:var(--dim)}
.fb-cta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:2px 0 0}
.fb-ok{margin:0 0 16px;font-size:16px;line-height:1.5}
.fb-ok b{display:block;font:500 22px/1.2 var(--display);margin-bottom:4px}

@media (max-width:640px){
  .fb-btn{right:12px;width:44px;height:44px;padding:0;justify-content:center}
  .fb-btn .fb-l{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .fb-btn .fb-i{width:20px;height:20px}
  .fb-panel{left:0;right:0;bottom:0;width:100%;max-height:92vh;max-height:92dvh;padding:18px 18px calc(18px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0;border-bottom:0;transform:translateY(40px)}
}
@media (prefers-reduced-motion:reduce){.fb-btn,.fb-panel,.fb-scrim{transition:none}}
@media print{.fb-btn,.fb{display:none!important}}
.fb-ua{word-break:break-word;margin:0 0 8px}

/* The Floor: "my night", the cart (common.js). The + on tiles, Add on each
   package, the bar, the sheet (a bottom sheet on phones, a side panel on wider
   screens), the note after an add, the lines on /book, the pinned group chips.
   Concatenated after app.css by build.js. No inline styles (CSP). */

/* ---- tiles: a cell holds the link and the quick add ---- */
.tile-cell{position:relative;display:grid;min-width:0}
.tile-cell>.tile{height:100%}
.tile-add{position:absolute;top:14px;right:10px;z-index:2;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:var(--ink);color:var(--btn-ink);font:400 28px/1 var(--font);box-shadow:0 4px 18px rgba(0,0,0,.45);cursor:pointer;transition:transform .15s ease,background .15s ease}
.tile-add:hover{transform:scale(1.07)}
.tile-add:active{transform:scale(.94)}
.tile-add.in{background:var(--turq);color:var(--btn-ink);box-shadow:0 0 22px rgba(62,224,207,.55);font-size:20px;font-weight:700}
.tile-add:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.tile-cell:has(.tile-add.in)>.tile{border-color:var(--turq);border-top-color:rgb(var(--a));box-shadow:0 0 0 1px var(--turq),0 10px 40px rgba(62,224,207,.18)}

/* ---- a page's packages read like a menu: each one has its own Add ---- */
.rp-offers li{grid-template-columns:minmax(0,1fr) auto auto;align-items:center}
.rp-offers em{grid-column:2;grid-row:1/3}
.rp-pkg{grid-column:3;grid-row:1/3;min-width:84px;min-height:40px;padding:0 14px;border:1px solid rgba(255,255,255,.4);border-radius:99px;background:transparent;color:var(--ink);font:600 14px var(--font);white-space:nowrap;cursor:pointer}
.rp-pkg:hover{background:var(--pink);border-color:var(--pink);color:var(--btn-ink)}
.rp-pkg.in{background:var(--turq);border-color:var(--turq);color:var(--btn-ink)}
.rp-pkg:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.res-embed [data-pkg]{pointer-events:none}
/* on a phone the side card comes last, so the add sits under the story too */
.rp-act{display:none}
.rp-ask.in,.rp-act-add.in{background:var(--turq);border-color:var(--turq);color:var(--btn-ink)}
/* the rest of the night, under a page */
.rp-more{margin-top:clamp(40px,6vw,64px);padding-top:clamp(28px,4vw,44px);border-top:1px solid var(--line)}
.rp-more h2{margin-bottom:10px}.rp-more .lede{margin-bottom:0}
.rp-need{display:flex;flex-wrap:wrap;align-items:center;gap:8px;max-width:none;margin:20px 0 0}.rp-need>span{font:600 12px var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--mute);margin-right:4px}

/* ---- chips into a group (the sheet, a page, the front page) ---- */
.nd-chip{display:inline-flex;align-items:center;min-height:38px;padding:0 14px;border:1px solid var(--line);border-radius:99px;background:rgba(255,255,255,.04);color:var(--ink);font:600 13.5px var(--font);text-decoration:none;white-space:nowrap}
.nd-chip:hover{border-color:rgb(var(--a));color:rgb(var(--a))}
.kinds{display:flex;flex-wrap:wrap;gap:6px;max-width:none;margin:4px 0 0}

/* ---- the bar ---- */
.night-bar{gap:12px;min-width:min(400px,calc(100vw - 32px));padding:8px 20px 8px 8px;font-size:15px;transition:transform .2s ease}
.nb-n{display:grid;place-items:center;flex:none;min-width:36px;height:36px;padding:0 9px;border-radius:99px;background:var(--btn-ink);color:var(--pink);font:700 15px var(--font)}
.nb-t{display:grid;line-height:1.2;min-width:0}.nb-t b{font-size:15px}.nb-t span{font-size:12.5px;opacity:.72;overflow:hidden;text-overflow:ellipsis}
.nb-sum{margin-left:auto;font-weight:600;font-variant-numeric:tabular-nums}
.night-bar em{flex:none}
.night-bar:hover{box-shadow:0 14px 44px rgba(255,94,156,.45)}
.night-bar:focus-visible{outline:3px solid var(--turq);outline-offset:3px}
.night-bar.bump{animation:nb-bump .5s ease}
@keyframes nb-bump{0%,100%{transform:translateX(-50%) scale(1)}35%{transform:translateX(-50%) scale(1.07)}}

/* ---- the note after an add or a remove ---- */
.nt{position:fixed;left:50%;bottom:88px;z-index:70;display:flex;align-items:center;gap:14px;width:max-content;max-width:calc(100vw - 32px);padding:10px 10px 10px 18px;border-radius:14px;background:var(--turq);color:var(--btn-ink);font:500 14.5px/1.35 var(--font);box-shadow:0 14px 44px rgba(0,0,0,.5);opacity:0;visibility:hidden;transform:translate(-50%,10px);transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s}
.nt.on{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .18s ease,transform .18s ease}
.nt-m{min-width:0}
.nt-a{flex:none;min-height:36px;padding:0 14px;border:0;border-radius:99px;background:var(--btn-ink);color:var(--turq);font:600 13.5px var(--font);cursor:pointer}
html.nd-open .nt{bottom:auto;top:16px}
html.nd-open .night-bar{opacity:0;pointer-events:none}

/* ---- the sheet ---- */
html.nd-open{overflow:hidden}
.nd{position:fixed;inset:0;z-index:60}
.nd-scrim{position:absolute;inset:0;background:rgba(5,2,8,.66);opacity:0;transition:opacity .24s ease}
.nd.on .nd-scrim{opacity:1}
.nd-panel{position:absolute;top:0;right:0;bottom:0;display:flex;flex-direction:column;width:min(460px,100vw);background:var(--plum);border-left:1px solid var(--line);box-shadow:-24px 0 80px rgba(0,0,0,.6);transform:translateX(104%);transition:transform .28s cubic-bezier(.2,.8,.2,1);outline:none}
.nd.on .nd-panel{transform:none}
.nd-head{position:relative;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px 22px 14px;border-bottom:1px solid var(--line)}
.nd-head h2{margin:0;font-size:32px}
.nd-sub{margin:6px 0 0;font-size:14px;color:var(--mute)}.nd-sub:empty{display:none}
.nd-x{flex:none;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink);font:300 26px/1 var(--font);cursor:pointer}
.nd-x:hover{border-color:var(--ink)}
.nd-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:16px 22px 10px}
.nd-when{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:10px;margin-bottom:16px}
.nd-when .f>span{font-size:11px}
.nd-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.nd-line{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:8px 12px;align-items:start;padding:12px;border:1px solid var(--line);border-left:4px solid rgb(var(--a));border-radius:12px;background:var(--card)}
.nd-img{display:block;border-radius:8px;overflow:hidden;background:#2a1a3a}.nd-img img{width:64px;height:48px;object-fit:cover}
.nd-info{display:grid;gap:2px;min-width:0}
.nd-name{color:var(--ink);font:500 18px/1.15 var(--display);text-decoration:none;overflow-wrap:anywhere}.nd-name:hover{text-decoration:underline}
.nd-kind{font-size:13px;color:var(--mute)}
.nd-pk{grid-column:2/-1;list-style:none;margin:0;padding:0;display:grid;gap:2px}
.nd-pk li{display:grid;grid-template-columns:minmax(0,1fr) auto 30px;gap:6px;align-items:center;padding:2px 0 2px 10px;border-left:2px solid rgb(var(--a));font-size:14px}
.nd-pk b{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.nd-pk span{min-width:0;overflow-wrap:anywhere}
.nd-unpick{width:30px;height:30px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--mute);font:400 20px/1 var(--font);cursor:pointer}.nd-unpick:hover{background:rgba(255,255,255,.08);color:var(--ink)}
.nd-choose{justify-self:start;margin-top:4px;color:var(--turq);font:600 13.5px var(--font)}
.nd-warn{grid-column:2/-1;max-width:none;margin:0;padding:6px 10px;border-radius:8px;background:rgba(255,94,156,.16);color:#ffc2da;font-size:13px;line-height:1.4}
.nd-end{display:grid;justify-items:end;gap:4px}
.nd-cost{font:400 18px var(--display);white-space:nowrap;font-variant-numeric:tabular-nums}
.nd-rm{padding:6px 0;border:0;background:none;color:var(--mute);font:500 13px var(--font);text-decoration:underline;cursor:pointer}.nd-rm:hover{color:var(--red)}
.nd-line.gone{opacity:.7}
.nd-empty{display:grid;gap:8px;justify-items:start;padding:18px 16px;border:1px dashed var(--line);border-radius:12px;color:var(--mute);font-size:15px;line-height:1.45}.nd-empty b{color:var(--ink);font-size:17px}
.nd-need{margin:18px 0 6px}.nd-need:empty{display:none}
.nd-need-h{margin:0 0 8px;font:600 12px var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.nd-need-l{display:flex;flex-wrap:wrap;gap:6px;max-width:none;margin:0}
.nd-foot{display:grid;gap:8px;padding:14px 22px calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#150a1b}
.nd-total{display:flex;align-items:baseline;justify-content:space-between;gap:10px;max-width:none;margin:0}.nd-total span{font-size:14px;color:var(--mute)}.nd-total b{font:400 28px var(--display);font-variant-numeric:tabular-nums}
.nd-quote,.nd-fine{max-width:none;margin:0;font-size:13px;color:var(--mute)}
.nd-go{width:100%}
.nd-keep{justify-self:center;padding:8px 12px;border:0;background:none;color:var(--ink);font:600 14.5px var(--font);text-decoration:underline;cursor:pointer}
.nd-sum{display:grid;gap:4px}.nd-sum:empty{display:none}
.nd-foot.empty .nd-sum,.nd-foot.empty .nd-go,.nd-foot.empty .nd-fine{display:none}

/* ---- /book: the same lines, then the estimate ---- */
.b-night .picked{margin:4px 0 0}
.b-total{display:grid;gap:4px;margin-top:10px}.b-total:empty{display:none}.b-total .nd-total b{font-size:26px}
.b-more{display:flex;flex-wrap:wrap;align-items:center;gap:14px;max-width:none;margin:10px 0 0;font-size:15px}.b-more #show-free{font-weight:600}

/* ---- /residents: the group chips stay pinned under the top bar. --top-h is
   the top bar's measured height (common.js; it wraps to two lines at some
   widths), --chips-h the chips' own (residents.js); the numbers are fallbacks ---- */
.filter{position:sticky;top:calc(var(--top-h,64px) - 1px);flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;z-index:15;margin:0 calc(-1 * var(--pad));padding:10px var(--pad);background:rgba(11,7,16,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.filter::-webkit-scrollbar{display:none}.filter .chip{flex:none}
.part-roster-head{padding-bottom:22px}
.roster{border-top:0;padding-top:24px}
.roster .group{scroll-margin-top:calc(var(--top-h,64px) + var(--chips-h,57px) + 8px)}
#roster{scroll-margin-top:calc(var(--top-h,64px) + var(--chips-h,57px))}
/* "Pick a package" lands on a page's list, clear of the top bar */
#offers{scroll-margin-top:calc(var(--top-h,64px) + 16px)}

@media (max-width:820px){
  .rp-act{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 12px;margin:6px 0 10px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--card)}
  .rp-act-p{margin:0;font:400 20px var(--display)}
  .rp-act .btn{padding:11px 16px;font-size:14.5px}
  .rp-act .btn.in{grid-column:1/-1}
  .night-bar{left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));min-width:0;max-width:none;transform:none}
  .night-bar.bump{animation-name:nb-bump-m}
  .nt{bottom:calc(84px + env(safe-area-inset-bottom))}
  .filter{top:calc(var(--top-h,52px) - 1px)}
  .roster .group{scroll-margin-top:calc(var(--top-h,52px) + var(--chips-h,57px) + 8px)}
  #roster{scroll-margin-top:calc(var(--top-h,52px) + var(--chips-h,57px))}
  #offers{scroll-margin-top:calc(var(--top-h,52px) + 12px)}
}
@keyframes nb-bump-m{0%,100%{transform:scale(1)}35%{transform:scale(1.03)}}
@media (max-width:640px){
  .nd-panel{top:auto;left:0;width:100%;max-height:90vh;max-height:90dvh;border-radius:20px 20px 0 0;box-shadow:0 -20px 80px rgba(0,0,0,.6);border-left:0;border-top:1px solid var(--line);transform:translateY(104%)}
  .nd-head{padding-top:24px}
  .nd-head::before{content:"";position:absolute;left:50%;top:9px;width:42px;height:4px;border-radius:99px;background:var(--line);transform:translateX(-50%)}
  .nd-scroll,.nd-head{padding-left:16px;padding-right:16px}
  .nd-foot{padding-left:16px;padding-right:16px}
  .nd-line{grid-template-columns:52px minmax(0,1fr) auto;gap:8px 10px;padding:10px}
  .nd-img img{width:52px;height:40px}
  .rp-offers li{grid-template-columns:minmax(0,1fr) auto;gap:2px 12px}
  .rp-offers em{grid-column:2;grid-row:1;font-size:19px}
  .rp-pkg{grid-column:2;grid-row:2/4;align-self:start;min-width:76px;min-height:38px;margin-top:4px}
}
@media (prefers-reduced-motion:reduce){.nd-panel,.nd-scrim,.nt,.tile-add,.night-bar{transition:none}.night-bar.bump{animation:none}}

/* The Floor: a vendor page drawn from a design (BUILDER.md, render.js).
   Plum and black, the vendor's colorway (--a, with --b and --c2) as neon.
   Everything is scoped to .res-d (a page with a saved design), so the
   classic page never changes; the lightbox and the focal classes are the
   only rules outside it. Screen sizes follow the banner slots: phone up to
   600 px, tablet 601 to 1024, desktop above. Blocks size themselves by the
   main column (a container), not the window. No inline styles (CSP). */

/* ---------------- the cover ---------------- */
.res-d .rp-cover{height:auto;border-radius:18px;overflow:hidden;background:#140c1c;isolation:isolate}
.res-d .rp-cover>picture{display:block;aspect-ratio:16/7}
.res-d .rp-cover>picture img,.res-d .cv-none>img{display:block;width:100%;height:100%;object-fit:cover;border-radius:0;filter:saturate(1.05)}
.res-d .cv-none{aspect-ratio:16/7}
.res-d .cv-pano>picture{aspect-ratio:3/1}
/* the night falls over the bottom of the photo */
.res-d .cv-full::after,.res-d .cv-pano::after,.res-d .cv-none::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(11,7,16,0) 58%,rgba(11,7,16,.5)),radial-gradient(70% 60% at 0% 100%,rgba(var(--a),.18),transparent 70%)}
/* framed: a print in a neon frame, the photo keeps its exact shape inside */
.res-d .cv-framed{max-width:880px;margin:0 auto;padding:10px;background:#140c1c;border:1px solid rgba(var(--a),.55);border-radius:12px;box-shadow:0 0 0 1px rgba(var(--a),.18),0 0 44px -6px rgba(var(--a),.45),0 30px 60px -30px rgba(0,0,0,.8)}
.res-d .cv-framed>picture{aspect-ratio:3/2;border-radius:6px;overflow:hidden}
/* the collage: a big photo and four beside it, drifting, on a desktop */
.res-d .cv-collage{background:#000;border-radius:18px}
.res-d .cv-grid{position:relative;display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:1fr 1fr;gap:3px;aspect-ratio:16/7}
.res-d .cv-grid .cg{position:relative;overflow:hidden;min-width:0;min-height:0;background:#0b0710}
.res-d .cv-grid .cg picture{display:block;height:100%}
.res-d .cv-grid .cg img{display:block;width:100%;height:100%;object-fit:cover;transform-origin:50% 50%;animation:cg-drift 26s ease-in-out infinite alternate;filter:saturate(1.05) contrast(1.04)}
.res-d .cv-grid .cg1 img{animation-delay:-7s;animation-duration:31s}.res-d .cv-grid .cg2 img{animation-delay:-13s;animation-duration:24s;animation-direction:alternate-reverse}
.res-d .cv-grid .cg3 img{animation-delay:-19s;animation-duration:29s;animation-direction:alternate-reverse}.res-d .cv-grid .cg4 img{animation-delay:-4s;animation-duration:34s}
.res-d .cv-grid .cg0{grid-column:1/7;grid-row:1/3}.res-d .cv-grid .cg1{grid-column:7/10;grid-row:1}.res-d .cv-grid .cg2{grid-column:10/13;grid-row:1}
.res-d .cv-grid .cg3{grid-column:7/10;grid-row:2}.res-d .cv-grid .cg4{grid-column:10/13;grid-row:2}
.res-d .cv-grid .cg-veil{z-index:1}
.res-d .rp-cover>.cv-one{display:none}
/* the portal preview: one hit area per screen size, over the banner that's showing */
.res-d .cv-hit{position:absolute;inset:0;z-index:2;display:none}
.res-d .cv-add{position:absolute;left:14px;bottom:14px;z-index:3;padding:7px 14px;border-radius:99px;background:rgba(11,7,16,.82);color:var(--ink);border:1px solid rgba(var(--a),.6);font:600 13px var(--font);pointer-events:none}
@media (min-width:1025px){.res-d .cv-hit-d{display:block}}
@media (max-width:1024px){
  .res-d .rp-cover>picture,.res-d .cv-none{aspect-ratio:4/3}
  .res-d .cv-pano>picture{aspect-ratio:2/1}
  .res-d .cv-grid{display:none}
  .res-d .rp-cover>.cv-one{display:block}
}
@media (min-width:601px) and (max-width:1024px){.res-d .cv-hit-t{display:block}}
@media (max-width:600px){
  .res-d .rp-cover{border-radius:14px}
  .res-d .rp-cover>picture,.res-d .cv-none{aspect-ratio:4/5}
  .res-d .cv-pano>picture{aspect-ratio:4/3}
  .res-d .cv-framed{padding:7px;border-radius:10px}
  .res-d .cv-hit-m{display:block}
}

/* ---------------- the main column and its blocks ---------------- */
.res-d .rp-main{container:main/inline-size}
.res-d .blk{margin-top:58px}
.res-d.sp-snug .blk{margin-top:36px}
.res-d .blk-h{font:400 33px/1.08 var(--display);letter-spacing:-.005em;margin:0 0 22px;max-width:none}
.res-d .blk-h::after{content:"";display:block;width:46px;height:3px;margin-top:12px;border-radius:3px;background:rgb(var(--a));box-shadow:0 0 14px rgba(var(--a),.8)}
.res-d.sp-snug .blk-h{margin-bottom:16px}
.res-d .blk-reviews .rp-muted{margin:0}
.res-d .blk-add{margin:0}
.res-d .blk p{max-width:62ch}
.res-d .rp-offers{margin:0}

/* ---------------- photos ---------------- */
.res-d .gal{display:grid;gap:12px}
.res-d.sp-snug .gal{gap:8px}
.res-d .gi{position:relative;display:block;margin:0;padding:0;border:0;border-radius:12px;overflow:hidden;background:#1c0f24;width:100%;color:inherit;font:inherit;text-align:left;text-decoration:none;-webkit-tap-highlight-color:transparent}
.res-d .gi img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(1.04);transition:transform .6s cubic-bezier(.2,.7,.2,1),filter .3s ease}
.res-d .gi-lb{cursor:zoom-in}.res-d .gi-pk,.res-d .gi-ln{cursor:pointer}
@media (hover:hover){.res-d .gi-lb:hover img,.res-d .gi-pk:hover img,.res-d .gi-ln:hover img{transform:scale(1.035);filter:saturate(1.12)}}
.res-d .gi:focus-visible,.res-d .g-all:focus-visible,.res-d .g-car:focus-visible{outline:2px solid rgb(var(--a));outline-offset:3px}
/* a photo that goes somewhere says where */
.res-d .gi-tag{position:absolute;left:10px;bottom:10px;max-width:calc(100% - 20px);padding:6px 11px;border-radius:99px;background:rgba(11,7,16,.82);border:1px solid rgba(var(--a),.5);color:var(--ink);font:500 12.5px/1.2 var(--font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;backdrop-filter:blur(6px)}
.res-d .gi-pk .gi-tag::before{content:"";display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:rgb(var(--a));box-shadow:0 0 8px rgb(var(--a));vertical-align:1px}
/* grid: even rows at 4:3 */
.res-d .g-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.res-d .g-grid .gi{aspect-ratio:4/3}
.res-d .g-grid.g-n1{grid-template-columns:minmax(0,1fr)}.res-d .g-grid.g-n1 .gi{aspect-ratio:3/2}
.res-d .g-grid.g-n2{grid-template-columns:repeat(2,minmax(0,1fr))}
/* masonry: every photo at its own shape */
.res-d .g-mas{display:block;columns:3;column-gap:12px}
.res-d.sp-snug .g-mas{column-gap:8px}
.res-d .g-mas .gi{margin:0 0 12px;break-inside:avoid}
.res-d.sp-snug .g-mas .gi{margin-bottom:8px}
.res-d .g-mas .gi img{height:auto}
/* carousel: slides snap, arrows at the edges */
.res-d .g-car-w{position:relative}
.res-d .g-car{display:flex;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:12px}
.res-d .g-car::-webkit-scrollbar{display:none}
.res-d .g-car .gi{flex:0 0 80%;aspect-ratio:3/2;scroll-snap-align:start}
.res-d .g-arr{position:absolute;top:50%;z-index:2;width:46px;height:46px;margin-top:-23px;display:grid;place-items:center;padding:0 0 3px;border:1px solid rgba(var(--a),.6);border-radius:50%;background:rgba(11,7,16,.78);color:var(--ink);font:400 30px/1 var(--font);box-shadow:0 0 18px -2px rgba(var(--a),.55);backdrop-filter:blur(6px);cursor:pointer;transition:opacity .2s ease,transform .2s ease}
.res-d .g-prev{left:12px}.res-d .g-next{right:12px}
.res-d .g-arr:hover{transform:scale(1.06);background:rgb(var(--a));color:var(--btn-ink)}
.res-d .g-arr:disabled{opacity:0;pointer-events:none}
.res-d .g-arr:focus-visible{outline:2px solid #fff;outline-offset:2px}
.res-d .g-car-still .g-arr{display:none}
/* one big, then a strip of four */
.res-d .g-feat{grid-template-columns:minmax(0,1fr)}
.res-d .g-big .gi{aspect-ratio:16/9}
.res-d .g-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:inherit}
.res-d .g-strip .gi{aspect-ratio:1}
/* collage: a tall one and four around it */
.res-d .g-coll{grid-template-columns:2fr 1fr 1fr;grid-template-rows:repeat(2,minmax(0,1fr));aspect-ratio:16/10}
.res-d .g-coll .gi{height:100%}
.res-d .g-coll .gi:first-child{grid-row:1/3}
/* side by side: two (or four) tall ones */
.res-d .g-duo{grid-template-columns:repeat(2,minmax(0,1fr))}
.res-d .g-duo .gi{aspect-ratio:4/5}
.res-d .g-more{margin:16px 0 0}
.res-d .g-all{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 18px;border:1px solid rgba(255,255,255,.4);border-radius:99px;background:transparent;color:var(--ink);font:600 14.5px var(--font);cursor:pointer}
.res-d .g-all::after{content:"\2192";color:rgb(var(--a))}
.res-d .g-all:hover{border-color:rgb(var(--a));box-shadow:0 0 18px -4px rgba(var(--a),.7)}

/* frames: CSS on the photo's figure, never baked */
.res-d .fr-line{overflow:visible;background:transparent}
.res-d .fr-line img{border-radius:inherit}
.res-d .fr-line::after{content:"";position:absolute;inset:-5px;border:1px solid rgba(var(--a),.75);border-radius:15px;pointer-events:none}
.res-d .fr-round{border-radius:28px}
.res-d .fr-mat{padding:10px;background:#f6f1ea;border-radius:3px;box-shadow:0 18px 36px -18px rgba(0,0,0,.8)}
.res-d .fr-mat img{border-radius:1px}
/* the skin edge, The Floor's: a neon edge in the vendor's colors */
.res-d .fr-skin{overflow:visible;box-shadow:0 0 0 2px rgb(var(--a)),0 0 26px -2px rgba(var(--a),.6),0 0 60px -20px rgba(var(--b,var(--a)),.7)}
.res-d .fr-skin img{border-radius:inherit}
@media (hover:hover){.res-d .fr-skin:hover img,.res-d .fr-mat:hover img,.res-d .fr-line:hover img{transform:none}}

/* ---------------- packages ---------------- */
.res-d .pk-pick{display:inline-block;padding:4px 9px;border-radius:99px;background:rgb(var(--a));color:var(--btn-ink);font:700 10.5px/1.2 var(--font);letter-spacing:.1em;text-transform:uppercase;vertical-align:3px;box-shadow:0 0 14px -2px rgba(var(--a),.8)}
.res-d .pk-menu .pk-feat{box-shadow:inset 3px 0 0 rgb(var(--a));padding-left:14px}
.res-d .pk-menu .pk-pick{margin-left:6px}
.res-d .pk-cards,.res-d .pk-cmp{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.res-d .pk-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
.res-d .pk-c{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:22px 22px 20px;background:var(--card);border:1px solid var(--line);border-radius:16px;transition:box-shadow .3s ease,border-color .3s ease}
.res-d .pk-t{font-size:18px;font-weight:600;line-height:1.3}
.res-d .pk-p{font:400 33px/1.1 var(--display);font-style:normal}
.res-d .pk-ask .pk-p{font-size:22px;color:var(--mute)}
.res-d .pk-d{flex:1;color:var(--mute);font-size:15px;line-height:1.5}
.res-d .pk-c .rp-pkg{margin-top:12px}
/* an odd card out spans the row: words on the left, the price and its Add on the right */
.res-d .pk-cards .pk-c:last-child:nth-child(odd){grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:24px;row-gap:4px;align-items:center}
.res-d .pk-cards .pk-c:last-child:nth-child(odd) .pk-t{grid-column:1;grid-row:1}
.res-d .pk-cards .pk-c:last-child:nth-child(odd) .pk-d{grid-column:1;grid-row:2}
.res-d .pk-cards .pk-c:last-child:nth-child(odd) .pk-p{grid-column:2;grid-row:1;justify-self:end}
.res-d .pk-cards .pk-c:last-child:nth-child(odd) .rp-pkg{grid-column:2;grid-row:2;justify-self:end;margin-top:0}
.res-d .pk-c.pk-feat{border-color:rgba(var(--a),.85);box-shadow:0 0 0 1px rgba(var(--a),.5),0 0 40px -12px rgba(var(--a),.7)}
.res-d .pk-c.pk-feat .pk-p{color:rgb(var(--a));text-shadow:0 0 18px rgba(var(--a),.45)}
.res-d .pk-c .pk-pick{position:absolute;top:-11px;left:20px}
/* compare: side by side, the pick raised a little */
.res-d .pk-cmp .pk-c{align-items:center;text-align:center;padding-top:26px}
.res-d .pk-cmp .pk-c .pk-pick{left:50%;transform:translateX(-50%)}
.res-d .pk-n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.res-d .pk-n3{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.res-d .pk-n3 .pk-c{padding-left:14px;padding-right:14px}
.res-d .pk-n3 .pk-p{font-size:28px}
.res-d .pk-n4{grid-template-columns:repeat(2,minmax(0,1fr))}
.res-d .pk-cmp .pk-feat{transform:translateY(-6px)}
/* a photo pointed here: the package lights up for a moment */
.res-d .pk-hit{animation:pk-hit 2.2s ease}
@keyframes pk-hit{0%,35%{background-color:rgba(var(--a),.16);box-shadow:0 0 0 2px rgb(var(--a)),0 0 30px -4px rgba(var(--a),.8)}100%{}}

/* ---------------- about you, the feature ---------------- */
.res-d .ab{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:30px;align-items:center}
.res-d .v-right .ab{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.res-d .v-right .ab-ph{order:2}
.res-d .ab-solo,.res-d.res-d .v-right .ab-solo{grid-template-columns:minmax(0,1fr)}
.res-d .ab-ph{position:relative;margin:0;aspect-ratio:4/5;border-radius:14px;overflow:hidden;background:#1c0f24}
.res-d .ab-ph img,.res-d .ft-ph img{display:block;width:100%;height:100%;object-fit:cover}
.res-d .ab-t .blk-h{font-size:30px;margin-bottom:14px}
.res-d .ab-t p{color:var(--mute);font-size:17px;line-height:1.6}
.res-d .ab-t p:last-child{margin-bottom:0}
.res-d .ph-empty{display:grid;place-items:center;border:2px dashed var(--line);background:transparent;color:var(--mute);font:600 14px var(--font);text-align:center;padding:12px}
.res-d .ft{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:28px;align-items:center}
.res-d .ft-solo{grid-template-columns:minmax(0,1fr)}
.res-d .ft-ph{position:relative;margin:0;aspect-ratio:3/2;border-radius:14px;overflow:hidden;background:#1c0f24}
.res-d .ft-t .blk-h{margin-bottom:12px}
.res-d .ft-t p{color:var(--mute);font-size:17px;line-height:1.6}
.res-d .ft-t p:last-child{margin-bottom:0}
/* full: the photo wide, the words on a card over its bottom edge */
.res-d .v-full .ft{grid-template-columns:minmax(0,1fr);gap:0}
.res-d .v-full .ft-ph{aspect-ratio:16/9;border-radius:16px}
.res-d .v-full .ft-t{position:relative;z-index:1;margin:-64px 26px 0;padding:22px 24px 20px;background:rgba(34,20,52,.92);border:1px solid rgba(var(--a),.35);border-radius:14px;box-shadow:0 24px 50px -24px rgba(0,0,0,.9),0 0 36px -16px rgba(var(--a),.5);backdrop-filter:blur(10px)}
.res-d .v-full .ft-solo .ft-t{margin:0}

/* ---------------- highlights ---------------- */
.res-d .hl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:22px}
.res-d .hl-numbers li{padding-top:14px;border-top:1px solid rgba(var(--a),.55)}
.res-d .hl-numbers b{display:block;margin-bottom:8px;color:rgb(var(--a));font:400 48px/1 var(--display);text-shadow:0 0 22px rgba(var(--a),.5)}
.res-d .hl-numbers span{display:block;color:var(--mute);font-size:14.5px;line-height:1.4}
.res-d .hl-badges{display:flex;flex-wrap:wrap;gap:10px}
.res-d .hl-badges li{display:inline-flex;align-items:baseline;gap:8px;padding:10px 18px;border:1px solid rgba(var(--a),.4);border-radius:99px;background:rgba(var(--a),.07)}
.res-d .hl-badges b{color:rgb(var(--a));font:700 17px var(--font)}
.res-d .hl-badges span{font-size:15px}

/* ---------------- kind words ---------------- */
.res-d .q-big{margin:0;padding:4px 0 0}
.res-d .q-big blockquote{margin:0}
.res-d .q-big blockquote::before{content:"\201C";display:block;height:50px;color:rgb(var(--a));font:400 120px/.9 var(--display);text-shadow:0 0 30px rgba(var(--a),.55)}
.res-d .q-big p{margin:0;max-width:30ch;font:400 31px/1.28 var(--display);color:var(--ink)}
.res-d .q-big figcaption,.res-d .q-card figcaption{margin-top:18px;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;font-size:15px}
.res-d .q-big figcaption b,.res-d .q-card figcaption b{font-weight:600}
.res-d .q-big figcaption span,.res-d .q-card figcaption span{color:var(--mute);font:400 11.5px var(--mono);letter-spacing:.06em;text-transform:uppercase}
.res-d .q-big figcaption b::before{content:"";display:inline-block;width:26px;height:2px;margin-right:10px;border-radius:2px;background:rgb(var(--a));box-shadow:0 0 10px rgb(var(--a));vertical-align:5px}
.res-d .q-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.res-d .q-card:last-child:nth-child(odd){grid-column:1/-1}
.res-d .q-card{margin:0;display:flex;flex-direction:column;justify-content:space-between;padding:22px 22px 20px;background:var(--card);border:1px solid var(--line);border-radius:16px}
.res-d .q-card blockquote{margin:0}
.res-d .q-card p{margin:0;font:400 20px/1.42 var(--display)}
.res-d .q-card p::before{content:"\201C";color:rgb(var(--a))}.res-d .q-card p::after{content:"\201D";color:rgb(var(--a))}
.res-d .q-card figcaption{margin-top:14px;font-size:14px}

/* ---------------- questions ---------------- */
.res-d .faq{border-top:1px solid var(--line)}
.res-d .faq details{border-bottom:1px solid var(--line)}
.res-d .faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 2px;list-style:none;cursor:pointer;font-weight:500;font-size:17px;line-height:1.35}
.res-d .faq summary::-webkit-details-marker{display:none}
.res-d .faq summary::after{content:"+";flex:none;display:grid;place-items:center;width:30px;height:30px;border:1px solid rgba(var(--a),.55);border-radius:50%;color:rgb(var(--a));font:400 20px/1 var(--font);padding-bottom:2px}
.res-d .faq details[open] summary::after{content:"\2212";background:rgb(var(--a));color:var(--btn-ink);box-shadow:0 0 14px -2px rgba(var(--a),.8)}
.res-d .faq summary:focus-visible{outline:2px solid rgb(var(--a));outline-offset:2px;border-radius:6px}
.res-d .faq-a{padding:0 44px 16px 2px}
.res-d .faq-a p{color:var(--mute);font-size:16px;line-height:1.6;margin:0 0 10px}
.res-d .faq-a p:last-child{margin-bottom:0}

/* ---------------- video ---------------- */
.res-d .vid{position:relative;display:block;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#000;color:#fff;text-decoration:none;box-shadow:0 0 0 1px rgba(var(--a),.25),0 30px 60px -30px rgba(var(--a),.55)}
.res-d .vid img{display:block;width:100%;height:100%;object-fit:cover;opacity:.8;transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .3s ease}
.res-d .vid::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,7,16,0) 40%,rgba(11,7,16,.75)),radial-gradient(60% 60% at 50% 50%,rgba(var(--a),.18),transparent 70%)}
.res-d .vid-none{background:radial-gradient(80% 90% at 30% 20%,rgba(var(--a),.35),transparent 60%),linear-gradient(135deg,#2b1236,#0b0710)}
.res-d .vid-play{position:absolute;z-index:1;left:50%;top:50%;width:78px;height:78px;margin:-39px 0 0 -39px;border-radius:50%;background:rgb(var(--a));box-shadow:0 0 0 8px rgba(var(--a),.18),0 0 40px rgba(var(--a),.8);transition:transform .25s ease}
.res-d .vid-play::after{content:"";position:absolute;left:31px;top:24px;border:15px solid transparent;border-left:24px solid var(--btn-ink);border-right:0}
.res-d .vid-cap{position:absolute;z-index:1;left:20px;bottom:16px;font:400 12px var(--mono);letter-spacing:.1em;text-transform:uppercase}
@media (hover:hover){.res-d .vid:hover img{transform:scale(1.03);opacity:.95}.res-d .vid:hover .vid-play{transform:scale(1.07)}}
.res-d .vid:focus-visible{outline:2px solid rgb(var(--a));outline-offset:3px}
.res-d .vid-side{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:26px;align-items:center}
.res-d .vid-side .vid-play{width:62px;height:62px;margin:-31px 0 0 -31px}
.res-d .vid-side .vid-play::after{left:25px;top:19px;border-width:12px;border-left-width:19px}
.res-d .vid-t .blk-h{margin-bottom:12px}
.res-d .vid-t p{margin:0}
.res-d .vid-t a{color:rgb(var(--a));font-weight:600}

/* ---------------- open dates ---------------- */
.res-d .rp-dates{max-width:560px;gap:12px}
.res-d .rp-dates .rp-cal-head{min-height:40px}
.res-d .rp-dates .rp-cal-m{font:400 22px var(--display)}
.res-d .rp-dates .rp-cal-nav{width:40px;height:40px;font-size:24px}
.res-d .rp-dates .rp-cal{gap:6px;font-size:14px}
.res-d .rp-dates .rp-cal b{font-size:12px}
.res-d .rp-dates .rp-cal span{aspect-ratio:1.2;border-radius:8px}
.res-d .v-two .rp-dates{max-width:none}
.res-d .rp-cal-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.res-d .rp-cal-mn{margin:0 0 8px;font:400 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:rgb(var(--a))}
.res-d .v-two .rp-cal{gap:4px;font-size:13px}
.res-d .v-two .rp-cal span{aspect-ratio:1;border-radius:6px}
.res-d .rp-dates-f{margin:12px 0 0}

/* ---------------- where they work, find them online ---------------- */
.res-d .area{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.res-d .area li{padding:9px 16px;border:1px solid var(--line);border-radius:99px;background:rgba(255,255,255,.04);font-size:15px;font-weight:500}
.res-d .area li::before{content:"";display:inline-block;width:7px;height:7px;margin-right:9px;border-radius:50%;background:rgb(var(--a));box-shadow:0 0 8px rgb(var(--a));vertical-align:1px}
.res-d .area-note{margin:14px 0 0;color:var(--mute);font-size:15.5px}
.res-d .soc{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.res-d .soc a{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 18px 0 14px;border:1px solid var(--line);border-radius:99px;background:rgba(255,255,255,.04);color:var(--ink);text-decoration:none;font-size:15px;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.res-d .soc a:hover{border-color:rgb(var(--a));box-shadow:0 0 22px -6px rgba(var(--a),.8);transform:translateY(-1px)}
.res-d .soc a:focus-visible{outline:2px solid rgb(var(--a));outline-offset:2px}
.res-d .soc-i{flex:none;fill:none;stroke:rgb(var(--a));stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.res-d .soc b{font-weight:600}
.res-d .soc small{color:var(--mute);font-size:13.5px}

/* ---------------- the main column narrows: blocks re-flow ---------------- */
@container main (max-width:560px){
  .res-d .blk-h{font-size:29px}
  .res-d .g-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .res-d .g-grid.g-n1{grid-template-columns:minmax(0,1fr)}
  .res-d .g-mas{columns:2}
  .res-d .g-car .gi{flex-basis:86%}
  .res-d .g-coll{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;aspect-ratio:auto}
  .res-d .g-coll .gi:first-child{grid-row:auto;grid-column:1/-1;aspect-ratio:4/3}
  .res-d .g-coll .gi{height:auto;aspect-ratio:1}
  .res-d .pk-cards,.res-d .q-cards{grid-template-columns:minmax(0,1fr)}
  .res-d .pk-n3,.res-d .pk-n4{grid-template-columns:minmax(0,1fr)}
  .res-d .pk-n2{grid-template-columns:minmax(0,1fr)}
  .res-d .pk-cmp .pk-feat{transform:none}
  .res-d .pk-n3 .pk-c{padding-left:22px;padding-right:22px}
  .res-d .ab,.res-d .v-right .ab{grid-template-columns:minmax(0,1fr);gap:20px}
  .res-d .v-right .ab-ph{order:0}
  .res-d .ab-ph{aspect-ratio:1}
  .res-d .ft{grid-template-columns:minmax(0,1fr);gap:18px}
  .res-d .v-full .ft-t{margin:-40px 12px 0;padding:18px 18px 16px}
  .res-d .vid-side{grid-template-columns:minmax(0,1fr);gap:14px}
  .res-d .q-big p{font-size:26px}
  .res-d .hl-numbers b{font-size:42px}
  .res-d .hl-numbers.hl-n3{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
  .res-d .hl-numbers.hl-n3 b{font-size:33px}
  .res-d .hl-numbers.hl-n4,.res-d .hl-numbers.hl-n2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .res-d .pk-cards .pk-c:last-child:nth-child(odd){display:flex}
  .res-d .rp-cal-two{grid-template-columns:minmax(0,1fr);gap:22px}
  .res-d .rp-dates .rp-cal span{aspect-ratio:1}
}
@container main (min-width:700px){
  .res-d .pk-n4{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
  .res-d .pk-n4 .pk-c{padding-left:14px;padding-right:14px}
  .res-d .pk-n4 .pk-p{font-size:27px}
}
/* one column (a tablet, a phone): the booking card keeps a card's width */
@media (max-width:820px){.res-d .rp-side{max-width:560px}}
@media (max-width:600px){
  .res-d .blk{margin-top:46px}
  .res-d.sp-snug .blk{margin-top:30px}
  .res-d .gal{gap:8px}
  .res-d .g-mas{column-gap:8px}.res-d .g-mas .gi{margin-bottom:8px}
  .res-d .gi{border-radius:10px}
  .res-d .g-strip{gap:6px}
  .res-d .g-arr{width:40px;height:40px;margin-top:-20px;font-size:26px}
  .res-d .g-prev{left:8px}.res-d .g-next{right:8px}
  .res-d .faq-a{padding-right:8px}
  .res-d .vid-play{width:64px;height:64px;margin:-32px 0 0 -32px}
  .res-d .vid-play::after{left:26px;top:20px;border-width:12px;border-left-width:19px}
}

/* ---------------- the lightbox (behave.js); a modal dialog, html.lb-open while it shows ---------------- */
html.lb-open{overflow:hidden}
.lb{position:fixed;inset:0;z-index:85;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;background:rgba(6,3,10,.94);color:var(--ink);overflow:hidden;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.lb:not([open]){display:none}
.lb::backdrop{background:rgba(6,3,10,.6)}
.lb-stage{position:absolute;inset:64px 76px 82px;display:flex;align-items:center;justify-content:center;touch-action:pan-y pinch-zoom}
.lb-img{display:block;flex:none;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:6px;box-shadow:0 0 0 1px rgba(255,94,156,.18),0 30px 90px rgba(0,0,0,.7);opacity:0;transform:scale(.985);transition:opacity .25s ease,transform .25s ease;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.lb-ready .lb-img{opacity:1;transform:none}
.lb-bar{position:absolute;left:76px;right:76px;bottom:0;min-height:82px;display:flex;align-items:center;justify-content:center;gap:18px;padding:12px 0 calc(12px + env(safe-area-inset-bottom))}
.lb-cap{margin:0;max-width:60ch;text-align:center;font:400 16px/1.4 var(--font);color:var(--ink)}
.lb-n{margin:0;flex:none;font:400 11px var(--mono);letter-spacing:.14em;color:var(--turq)}
.lb-btn{position:absolute;display:grid;place-items:center;width:48px;height:48px;padding:0 0 3px;border:1px solid rgba(255,94,156,.45);border-radius:50%;background:rgba(11,7,16,.7);color:var(--ink);font:300 32px/1 var(--font);cursor:pointer;transition:background .2s ease,box-shadow .2s ease}
.lb-btn:hover{background:var(--pink);color:var(--btn-ink);box-shadow:0 0 24px -2px rgba(255,94,156,.8)}
.lb-btn:focus-visible{outline:2px solid var(--turq);outline-offset:2px}
.lb-btn:disabled{opacity:.25;cursor:default;background:rgba(11,7,16,.7);color:var(--ink);box-shadow:none}
.lb-btn[hidden]{display:none}
.lb-prev{left:16px;top:50%;margin-top:-24px}.lb-next{right:16px;top:50%;margin-top:-24px}
.lb-x{right:16px;top:12px;font-size:30px}
@media (max-width:600px){
  .lb-stage{inset:58px 0 96px}
  .lb-img{border-radius:0}
  .lb-bar{left:16px;right:16px;flex-direction:column;gap:6px;justify-content:center}
  .lb-prev,.lb-next{top:auto;bottom:calc(20px + env(safe-area-inset-bottom));margin:0;width:44px;height:44px}
  .lb-prev{left:12px}.lb-next{right:12px}
  .lb-x{right:10px;top:8px}
}
@media (prefers-reduced-motion:reduce){.res-d .cv-grid .cg img{animation:none}.res-d .gi img,.res-d .vid img,.res-d .g-arr,.res-d .soc a,.lb-img{transition:none}.res-d .pk-hit{animation:none;box-shadow:0 0 0 2px rgb(var(--a))}}

/* ---------------- focal points: where object-fit: cover keeps its middle, in steps of 5 (render.js) ---------------- */
.res-d img{object-position:var(--fx,50%) var(--fy,50%)}
.fx-0{--fx:0%}.fx-5{--fx:5%}.fx-10{--fx:10%}.fx-15{--fx:15%}.fx-20{--fx:20%}.fx-25{--fx:25%}.fx-30{--fx:30%}.fx-35{--fx:35%}.fx-40{--fx:40%}.fx-45{--fx:45%}.fx-50{--fx:50%}.fx-55{--fx:55%}.fx-60{--fx:60%}.fx-65{--fx:65%}.fx-70{--fx:70%}.fx-75{--fx:75%}.fx-80{--fx:80%}.fx-85{--fx:85%}.fx-90{--fx:90%}.fx-95{--fx:95%}.fx-100{--fx:100%}.fy-0{--fy:0%}.fy-5{--fy:5%}.fy-10{--fy:10%}.fy-15{--fy:15%}.fy-20{--fy:20%}.fy-25{--fy:25%}.fy-30{--fy:30%}.fy-35{--fy:35%}.fy-40{--fy:40%}.fy-45{--fy:45%}.fy-50{--fy:50%}.fy-55{--fy:55%}.fy-60{--fy:60%}.fy-65{--fy:65%}.fy-70{--fy:70%}.fy-75{--fy:75%}.fy-80{--fy:80%}.fy-85{--fy:85%}.fy-90{--fy:90%}.fy-95{--fy:95%}.fy-100{--fy:100%}
@media (min-width:601px) and (max-width:1024px){.tfx-0{--fx:0%}.tfx-5{--fx:5%}.tfx-10{--fx:10%}.tfx-15{--fx:15%}.tfx-20{--fx:20%}.tfx-25{--fx:25%}.tfx-30{--fx:30%}.tfx-35{--fx:35%}.tfx-40{--fx:40%}.tfx-45{--fx:45%}.tfx-50{--fx:50%}.tfx-55{--fx:55%}.tfx-60{--fx:60%}.tfx-65{--fx:65%}.tfx-70{--fx:70%}.tfx-75{--fx:75%}.tfx-80{--fx:80%}.tfx-85{--fx:85%}.tfx-90{--fx:90%}.tfx-95{--fx:95%}.tfx-100{--fx:100%}.tfy-0{--fy:0%}.tfy-5{--fy:5%}.tfy-10{--fy:10%}.tfy-15{--fy:15%}.tfy-20{--fy:20%}.tfy-25{--fy:25%}.tfy-30{--fy:30%}.tfy-35{--fy:35%}.tfy-40{--fy:40%}.tfy-45{--fy:45%}.tfy-50{--fy:50%}.tfy-55{--fy:55%}.tfy-60{--fy:60%}.tfy-65{--fy:65%}.tfy-70{--fy:70%}.tfy-75{--fy:75%}.tfy-80{--fy:80%}.tfy-85{--fy:85%}.tfy-90{--fy:90%}.tfy-95{--fy:95%}.tfy-100{--fy:100%}}
@media (max-width:600px){.mfx-0{--fx:0%}.mfx-5{--fx:5%}.mfx-10{--fx:10%}.mfx-15{--fx:15%}.mfx-20{--fx:20%}.mfx-25{--fx:25%}.mfx-30{--fx:30%}.mfx-35{--fx:35%}.mfx-40{--fx:40%}.mfx-45{--fx:45%}.mfx-50{--fx:50%}.mfx-55{--fx:55%}.mfx-60{--fx:60%}.mfx-65{--fx:65%}.mfx-70{--fx:70%}.mfx-75{--fx:75%}.mfx-80{--fx:80%}.mfx-85{--fx:85%}.mfx-90{--fx:90%}.mfx-95{--fx:95%}.mfx-100{--fx:100%}.mfy-0{--fy:0%}.mfy-5{--fy:5%}.mfy-10{--fy:10%}.mfy-15{--fy:15%}.mfy-20{--fy:20%}.mfy-25{--fy:25%}.mfy-30{--fy:30%}.mfy-35{--fy:35%}.mfy-40{--fy:40%}.mfy-45{--fy:45%}.mfy-50{--fy:50%}.mfy-55{--fy:55%}.mfy-60{--fy:60%}.mfy-65{--fy:65%}.mfy-70{--fy:70%}.mfy-75{--fy:75%}.mfy-80{--fy:80%}.mfy-85{--fy:85%}.mfy-90{--fy:90%}.mfy-95{--fy:95%}.mfy-100{--fy:100%}}

/* The photo editor sheet (src/photo.js, LFE_PHOTO.openEditor), The Floor's
   colors; the shape is the same on both skins. A modal on the portal page at
   z-index 88 (START-HERE.md, the layer ladder). While it's open, html.pe-open
   holds the page still and hides the Feedback button (feedback.css). No inline
   styles: the few sizes that change are set from script through the CSSOM. */
.pe{--pe-bg:var(--plum);--pe-ink:var(--ink);--pe-mute:var(--mute);--pe-line:rgba(255,220,220,.16);--pe-field:rgba(255,255,255,.045);--pe-soft:rgba(255,255,255,.08);--pe-hover:rgba(255,255,255,.08);--pe-track:rgba(255,255,255,.2);
  --pe-acc:var(--pink);--pe-acc-ink:var(--btn-ink);--pe-sel:var(--pink);--pe-thumb:var(--pink);--pe-box:var(--turq);--pe-box-ink:var(--btn-ink);--pe-good:var(--turq);--pe-warn:var(--gold);--pe-bad:#ff7a98;--pe-cut:#ff5e7e;--pe-ok-bg:rgba(62,224,207,.12);--pe-ok-ink:var(--turq);--pe-bad-bg:rgba(255,94,156,.13);
  --pe-stage:#07040b;--pe-dim:rgba(3,1,6,.7);--pe-scrim:rgba(5,2,8,.68);--pe-shadow:0 30px 110px rgba(0,0,0,.72),0 0 0 1px rgba(255,94,156,.07)}

html.pe-open{overflow:hidden}
.pe{position:fixed;inset:0;z-index:88;display:grid;place-items:center;padding:24px;color:var(--pe-ink);font:400 15px/1.45 var(--font)}
.pe-scrim{position:absolute;inset:0;background:var(--pe-scrim);opacity:0;transition:opacity .2s ease}
.pe.on .pe-scrim{opacity:1}
.pe-sheet{position:relative;display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:min(1240px,100%);height:min(860px,100%);background:var(--pe-bg);border:1px solid var(--pe-line);border-radius:20px;box-shadow:var(--pe-shadow);overflow:hidden;outline:none;opacity:0;transform:translateY(10px) scale(.985);transition:opacity .2s ease,transform .24s cubic-bezier(.2,.8,.2,1)}
.pe.on .pe-sheet{opacity:1;transform:none}
.pe svg{flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pe svg .pe-fill{fill:currentColor;stroke:none;opacity:.4}
.pe p{max-width:none}

/* ---- the head ---- */
.pe-head{display:flex;align-items:center;gap:14px;min-width:0;padding:12px 12px 12px 22px;border-bottom:1px solid var(--pe-line)}
.pe-head-t{flex:1;display:flex;align-items:baseline;gap:14px;min-width:0}
.pe-head h2{flex:none;max-width:100%;margin:0;font:500 23px/1.2 var(--display);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pe-subt{min-width:0;margin:0;font-size:13.5px;color:var(--pe-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pe-x{flex:none;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--pe-mute);cursor:pointer}
.pe-x svg{width:22px;height:22px}
.pe-x:hover{background:var(--pe-hover);color:var(--pe-ink)}
.pe-x:focus-visible{outline:2px solid var(--pe-acc);outline-offset:2px}

/* ---- the stage: the photo on a dark ground ---- */
.pe-body{display:grid;grid-template-columns:minmax(0,1fr) 376px;min-height:0}
.pe-stage{position:relative;min-width:0;min-height:0;overflow:hidden;background:var(--pe-stage);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.pe-cv{position:absolute;inset:0;display:block;width:100%;height:100%;outline:none;touch-action:none}
.pe-cv:focus-visible{box-shadow:inset 0 0 0 3px var(--pe-acc)}
.pe-read,.pe-hint,.pe-orig{position:absolute;top:14px;display:flex;align-items:center;gap:8px;margin:0;padding:7px 13px;border-radius:99px;font:500 12.5px/1.2 var(--font);pointer-events:none;white-space:nowrap}
.pe-read{left:14px;max-width:calc(100% - 28px);padding-left:11px;background:rgba(12,10,8,.66);color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.pe-read span{overflow:hidden;text-overflow:ellipsis}
.pe-read i{flex:none;width:8px;height:8px;border-radius:50%;background:#bdb5aa}
.pe-read.pe-good i{background:var(--pe-good)}.pe-read.pe-soft i{background:var(--pe-warn)}.pe-read.pe-bad i{background:var(--pe-bad)}
.pe-hint{right:14px;background:rgba(12,10,8,.44);color:rgba(255,255,255,.86)}
.pe-orig{left:50%;transform:translateX(-50%);background:var(--turq);color:var(--btn-ink);font-weight:600}
.pe-stage.is-cmp .pe-read,.pe-stage.is-cmp .pe-hint,.pe-stage[data-tab=frame] .pe-read{visibility:hidden}
.pe-float{position:absolute;left:0;right:0;bottom:18px;display:flex;justify-content:center;pointer-events:none}
.pe-cmp{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 17px 0 13px;border:1px solid rgba(255,255,255,.24);border-radius:99px;background:rgba(18,15,12,.8);color:#fff;font:600 13.5px var(--font);cursor:pointer;pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .12s ease,color .12s ease}
.pe-cmp:hover{border-color:rgba(255,255,255,.5)}
.pe-cmp[aria-pressed=true]{background:var(--turq);border-color:var(--turq);color:var(--btn-ink)}
.pe-cmp:focus-visible{outline:2px solid #fff;outline-offset:2px}
.pe-stage[data-tab=frame] .pe-float,.pe-stage[data-tab=details] .pe-float{display:none}
.pe-load{position:absolute;inset:0;display:grid;place-items:center;margin:0;padding:24px;color:rgba(255,255,255,.78);font-size:14.5px;text-align:center}
.pe-load.pe-bad{color:#ffb4a4}

/* ---- the Frame tab: a slice of a page in this skin ---- */
.pe-mock{position:absolute;inset:0;display:grid;place-items:center;padding:22px}
.pe-mock-pg{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;max-width:780px;padding:24px 40px 28px;border:1px solid var(--line);border-radius:14px;background:radial-gradient(120% 80% at 50% 0%,rgba(138,92,255,.16),transparent 60%),linear-gradient(180deg,var(--plum),var(--paper));color:var(--ink);box-shadow:0 22px 70px rgba(0,0,0,.6);overflow:hidden}
.pe-mock-k{margin:0 0 6px;font:600 11px/1 var(--font);letter-spacing:.14em;text-transform:uppercase;color:var(--pink)}
.pe-mock-h{margin:0 0 22px;font:500 28px/1.1 var(--display)}
.pe-mock-fig{position:relative;flex:none;margin:0}
.pe-mock-cv{display:block}
.pe-mock-l{display:grid;justify-items:center;gap:8px;width:100%;margin:26px 0 0}
.pe-mock-l i{display:block;width:60%;height:8px;border-radius:4px;background:rgba(255,255,255,.12)}
.pe-mock-l i+i{width:42%}
/* how each frame looks until page.css draws the real ones; :where() keeps
   these below page.css's own .fr-* rules */
:where(.pe-mock .fr-line){outline:1px solid rgba(255,243,234,.6);outline-offset:7px}
:where(.pe-mock .fr-round){border-radius:18px;overflow:hidden}
:where(.pe-mock .fr-round canvas){border-radius:18px}
:where(.pe-mock .fr-mat){padding:14px;background:#f6f1f4;box-shadow:0 14px 40px rgba(0,0,0,.55)}
:where(.pe-mock .fr-skin){border-radius:12px;box-shadow:0 0 0 2px var(--pink),0 0 22px 3px rgba(255,94,156,.55),0 0 70px 8px rgba(62,224,207,.2)}
:where(.pe-mock .fr-skin canvas){border-radius:11px}

/* ---- the tools ---- */
.pe-tools{display:grid;grid-template-rows:auto minmax(0,1fr);min-width:0;min-height:0;border-left:1px solid var(--pe-line);background:var(--pe-bg)}
.pe-is-slot .pe-tools{grid-template-rows:minmax(0,1fr)}
.pe-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:0 6px;border-bottom:1px solid var(--pe-line)}
.pe-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:60px;margin-bottom:-1px;padding:8px 2px 7px;border:0;border-bottom:2px solid transparent;background:none;color:var(--pe-mute);font:600 12.5px/1.1 var(--font);cursor:pointer}
.pe-tab:hover{color:var(--pe-ink)}
.pe-tab[aria-selected=true]{color:var(--pe-ink);border-bottom-color:var(--pe-acc)}
.pe-tab[aria-selected=true] svg{color:var(--pe-acc)}
.pe-tab:focus-visible{outline:2px solid var(--pe-acc);outline-offset:-4px;border-radius:10px}
.pe-panes,.pe-p-slot{min-height:0;overflow:auto;overscroll-behavior:contain}
.pe-p{padding:20px 22px 26px}
.pe-h3{margin:0 0 10px;font:600 11.5px/1.2 var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--pe-mute)}
.pe-p>.pe-h3:not(:first-child){margin-top:24px}
.pe-h3-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:24px}
.pe-tip{margin:16px 0 0;font-size:13px;line-height:1.5;color:var(--pe-mute)}
.pe-tip-top{margin:0 0 16px}
.pe-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.pe-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:0 15px;border:1px solid var(--pe-line);border-radius:99px;background:var(--pe-field);color:var(--pe-ink);font:600 13.5px var(--font);cursor:pointer}
.pe-btn svg{width:18px;height:18px}
.pe-btn:hover{border-color:var(--pe-ink)}
.pe-btn:disabled{opacity:.4;cursor:default;border-color:var(--pe-line)}
.pe-btn:focus-visible,.pe-asps button:focus-visible,.pe-frames button:focus-visible,.pe-looks button:focus-visible,.pe-link:focus-visible{outline:2px solid var(--pe-acc);outline-offset:2px}
.pe-link{padding:4px 0;border:0;background:none;color:var(--pe-acc);font:600 13px var(--font);letter-spacing:0;text-transform:none;text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* crop: shapes, sliders */
.pe-asps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.pe-asps button{display:grid;grid-template-rows:24px auto;justify-items:center;align-items:center;align-content:center;gap:6px;min-width:0;min-height:64px;padding:8px 2px;border:1px solid var(--pe-line);border-radius:12px;background:var(--pe-field);color:var(--pe-ink);font:600 12px/1 var(--font);cursor:pointer}
.pe-asps button:hover{border-color:var(--pe-mute)}
.pe-asps button[aria-pressed=true]{border-color:var(--pe-sel);box-shadow:inset 0 0 0 1px var(--pe-sel);background:var(--pe-soft)}
.pe-shp{display:block;width:20px;height:15px;border:1.6px solid currentColor;border-radius:2px}
[data-asp=free] .pe-shp{border-style:dashed}
.pe-sl{margin-top:18px}
.pe-sl-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:2px}
.pe-sl-h label{font:600 13.5px var(--font)}
.pe-sl-h output{font:500 13px var(--font);color:var(--pe-mute);font-variant-numeric:tabular-nums}
.pe input[type=range]{-webkit-appearance:none;appearance:none;display:block;width:100%;height:30px;margin:0;padding:0;background:transparent;cursor:pointer;touch-action:pan-y}
.pe input[type=range]:focus{outline:none}
.pe input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:var(--pe-track)}
.pe input[type=range]::-moz-range-track{height:4px;border-radius:4px;background:var(--pe-track)}
.pe input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;margin-top:-9px;border:2px solid var(--pe-thumb);border-radius:50%;background:var(--pe-bg);box-shadow:0 1px 4px rgba(0,0,0,.22)}
.pe input[type=range]::-moz-range-thumb{width:18px;height:18px;border:2px solid var(--pe-thumb);border-radius:50%;background:var(--pe-bg);box-shadow:0 1px 4px rgba(0,0,0,.22)}
.pe input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px var(--pe-soft),0 0 0 6px var(--pe-acc)}
.pe input[type=range]:focus-visible::-moz-range-thumb{box-shadow:0 0 0 4px var(--pe-soft),0 0 0 6px var(--pe-acc)}
.pe-bi input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg,transparent calc(50% - 1px),var(--pe-mute) calc(50% - 1px),var(--pe-mute) calc(50% + 1px),transparent calc(50% + 1px)),var(--pe-track)}
.pe-bi input[type=range]::-moz-range-track{background:linear-gradient(90deg,transparent calc(50% - 1px),var(--pe-mute) calc(50% - 1px),var(--pe-mute) calc(50% + 1px),transparent calc(50% + 1px)),var(--pe-track)}

/* light: looks */
.pe-looks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 8px}
.pe-looks button{display:grid;gap:6px;min-width:0;padding:0 0 2px;border:0;border-radius:10px;background:none;color:var(--pe-ink);font:600 12px/1.2 var(--font);text-align:center;cursor:pointer}
.pe-looks canvas{display:block;width:100%;aspect-ratio:4/3;border-radius:10px;background:var(--pe-soft);box-shadow:0 0 0 1px var(--pe-line)}
.pe-looks button[aria-pressed=true] canvas{box-shadow:0 0 0 2px var(--pe-bg),0 0 0 4px var(--pe-acc)}
.pe-looks button[aria-pressed=true] span{color:var(--pe-acc)}

/* frame: the choices */
.pe-frames{display:grid;gap:7px}
.pe-frames button{display:flex;align-items:center;gap:14px;min-height:58px;padding:8px 14px 8px 10px;border:1px solid var(--pe-line);border-radius:12px;background:var(--pe-field);color:var(--pe-ink);text-align:left;cursor:pointer}
.pe-frames button:hover{border-color:var(--pe-mute)}
.pe-frames button[aria-pressed=true]{border-color:var(--pe-sel);box-shadow:inset 0 0 0 1px var(--pe-sel);background:var(--pe-soft)}
.pe-frames span{display:grid;gap:1px;min-width:0}
.pe-frames span b{font:600 14px/1.25 var(--font)}
.pe-frames small{font-size:12.5px;line-height:1.3;color:var(--pe-mute)}
.pe-fi{flex:none;display:grid;place-items:center;width:46px;height:38px}
.pe-fi b{display:block;width:30px;height:21px;background:linear-gradient(140deg,#ff9ac2 0%,#8a5cff 55%,#2a1a3a 100%)}
.pe-fi-line b{outline:1px solid rgba(255,243,234,.7);outline-offset:3px}
.pe-fi-round b{border-radius:7px}
.pe-fi-mat b{width:26px;height:18px;box-shadow:0 0 0 4px #f6f1f4}
.pe-fi-skin b{border-radius:5px;box-shadow:0 0 0 1.5px var(--pink),0 0 10px 1px rgba(255,94,156,.75)}

/* focus: the label and three other crops */
.pe-f{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0 0 6px}
.pe-f label{font:600 13.5px var(--font)}
.pe-f em{font-style:normal;font-size:12.5px;color:var(--pe-mute);font-variant-numeric:tabular-nums}
.pe-in{display:block;width:100%;min-height:46px;margin:0;padding:10px 12px;border:1px solid var(--pe-line);border-radius:10px;background:var(--pe-field);color:var(--pe-ink);font:400 16px/1.35 var(--font)}
textarea.pe-in{min-height:88px;resize:vertical}
select.pe-in{padding-right:8px}
.pe-in:focus{outline:2px solid var(--pe-acc);outline-offset:1px;border-color:transparent}
.pe-in.pe-bad{border-color:var(--pe-bad)}
.pe-prevs{display:grid;grid-template-columns:.8fr 1fr 2.2857fr;align-items:end;gap:10px}
.pe-prev{display:grid;gap:7px;min-width:0;margin:0}
.pe-prev canvas{display:block;width:100%;aspect-ratio:1;border-radius:8px;background:var(--pe-stage)}
.pe-prev figcaption{display:flex;align-items:center;gap:6px;margin:0;font:600 12.5px/1.2 var(--font);color:var(--pe-ink);white-space:nowrap}
.pe-prev figcaption i{flex:none;width:8px;height:8px;border-radius:50%;background:var(--pe-good)}
.pe-prev.is-cut figcaption i{background:var(--pe-bad)}
.pe-prev.is-cut canvas{box-shadow:0 0 0 2px var(--pe-bad)}
.pe-prev-sum{margin:12px 0 0;font-size:13px;line-height:1.45;color:var(--pe-mute)}
.pe-prev-sum.is-cut{color:var(--pe-bad);font-weight:600}

/* details: taps */
.pe-taps{min-width:0;margin:22px 0 0;padding:0;border:0}
.pe-taps legend{padding:0;margin-bottom:6px}
.pe-opt{display:flex;align-items:flex-start;gap:12px;margin-top:7px;padding:11px 12px;border:1px solid var(--pe-line);border-radius:12px;background:var(--pe-field);cursor:pointer}
.pe-opt:has(input:checked){border-color:var(--pe-sel);box-shadow:inset 0 0 0 1px var(--pe-sel)}
.pe-opt:has(input:disabled){opacity:.5;cursor:default}
.pe-opt input{flex:none;width:18px;height:18px;margin:2px 0 0;accent-color:var(--pe-acc)}
.pe-opt span{display:grid;gap:1px;min-width:0}
.pe-opt b{font:600 14px/1.25 var(--font)}
.pe-opt small{font-size:12.5px;line-height:1.3;color:var(--pe-mute)}
.pe-more{padding:8px 0 4px 42px}
.pe-err{margin:7px 0 0;font-size:13px;line-height:1.4;color:var(--pe-bad)}
.pe-err:empty{display:none}

/* slot mode */
.pe-card{display:flex;align-items:center;gap:14px;padding:13px 15px;border-radius:14px;background:var(--pe-soft)}
.pe-card b{display:block;font:600 15px/1.3 var(--font)}
.pe-card small{display:block;margin-top:2px;font-size:12.5px;line-height:1.4;color:var(--pe-mute)}
.pe-shp-big{flex:none;border-width:2px;border-radius:4px}
.pe-head h2{font-weight:400}

/* ---- the foot ---- */
.pe-foot{display:flex;align-items:center;gap:10px;padding:12px 16px 12px 18px;border-top:1px solid var(--pe-line)}
.pe-sp{flex:1}
.pe-foot .btn{min-height:44px;white-space:nowrap}
.pe-quiet{border-color:transparent;background:transparent;color:var(--pe-mute)}
.pe-quiet:hover{border-color:var(--pe-line);color:var(--pe-ink)}
.pe-quiet:disabled{border-color:transparent}
.pe-reset-top{display:none}

/* ---- phones: the photo on top, the tools under it ---- */
@media (max-width:720px){
  .pe{padding:0;place-items:stretch}
  .pe-sheet{width:100%;height:100%;border:0;border-radius:0;transform:translateY(24px)}
  .pe-head{padding:6px 4px 6px 16px}
  .pe-head h2{font-size:19px}
  .pe-subt{display:none}
  .pe-body{grid-template-columns:minmax(0,1fr);grid-template-rows:clamp(200px,42vh,440px) minmax(0,1fr);grid-template-rows:clamp(200px,42dvh,440px) minmax(0,1fr)}
  .pe-tools{border-left:0;border-top:1px solid var(--pe-line)}
  .pe-tabs{padding:0}
  .pe-tab{min-height:56px;font-size:12px}
  .pe-p{padding:16px 16px 22px}
  .pe-hint{display:none}
  .pe-read,.pe-orig{top:10px;padding:6px 11px;font-size:12px}
  .pe-read{left:10px;max-width:calc(100% - 20px)}
  .pe-float{bottom:10px}
  .pe-cmp{min-height:40px}
  .pe-foot{gap:8px;padding:9px 12px calc(9px + env(safe-area-inset-bottom))}
  .pe-foot .btn{flex:1;min-width:0;padding-left:10px;padding-right:10px}
  .pe-reset-top{display:inline-flex;flex:none;min-height:40px;padding:0 10px}
  .pe-reset-foot,.pe-sp{display:none}
  .pe-mock{padding:10px}
  .pe-mock-pg{padding:14px 14px 16px;border-radius:10px}
  .pe-mock-k{font-size:10px}
  .pe-mock-h{margin-bottom:10px;font-size:19px}
  .pe-mock-l{gap:6px;margin-top:12px}
  .pe-mock-l i{height:6px}
}
/* a short, wide screen (a phone on its side): the whole screen */
@media (min-width:721px) and (max-height:560px){
  .pe{padding:0;place-items:stretch}
  .pe-sheet{width:100%;height:100%;border:0;border-radius:0}
  .pe-head{padding:4px 8px 4px 18px}
  .pe-subt{display:none}
  .pe-tab{min-height:48px}
}
@media (prefers-reduced-motion:reduce){.pe-scrim,.pe-sheet,.pe-cmp{transition:none}.pe-sheet{transform:none}}

/* The Floor: the customer's request page (/req/:id) and the link card on /book.
   Concatenated after app.css by build.js; every class is cq- so nothing here
   touches the portal's rq-/pt- pieces. Dark paper, so the thread reads by
   contrast in the cards and the customer's own bubbles glow pink. */
.cq{padding-top:34px;padding-bottom:90px}
.cq-night{max-width:820px}
.cq h1{max-width:none;font-size:clamp(36px,5.4vw,60px);margin-bottom:10px}
.cq-meta{margin:0 0 14px;font-size:17px;color:var(--mute)}
.cq-lede{margin:0;max-width:62ch;font-size:17px;color:var(--mute)}
.cq-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:34px;align-items:start;margin-top:34px}
.cq h2{font-size:24px;margin:0 0 14px}
.cq-card{display:grid;gap:12px;padding:20px;border:1px solid var(--line);border-radius:14px;background:var(--card)}
.cq-card h2{margin:0}
.cq-vendors{list-style:none;margin:0;padding:0}
.cq-v{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:10px 0;border-top:1px solid var(--line)}
.cq-v:first-child{border-top:0;padding-top:0}
.cq-pk{flex-basis:100%;margin-top:-4px;font-size:13.5px;line-height:1.4;color:var(--mute)}
.cq-v a{font-weight:600;color:var(--ink);text-decoration:none;min-width:0;overflow-wrap:anywhere}
.cq-v a:hover{text-decoration:underline;color:var(--green)}
.cq-pill{display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border-radius:99px;background:rgba(255,255,255,.1);color:var(--mute);font:600 12px var(--font);white-space:nowrap}
.cq-pill.st-yes{background:rgba(62,224,207,.16);color:var(--green)}
.cq-pill.st-no{background:rgba(255,94,156,.16);color:var(--red)}
.cq-card .fine{margin:0}
.cq-help{margin:14px 0 0}
.cq-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.cq-msg{max-width:min(82%,600px);justify-self:start;padding:11px 15px;border:1px solid var(--line);border-radius:14px 14px 14px 4px;background:var(--card)}
.cq-msg.mine{justify-self:end;background:var(--red);color:var(--btn-ink,var(--paper));border-color:var(--red);border-radius:14px 14px 4px 14px;box-shadow:0 0 24px rgba(255,94,156,.22)}
.cq-msg.from-admin:not(.mine){border-color:var(--gold);background:rgba(255,210,63,.1)}
.cq-who{display:block;margin-bottom:3px;font:600 12px var(--font);color:var(--mute)}
.cq-who time{margin-left:4px;font-weight:400;color:var(--dim)}
.cq-msg.mine .cq-who,.cq-msg.mine .cq-who time{color:var(--btn-ink,var(--paper));opacity:.8}
.cq-body{margin:0;font-size:15.5px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.cq-empty{margin:0;padding:14px 16px;border:1px dashed var(--line);border-radius:10px;font-size:15px;color:var(--mute)}
.cq-empty[hidden]{display:none}
.cq-form{display:grid;gap:10px;margin-top:18px}
.cq-form textarea{min-height:92px}
.cq-send{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0}
.cq-note{margin:12px 0 0;max-width:62ch}
/* the link card on /book, once the request went out */
.cq-link{display:grid;gap:8px;margin-top:18px;padding:16px 18px;border:2px dashed var(--green);border-radius:12px;background:var(--paper)}
.cq-link-h{margin:0;font-weight:600}
.cq-link-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0}
.cq-link-url{min-width:0;font:500 14.5px var(--mono,ui-monospace,monospace);color:var(--ink);overflow-wrap:anywhere}
.cq-link .fine{margin:0}
@media (max-width:860px){
  .cq{padding-top:24px}
  .cq-meta,.cq-lede{font-size:16px}
  .cq-grid{grid-template-columns:1fr;gap:24px;margin-top:26px}
  .cq-side{order:-1}
  .cq-msg{max-width:92%}
}