/* ══════════════════════════════════
   AdImpulse · style.css
   Deep Ocean Teal · AdImpulse theme
   ══════════════════════════════════ */

*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg0:#071E26;--bg1:#0A2B36;--bg2:#0D3340;
  --t1:rgba(255,255,255,.92);--t2:rgba(255,255,255,.55);--t3:rgba(255,255,255,.28);
  --border:rgba(255,255,255,.08);
  --rust:#C4341A;--orange:#DC7B1A;--amber:#D4A50E;
  --teal:#2A9BAD;--sage:#7BBFB5;
  --impulse:#FF6B35;
}
html,body{background:var(--bg0);color:var(--t1);font-family:'Figtree',sans-serif;min-height:100vh;overflow-x:hidden;}

/* ── SCREENS ── */
.screen{display:none;min-height:100vh;}
.screen.active{display:flex;flex-direction:column;}

/* ── LOGO MARKS ── */
.imp-mark{position:relative;display:flex;align-items:center;justify-content:center;width:44px;height:44px;}
.imp-mark .imp-core{width:14px;height:14px;border-radius:50%;background:var(--impulse);position:relative;z-index:2;}
.imp-mark .imp-ring{position:absolute;border-radius:50%;border:2px solid var(--impulse);width:22px;height:22px;opacity:.4;}
.imp-mark.sm .imp-core{width:9px;height:9px;}
.imp-mark.sm .imp-ring{width:14px;height:14px;border-width:1.5px;}
.imp-mark.sm{width:26px;height:26px;}

@keyframes imp-pulse{0%{transform:scale(1);opacity:.65;}100%{transform:scale(2.4);opacity:0;}}
@keyframes imp-breathe{0%,100%{transform:scale(1);}50%{transform:scale(1.1);}}
.imp-mark.live .imp-ring{animation:imp-pulse 2.4s ease-out infinite;}
.imp-mark.live .imp-ring:nth-child(2){animation-delay:.8s;}
.imp-mark.live .imp-ring:nth-child(3){animation-delay:1.6s;}
.imp-mark.live .imp-core{animation:imp-breathe 2.4s ease-in-out infinite;}

.ar-logo{display:inline-flex;gap:3px;align-items:flex-end;}
.ar-logo span{display:block;border-radius:50%;}
.ar-logo span:nth-child(1){width:6px;height:6px;background:var(--rust);}
.ar-logo span:nth-child(2){width:8px;height:8px;background:var(--orange);margin-bottom:-1px;}
.ar-logo span:nth-child(3){width:10px;height:10px;background:var(--amber);margin-bottom:-2px;}
@keyframes ar-bob{0%,100%{transform:translateY(0);}50%{transform:translateY(-2px);}}
.ar-logo.live span:nth-child(1){animation:ar-bob 2.4s ease-in-out infinite;}
.ar-logo.live span:nth-child(2){animation:ar-bob 2.4s ease-in-out .3s infinite;}
.ar-logo.live span:nth-child(3){animation:ar-bob 2.4s ease-in-out .6s infinite;}

