@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400;12..96,500;12..96,600;12..96,700;12..96,800&family=Inter:wght@400;500;600;700&display=swap');

/* =====================================================================
   Type: Instrument Serif for display, Inter for everything functional.
   Figures use tabular numerals so prices don't jitter as they change.
   ===================================================================== */

:root[data-theme="light"]{
  --bg:#FAFAF8; --bg-elev:#FFFFFF; --surface:#FFFFFF;
  --surface-2:#F2F1EC; --surface-3:#E8E6DD;
  --ink:#111111; --ink-2:#3A3A38; --ink-soft:#63615C;
  --line:#E4E1D6; --line-strong:#CBC7B8;
  --navy:#1A1A1A; --navy-deep:#0A0A0A; --navy-tint:#EEEEEC;
  --accent:#E8590C; --accent-2:#FFC531; --accent-soft:#FDE9D9; --accent-text:#B8430A;
  --moss:#2E7D4F; --moss-soft:#E4F1E9; --moss-text:#27653F;
  --clay:#C23B22; --clay-soft:#FBE4DD; --clay-text:#A32F19;
  --onaccent:#FFFFFF;
  --shadow-sm:0 1px 2px rgba(17,17,17,.06);
  --shadow:0 1px 3px rgba(17,17,17,.06), 0 8px 24px -12px rgba(17,17,17,.2);
  --shadow-lg:0 2px 6px rgba(17,17,17,.08), 0 24px 48px -20px rgba(17,17,17,.3);
  --skeleton:linear-gradient(90deg,#EDEBE3 25%,#F5F4EF 50%,#EDEBE3 75%);
  --photo-1:#1C1C1C; --photo-2:#000000;
}
:root[data-theme="dark"]{
  --bg:#0B0B0A; --bg-elev:#151513; --surface:#161614;
  --surface-2:#1F1F1C; --surface-3:#2A2A26;
  --ink:#F7F6F1; --ink-2:#CFCDC4; --ink-soft:#9C9A92;
  --line:#2A2A26; --line-strong:#3D3C36;
  --navy:#EDEBE3; --navy-deep:#FFFFFF; --navy-tint:#232320;
  --accent:#FF7A29; --accent-2:#FFD166; --accent-soft:#3A2410; --accent-text:#FFB066;
  --moss:#6FCF97; --moss-soft:#173026; --moss-text:#8AE0AE;
  --clay:#FF8066; --clay-soft:#331E17; --clay-text:#FF9E88;
  --onaccent:#0B0B0A;
  --shadow-sm:0 1px 2px rgba(0,0,0,.5);
  --shadow:0 1px 3px rgba(0,0,0,.5), 0 8px 24px -12px rgba(0,0,0,.7);
  --shadow-lg:0 2px 6px rgba(0,0,0,.6), 0 24px 48px -20px rgba(0,0,0,.85);
  --skeleton:linear-gradient(90deg,#1E1E1B 25%,#26261F 50%,#1E1E1B 75%);
  --photo-1:#1C1C1C; --photo-2:#000000;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:
    radial-gradient(ellipse 900px 500px at 15% -10%, color-mix(in srgb, var(--accent) 7%, transparent), transparent),
    radial-gradient(ellipse 700px 500px at 100% 0%, color-mix(in srgb, var(--navy) 6%, transparent), transparent),
    var(--bg);
  background-attachment:fixed;
  color:var(--ink);font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;font-feature-settings:'cv02','cv03','cv04';-webkit-font-smoothing:antialiased;padding-bottom:78px;transition:background-color .25s ease,color .25s ease;
}
h1,h2,h3,.serif{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;letter-spacing:-.02em;}
.lbpts,.stat .v,.statbox .v,.dprice,.balancecard .v,.shopcard .sb .p,.ledrow .amt,.calcrow,.pricebadge{font-variant-numeric:tabular-nums;}
button{font-family:inherit;cursor:pointer;color:inherit;}
a{color:var(--navy);cursor:pointer;}
.container{max-width:780px;margin:0 auto;padding:0 20px;}
::selection{background:var(--accent-soft);color:var(--accent-text);}
:where(button,a,input,select,textarea):focus-visible{outline:2px solid var(--navy);outline-offset:2px;border-radius:6px;}

/* ================= top bar ================= */
#topbar{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(14px) saturate(1.4);border-bottom:1px solid var(--line);}
#topbar .bar{max-width:780px;margin:0 auto;padding:13px 20px;display:flex;align-items:center;justify-content:space-between;gap:10px;}
.brand{font-family:'Bricolage Grotesque',sans-serif;font-size:23px;display:flex;align-items:center;gap:9px;color:var(--ink);letter-spacing:-.02em;cursor:pointer;}
.brand .mark{width:10px;height:10px;border-radius:50%;background:linear-gradient(135deg,var(--accent-2),var(--accent));box-shadow:0 0 0 3px var(--accent-soft);}
.brand .brandthin{font-style:normal;font-weight:400;color:var(--ink-soft);}
.navlinks{display:flex;align-items:center;gap:5px;}
.navlinks button{background:none;border:none;padding:7px 13px;border-radius:8px;font-size:13.5px;font-weight:500;color:var(--ink-soft);transition:background .16s,color .16s;}
.navlinks button:hover{background:var(--surface-2);color:var(--ink);}
.navlinks button.active{background:var(--navy-deep);color:var(--onaccent);}
.iconbtn{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:var(--surface);display:flex;align-items:center;justify-content:center;font-size:14px;transition:transform .14s,border-color .16s;position:relative;}
.iconbtn:hover{transform:translateY(-1px);border-color:var(--line-strong);}
.iconbtn .dot{position:absolute;top:-3px;right:-3px;width:9px;height:9px;border-radius:50%;background:var(--clay);border:2px solid var(--bg);}

/* ================= tab bar ================= */
.tabbar{position:fixed;bottom:0;left:0;right:0;z-index:40;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(14px) saturate(1.4);border-top:1px solid var(--line);display:flex;justify-content:center;gap:2px;padding:7px 10px calc(7px + env(safe-area-inset-bottom));}
.tabbar button{background:none;border:none;padding:6px 14px;border-radius:11px;font-size:10.5px;font-weight:500;color:var(--ink-soft);display:flex;flex-direction:column;align-items:center;gap:3px;min-width:62px;transition:color .16s,background .16s;}
.tabbar button .ic{font-size:18px;line-height:1;transition:transform .2s cubic-bezier(.34,1.56,.64,1);}
.tabbar button:active .ic{transform:scale(.86);}
.tabbar button.active{color:var(--ink);background:var(--surface-2);}
.tabbar button.active .ic{transform:translateY(-1px);}
.tabbar:empty{display:none;}

/* ================= hero ================= */
.hero{padding:56px 0 50px;}
.herogrid2{display:grid;grid-template-columns:1.15fr 1fr;gap:48px;align-items:center;}
.heropreview{position:relative;}
.heropreview::before{content:'';position:absolute;inset:-24px -18px auto auto;top:8%;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,var(--accent-soft),transparent 70%);z-index:0;}
.pcard.nointeract{position:relative;z-index:1;pointer-events:none;transform:rotate(1.2deg);max-width:340px;margin:0 auto;box-shadow:var(--shadow-lg);}
.pcard.nointeract:hover{transform:rotate(1.2deg);}
.herokicker{font-size:12px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--accent-text);margin-bottom:16px;display:flex;align-items:center;gap:8px;}
.herokicker::before{content:'';width:20px;height:1px;background:var(--accent);}
.hero h1{font-size:52px;line-height:1.04;margin:0 0 18px;letter-spacing:-.025em;}
.hero h1 em{font-style:normal;color:var(--accent);font-weight:800;}
.hero p{color:var(--ink-2);font-size:17px;line-height:1.65;margin:0 0 30px;max-width:520px;}
.herobtns{display:flex;gap:11px;flex-wrap:wrap;}
.btn-primary{background:var(--navy-deep);color:var(--onaccent);border:none;padding:13px 26px;border-radius:10px;font-size:15px;font-weight:600;transition:transform .14s,box-shadow .18s,background .16s;box-shadow:var(--shadow-sm);}
.btn-primary:hover{transform:translateY(-1px);box-shadow:var(--shadow);background:var(--navy);}
.btn-primary:active{transform:translateY(0);}
.btn-ghost{background:var(--surface);color:var(--ink);border:1px solid var(--line-strong);padding:13px 26px;border-radius:10px;font-size:15px;font-weight:500;transition:transform .14s,border-color .16s;}
.btn-ghost:hover{transform:translateY(-1px);border-color:var(--ink-soft);}
.trustline{display:flex;gap:22px;flex-wrap:wrap;margin-top:30px;padding-top:26px;border-top:1px solid var(--line);}
.trustitem{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500;color:var(--ink-soft);}
.trustitem .ti-ic{width:22px;height:22px;border-radius:50%;background:var(--surface-2);display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--moss-text);flex-shrink:0;}
.featgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:56px;}
.featcard{border:1px solid var(--line);border-radius:14px;padding:22px;background:var(--surface);box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s;}
.featcard:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.featcard h3{margin:0 0 7px;font-size:19px;}
.featcard p{margin:0;font-size:13.5px;color:var(--ink-soft);line-height:1.6;}

