/* Core styles: brand tokens, layout, shared components (buttons, panels, chips, accordions, chat bubbles, composer, tab bar). */
:root{
  --ink:#050608;      /* matches the logo's own black */
  --panel:#0c0e12;
  --raise:#12151a;
  --line:#1f232a;
  --line2:#2e333b;
  --gold:#d8b45c; --gold-hi:#f1dc96; --gold-lo:#a9782b;
  --steel:#bfc4cc;
  --txt:#f3efe4; --mut:#99a0a9;
  --good:#62d19b; --bad:#ee6a77;
  --gold-grad:linear-gradient(120deg,var(--gold-lo),var(--gold-hi) 52%,var(--gold-lo));
  --display:'Markazi Text','Newsreader',Georgia,serif;
  --sans:'Vazirmatn',system-ui,-apple-system,'Segoe UI',Tahoma,sans-serif;
  --latin:'Newsreader',Georgia,serif;
  --tabh:64px;
  color-scheme:dark;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{background:var(--ink);color:var(--txt);overflow-x:hidden;max-width:100%}
body{font-family:var(--sans);font-size:15px;line-height:1.75;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--ink)}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
a{color:var(--gold-hi)}
.app{max-width:520px;margin:0 auto;min-height:100%;position:relative;overflow-x:clip}

/* header */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(5,6,8,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line);
  padding-block:10px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));display:flex;align-items:center;gap:12px}