.mk-logo{display:inline-flex;align-items:flex-end;gap:3px;}
.mk-logo span{display:block;border-radius:2px;}
.mk-logo span:nth-child(1){width:5px;height:10px;background:rgba(123,191,181,.45);}
.mk-logo span:nth-child(2){width:5px;height:16px;background:rgba(123,191,181,.72);}
.mk-logo span:nth-child(3){width:5px;height:22px;background:#7BBFB5;}
@keyframes mk-breathe{0%,100%{transform:scaleY(1);}50%{transform:scaleY(1.3);}}
.mk-logo.live span{transform-origin:bottom;}
.mk-logo.live span:nth-child(1){animation:mk-breathe 1.8s ease-in-out infinite;}
.mk-logo.live span:nth-child(2){animation:mk-breathe 1.8s ease-in-out .25s infinite;}
.mk-logo.live span:nth-child(3){animation:mk-breathe 1.8s ease-in-out .5s infinite;}

.ht-logo{display:inline-flex;align-items:center;justify-content:center;position:relative;width:26px;height:26px;}
.ht-logo .ht-track{position:absolute;width:22px;height:22px;border-radius:50%;border:1.5px solid rgba(212,165,14,.35);}
.ht-logo .ht-sat{position:absolute;top:0;left:50%;transform:translateX(-50%) translateY(-1px);width:5px;height:5px;border-radius:50%;background:rgba(212,165,14,.7);}
.ht-logo .ht-core{width:7px;height:7px;border-radius:50%;background:var(--amber);z-index:2;position:relative;}
@keyframes ht-orbit{0%{transform:rotate(0deg) translateX(10px) rotate(0deg);}100%{transform:rotate(360deg) translateX(10px) rotate(-360deg);}}
@keyframes ht-pulse{0%,100%{opacity:.6;transform:scale(1);}50%{opacity:1;transform:scale(1.2);}}
.ht-logo.live .ht-core{animation:ht-pulse 2s ease-in-out infinite;}
.ht-logo.live .ht-sat{top:auto;left:50%;animation:ht-orbit 3.2s linear infinite;width:22px;height:22px;border-radius:0;background:none;}
.ht-logo.live .ht-sat::after{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:5px;height:5px;border-radius:50%;background:rgba(212,165,14,.75);box-shadow:0 0 6px var(--amber);}

/* ── LOGIN ── */
#screen-login{position:relative;align-items:center;justify-content:center;padding:32px;}
.login-bg{position:fixed;inset:0;pointer-events:none;}
.login-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.015) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.015) 1px,transparent 1px);background-size:48px 48px;}
.login-glow{position:absolute;top:20%;left:50%;transform:translateX(-50%);width:500px;height:400px;background:radial-gradient(ellipse,rgba(255,107,53,.08) 0%,transparent 70%);pointer-events:none;}
.login-inner{position:relative;z-index:1;max-width:380px;width:100%;text-align:center;}
.login-logo{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:40px;}
.login-wordmark{font-family:'Syne',sans-serif;font-weight:800;font-size:1.6rem;letter-spacing:-.02em;}
.login-wordmark .imp-col{color:var(--impulse);}
.login-title{font-family:'Instrument Serif',serif;font-size:2rem;line-height:1.1;letter-spacing:-.02em;margin-bottom:12px;}
.login-title em{font-style:italic;color:var(--impulse);}
.login-sub{font-size:.8rem;color:var(--t2);line-height:1.65;margin-bottom:36px;}
.btn-google{
  display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
  padding:13px 20px;border-radius:10px;border:1px solid var(--border);
  background:rgba(255,255,255,.04);color:var(--t1);font-family:'Figtree',sans-serif;
  font-size:.82rem;font-weight:700;cursor:pointer;transition:all .2s;margin-bottom:14px;
}
.btn-google:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);}
.login-terms{font-size:.62rem;color:var(--t3);line-height:1.6;}
.login-terms a{color:var(--t2);text-decoration:underline;}

/* ── TOPBAR ── */
.topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:0 20px;height:52px;border-bottom:1px solid var(--border);
  background:var(--bg0);position:sticky;top:0;z-index:100;flex-shrink:0;
}
.tb-brand{display:flex;align-items:center;gap:8px;}
.tb-wordmark{font-family:'Syne',sans-serif;font-weight:800;font-size:.92rem;letter-spacing:-.01em;}
.tb-wordmark .imp-col{color:var(--impulse);}
.tb-right{display:flex;align-items:center;gap:10px;}
.token-badge{
  display:flex;align-items:center;gap:5px;padding:4px 10px;
  border-radius:6px;background:rgba(255,107,53,.08);
  border:1px solid rgba(255,107,53,.15);
  font-size:.7rem;font-weight:700;color:var(--t2);
}
.token-sym{color:var(--impulse);}
.tb-avatar{
  width:28px;height:28px;border-radius:50%;
  background:rgba(255,107,53,.12);border:1px solid rgba(255,107,53,.2);
  display:flex;align-items:center;justify-content:center;
  font-size:.62rem;font-weight:800;color:var(--impulse);cursor:pointer;
}

/* ── HUB BODY ── */
.hub-body{flex:1;overflow-y:auto;padding:24px 20px 48px;}
.hub-welcome{margin-bottom:20px;}
.hub-greeting{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--t3);margin-bottom:3px;}
.hub-name{font-family:'Instrument Serif',serif;font-style:italic;font-size:1.6rem;color:var(--t1);}