/* ================= forms ================= */
@keyframes rise{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
.panel{max-width:470px;margin:40px auto;border:1px solid var(--line);border-radius:16px;padding:34px;background:var(--surface);box-shadow:var(--shadow);animation:rise .3s cubic-bezier(.2,.8,.2,1);}
.panel h2{margin:0 0 5px;font-size:30px;}
.panel .sub{color:var(--ink-soft);font-size:14px;margin-bottom:24px;line-height:1.55;}
label{display:block;font-size:11.5px;font-weight:600;color:var(--ink-soft);margin:16px 0 6px;text-transform:uppercase;letter-spacing:.06em;}
input,select,textarea{width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:9px;font-size:15px;font-family:inherit;background:var(--bg-elev);color:var(--ink);transition:border-color .16s,box-shadow .16s;}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px var(--navy-tint);}
textarea{resize:vertical;min-height:80px;line-height:1.55;}
.submitbtn{margin-top:22px;width:100%;background:var(--navy-deep);color:var(--onaccent);border:none;padding:13px;border-radius:10px;font-size:15px;font-weight:600;transition:transform .14s,background .16s;}
.submitbtn:hover:not(:disabled){transform:translateY(-1px);background:var(--navy);}
.submitbtn:disabled{opacity:.5;cursor:default;transform:none;}
.switchline{margin-top:16px;font-size:13.5px;color:var(--ink-soft);text-align:center;}
.errmsg{color:var(--clay-text);font-size:13px;margin-top:9px;line-height:1.5;}
.okmsg{color:var(--moss-text);font-size:13px;margin-top:9px;line-height:1.5;}
.roletabs{display:flex;gap:8px;}
.roletabs button{flex:1;padding:11px;border-radius:9px;border:1px solid var(--line);background:var(--bg-elev);font-size:13.5px;font-weight:500;color:var(--ink-soft);transition:all .16s;}
.roletabs button:hover{border-color:var(--line-strong);}
.roletabs button.selected{border-color:var(--navy-deep);background:var(--navy-deep);color:var(--onaccent);}
.hint{font-size:12px;color:var(--ink-soft);margin-top:7px;line-height:1.6;}
.row2{display:flex;gap:12px;}
.row2>div{flex:1;}

