[hidden]{display:none!important}

/* Layout: one-screen landing on desktop — gradient header (nav, greeting, glowing clock), then a tools panel (folders row + tool grid) beside the news sidebar. News and login are separate hash views. Role-aware: signed-out, producer, agent, admin, super admin. */
:root{
  --deep:#0D5E5A; --base:#14807A; --action:#1FA89E; --mint:#7DD9D0; --neon:#2EF2A0;
  --bg:#FFFFFF; --alt:#F4F9F8; --line:#E6EEED; --ink:#1A1C1C; --text2:#4A5859; --muted:#7A8B8A;
  --lock:#F7F3EA; --lock-ink:#8A6A2B;
  --demo:#093F3C;
  --grad:linear-gradient(135deg,#0D5E5A 0%,#14807A 100%);
  --shadow:0 12px 40px -12px rgba(13,94,90,.16);
  --font:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --max:1200px;
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:var(--font);background:var(--bg);color:var(--ink);line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
h1,h2,h3{text-wrap:balance}
:focus-visible{outline:2px solid var(--neon);outline-offset:3px;border-radius:6px}
.gut{max-width:var(--max);margin:0 auto;padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}

/* Demo bar */

/* Shared */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:12px;font-weight:700;font-size:.92rem;letter-spacing:-.01em;border:none;cursor:pointer;transition:all .2s cubic-bezier(.175,.885,.32,1.275)}
.btn-primary{background:var(--action);color:#fff;box-shadow:0 4px 14px rgba(31,168,158,.4)}
.btn-primary:hover{background:var(--neon);color:var(--deep);transform:translateY(-2px)}
.badge{display:inline-block;font-size:.62rem;font-weight:900;letter-spacing:.04em;text-transform:uppercase;color:var(--deep);background:var(--neon);padding:2px 6px;border-radius:3px;margin-bottom:6px}
.badge.alt{background:var(--mint)}
.badge.int{background:var(--deep);color:#fff}
.sec-h{font-size:1.15rem;font-weight:800;letter-spacing:-.03em;display:flex;align-items:center;gap:10px}
.sec-h svg{width:19px;height:19px;fill:var(--action);flex:none}
.brand{display:flex;align-items:center;gap:9px;font-size:1.45rem;font-weight:900;letter-spacing:-.04em;text-transform:lowercase;color:#fff}
.brand svg{color:var(--neon);flex:none}
.lockico{width:13px;height:13px;flex:none}

/* Energy lines */
.energy{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.energy i{position:absolute;left:0;width:200%;height:1px;background:linear-gradient(90deg,transparent,rgba(46,242,160,.3),transparent);animation:slide 8s linear infinite}
@keyframes slide{from{transform:translate(-50%,-50%) rotate(-35deg)}to{transform:translate(0,0) rotate(-35deg)}}

/* ---------- HOME ---------- */
.home{display:flex;flex-direction:column;min-height:100%}
.head{background:var(--grad);color:#fff;position:relative;overflow:hidden;padding-bottom:clamp(76px,12vh,120px);flex:none}
.nav{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-block:clamp(16px,3vh,28px);position:relative;z-index:2}
.nav-r{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.nav-link{font-size:.82rem;font-weight:700;color:var(--mint);background:none;border:none;cursor:pointer;padding:0}
.nav-link:hover{color:#fff}
.btn-signin{background:#fff;color:var(--deep);box-shadow:0 6px 18px rgba(0,0,0,.12)}
.btn-signin:hover{background:var(--neon);color:var(--deep);transform:translateY(-2px)}
.who-pill{display:inline-flex;align-items:center;gap:8px;font-size:.78rem;font-weight:600;color:#E6FAF6;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);padding:5px 12px 5px 5px;border-radius:999px}
.who-pill .av{width:24px;height:24px;font-size:.66rem}
.who-pill b{color:var(--neon);font-weight:800}
.hero{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap;position:relative;z-index:2;padding-top:clamp(2px,1.6vh,20px)}
.hero-title{font-size:clamp(2.3rem,min(5vw,7.6vh),4.4rem);font-weight:900;line-height:.95;letter-spacing:-.05em;margin-bottom:14px}
.hero-sub{font-size:clamp(1rem,1.5vw,1.15rem);color:var(--mint);font-weight:400;max-width:46ch}
.hero-sub strong{color:#fff;font-weight:700}
.clock{text-align:right}
.clock-label{display:block;font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--mint);margin-bottom:8px}
.glow{font-size:clamp(2.9rem,min(6.4vw,9.6vh),5.5rem);font-weight:900;line-height:1;letter-spacing:-.05em;color:var(--neon);text-shadow:0 0 20px var(--neon),0 0 40px rgba(46,242,160,.4);font-variant-numeric:tabular-nums;white-space:nowrap}
.glow small{font-size:.32em;letter-spacing:.02em;font-weight:800;text-shadow:none;color:var(--mint);margin-left:2px;vertical-align:.9em}
.clock-next{display:block;font-size:.78rem;color:#CFEFEA;margin-top:10px}
.clock-next b{color:#fff}
.topstory{position:relative;z-index:2;display:flex;align-items:center;gap:14px;margin-top:clamp(16px,2.6vh,26px);padding:12px 16px;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(125,217,208,.28);color:#fff;transition:background .2s,border-color .2s;flex-wrap:wrap}
.topstory:hover{background:rgba(255,255,255,.13);border-color:var(--neon)}
.ts-tag{flex:none;font-size:.62rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--deep);background:var(--neon);padding:3px 8px;border-radius:4px;box-shadow:0 0 14px rgba(46,242,160,.45)}
.ts-h{flex:1;min-width:0;font-weight:700;font-size:clamp(.9rem,1.3vw,1.02rem);letter-spacing:-.01em;line-height:1.3}
.ts-go{flex:none;font-size:.8rem;font-weight:800;color:var(--neon);white-space:nowrap}
.ts-more{flex:none;font-size:.74rem;font-weight:700;color:var(--mint);white-space:nowrap}
.ts-more:hover{color:#fff}
.nlinks{display:flex;gap:14px;flex-wrap:wrap;font-size:.76rem;font-weight:800}
.nlinks a{color:var(--action)}
.nlinks a:hover{color:var(--deep)}
.nlinks .lk{color:var(--lock-ink);display:inline-flex;gap:4px;align-items:center}
.archive{background:#fff;border-radius:20px;border:1px solid var(--line);padding:22px 24px;margin-top:18px}
.archive p{font-size:.84rem;color:var(--text2);margin:6px 0 12px}
.archive a.btn{width:100%;margin-top:8px}

.body{flex:1;min-height:0;position:relative;z-index:5;margin-top:calc(-1 * clamp(54px,8.5vh,90px));padding-bottom:22px}
.grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:28px;height:100%}
.tools-wrap{position:relative;background:#fff;border-radius:20px;box-shadow:var(--shadow);border:1px solid rgba(13,94,90,.05);padding:22px 24px;min-width:0;display:flex;flex-direction:column;gap:14px}
.row-h{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.row-note{font-size:.72rem;color:var(--muted)}

/* Folders */
.folders{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.folder{position:relative;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;border:1px solid var(--line);background:var(--alt);cursor:pointer;text-align:left;width:100%;transition:all .2s;min-width:0}
.folder:hover{border-color:var(--neon);transform:translateY(-2px);box-shadow:0 10px 25px rgba(20,128,122,.08)}
.folder[aria-expanded="true"]{border-color:var(--action);background:#fff;box-shadow:0 0 0 3px rgba(46,242,160,.25)}
.f-ico{flex:none;width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:var(--deep);color:var(--neon)}
.f-ico svg{width:20px;height:20px}
.f-txt{min-width:0;flex:1}
.f-t{display:block;font-weight:800;font-size:.92rem;letter-spacing:-.01em;line-height:1.2}
.f-d{display:block;font-size:.74rem;color:var(--text2);line-height:1.3;margin-top:2px}
.f-chev{flex:none;color:var(--muted);font-weight:800;transition:transform .2s}
.folder[aria-expanded="true"] .f-chev{transform:rotate(180deg);color:var(--action)}
.folder.locked{background:var(--lock);border-color:#EDE4CF}
.folder.locked .f-ico{background:#EFE6D2;color:var(--lock-ink)}
.folder.locked .f-d{color:var(--lock-ink);font-weight:600;display:flex;align-items:center;gap:5px}
.folder.locked:hover{border-color:#D9C79E;box-shadow:none}

/* Folder dropdown panel */
.pop{position:fixed;top:0;right:0;bottom:0;left:auto;width:min(480px,100%);z-index:50;background:#fff;border-left:1px solid var(--line);box-shadow:-24px 0 60px -18px rgba(13,94,90,.35);display:flex;flex-direction:column;overflow:hidden;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);padding-right:env(safe-area-inset-right,0px)}
.scrim{position:fixed;inset:0;z-index:45;background:rgba(9,63,60,.18)}
.pop .sub-b{grid-template-columns:minmax(0,1fr)}
.pop-h{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);background:var(--alt)}
.pop-h h3{font-size:1rem;font-weight:800;letter-spacing:-.02em}
.pop-h p{font-size:.74rem;color:var(--muted)}
.pop-x{background:none;border:none;font-size:1.3rem;line-height:1;cursor:pointer;color:var(--text2);padding:4px 8px;border-radius:8px}
.pop-x:hover{background:#fff}
.pop-b{overflow:auto;padding:10px 14px 16px;display:grid;gap:10px}
.sub{border:1px solid var(--line);border-radius:12px}
.sub>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:10px 14px;font-weight:800;font-size:.86rem}
.sub>summary::-webkit-details-marker{display:none}
.sub>summary::before{content:"";width:7px;height:7px;border-right:2px solid var(--action);border-bottom:2px solid var(--action);transform:rotate(-45deg);transition:transform .2s;flex:none}
.sub[open]>summary::before{transform:rotate(45deg)}
.sub>summary .cnt{margin-left:auto;font-size:.7rem;font-weight:700;color:var(--muted)}
.sub-b{padding:0 10px 10px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.it{display:flex;gap:10px;align-items:flex-start;padding:10px;border-radius:10px;border:1px solid var(--line);background:#fff;min-width:0;transition:border-color .2s}
a.it:hover{border-color:var(--neon)}
.it-t{display:block;font-weight:700;font-size:.84rem;line-height:1.25}
.it-u{display:block;font-size:.7rem;color:var(--action);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.it-n{display:block;font-size:.72rem;color:var(--text2);line-height:1.35;margin-top:2px}
.it-n.flag{color:#B4373F;font-weight:600}
.copyrow{display:flex;align-items:center;gap:6px;margin-top:4px;flex-wrap:wrap}
.val{font-size:.74rem;font-weight:700;color:var(--deep);font-variant-numeric:tabular-nums;user-select:all;overflow-wrap:anywhere}
.cp{font-size:.66rem;font-weight:800;border:1px solid var(--line);background:var(--alt);border-radius:6px;padding:1px 6px;cursor:pointer;color:var(--base)}
.cp:hover{border-color:var(--action)}

/* Tools */
.tools{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.tool{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:12px;border:1px solid var(--line);background:#fff;transition:all .2s;min-width:0}
.tool:hover{border-color:var(--neon);transform:translateY(-3px);box-shadow:0 10px 25px rgba(20,128,122,.08)}
.ico{position:relative;width:34px;height:34px;border-radius:9px;background:var(--alt);display:grid;place-items:center;overflow:hidden;flex:none}
.ico b{font-size:.74rem;font-weight:900;letter-spacing:-.02em;color:var(--base)}
.ico img{position:absolute;inset:6px;width:22px;height:22px;object-fit:contain;background:var(--alt)}
.tool-x{min-width:0}
.tool-t{display:block;font-weight:800;font-size:.86rem;letter-spacing:-.01em;line-height:1.2;overflow-wrap:anywhere}
.tool-d{display:block;font-size:.72rem;color:var(--text2);line-height:1.3}
.tool.soon{opacity:.68}
.soon-tag{font-size:.58rem;font-weight:900;text-transform:uppercase;letter-spacing:.04em;background:var(--alt);color:var(--base);padding:1px 5px;border-radius:3px;margin-left:4px;vertical-align:1px}
.tools-foot{margin-top:auto;padding-top:4px;font-size:.72rem;color:var(--muted);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* Feed */
.feed{background:var(--alt);border-radius:20px;border:1px solid var(--line);padding:22px 24px;display:flex;flex-direction:column;min-height:0}
.feed .sec-h{font-size:1.02rem;margin-bottom:2px}
.feed-list{overflow:auto;min-height:0;margin-right:-8px;padding-right:8px}
.ni{display:block;padding:13px 0;border-bottom:1px solid rgba(13,94,90,.1)}
.ni:last-child{border-bottom:none}
.ni-t{display:block;font-weight:700;font-size:.88rem;line-height:1.38;transition:color .2s}
.ni-s{display:block;font-size:.7rem;color:var(--muted);margin-top:3px}
.ni:hover .ni-t{color:var(--action)}
.feed-more{margin-top:8px;font-size:.8rem;font-weight:800;color:var(--action)}

@media (min-width:1001px) and (min-height:740px){
  body.lock .home{min-height:100%}
}

/* ---------- NEWS ---------- */
.news-head{background:var(--grad);color:#fff;position:relative;overflow:hidden;padding-bottom:90px}
.news-title{font-size:clamp(2.2rem,4.5vw,3.6rem);font-weight:900;letter-spacing:-.05em;line-height:.95;position:relative;z-index:2}
.news-body{margin-top:-60px;position:relative;z-index:5;padding-bottom:48px}
.ngrid-wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:32px}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.fchip{font-size:.78rem;font-weight:700;padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--text2);cursor:pointer}
.fchip[aria-pressed="true"]{background:var(--deep);border-color:var(--deep);color:#fff}
.ngrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.ncard{display:flex;flex-direction:column;gap:10px;background:#fff;border-radius:20px;border:1px solid var(--line);padding:26px;transition:all .2s}
.ncard:hover{border-color:var(--neon);box-shadow:var(--shadow)}
.ncard.lead{grid-column:1/-1;box-shadow:var(--shadow);padding:34px}
.ncard h3{font-size:1.1rem;font-weight:800;letter-spacing:-.02em;line-height:1.3}
.ncard.lead h3{font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:900;letter-spacing:-.04em;line-height:1.08}
.ncard p{font-size:.88rem;color:var(--text2)}
.take{padding:12px 14px;border-radius:12px;background:var(--alt);font-size:.85rem;color:var(--text2)}
.take b{color:var(--deep)}
.ncard-f{display:flex;justify-content:space-between;gap:10px;margin-top:auto;font-size:.74rem;color:var(--muted);flex-wrap:wrap}
.ncard-f span{font-size:.72rem}
.mini{background:var(--grad);border-radius:20px;padding:26px;color:#fff;margin-bottom:18px}
.mini .glow{font-size:3rem}
.cal{background:var(--alt);border-radius:20px;border:1px solid var(--line);padding:24px}
.cal ul{list-style:none;margin-top:8px}
.cal li{display:grid;grid-template-columns:58px 1fr;gap:10px;padding:10px 0;border-bottom:1px solid rgba(13,94,90,.1);font-size:.85rem}
.cal li:last-child{border-bottom:none}
.cal time{font-weight:800;color:var(--deep);font-variant-numeric:tabular-nums}
.cal .now time{color:var(--action)}

/* ---------- LOGIN ---------- */
.login{display:grid;grid-template-columns:1fr 1.2fr;min-height:100%}
.login-brand{background:var(--grad);color:#fff;padding:72px max(56px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.login-brand > *{position:relative;z-index:2}
.login-brand h1{font-size:clamp(2.4rem,4.2vw,3.5rem);font-weight:900;line-height:1;letter-spacing:-.05em;margin:40px 0 22px}
.login-brand p{font-size:1.15rem;color:var(--mint);max-width:26ch}
.login-form{display:flex;align-items:center;justify-content:center;padding:40px max(28px,env(safe-area-inset-right,0px)) 40px 28px;background:#fff}
.lbox{width:100%;max-width:440px}
.back{color:var(--base);font-weight:700;margin-bottom:32px;display:inline-flex;gap:8px}
.who{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.av{width:42px;height:42px;border-radius:50%;background:var(--mint);color:var(--deep);display:grid;place-items:center;font-weight:900;font-size:.9rem;flex:none}
.lbox h2{font-size:2.5rem;font-weight:900;letter-spacing:-.04em;line-height:1;margin-bottom:12px}
.lsub{color:var(--text2);margin-bottom:28px}
.notice{display:flex;gap:10px;align-items:flex-start;background:var(--lock);color:var(--lock-ink);border:1px solid #EDE4CF;border-radius:12px;padding:11px 14px;font-size:.84rem;font-weight:600;margin-bottom:22px}
.ig{margin-bottom:20px}
.ig label{display:block;font-weight:700;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;margin-bottom:8px;color:var(--text2)}
.ig input{width:100%;padding:15px 16px;border:2px solid var(--line);border-radius:12px;font-size:1rem;color:var(--ink);background:#fff}
.ig input:focus{border-color:var(--action);outline:none}
.pw{position:relative}
.pw button{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;font-size:.78rem;font-weight:800;color:var(--action);cursor:pointer;padding:6px}
.lrow{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.85rem;color:var(--text2);margin:-4px 0 22px}
.lrow label{display:flex;gap:8px;align-items:center}
.lrow a{color:var(--action);font-weight:700}
.w100{width:100%}
.lnote{margin-top:16px;font-size:.76rem;color:var(--muted);text-align:center}
.lnote a{color:var(--action);font-weight:700}
.dest{display:grid;gap:12px}
.dcard{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:20px 22px;border-radius:14px;border:2px solid var(--line);transition:all .2s}
.dcard:hover{border-color:var(--neon);transform:translateY(-2px);box-shadow:var(--shadow)}
.dcard h3{font-size:1.08rem;font-weight:800;letter-spacing:-.02em}
.dcard p{font-size:.82rem;color:var(--muted)}
.arr{flex:none;width:36px;height:36px;border-radius:50%;background:var(--neon);color:var(--deep);display:grid;place-items:center;font-weight:900}

/* Responsive */
@media (max-width:1100px){.tools{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1000px){
  .grid,.ngrid-wrap{grid-template-columns:minmax(0,1fr)}
  .login{grid-template-columns:1fr}
  .login-brand{padding:48px max(24px,env(safe-area-inset-left,0px))}
  .clock{text-align:left}
}
@media (max-width:760px){.folders{grid-template-columns:minmax(0,1fr)}.sub-b{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){
  .tools{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ngrid{grid-template-columns:minmax(0,1fr)}
  .tools-wrap,.feed{padding:18px}
}
@media (prefers-reduced-motion:reduce){.energy i{animation:none}*{transition:none!important}}

/* ---------- Live additions ---------- */
.view{display:block}
.reflink{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 14px;border-radius:14px;border:1px dashed var(--action);background:var(--alt)}
.reflink b{font-size:.86rem}
.reflink code{font-size:.78rem;color:var(--deep);background:#fff;border:1px solid var(--line);padding:4px 8px;border-radius:8px;overflow-wrap:anywhere;min-width:0;flex:1}
.reflink .cp{font-size:.74rem;padding:4px 10px}
/* Referral page */
.refer-head{background:var(--grad);color:#fff;position:relative;overflow:hidden;padding-bottom:110px}
.refer-hero{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:32px;align-items:end;padding-top:8px}
.refer-hero h1{font-size:clamp(2.2rem,4.6vw,3.8rem);font-weight:900;letter-spacing:-.05em;line-height:.98}
.refer-hero p{color:var(--mint);font-size:1.1rem;margin-top:14px;max-width:46ch}
.agent-card{background:rgba(255,255,255,.08);border:1px solid rgba(125,217,208,.3);border-radius:18px;padding:18px 20px;display:flex;gap:14px;align-items:center}
.agent-card .av{width:52px;height:52px;font-size:1rem;color:var(--deep)}
.agent-card b{display:block;font-size:1.05rem}
.agent-card span{font-size:.84rem;color:var(--mint)}
.refer-body{margin-top:-70px;position:relative;z-index:5;padding-bottom:48px}
.refer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.rcard{background:#fff;border-radius:20px;border:1px solid var(--line);box-shadow:var(--shadow);padding:30px;display:flex;flex-direction:column;gap:12px}
.rcard h2{font-size:1.5rem;font-weight:900;letter-spacing:-.04em;line-height:1.1}
.rcard p{color:var(--text2);font-size:.95rem}
.rcard .btn{align-self:flex-start;margin-top:auto}
.rcard .lines{display:flex;gap:8px;flex-wrap:wrap}
.chipline{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;background:var(--alt);color:var(--base);border:1px solid var(--line);padding:4px 10px;border-radius:999px}
.howto{margin-top:26px;background:var(--alt);border:1px solid var(--line);border-radius:20px;padding:26px 28px}
.howto ol{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:14px;counter-reset:s}
.howto li{counter-increment:s;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;font-size:.88rem;color:var(--text2)}
.howto li::before{content:"Step " counter(s);display:block;font-size:.66rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--action);margin-bottom:6px}
.howto li b{display:block;color:var(--ink);font-size:.95rem;margin-bottom:2px}
.fine{margin-top:22px;font-size:.74rem;color:var(--muted);line-height:1.55;max-width:90ch}
/* Login page (live) */
.login-err{background:#FDECEC;color:#9B1C1C;border:1px solid #F5C2C2;border-radius:12px;padding:11px 14px;font-size:.86rem;font-weight:600;margin-bottom:18px}
@media (max-width:900px){.refer-hero,.refer-grid{grid-template-columns:minmax(0,1fr)}.howto ol{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.howto ol{grid-template-columns:minmax(0,1fr)}}

/* ---------- v3: photos, account settings, Haven Brief stories + archive ---------- */
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
img.av{object-fit:cover;background:var(--mint)}
.av-lg{width:64px;height:64px;font-size:1.2rem}
.av-lg svg{width:30px;height:30px;color:var(--deep)}
.av-xl{width:148px;height:148px;font-size:2.6rem;box-shadow:0 0 0 4px #fff,0 0 0 6px var(--neon),var(--shadow)}
a.who-pill{text-decoration:none}
a.who-pill:hover{border-color:var(--neon)}
.nav-link.on{color:#fff;text-decoration:underline;text-underline-offset:6px;text-decoration-color:var(--neon)}
.hero-id{display:flex;align-items:center;gap:22px;min-width:0}
.hero-av{width:clamp(72px,9vh,104px);height:clamp(72px,9vh,104px);border-radius:50%;object-fit:cover;flex:none;box-shadow:0 0 0 3px rgba(255,255,255,.9),0 0 0 6px var(--neon),0 0 28px rgba(46,242,160,.45)}
.agent-card img.av{width:64px;height:64px}
.agent-card em{display:block;font-style:normal;font-size:.84rem;color:#E6FAF6;margin-top:6px;line-height:1.45;max-width:42ch}
.btn-ghost{background:var(--alt);color:var(--deep);border:1px solid var(--line)}
.btn-ghost:hover{border-color:var(--action)}

/* Settings */
.set-head{padding-bottom:96px}
.set-lead{position:relative;z-index:2;color:var(--mint);font-size:1.05rem;margin-top:12px;max-width:60ch}
.set-team{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px 16px;margin-bottom:16px;box-shadow:var(--shadow)}
.set-team label{font-size:.76rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--text2)}
.set-team select{flex:1;min-width:220px;padding:10px 12px;border:2px solid var(--line);border-radius:10px;font:inherit;background:#fff}
.set-ok{background:#E9FBF3;color:#0B5E3C;border:1px solid #BDEFD7;border-radius:12px;padding:11px 14px;font-size:.88rem;font-weight:600;margin-bottom:16px}
.set-ok a{color:var(--deep);text-decoration:underline}
.set-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:22px;align-items:start}
.set-photo{align-items:center;text-align:center}
.set-photo .rcard h2,.set-photo h2{align-self:flex-start}
.set-av{margin:10px 0 6px}
.set-btns{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.set-btns .btn{margin:0}
.set-hint{font-size:.8rem;color:var(--muted)}
.set-hint.bad{color:#9B1C1C;font-weight:600}
.set-fields .ig{margin-bottom:16px}
.ig small{display:block;font-size:.74rem;color:var(--muted);margin-top:6px}
.ig textarea{width:100%;padding:13px 16px;border:2px solid var(--line);border-radius:12px;font:inherit;font-size:.95rem;resize:vertical;color:var(--ink)}
.ig textarea:focus{border-color:var(--action);outline:none}
.ig.bad input,.ig.bad textarea{border-color:#E08A8A}
.ig.bad small{color:#9B1C1C;font-weight:600}
.opt{font-weight:600;text-transform:none;letter-spacing:0;color:var(--muted);margin-left:6px}
.set-fixed{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:6px 0 4px}
.set-fixed div{background:var(--alt);border:1px solid var(--line);border-radius:12px;padding:10px 12px;min-width:0}
.set-fixed dt{font-size:.66rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.set-fixed dd{font-size:.82rem;font-weight:700;overflow-wrap:anywhere}
.set-preview{grid-column:1/-1}
.set-pv{padding:28px;border-radius:20px;margin-top:12px}
.set-pv .agent-card{max-width:520px;position:relative;z-index:2}

/* Story page */
.art-head{padding-bottom:70px}
.art-hero{position:relative;z-index:2;max-width:880px;padding-top:6px}
.art-kicker{display:inline-flex;align-items:center;gap:10px;font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--mint)}
.art-kicker .badge{margin:0}
.art-hero h1{font-size:clamp(2rem,4.4vw,3.4rem);font-weight:900;letter-spacing:-.045em;line-height:1.02;margin:14px 0 16px}
.art-dek{font-size:clamp(1.05rem,1.7vw,1.25rem);color:#E6FAF6;max-width:62ch;line-height:1.5}
.art-meta{display:flex;align-items:center;flex-wrap:wrap;gap:8px 18px;margin-top:22px;font-size:.82rem;color:var(--mint)}
.art-by{display:inline-flex;align-items:center;gap:6px;color:#fff}
.art-by svg{width:16px;height:16px;color:var(--neon)}
.art-stats{background:rgba(46,242,160,.16);color:var(--neon);font-weight:800;padding:3px 10px;border-radius:999px}
.art-share{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.25)}
.art-body{padding:36px 0 40px;background:var(--bg)}
.art-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:44px;align-items:start}
.art{min-width:0;max-width:740px}
.art-take{background:var(--alt);border-left:4px solid var(--neon);border-radius:0 14px 14px 0;padding:16px 20px;font-size:1.02rem;font-weight:600;color:var(--deep);margin-bottom:26px}
.art-take b{display:block;font-size:.7rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--action);margin-bottom:4px}
.prose{font-size:1.06rem;line-height:1.72;color:#253131}
.prose p{margin:0 0 1.05em}
.prose h2{font-size:1.4rem;font-weight:900;letter-spacing:-.03em;line-height:1.2;color:var(--ink);margin:1.6em 0 .55em}
.prose ul,.prose ol{margin:0 0 1.15em 1.25em}
.prose li{margin:.35em 0;padding-left:.2em}
.prose li::marker{color:var(--action);font-weight:800}
.prose strong{color:var(--ink)}
.prose a{color:var(--base);font-weight:700;text-decoration:underline;text-decoration-color:var(--mint);text-underline-offset:3px}
.a-note{font-size:.9rem!important;color:var(--lock-ink);background:var(--lock);border-radius:12px;padding:12px 14px}
.a-table{overflow-x:auto;margin:0 0 1.3em;border:1px solid var(--line);border-radius:14px}
.a-table table{width:100%;border-collapse:collapse;font-size:.9rem;line-height:1.45}
.a-table th{background:var(--deep);color:#fff;text-align:left;font-weight:800;font-size:.74rem;letter-spacing:.05em;text-transform:uppercase;padding:10px 14px}
.a-table td{padding:10px 14px;border-top:1px solid var(--line);vertical-align:top}
.a-table tr:nth-child(even) td{background:var(--alt)}
.a-video{margin:0 0 1.4em}
.a-frame{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:var(--deep);box-shadow:var(--shadow)}
.a-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.a-video figcaption{font-size:.82rem;color:var(--muted);margin-top:8px}
.a-video figcaption b{color:var(--ink)}
.a-sessions{list-style:none!important;margin:0 0 1.2em!important;display:grid;gap:10px}
.a-sessions li{display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin:0!important}
.a-sessions li.pick{border-color:var(--neon);box-shadow:0 0 0 3px rgba(46,242,160,.18)}
.a-sessions li.past{opacity:.55}
.a-sessions time{font-size:.78rem;color:var(--muted);line-height:1.3}
.a-sessions time b{display:block;color:var(--deep);font-size:.9rem}
.ses-t{font-weight:700;font-size:.95rem;line-height:1.35}
.ses-t em{font-style:normal;margin-left:8px;font-size:.62rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase;background:var(--neon);color:var(--deep);padding:2px 6px;border-radius:3px;vertical-align:2px}
.ses-go{padding:9px 14px;font-size:.82rem;text-decoration:none!important;color:#fff!important}
.ses-done{font-size:.76rem;font-weight:800;color:var(--muted)}
.art-team{margin-top:34px;background:var(--alt);border:1px solid var(--line);border-radius:20px;padding:24px 26px}
.art-team h2{font-size:1.15rem;font-weight:900;letter-spacing:-.03em;display:flex;align-items:center;gap:10px;margin-bottom:12px}
.art-team h2 svg{width:18px;height:18px;fill:var(--action)}
.art-team .prose{font-size:.98rem}
.art-team .prose h2{font-size:1.05rem;margin-top:1.1em}
.art-lock{display:flex;gap:8px;align-items:flex-start;color:var(--text2);margin-bottom:14px}
.art-src{margin-top:30px;border-top:1px solid var(--line);padding-top:20px}
.art-src h2{font-size:.78rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.art-src ol{margin-left:1.2em;font-size:.9rem;color:var(--text2)}
.art-src li{margin:.4em 0}
.art-src a{color:var(--base);font-weight:700}
.src-host{margin-left:8px;font-size:.74rem;color:var(--muted)}
.art-side{position:sticky;top:20px;display:grid;gap:18px}
.side-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px;box-shadow:var(--shadow)}
.agent-side{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.agent-side b{font-size:1.05rem;font-weight:900;letter-spacing:-.02em}
.agent-side p{font-size:.88rem;color:var(--text2)}
.side-more .ni:last-of-type{border-bottom:none}
.art-foot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.76rem;color:var(--muted);border-top:1px solid var(--line);padding-top:18px;margin-top:40px}
.ncard-a{color:inherit}
.ncard-a::after{content:"";position:absolute;inset:0}
.ncard{position:relative}
.ncard-go{font-weight:800;color:var(--action)}

/* Archive */
.arc-wrap{max-width:980px}
.arc-tools{display:grid;gap:12px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:var(--shadow);margin-bottom:26px}
.arc-tools input{width:100%;padding:14px 16px;border:2px solid var(--line);border-radius:12px;font:inherit;font-size:1rem}
.arc-tools input:focus{border-color:var(--action);outline:none}
.arc-tools .filters{margin:0}
.arc-mh{font-size:.8rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--action);margin:6px 0 10px}
.arc-list{list-style:none;display:grid;gap:12px;margin-bottom:28px}
.arc-row{display:grid;grid-template-columns:64px minmax(0,1fr);gap:16px;align-items:start}
.arc-row time{background:var(--grad);color:#fff;border-radius:14px;text-align:center;padding:10px 6px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.arc-row time b{display:block;font-size:1.5rem;font-weight:900;letter-spacing:-.03em;line-height:1}
.arc-a{display:block;background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 20px;transition:all .2s}
.arc-a:hover{border-color:var(--neon);box-shadow:var(--shadow);transform:translateY(-1px)}
.arc-k{display:flex;align-items:center;gap:10px;font-size:.74rem;color:var(--muted);flex-wrap:wrap}
.arc-k .badge{margin:0}
.arc-t{display:block;font-size:1.12rem;font-weight:800;letter-spacing:-.02em;line-height:1.3;margin:6px 0 4px}
.arc-a:hover .arc-t{color:var(--base)}
.arc-d{display:block;font-size:.88rem;color:var(--text2)}
.arc-none{color:var(--muted);text-align:center;padding:30px}

@media (max-width:1000px){.art-grid{grid-template-columns:minmax(0,1fr)}.art-side{position:static}.set-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){.a-sessions li{grid-template-columns:minmax(0,1fr)}.set-fixed{grid-template-columns:minmax(0,1fr)}.hero-id{flex-direction:column;align-items:flex-start;gap:14px}.arc-row{grid-template-columns:52px minmax(0,1fr);gap:10px}}
@media (min-width:1001px){.hero{flex-wrap:nowrap}.hero-id{flex:1 1 auto}.clock{flex:none}}