/* Pawphoria Partner Program. Tokens first: tabby orange + ink navy + cream. Archivo Black display, Nunito body. */
:root{--tabby:#EE6A17;--deep:#B5460A;--ink:#1B2340;--ink2:#3A4262;--cream:#FFF3E0;--milk:#FFFBF4;--line:#EBD9BE;--eye:#FFC61F;--mute:#6B6475;--green:#2E8B57;--red:#C0392B;--amber:#C98A0B;--blue:#2F6FB5;--r:18px;--shadow:0 2px 0 rgba(27,35,64,.9);--font-d:"Archivo Black","Arial Black",Impact,sans-serif;--font-b:"Nunito","Trebuchet MS",Verdana,sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font:600 16px/1.5 var(--font-b)}
h1,h2,h3,.disp{font-family:var(--font-d);font-weight:400;letter-spacing:.2px;line-height:1.08;margin:0}
h1{font-size:clamp(30px,5vw,48px)}h2{font-size:clamp(22px,3vw,30px);margin-bottom:12px}h3{font-size:18px;margin-bottom:8px}
p{margin:0 0 10px}a{color:var(--deep)}
.loading{padding:40px;text-align:center;color:var(--mute)}
button,input,select,textarea{font:inherit;color:inherit}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:2px solid var(--ink);background:var(--tabby);color:#fff;font:800 15px var(--font-b);padding:11px 18px;border-radius:999px;cursor:pointer;box-shadow:var(--shadow);text-decoration:none;transition:transform .08s}
.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(2px);box-shadow:none}
.btn.ghost{background:var(--milk);color:var(--ink)}.btn.dark{background:var(--ink);color:var(--cream)}.btn.sm{padding:6px 12px;font-size:13px}.btn.danger{background:#fff;color:var(--red);border-color:var(--red);box-shadow:none}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}
input,select,textarea{width:100%;border:2px solid var(--line);background:#fff;border-radius:12px;padding:10px 12px;outline:0}
input:focus,select:focus,textarea:focus{border-color:var(--tabby);box-shadow:0 0 0 3px rgba(238,106,23,.18)}
label{display:block;font:800 13px var(--font-b);margin:12px 0 4px;color:var(--ink2)}
.hint{font-size:13px;color:var(--mute);font-weight:600}.err{color:var(--red);font-weight:800;min-height:1.3em;margin:8px 0}.ok{color:var(--green);font-weight:800}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.grow{flex:1}.sp{margin-left:auto}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media(max-width:700px){.grid2,.grid3{grid-template-columns:1fr}}
.card{background:var(--milk);border:2px solid var(--ink);border-radius:var(--r);padding:18px;box-shadow:var(--shadow);margin-bottom:16px}
.card.flat{box-shadow:none;border-color:var(--line)}.card.dark{background:var(--ink);color:var(--cream)}.card.orange{background:var(--tabby);color:#fff}
.pill{display:inline-block;font:800 12px var(--font-b);padding:3px 10px;border-radius:999px;background:var(--cream);border:1.5px solid var(--line);white-space:nowrap}
.pill.g{background:#E3F4EA;border-color:#9BD2B2;color:#1E6B40}.pill.a{background:#FFF1CC;border-color:#F0CC73;color:#8A5E00}.pill.r{background:#FBE3DF;border-color:#EDA8A0;color:#9A2B1F}.pill.b{background:#E3EEFA;border-color:#9FC0E6;color:#1D4C80}.pill.t{background:var(--tabby);border-color:var(--deep);color:#fff}
.num{font-family:var(--font-d);font-size:clamp(22px,2.6vw,28px);line-height:1}.lbl{font:800 12px var(--font-b);text-transform:uppercase;letter-spacing:.06em;color:var(--mute)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:16px}
.stat{background:#fff;border:2px solid var(--line);border-radius:14px;padding:12px 14px}.stat .num{margin-top:4px}
table{width:100%;border-collapse:collapse;font-size:14px}th{text-align:left;font:800 12px var(--font-b);text-transform:uppercase;letter-spacing:.05em;color:var(--mute);padding:8px 10px;border-bottom:2px solid var(--line)}
td{padding:10px;border-bottom:1px solid var(--line);vertical-align:middle}tr:last-child td{border-bottom:0}td.r,th.r{text-align:right}
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
/* progress */
.bar{height:16px;background:#fff;border:2px solid var(--ink);border-radius:999px;overflow:hidden;position:relative}.bar>i{display:block;height:100%;background:var(--tabby);border-radius:999px;transition:width .6s cubic-bezier(.2,.8,.2,1)}
.bar.keep>i{background:var(--green)}.bar.eye>i{background:var(--eye)}
.bar-l{display:flex;justify-content:space-between;font:800 13px var(--font-b);margin:0 0 5px}
/* shell */
.top{background:var(--tabby);color:#fff;display:flex;align-items:center;gap:12px;padding:10px 18px;border-bottom:3px solid var(--ink);position:sticky;top:0;z-index:20}
.top .brand{font:400 19px var(--font-d);display:flex;align-items:center;gap:9px;color:#fff;text-decoration:none}.top .brand small{font:800 11px var(--font-b);background:var(--ink);padding:2px 8px;border-radius:99px;letter-spacing:.06em}
.top .who{margin-left:auto;font-size:13px;display:flex;gap:10px;align-items:center}.top .who a{color:#fff}
.layout{display:grid;grid-template-columns:210px 1fr;max-width:1240px;margin:0 auto}
.nav{padding:18px 12px;position:sticky;top:60px;align-self:start;display:flex;flex-direction:column;gap:4px}
.nav a{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:12px;color:var(--ink);text-decoration:none;font:800 14px var(--font-b)}.nav a:hover{background:#fff}.nav a.on{background:var(--ink);color:var(--cream)}.nav .sec{font:800 11px var(--font-b);text-transform:uppercase;letter-spacing:.08em;color:var(--mute);padding:12px 12px 4px}
main{padding:22px 20px 80px;min-width:0}
@media(max-width:820px){.layout{grid-template-columns:1fr}.nav{position:static;flex-direction:row;overflow-x:auto;padding:8px 10px;gap:6px;border-bottom:2px solid var(--line);background:var(--milk)}.nav a{white-space:nowrap;flex:none}.nav .sec{display:none}main{padding:16px 12px 70px}.top .who span{display:none}}
.banner{background:var(--ink);color:var(--cream);padding:8px 16px;font:800 13px var(--font-b);display:flex;gap:10px;align-items:center;flex-wrap:wrap}.banner a{color:var(--eye)}
/* auth + invite */
.authwrap{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--cream)}
.authcard{width:min(440px,100%)}
.invite-hero{background:var(--tabby);color:#fff;border-bottom:3px solid var(--ink);padding:26px 18px 0;overflow:hidden;position:relative}
.invite-hero .in{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:1.05fr 1fr;gap:10px;align-items:end}
.invite-hero h1{color:#fff;text-shadow:3px 3px 0 var(--deep);margin:10px 0 12px}.invite-hero .tag{display:inline-block;background:var(--ink);color:var(--eye);font:800 12px var(--font-b);letter-spacing:.1em;text-transform:uppercase;padding:5px 12px;border-radius:99px}
.invite-hero p.lead{font-size:18px;max-width:34ch;color:#fff8ee}
.hero-art{position:relative;height:330px;min-width:280px}.hero-art .fl{position:absolute;animation:bob 3.4s ease-in-out infinite}.hero-art .ha-box{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);z-index:3}
.ha-cat{position:absolute;z-index:2}.ha-cat.l{left:0;bottom:96px;transform:rotate(-8deg)}.ha-cat.r{right:0;bottom:104px;transform:rotate(8deg)}.ha-cat.m{left:34%;bottom:150px;z-index:1}
.ha-stack{position:absolute;z-index:4;bottom:-4px}.ha-stack.a{left:1%}.ha-stack.b{right:2%}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-12px) rotate(5deg)}}
@media(prefers-reduced-motion:reduce){.hero-art .fl{animation:none}}
@media(max-width:820px){.invite-hero .in{grid-template-columns:1fr}.hero-art{height:290px;order:2}}
.invite-body{max-width:1080px;margin:0 auto;padding:28px 18px 90px;display:grid;grid-template-columns:1.2fr 1fr;gap:22px;align-items:start}
@media(max-width:900px){.invite-body{grid-template-columns:1fr}}
.lv-ladder{display:flex;flex-direction:column;gap:10px}
.lv-step{display:grid;grid-template-columns:54px 1fr;gap:12px;align-items:center;background:#fff;border:2px solid var(--ink);border-radius:16px;padding:10px 14px}
.lv-step .badge{width:54px;height:54px;border-radius:50%;background:var(--eye);border:2px solid var(--ink);display:grid;place-items:center;font:400 22px var(--font-d)}
.lv-step b{font-family:var(--font-d);font-weight:400}.lv-step .pay{color:var(--deep);font-weight:800}
.lv-step.cur{background:var(--ink);color:var(--cream)}.lv-step.cur .pay{color:var(--eye)}
.fine{font-size:12px;color:var(--mute);font-weight:600}
.soc{display:grid;grid-template-columns:1.1fr 1.3fr 1fr 36px;gap:8px;align-items:center;margin-bottom:8px}
@media(max-width:560px){.soc{grid-template-columns:1fr 1fr}.soc .x{grid-column:2}}
.x{border:0;background:transparent;font-size:20px;cursor:pointer;color:var(--red)}
/* box cards */
.boxes{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.bx{background:#fff;border:2px solid var(--ink);border-radius:var(--r);padding:12px;text-align:center;position:relative;box-shadow:var(--shadow)}
.bx.off{opacity:.55;filter:saturate(.4)}.bx h4{margin:6px 0 2px;font:400 16px var(--font-d)}.bx .pr{font-weight:800;color:var(--deep);font-size:18px}
.qty{display:inline-flex;align-items:center;border:2px solid var(--ink);border-radius:99px;overflow:hidden;background:#fff}.qty button{border:0;background:var(--cream);width:34px;height:32px;font:800 18px var(--font-b);cursor:pointer}.qty span{min-width:30px;text-align:center;font-weight:800}
.tray{position:sticky;bottom:0;z-index:15;background:var(--ink);color:var(--cream);border-radius:20px 20px 0 0;padding:14px 18px;margin:18px -4px -4px;display:flex;flex-wrap:wrap;gap:14px;align-items:center;box-shadow:0 -6px 0 rgba(27,35,64,.15)}
.tray .bar{flex:1;min-width:180px;background:#2c3556;border-color:#2c3556}.tray .bar>i{background:var(--eye)}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}.chip{border:2px solid var(--ink);background:#fff;border-radius:99px;padding:5px 13px;font:800 13px var(--font-b);cursor:pointer}.chip.on{background:var(--ink);color:var(--cream)}
/* tabs inside pages */
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}
/* checkout mock */
.shop{background:#fff;border:2px solid var(--ink);border-radius:var(--r);overflow:hidden;max-width:560px}
.shop .sh{background:var(--tabby);color:#fff;padding:12px 16px;font:400 18px var(--font-d);display:flex;align-items:center;gap:8px}.shop .sb{padding:16px}
.shop .line{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px dashed var(--line)}.shop .reward{background:#E3F4EA;color:#1E6B40;font-weight:800;border-radius:10px;padding:8px 10px;border:0;margin:6px 0}
.shop .tot{display:flex;justify-content:space-between;font:400 22px var(--font-d);padding-top:12px}.shop .fakebtn{background:var(--ink);color:#fff;text-align:center;border-radius:12px;padding:12px;font-weight:800;margin-top:12px}
.explain li{margin-bottom:6px}
.copy{display:flex;gap:6px}.copy input{font-size:13px}
.mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px}
/* howto */
.step{display:grid;grid-template-columns:44px 1fr;gap:12px}.step .n{width:44px;height:44px;border-radius:50%;background:var(--tabby);color:#fff;font:400 20px var(--font-d);display:grid;place-items:center;border:2px solid var(--ink)}
.tpl{border:2px solid var(--line);border-radius:14px;padding:12px;background:#fff;margin-bottom:12px}.tpl pre{white-space:pre-wrap;font:600 14px/1.5 var(--font-b);margin:6px 0;background:var(--cream);padding:10px;border-radius:10px}
.dont{background:#FBE3DF;border:2px solid #EDA8A0;border-radius:14px;padding:12px 14px}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--ink);color:var(--cream);padding:10px 18px;border-radius:99px;font-weight:800;z-index:50}
details>summary{cursor:pointer;font-weight:800}
.spark{display:flex;align-items:flex-end;gap:2px;height:40px}.spark i{flex:1;background:var(--tabby);border-radius:3px 3px 0 0;min-height:2px}

.socbox{margin-bottom:12px;padding-bottom:10px;border-bottom:1px dashed var(--line)}.socbox .soc{margin-bottom:4px}
.audgrid{display:grid;grid-template-columns:1.6fr .7fr 1.6fr .7fr 1.6fr .7fr;gap:6px;margin-top:4px}
@media(max-width:560px){.audgrid{grid-template-columns:1.6fr .7fr 1.6fr .7fr}}
.lv-line{display:flex;gap:8px;align-items:flex-start;margin-top:4px;line-height:1.35}

/* levels: reward track + tier cards */
.lvhero{background:var(--ink);color:var(--cream);border:2px solid var(--ink);border-radius:22px;padding:22px 18px 16px;margin-bottom:18px;background-image:radial-gradient(circle at 12% 0,rgba(238,106,23,.45),transparent 45%),radial-gradient(circle at 95% 100%,rgba(255,198,31,.2),transparent 40%)}
.lvh-top{display:flex;gap:18px;align-items:center;margin-bottom:22px}.lvh-medal{flex:none;filter:drop-shadow(0 6px 0 rgba(0,0,0,.3))}
.track{position:relative;display:grid;grid-template-columns:repeat(4,1fr);text-align:center}
.tline{position:absolute;left:12.5%;width:75%;top:26px;height:10px;background:#2c3556;border-radius:99px;overflow:hidden}.tline i{display:block;height:100%;width:var(--w,0%);background:linear-gradient(90deg,var(--tabby),var(--eye));border-radius:99px}
.tnode{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px}.tnode svg{background:var(--ink);border-radius:50%;padding:0 2px}.tnode b{font:400 14px var(--font-d)}.tnode span{font-size:12px;color:#bfc6dd;font-weight:700}
.tnode.cur svg{animation:pulse 2s ease-in-out infinite}.tnode.lock{opacity:.75}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}@media(prefers-reduced-motion:reduce){.tnode.cur svg{animation:none}}
.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.tier{position:relative;border:2px solid var(--ink);border-radius:22px;padding:18px 14px 14px;text-align:center;background:#fff;box-shadow:var(--shadow);overflow:hidden}
.tier::before{content:"";position:absolute;left:0;right:0;top:0;height:92px;background:var(--tc)}.tier>*{position:relative}
.tier.t1{--tc:#FFD9B8}.tier.t2{--tc:#CFE3F7}.tier.t3{--tc:#EBD3F5}.tier.t4{--tc:#FFE58A}
.tier .tmed{margin:-2px 0 4px}.tier h3{font-size:22px;margin:2px 0 10px}
.tier.now{outline:4px solid var(--eye);transform:translateY(-4px)}.tier.locked{background:#F7F2EA}.tier.locked .big{color:var(--mute)}
.ribbon{position:absolute!important;top:10px;right:-34px;transform:rotate(35deg);background:var(--ink);color:var(--eye);font:800 10px var(--font-b);letter-spacing:.08em;padding:3px 36px}
.tstat{background:var(--milk);border:2px solid var(--line);border-radius:14px;padding:8px 6px;margin-bottom:8px}.tstat .big{font:400 30px var(--font-d);color:var(--deep);line-height:1.05}.tstat .cap{font-size:13px;font-weight:800;color:var(--ink2)}.tstat .cap span{font-weight:600;color:var(--mute);font-size:12px}
.perk{background:var(--ink);color:var(--cream);border-radius:12px;padding:7px 9px;font-size:13px;font-weight:800;margin-bottom:8px}.tfoot{font:800 13px var(--font-b);color:var(--ink2)}

.chips{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 10px}.chip{font:inherit;font-weight:800;font-size:14px;padding:8px 14px;border-radius:999px;border:2px solid var(--ink);background:#fff;color:var(--ink);cursor:pointer}.chip:hover{background:var(--tabby);color:#fff;border-color:var(--tabby)}
.gaud{margin:14px 0 4px}.soc input[name=s_followers]{max-width:170px}
.rv{padding-left:20px;margin:8px 0}.rv li{margin:0 0 10px;line-height:1.45}