/* ================= feed ================= */
.feedwrap{max-width:540px;margin:0 auto;padding:20px 16px 34px;}
.feedhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;gap:10px;}
.feedhead h2{font-size:27px;margin:0;}
.filterbtn{font-size:12.5px;font-weight:500;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:7px 13px;color:var(--ink-soft);transition:all .16s;}
.filterbtn:hover{border-color:var(--line-strong);color:var(--ink);}
@keyframes fadeup{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.pcard{background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-sm);margin-bottom:18px;transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s;animation:fadeup .38s cubic-bezier(.2,.8,.2,1) backwards;}
.pcard:hover{transform:translateY(-2px);box-shadow:var(--shadow);}
.pcard .owner{display:flex;align-items:center;gap:10px;padding:13px 14px;}
.pcard .owner .av{width:36px;height:36px;border-radius:50%;background:var(--surface-2);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;color:var(--ink-soft);overflow:hidden;flex-shrink:0;cursor:pointer;transition:transform .16s;}
.pcard .owner .av:hover{transform:scale(1.06);}
.pcard .owner .av img{width:100%;height:100%;object-fit:cover;}
.pcard .owner .who{flex:1;min-width:0;cursor:pointer;}
.pcard .owner .who .n{font-size:14px;font-weight:600;display:flex;align-items:center;gap:2px;}
.pcard .owner .who .t{font-size:11.5px;color:var(--ink-soft);margin-top:1px;}
.boostpill{background:linear-gradient(135deg,var(--accent-2),var(--accent));color:#fff;font-size:9.5px;font-weight:700;padding:4px 10px;border-radius:6px;letter-spacing:.07em;}
.pcard .imgwrap{position:relative;aspect-ratio:4/3;background:linear-gradient(150deg,var(--photo-1) 0%,var(--photo-2) 100%);overflow:hidden;cursor:pointer;}
.pcard .imgwrap img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.2,.8,.2,1);}
.pcard:hover .imgwrap img{transform:scale(1.03);}
.pcard .imgwrap .nophoto{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.6);font-size:13px;letter-spacing:.04em;}
.photodots{position:absolute;bottom:11px;left:0;right:0;display:flex;justify-content:center;gap:5px;z-index:3;}
.photodots span{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.45);transition:all .22s;}
.photodots span.on{background:#fff;width:16px;border-radius:3px;}
.pricebadge{position:absolute;top:12px;left:12px;background:rgba(10,16,20,.8);backdrop-filter:blur(8px);color:#fff;font-size:14.5px;font-weight:700;padding:6px 12px;border-radius:8px;letter-spacing:-.01em;z-index:3;}
.spreadbadge{position:absolute;top:12px;right:12px;background:var(--moss);color:#fff;font-size:12px;font-weight:700;padding:6px 11px;border-radius:8px;z-index:3;}
.navzone{position:absolute;top:0;bottom:0;width:30%;z-index:2;}
.navzone.l{left:0;} .navzone.r{right:0;}
.pcard .info{padding:15px;}
.pcard .addr{font-family:'Bricolage Grotesque',sans-serif;font-size:22px;margin:0 0 2px;letter-spacing:-.01em;}
.pcard .cityline{color:var(--ink-soft);font-size:13px;margin-bottom:11px;}
.specs{display:flex;gap:6px;font-size:11.5px;color:var(--ink-soft);margin-bottom:11px;flex-wrap:wrap;}
.specs span{background:var(--surface-2);padding:4px 9px;border-radius:6px;font-weight:500;}
.matchrow{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:13px;}
.matchtag{background:var(--accent-soft);color:var(--accent-text);font-size:11px;font-weight:600;padding:4px 10px;border-radius:6px;}
.actions{display:flex;gap:8px;border-top:1px solid var(--line);padding-top:13px;}
.actions button{flex:1;border:1px solid var(--line);background:var(--bg-elev);border-radius:9px;padding:10px;font-size:13.5px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:6px;transition:all .16s;}
.actions button:hover{border-color:var(--line-strong);transform:translateY(-1px);}
.actions button.saved{background:var(--clay-soft);color:var(--clay-text);border-color:transparent;}
.actions button.primary{background:var(--navy-deep);color:var(--onaccent);border-color:transparent;}
.actions button.primary:hover{background:var(--navy);}
@keyframes pop{0%{transform:scale(1);}40%{transform:scale(1.22);}100%{transform:scale(1);}}
.heartpop{animation:pop .36s cubic-bezier(.34,1.56,.64,1);}

/* ================= skeletons ================= */
@keyframes shimmer{from{background-position:200% 0;}to{background-position:-200% 0;}}
.skel{background:var(--skeleton);background-size:200% 100%;animation:shimmer 1.3s infinite linear;border-radius:8px;}
.skelcard{background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;margin-bottom:18px;}
.skelcard .sk-img{aspect-ratio:4/3;}
.skelcard .sk-line{height:12px;margin:12px 15px;}

/* ================= toasts ================= */
#toastwrap{position:fixed;bottom:88px;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:8px;z-index:90;pointer-events:none;}
@keyframes toastin{from{opacity:0;transform:translateY(14px) scale(.96);}to{opacity:1;transform:none;}}
@keyframes toastout{to{opacity:0;transform:translateY(8px) scale(.97);}}
.toast{background:var(--navy-deep);color:#fff;padding:12px 20px;border-radius:11px;font-size:13.5px;font-weight:500;box-shadow:var(--shadow-lg);animation:toastin .3s cubic-bezier(.2,.8,.2,1);max-width:min(440px,90vw);pointer-events:auto;line-height:1.5;}
.toast.err{background:var(--clay);}
.toast.ok{background:var(--moss);}
.toast.leaving{animation:toastout .25s forwards;}

/* ================= detail ================= */
.detail{max-width:640px;margin:0 auto;padding:20px 16px 44px;animation:rise .3s cubic-bezier(.2,.8,.2,1);}
.backbtn{background:none;border:none;color:var(--ink-soft);font-size:14px;font-weight:500;padding:6px 0;margin-bottom:14px;transition:color .16s,transform .16s;}
.backbtn:hover{color:var(--ink);transform:translateX(-2px);}
.gallery{border-radius:16px;overflow:hidden;border:1px solid var(--line);margin-bottom:20px;background:var(--surface-2);box-shadow:var(--shadow-sm);}
.gallery .main{aspect-ratio:4/3;background:linear-gradient(150deg,var(--photo-1),var(--photo-2));display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.6);}
.gallery .main img{width:100%;height:100%;object-fit:cover;}
.thumbs{display:flex;gap:6px;padding:8px;overflow-x:auto;}
.thumbs img{width:66px;height:50px;object-fit:cover;border-radius:7px;cursor:pointer;border:2px solid transparent;transition:border-color .16s,transform .16s;}
.thumbs img:hover{transform:translateY(-2px);}
.thumbs img.on{border-color:var(--navy);}
.dhead{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px;flex-wrap:wrap;}
.dhead h2{font-size:32px;margin:0 0 3px;letter-spacing:-.02em;}
.dhead .c{color:var(--ink-soft);font-size:14.5px;}
.dprice{font-family:'Bricolage Grotesque',sans-serif;font-size:32px;color:var(--ink);letter-spacing:-.02em;}
.dgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(108px,1fr));gap:10px;margin:20px 0;}
.dcell{border:1px solid var(--line);border-radius:11px;padding:13px;background:var(--surface);transition:border-color .16s;}
.dcell:hover{border-color:var(--line-strong);}
.dcell .l{font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-soft);margin-bottom:4px;font-weight:600;}
.dcell .v{font-size:15.5px;font-weight:600;}
.dsection{border-top:1px solid var(--line);padding-top:20px;margin-top:20px;}
.dsection h3{font-size:19px;margin:0 0 12px;}
.dnotes{font-size:14.5px;line-height:1.7;color:var(--ink-2);}
.ownerbox{display:flex;align-items:center;gap:13px;border:1px solid var(--line);border-radius:13px;padding:15px;background:var(--surface);}
.ownerbox .av{width:48px;height:48px;border-radius:50%;background:var(--surface-2);display:flex;align-items:center;justify-content:center;font-weight:600;color:var(--ink-soft);overflow:hidden;flex-shrink:0;cursor:pointer;}
.ownerbox .av img{width:100%;height:100%;object-fit:cover;}
.ownerbox .meta{flex:1;min-width:0;cursor:pointer;}
.ownerbox .meta .n{font-weight:600;font-size:15.5px;display:flex;align-items:center;gap:3px;}
.ownerbox .meta .s{font-size:12.5px;color:var(--ink-soft);margin-top:2px;}
.ownerbox button{border:1px solid var(--line-strong);background:var(--bg-elev);border-radius:9px;padding:9px 16px;font-size:13px;font-weight:600;transition:all .16s;}
.ownerbox button:hover{transform:translateY(-1px);}
.ownerbox button.following{background:var(--surface-2);border-color:var(--line);}
.minigrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(134px,1fr));gap:11px;}
.minicard{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--surface);cursor:pointer;transition:transform .18s,box-shadow .18s;}
.minicard:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.minicard .mi{aspect-ratio:4/3;background:linear-gradient(150deg,var(--photo-1),var(--photo-2));}
.minicard .mi img{width:100%;height:100%;object-fit:cover;}
.minicard .mt{padding:10px;font-size:12.5px;}
.minicard .mt b{display:block;font-size:13px;margin-bottom:2px;font-weight:600;}
.minicard .mt span{color:var(--ink-soft);}