/* Token wallet */
.token-wallet{
  background:var(--bg1);border:1px solid rgba(255,107,53,.2);
  border-radius:14px;padding:18px 20px;
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:12px;
}
.tw-label{font-size:.6rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,107,53,.6);margin-bottom:4px;}
.tw-balance{display:flex;align-items:baseline;gap:4px;}
.tw-num{font-family:'Instrument Serif',serif;font-size:2.2rem;line-height:1;color:var(--impulse);}
.tw-sym{font-size:.85rem;color:rgba(255,107,53,.5);font-weight:700;}
.tw-sub{font-size:.6rem;color:var(--t3);margin-top:2px;text-transform:uppercase;letter-spacing:.06em;font-weight:600;}
.btn-topup{
  padding:8px 14px;border-radius:8px;border:1px solid rgba(255,107,53,.3);
  background:rgba(255,107,53,.08);color:var(--impulse);font-size:.7rem;font-weight:700;
  font-family:'Figtree',sans-serif;cursor:pointer;transition:all .15s;
}
.btn-topup:hover{background:rgba(255,107,53,.15);}

/* Cost row */
.cost-row{display:flex;gap:8px;margin-bottom:24px;flex-wrap:wrap;}
.cost-item{
  display:flex;align-items:center;gap:6px;padding:5px 10px;
  border-radius:6px;background:rgba(255,255,255,.03);border:1px solid var(--border);
  font-size:.62rem;color:var(--t2);
}
.cost-prod{font-weight:800;padding:2px 6px;border-radius:3px;font-size:.58rem;}
.cost-prod.rk{background:rgba(42,155,173,.12);color:var(--teal);}
.cost-prod.mk{background:rgba(123,191,181,.12);color:var(--sage);}
.cost-prod.ht{background:rgba(212,165,14,.12);color:var(--amber);}

/* Hub label */
.hub-label{font-size:.6rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--t3);margin-bottom:12px;}

/* Product cards */
.products-grid{display:flex;flex-direction:column;gap:10px;}
.prod-card{
  display:flex;align-items:center;gap:14px;
  background:var(--bg1);border:1px solid var(--border);border-radius:14px;
  padding:16px;cursor:pointer;transition:all .2s;position:relative;
}
.prod-card:hover{transform:translateX(3px);}
.pc-rk:hover{border-color:rgba(42,155,173,.3);}
.pc-mk:hover{border-color:rgba(123,191,181,.3);}
.pc-ht:hover{border-color:rgba(212,165,14,.3);}
.pc-mark{width:32px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.pc-body{flex:1;min-width:0;}
.pc-name{font-size:.82rem;font-weight:800;margin-bottom:2px;}
.rk-col{color:var(--teal);}
.mk-col{color:var(--sage);}
.ht-col{color:var(--amber);}
.imp-col{color:var(--impulse);}
.pc-domain{font-size:.56rem;font-weight:600;letter-spacing:.06em;color:var(--t3);margin-bottom:5px;}
.pc-desc{font-size:.68rem;color:var(--t2);line-height:1.5;}
.pc-cost{font-size:.62rem;font-weight:700;color:var(--t3);white-space:nowrap;font-family:'DM Mono',monospace;}
.pc-arrow{font-size:1rem;color:var(--t3);flex-shrink:0;transition:transform .2s;}
.prod-card:hover .pc-arrow{transform:translateX(4px);color:var(--t2);}

/* Recent sessions */
.session-item{
  display:flex;align-items:center;gap:12px;
  padding:12px 14px;background:var(--bg1);border:1px solid var(--border);
  border-radius:10px;margin-bottom:8px;cursor:pointer;transition:all .15s;
}
.session-item:hover{border-color:rgba(255,255,255,.14);}
.si-score{
  font-family:'Instrument Serif',serif;font-size:1.4rem;width:40px;
  text-align:center;flex-shrink:0;
}
.si-body{flex:1;min-width:0;}
.si-brand{font-size:.75rem;font-weight:700;margin-bottom:2px;}
.si-meta{font-size:.6rem;color:var(--t3);}
.si-status{font-size:.55rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:2px 7px;border-radius:10px;}
.st-scored{background:rgba(42,155,173,.1);color:var(--teal);}
.st-variants{background:rgba(123,191,181,.1);color:var(--sage);}
.st-simulated{background:rgba(212,165,14,.1);color:var(--amber);}

.empty-state{padding:24px;text-align:center;font-size:.74rem;color:var(--t3);border:1px dashed var(--border);border-radius:10px;}

.hub-signout{margin-top:32px;text-align:center;}
.hub-signout button{background:none;border:none;color:var(--t3);font-size:.7rem;cursor:pointer;font-family:'Figtree',sans-serif;}
.hub-signout button:hover{color:var(--t2);}
