:root{
  --basalt:#1a1715; --basalt-soft:#2a2622;
  --paper:#f6f1e8; --paper-deep:#ebe4d4; --card:#fffdf8;
  --ink:#1a1715; --stone:#6f6a62; --hair:#d6cfc0;
  --green:#2d6a4f; --orange:#c2693d; --purple:#6b5b95; --rust:#b4471f; --blue:#3d7ea6;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
body{font-family:'Inter','Noto Sans SC',sans-serif;background:var(--paper);color:var(--ink);font-size:15px;line-height:1.6;min-height:100vh;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:920px;margin:0 auto;padding:0 18px;}

/* topbar */
.topbar{position:sticky;top:0;z-index:50;background:rgba(246,241,232,.86);backdrop-filter:blur(10px);border-bottom:1px solid var(--hair);}
.topbar-in{max-width:920px;margin:0 auto;padding:11px 18px;display:flex;align-items:center;gap:12px;}
.brand{font-family:'Source Serif 4','Noto Serif SC',serif;font-weight:600;font-size:18px;letter-spacing:-.01em;display:flex;align-items:center;gap:7px;}
.brand .dot{width:9px;height:9px;border-radius:3px;background:var(--green);}
.tb-spacer{flex:1;}
.btn{cursor:pointer;border:none;border-radius:999px;padding:8px 16px;font-weight:600;font-size:13px;background:var(--basalt);color:var(--paper);font-family:inherit;transition:.15s;}
.btn:hover{opacity:.88;}
.btn.ghost{background:transparent;border:1px solid var(--hair);color:var(--ink);}
.btn.sm{padding:6px 12px;font-size:12px;}
.btn.green{background:var(--green);}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--green);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;}

/* generic */
.eyebrow{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--orange);font-weight:600;}
h1.page{font-family:'Source Serif 4','Noto Serif SC',serif;font-size:32px;font-weight:600;letter-spacing:-.01em;line-height:1.15;}
.muted{color:var(--stone);font-size:13px;}
.serif{font-family:'Source Serif 4','Noto Serif SC',serif;}

/* tag chips */
.tag{font-size:10px;letter-spacing:.04em;padding:1px 7px;border-radius:999px;font-weight:600;}
.tag.worn{background:rgba(107,91,149,.14);color:var(--purple);}
.tag.cons{background:rgba(180,71,31,.12);color:var(--rust);}
.tag.priv{background:rgba(111,106,98,.14);color:var(--stone);}

/* footer xhs */
.site-footer{margin:54px auto 40px;max-width:884px;background:var(--basalt);border-radius:20px;padding:34px 26px 30px;text-align:center;color:var(--paper);}
.site-footer .ftag{font-family:'Source Serif 4','Noto Serif SC',serif;font-size:18px;font-style:italic;color:rgba(246,241,232,.92);margin-bottom:6px;}
.site-footer .fline{font-size:12px;color:rgba(246,241,232,.5);line-height:1.8;}
.site-footer .fcred{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(246,241,232,.35);margin-top:14px;}
.xhs-wrap{margin-top:18px;}
.xhs-credit{display:inline-flex;align-items:center;gap:7px;position:relative;cursor:pointer;outline:none;}
.xhs-credit .xhs-logo{background:#ff2442;color:#fff;font-size:10px;font-weight:700;padding:3px 7px;border-radius:5px;letter-spacing:.3px;line-height:1;}
.xhs-credit .xhs-name{color:rgba(246,241,232,.82);font-size:13px;font-weight:500;}
.xhs-credit .xhs-hint{color:rgba(246,241,232,.35);font-size:11px;}
.xhs-credit .xhs-card-pop{position:absolute;bottom:calc(100% + 12px);left:50%;width:236px;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 16px 50px rgba(0,0,0,.55);opacity:0;visibility:hidden;transform:translateX(-50%) translateY(8px) scale(.96);transform-origin:bottom center;transition:.22s;pointer-events:none;z-index:999;}
.xhs-credit .xhs-card-pop img{width:100%;display:block;}
.xhs-credit:hover .xhs-card-pop,.xhs-credit:focus-within .xhs-card-pop{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0) scale(1);}

/* modal */
.modal-bg{position:fixed;inset:0;background:rgba(26,23,21,.55);backdrop-filter:blur(3px);z-index:200;display:flex;align-items:center;justify-content:center;padding:18px;opacity:0;visibility:hidden;transition:.2s;}
.modal-bg.show{opacity:1;visibility:visible;}
.modal{background:var(--card);border-radius:18px;width:100%;max-width:380px;padding:26px 24px;box-shadow:0 24px 70px rgba(0,0,0,.3);}
.modal h2{font-family:'Source Serif 4','Noto Serif SC',serif;font-size:22px;margin-bottom:4px;}
.field{margin-top:14px;}
label{display:block;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--stone);margin-bottom:5px;}
input,select,textarea{width:100%;padding:9px 11px;border:1px solid var(--hair);border-radius:9px;background:#fff;color:var(--ink);font-family:inherit;font-size:14px;}
textarea{resize:vertical;min-height:40px;}
.err{color:var(--rust);font-size:12px;margin-top:10px;min-height:14px;}
.tabsw{display:flex;gap:6px;background:var(--paper-deep);border-radius:10px;padding:4px;margin-bottom:6px;}
.tabsw button{flex:1;border:none;background:transparent;padding:7px;border-radius:7px;font-weight:600;font-size:13px;cursor:pointer;color:var(--stone);}
.tabsw button.active{background:var(--card);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.08);}

/* toast */
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--basalt);color:var(--paper);padding:10px 18px;border-radius:999px;font-size:13px;opacity:0;transition:.2s;pointer-events:none;z-index:300;}
.toast.show{opacity:1;}
.hide{display:none!important;}