/* ================= generic ================= */
.page{max-width:780px;margin:0 auto;padding:26px 20px 54px;animation:rise .3s cubic-bezier(.2,.8,.2,1);}
.page h2{font-size:31px;margin:0 0 5px;}
.page .sub{color:var(--ink-soft);font-size:14.5px;margin-bottom:26px;line-height:1.6;}
.sectiontitle{font-size:11.5px;font-weight:700;margin:30px 0 11px;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.09em;}
.card{border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:var(--shadow-sm);overflow:hidden;}
.listrow{display:flex;align-items:center;gap:12px;padding:15px 16px;border-bottom:1px solid var(--line);transition:background .14s;}
.listrow:hover{background:var(--surface-2);}
.listrow:last-child{border-bottom:none;}
.listrow .grow{flex:1;min-width:0;}
.listrow .t{font-weight:600;font-size:14px;}
.listrow .s{font-size:12.5px;color:var(--ink-soft);margin-top:2px;}
.listrow button{border:1px solid var(--line-strong);background:var(--bg-elev);border-radius:8px;padding:8px 14px;font-size:12.5px;font-weight:600;transition:all .16s;white-space:nowrap;}
.listrow button:hover{transform:translateY(-1px);}
.empty{text-align:center;padding:64px 24px;color:var(--ink-soft);border:1px dashed var(--line-strong);border-radius:16px;}
.empty h3{color:var(--ink);margin:0 0 7px;font-size:21px;}
.empty p{margin:0;font-size:14px;line-height:1.6;}
.pill{display:inline-block;padding:4px 10px;border-radius:6px;font-size:11px;font-weight:600;}
.pill.good,.pill.interested{background:var(--moss-soft);color:var(--moss-text);}
.pill.warn{background:var(--accent-soft);color:var(--accent-text);}
.pill.bad,.pill.passed{background:var(--clay-soft);color:var(--clay-text);}
.pill.verified{background:var(--accent-soft);color:var(--accent-text);}
.togglerow{display:flex;align-items:center;justify-content:space-between;padding:15px 16px;border-bottom:1px solid var(--line);gap:14px;}
.togglerow:last-child{border-bottom:none;}
.togglerow .tl{font-size:14.5px;font-weight:500;}
.togglerow .td{font-size:12.5px;color:var(--ink-soft);margin-top:3px;line-height:1.5;}
.switch{width:48px;height:28px;border-radius:20px;background:var(--surface-3);border:1px solid var(--line);position:relative;flex-shrink:0;padding:0;transition:background .2s,border-color .2s;}
.switch .knob{position:absolute;top:2px;left:2px;width:22px;height:22px;border-radius:50%;background:var(--ink-soft);transition:transform .22s cubic-bezier(.34,1.4,.64,1),background .2s;}
.switch.on{background:var(--moss);border-color:transparent;}
.switch.on .knob{transform:translateX(20px);background:#fff;}
.picker{border:1.5px dashed var(--line-strong);border-radius:12px;padding:20px;text-align:center;color:var(--ink-soft);font-size:13.5px;font-weight:500;cursor:pointer;background:var(--surface-2);transition:all .18s;}
.picker:hover{border-color:var(--navy);color:var(--ink);background:var(--navy-tint);}
.previewrow{display:flex;gap:8px;flex-wrap:wrap;margin-top:11px;}
.previewrow .pv{position:relative;width:74px;height:58px;border-radius:9px;overflow:hidden;border:1px solid var(--line);animation:rise .24s;}
.previewrow .pv img{width:100%;height:100%;object-fit:cover;}
.previewrow .pv button{position:absolute;top:3px;right:3px;width:19px;height:19px;border-radius:50%;background:rgba(0,0,0,.7);color:#fff;border:none;font-size:11px;line-height:1;padding:0;}

/* ================= wallet / shop ================= */
.balancecard{background:linear-gradient(140deg,var(--navy) 0%,var(--navy-deep) 100%);color:#fff;border-radius:18px;padding:24px;margin-bottom:20px;box-shadow:var(--shadow);position:relative;overflow:hidden;}
.balancecard::after{content:'';position:absolute;top:-40%;right:-12%;width:190px;height:190px;border-radius:50%;background:rgba(255,255,255,.06);}
.balancecard .l{font-size:11px;opacity:.8;text-transform:uppercase;letter-spacing:.09em;font-weight:600;}
.balancecard .v{font-family:'Bricolage Grotesque',sans-serif;font-size:44px;margin:6px 0 16px;letter-spacing:-.02em;}
.balancecard .btns{display:flex;gap:10px;flex-wrap:wrap;position:relative;}
.balancecard .btns button{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.26);padding:10px 18px;border-radius:9px;font-size:13.5px;font-weight:600;transition:background .16s,transform .14s;}
.balancecard .btns button:hover{background:rgba(255,255,255,.22);transform:translateY(-1px);}
.balancecard .btns button.solid{background:#fff;color:var(--navy-deep);border-color:#fff;}
.ledrow{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border-bottom:1px solid var(--line);gap:12px;}
.ledrow:last-child{border-bottom:none;}
.ledrow .d{font-size:13.5px;font-weight:500;}
.ledrow .dt{font-size:11.5px;color:var(--ink-soft);margin-top:2px;}
.ledrow .amt{font-weight:700;font-size:14.5px;white-space:nowrap;}
.ledrow .amt.pos{color:var(--moss-text);}
.ledrow .amt.neg{color:var(--ink-soft);}
.cardchip{display:flex;align-items:center;gap:13px;padding:15px 16px;border-bottom:1px solid var(--line);}
.cardchip:last-child{border-bottom:none;}
.cardchip .brandbox{width:46px;height:31px;border-radius:6px;background:linear-gradient(135deg,var(--surface-3),var(--surface-2));display:flex;align-items:center;justify-content:center;font-size:9.5px;font-weight:700;color:var(--ink-soft);letter-spacing:.04em;}
.shopgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:14px;}
.shopcard{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface);box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s;}
.shopcard:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.shopcard .si{aspect-ratio:1;background:var(--surface-2);display:flex;align-items:center;justify-content:center;color:var(--ink-soft);font-size:12px;overflow:hidden;}
.shopcard .si img{width:100%;height:100%;object-fit:cover;transition:transform .4s;}
.shopcard:hover .si img{transform:scale(1.05);}
.shopcard .sb{padding:12px;}
.shopcard .sb .t{font-size:13.5px;font-weight:600;line-height:1.35;margin-bottom:4px;}
.shopcard .sb .p{font-family:'Bricolage Grotesque',sans-serif;font-size:20px;}
.shopcard .sb .m{font-size:11.5px;color:var(--ink-soft);margin-top:3px;}
.shopcard button{width:100%;border:none;border-top:1px solid var(--line);background:var(--surface-2);padding:11px;font-size:13px;font-weight:600;color:var(--ink);transition:background .16s,color .16s;}
.shopcard button:hover{background:var(--navy-deep);color:var(--onaccent);}
.chiprow{display:flex;gap:7px;overflow-x:auto;padding-bottom:10px;margin-bottom:16px;scrollbar-width:none;}
.chiprow::-webkit-scrollbar{display:none;}
.chiprow button{white-space:nowrap;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:8px 15px;font-size:12.5px;font-weight:500;color:var(--ink-soft);transition:all .16s;}
.chiprow button:hover{border-color:var(--line-strong);}
.chiprow button.on{background:var(--navy-deep);color:var(--onaccent);border-color:transparent;}
.calcbox{background:var(--surface-2);border-radius:12px;padding:18px;margin-top:10px;}
.calcrow{display:flex;justify-content:space-between;font-size:13.5px;padding:7px 0;}
.calcrow.total{border-top:1px solid var(--line-strong);margin-top:9px;padding-top:13px;font-weight:700;font-size:15.5px;}
.calcrow .g{color:var(--moss-text);font-weight:600;}
.calcrow .r{color:var(--clay-text);font-weight:600;}
.offerrow{display:flex;justify-content:space-between;align-items:center;padding:15px 16px;border-bottom:1px solid var(--line);gap:11px;flex-wrap:wrap;}
.offerrow:last-child{border-bottom:none;}
.offerbtns{display:flex;gap:6px;}
.offerbtns button{border:1px solid var(--line-strong);background:var(--bg-elev);border-radius:8px;padding:8px 13px;font-size:12.5px;font-weight:600;}
.offerbtns button.acc{background:var(--moss);color:#fff;border-color:transparent;}
.vbadge{display:inline-flex;align-items:center;gap:3px;background:var(--moss-soft);color:var(--moss-text);font-size:10px;font-weight:700;padding:3px 8px;border-radius:5px;margin-left:5px;}
.spotbadge{background:linear-gradient(135deg,var(--accent-2),var(--accent));color:#fff;font-size:11px;font-weight:700;padding:4px 10px;border-radius:6px;}
.demopill{background:var(--surface-2);color:var(--ink-soft);font-size:9.5px;font-weight:700;padding:4px 10px;border-radius:6px;border:1px solid var(--line);letter-spacing:.06em;}
.dsbadge{background:var(--navy-tint);color:var(--navy);font-size:9.5px;font-weight:700;padding:3px 8px;border-radius:5px;letter-spacing:.05em;}
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(102px,1fr));gap:11px;margin-bottom:20px;}
.statbox{border:1px solid var(--line);border-radius:12px;padding:16px 12px;background:var(--surface);text-align:center;transition:transform .18s;}
.statbox:hover{transform:translateY(-2px);}
.statbox .v{font-family:'Bricolage Grotesque',sans-serif;font-size:26px;letter-spacing:-.01em;}
.statbox .l{font-size:11px;color:var(--ink-soft);margin-top:3px;font-weight:500;}
.stat{flex:1;min-width:140px;border:1px solid var(--line);border-radius:13px;padding:18px 20px;background:var(--surface);box-shadow:var(--shadow-sm);}
.stat .v{font-size:30px;font-family:'Bricolage Grotesque',sans-serif;color:var(--navy-deep);}
.stat .l{font-size:12px;color:var(--ink-soft);margin-top:3px;}
.statrow{display:flex;gap:13px;margin-bottom:34px;flex-wrap:wrap;}
.lbrow{display:flex;align-items:center;gap:13px;padding:15px 16px;border-bottom:1px solid var(--line);transition:background .14s;}
.lbrow:hover{background:var(--surface-2);}
.lbrow:last-child{border-bottom:none;}
.lbrank{width:26px;font-family:'Bricolage Grotesque',sans-serif;font-size:19px;color:var(--ink-soft);text-align:center;}
.lbpts{font-family:'Bricolage Grotesque',sans-serif;font-size:19px;}
.badge{font-size:9.5px;font-weight:700;padding:3px 8px;border-radius:5px;margin-left:6px;letter-spacing:.04em;}
.badge.Gold{background:var(--accent-soft);color:var(--accent-text);}
.badge.Silver{background:var(--surface-3);color:var(--ink-soft);}
.badge.Bronze{background:var(--clay-soft);color:var(--clay-text);}
.lockwrap{position:relative;}
.lockoverlay{position:absolute;inset:0;background:color-mix(in srgb,var(--bg) 80%,transparent);backdrop-filter:blur(9px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:11px;text-align:center;padding:26px;border-radius:14px;}
.lockoverlay .lk{font-size:30px;}
.lockoverlay .lt{font-weight:700;font-size:16px;}
.lockoverlay .ld{font-size:13px;color:var(--ink-soft);max-width:300px;line-height:1.6;}
.blurred{filter:blur(7px);user-select:none;pointer-events:none;}
.trialbar{background:var(--accent-soft);color:var(--accent-text);border:1px solid var(--accent-2);border-radius:12px;padding:13px 16px;font-size:13.5px;font-weight:500;margin-bottom:18px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;}
.trialbar button{background:var(--accent);color:#fff;border:none;padding:8px 15px;border-radius:8px;font-size:12.5px;font-weight:600;transition:transform .14s;}
.trialbar button:hover{transform:translateY(-1px);}
.tiergrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(142px,1fr));gap:12px;margin-top:8px;}
.tier{border:1px solid var(--line);border-radius:13px;padding:18px;text-align:center;background:var(--surface);cursor:pointer;transition:all .18s;}
.tier:hover{transform:translateY(-2px);border-color:var(--line-strong);}
.tier.sel{border-color:var(--accent);background:var(--accent-soft);}
.tier .d{font-size:14.5px;font-weight:600;margin-bottom:5px;}
.tier .p{font-family:'Bricolage Grotesque',sans-serif;font-size:26px;color:var(--accent-text);}

.tiergrid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:10px;}
.tiercard{border:1px solid var(--line);border-radius:16px;padding:22px 20px;background:var(--surface);box-shadow:var(--shadow-sm);position:relative;display:flex;flex-direction:column;}
.tiercard.featured{border-color:var(--accent);border-width:2px;box-shadow:var(--shadow);background:linear-gradient(180deg,var(--accent-soft) 0%,var(--surface) 22%);}
.tierribbon{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--accent-2),var(--accent));color:#fff;font-size:10px;font-weight:700;padding:4px 12px;border-radius:20px;letter-spacing:.06em;white-space:nowrap;}
.tiercard-name{font-size:19px;margin:4px 0 2px;}
.tiercard-tagline{font-size:12.5px;color:var(--ink-soft);margin-bottom:12px;min-height:32px;}
.tiercard-price{font-family:'Bricolage Grotesque',sans-serif;font-size:19px;font-weight:700;margin-bottom:14px;}
.tiercard-perks{list-style:none;padding:0;margin:0;flex:1;}
.tiercard-perks li{font-size:12.5px;line-height:1.55;color:var(--ink-2);padding-left:18px;position:relative;margin-bottom:8px;}
.tiercard-perks li::before{content:'✓';position:absolute;left:0;color:var(--moss-text);font-weight:700;}
.tiercard.featured .tiercard-perks li::before{color:var(--accent);}
@media(max-width:760px){
  .tiergrid3{grid-template-columns:1fr;}
  .tiercard.featured{order:-1;}
}