.top img{width:40px;height:40px;border-radius:50%;border:1px solid var(--line2)}
.brand{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.brand b{font-family:var(--latin);font-weight:500;font-size:19px;letter-spacing:.06em;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand small{color:var(--mut);font-size:12px}
.back{white-space:nowrap;background:none;border:1px solid var(--line2);padding:6px 12px;font-size:13px;cursor:pointer}
.back:hover{border-color:var(--gold)}

main{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:0 calc(var(--tabh) + env(safe-area-inset-bottom,0px) + 28px)}
.view{display:flex;flex-direction:column;gap:18px;padding-top:18px}
.view[hidden]{display:none!important}

/* type */
.eyebrow{display:flex;align-items:center;gap:10px;font-size:12.5px;font-weight:700;letter-spacing:.04em;color:var(--gold)}
.eyebrow::before{content:"";width:10px;height:10px;border:2px solid var(--gold);border-radius:50%;flex:none}
.latin-eyebrow{font-family:var(--sans);direction:ltr;text-align:left;font-size:10.5px;font-weight:700;letter-spacing:.32em;color:var(--gold-lo)}
h1,h2,h3{font-family:var(--display);font-weight:600;margin:0;text-wrap:balance}
h1{font-size:clamp(40px,11vw,54px);line-height:1.12}
h2{font-size:30px;line-height:1.2}
h3{font-size:22px;line-height:1.3}
.g{background:linear-gradient(90deg,var(--gold-hi),var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{color:var(--mut);margin:0;font-size:15.5px}
.label{font-size:12px;font-weight:700;color:var(--gold);letter-spacing:.03em}
.muted{color:var(--mut)}
.num{font-variant-numeric:tabular-nums}
.ltr{direction:ltr;unicode-bidi:isolate}

/* buttons */
.btn{display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 20px;border:1px solid var(--line2);background:transparent;font-weight:700;font-size:15px;cursor:pointer;text-decoration:none;color:var(--txt);transition:border-color .15s,filter .15s}
.btn:hover{border-color:var(--gold)}
.btn.gold{border:0;background:var(--gold-grad);color:#14100a;box-shadow:0 10px 30px rgba(216,180,92,.16)}
.btn.gold:hover{filter:brightness(1.07)}
.btn.sm{min-height:40px;font-size:13.5px;padding:0 14px}
.btn:disabled{opacity:.35;cursor:not-allowed}
.row{display:flex;gap:10px;flex-wrap:wrap}
.row>.btn{flex:1 1 140px}
/* surfaces */
.panel{background:var(--panel);border:1px solid var(--line);padding:18px;display:flex;flex-direction:column;gap:12px}
.progress{height:4px;background:var(--line);position:relative;overflow:hidden}
.progress i{position:absolute;inset-block:0;inset-inline-start:0;background:var(--gold-grad);transition:width .4s}

.contract{display:flex;flex-direction:column;gap:10px}
.addr{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;background:var(--ink);border:1px solid var(--line2);padding:10px 12px;direction:ltr;text-align:left;overflow-wrap:anywhere;user-select:all}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:3px 10px;border:1px solid var(--line2);color:var(--mut);white-space:nowrap}
.chip.ok{color:var(--good);border-color:rgba(98,209,155,.35)}
.chip.soon{color:var(--gold);border-color:rgba(216,180,92,.35)}
.acc{border:1px solid var(--line);background:var(--panel)}
.acc+.acc{border-top:0}
.acc summary{list-style:none;cursor:pointer;padding:14px 16px;display:flex;gap:12px;align-items:flex-start;font-weight:600}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";margin-inline-start:auto;color:var(--gold);font-size:20px;line-height:1.2}
.acc[open] summary::after{content:"−"}
.acc .body{padding:0 16px 16px;color:#d9d5ca}
.acc .body p{margin:0 0 8px}
.acc .body ul{margin:0 0 8px;padding-inline-start:18px}
.thread{display:flex;flex-direction:column;gap:14px;padding-bottom:84px}
.msg{max-width:92%;padding:12px 14px;line-height:1.75;font-size:15px}
.msg.bot{align-self:flex-start;background:var(--panel);border:1px solid var(--line)}
.msg.me{align-self:flex-end;background:var(--raise);border:1px solid var(--line2)}
.msg .q{font-weight:700;color:var(--gold-hi);margin-bottom:6px;display:block}
.msg p{margin:0 0 8px} .msg p:last-child{margin:0}
.msg ul{margin:0 0 8px;padding-inline-start:18px}
.sugs{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.sug{background:transparent;border:1px solid var(--line2);padding:6px 12px;font-size:13px;cursor:pointer;text-align:start;line-height:1.5}
.sug:hover{border-color:var(--gold);color:var(--gold-hi)}
.from{font-size:11.5px;color:var(--mut);margin-top:8px;display:block}
.composer{position:fixed;inset-inline:0;bottom:calc(var(--tabh) + env(safe-area-inset-bottom,0px));z-index:15;background:var(--ink);border-top:1px solid var(--line);
  padding-block:10px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.composer form{max-width:488px;margin:0 auto;display:flex;gap:8px}
.composer input{flex:1;min-width:0;background:var(--panel);border:1px solid var(--line2);padding:12px 14px;outline:none}
.composer input:focus{border-color:var(--gold)}
.composer button{flex:none;width:50px;border:0;background:var(--gold-grad);color:#14100a;cursor:pointer;font-size:18px}
.cats{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.cats::-webkit-scrollbar{display:none}
.cats button{flex:none;background:transparent;border:1px solid var(--line2);padding:7px 14px;font-size:13.5px;cursor:pointer;color:var(--mut)}
.cats button.on{border-color:var(--gold);color:var(--gold-hi)}
.tabs{position:fixed;inset-inline:0;bottom:0;z-index:25;background:rgba(9,10,13,.97);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px);
  padding-left:max(8px,env(safe-area-inset-left,0px));padding-right:max(8px,env(safe-area-inset-right,0px))}
.tabs nav{max-width:520px;margin:0 auto;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;height:var(--tabh)}
.tabs button{background:none;border:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11.5px;color:var(--mut);cursor:pointer;position:relative}
.tabs svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.6}
.tabs button.on{color:var(--gold-hi)}
.tabs button.on::before{content:"";position:absolute;top:0;inset-inline:28%;height:2px;background:var(--gold-grad)}

.toast{position:fixed;left:50%;bottom:calc(var(--tabh) + env(safe-area-inset-bottom,0px) + 80px);transform:translateX(-50%);background:var(--raise);border:1px solid var(--gold-lo);padding:10px 16px;font-size:13.5px;z-index:40;max-width:calc(100% - 32px);transition:opacity .25s;z-index:70}
.foot{font-size:12px;color:var(--mut);line-height:1.7}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

html,body{margin:0}
[dir=rtl] .latin-eyebrow{text-align:right}
.top-actions{margin-inline-start:auto;display:flex;align-items:center;gap:8px}
.lang{display:flex;border:1px solid var(--line2)}
.lang button{background:none;border:0;padding:5px 9px;font-size:12px;font-weight:700;cursor:pointer;color:var(--mut);font-family:var(--sans);letter-spacing:.04em}
.lang button.on{background:var(--gold-grad);color:#14100a}
.boot{min-height:70vh;display:grid;place-items:center;color:var(--mut);font-size:14px}
.boot .dots{display:inline-flex;gap:5px}
.boot .dots i{width:7px;height:7px;border-radius:50%;background:var(--gold);opacity:.3;animation:dot 1s infinite}
.boot .dots i:nth-child(2){animation-delay:.2s}.boot .dots i:nth-child(3){animation-delay:.4s}
@keyframes dot{50%{opacity:1}}