/* ================= footer / static ================= */
#sitefooter{border-top:1px solid var(--line);margin-top:48px;background:var(--bg-elev);}
.footinner{max-width:780px;margin:0 auto;padding:30px 20px 36px;}
.footlinks{display:flex;gap:20px;flex-wrap:wrap;margin-bottom:16px;}
.footlinks a{font-size:13.5px;font-weight:500;color:var(--ink-soft);text-decoration:none;transition:color .16s;}
.footlinks a:hover{color:var(--ink);}
.footmeta{font-size:12.5px;color:var(--ink-soft);margin-bottom:11px;}
.footdisc{font-size:11.5px;color:var(--ink-soft);line-height:1.65;max-width:660px;opacity:.85;}
.staticpage{max-width:680px;}
.stheading{font-size:20px;margin:30px 0 9px;}
.stbody{font-size:15px;line-height:1.75;color:var(--ink-2);margin:0 0 14px;}
.contactmail{display:inline-block;font-family:'Bricolage Grotesque',sans-serif;font-size:24px;margin-top:7px;color:var(--navy);text-decoration:none;word-break:break-all;}
.policybox{border:1px solid var(--clay);background:var(--clay-soft);color:var(--clay-text);border-radius:12px;padding:16px;font-size:13.5px;line-height:1.65;margin:14px 0;}
.policybox b{display:block;margin-bottom:5px;font-size:14px;}

@media(max-width:600px){
  .hero h1{font-size:36px;}
  .herogrid2{grid-template-columns:1fr;gap:32px;}
  .heropreview{order:-1;max-width:280px;margin:0 auto;}
  .featgrid{grid-template-columns:1fr;}
  .row2{flex-direction:column;gap:0;}
  .dhead h2{font-size:26px;}
  .page h2{font-size:26px;}
}
@media(max-width:430px){
  /* "Better Real Estate" crowds the top bar next to the icon buttons on a
     phone screen — drop to just "Better" (still has the accent dot as a
     mark) rather than let it wrap or overflow. */
  .brand .brandthin{display:none;}
  .brand{font-size:20px;}
}
@media(min-width:601px) and (max-width:860px){
  .herogrid2{grid-template-columns:1fr;gap:32px;}
  .heropreview{order:-1;max-width:340px;margin:0 auto;}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important;}
}