/* =========================================================
   SONOFPOLLUX PORTAL v2.6 — AFTERHOURS INTERFACE
   Shared editorial polish + command/search layer.
   Loaded by portal-bridge.js and on authenticated surfaces.
========================================================= */
:root{
  --sop-ink:#07080d;
  --sop-paper:#f5f2eb;
  --sop-surface:rgba(255,255,255,.055);
  --sop-surface-strong:rgba(255,255,255,.085);
  --sop-line:rgba(255,255,255,.105);
  --sop-muted:rgba(246,245,251,.62);
  --sop-pink:#ff89bd;
  --sop-blue:#8ea8ff;
  --sop-ice:#b9f4ec;
  --sop-violet:#9d85ff;
  --sop-radius:22px;
  --sop-radius-sm:15px;
  --sop-shadow:0 24px 80px rgba(0,0,0,.32);
}

html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(80rem 45rem at 8% -10%, rgba(255,137,189,.075), transparent 56%),
    radial-gradient(70rem 45rem at 96% 4%, rgba(142,168,255,.07), transparent 58%),
    #08090f;
}
body::selection{background:rgba(255,137,189,.28);color:#fff}

/* calmer, more editorial navigation */
.topbar{
  border-bottom-color:rgba(255,255,255,.075)!important;
  background:rgba(8,9,15,.76)!important;
  backdrop-filter:blur(20px) saturate(130%);
  -webkit-backdrop-filter:blur(20px) saturate(130%);
}
.brand__mark{filter:drop-shadow(0 0 18px rgba(255,137,189,.22))}
.nav{gap:2px!important}
.nav__link{
  border:1px solid transparent;
  border-radius:999px!important;
  padding:.58rem .78rem!important;
  font-size:.77rem!important;
  letter-spacing:.015em;
}
.nav__link:hover,.nav__link:focus-visible{
  border-color:rgba(255,255,255,.085);
  background:rgba(255,255,255,.05)!important;
}
.nav__link--hot{
  color:#fff!important;
  background:linear-gradient(135deg,rgba(255,137,189,.12),rgba(142,168,255,.08))!important;
  border-color:rgba(255,255,255,.08)!important;
}

/* cards feel more like fashion/editorial panels than generic dashboards */
.panel,.card,.featureCard{
  border-color:var(--sop-line)!important;
}
.featureCard{
  position:relative;
  overflow:hidden;
  min-height:285px;
  background:
    linear-gradient(150deg,rgba(255,255,255,.055),rgba(255,255,255,.025))!important;
  box-shadow:0 1px 0 rgba(255,255,255,.04) inset;
}
.featureCard::after{
  content:"";
  position:absolute;
  width:190px;height:190px;border-radius:50%;
  right:-110px;bottom:-125px;
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 0 0 30px rgba(255,255,255,.015),0 0 0 62px rgba(255,255,255,.01);
  pointer-events:none;
}
@media(hover:hover){
  .featureCard:hover{
    transform:translateY(-4px)!important;
    border-color:rgba(255,255,255,.17)!important;
    background:linear-gradient(150deg,rgba(255,255,255,.075),rgba(255,255,255,.03))!important;
  }
}
.featureCard .tag,.kicker{
  letter-spacing:.16em!important;
  font-size:.68rem!important;
}
.featureTitle{letter-spacing:-.035em!important}

/* v2.6 homepage editorial surfaces */
.afterHero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(290px,.7fr);
  gap:clamp(22px,5vw,70px);
  align-items:end;
  padding-top:clamp(72px,10vw,138px);
  padding-bottom:clamp(48px,7vw,90px);
}
.afterHero__eyebrow{
  display:flex;align-items:center;gap:10px;
  color:rgba(255,255,255,.58);
  font-size:11px;font-weight:800;letter-spacing:.17em;text-transform:uppercase;
}
.afterHero__eyebrow::before{content:"";width:36px;height:1px;background:rgba(255,255,255,.34)}
.afterHero h1{
  max-width:12ch;
  margin:16px 0 18px;
  font-size:clamp(52px,8vw,108px);
  line-height:.88;
  letter-spacing:-.068em;
  font-weight:780;
}
.afterHero h1 em{
  display:block;
  color:rgba(255,255,255,.47);
  font-style:normal;
  font-weight:560;
}
.afterHero__lead{
  max-width:660px;
  color:rgba(255,255,255,.66);
  font-size:clamp(16px,2vw,20px);
  line-height:1.62;
}
.afterHero__actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:27px}
.afterHero__side{
  padding:24px;
  border:1px solid rgba(255,255,255,.105);
  border-radius:26px;
  background:linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.022));
  box-shadow:var(--sop-shadow);
}
.afterHero__sideTop{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}
.afterHero__status{
  display:inline-flex;align-items:center;gap:8px;
  color:rgba(255,255,255,.66);
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;
}
.afterHero__status::before{
  content:"";width:7px;height:7px;border-radius:50%;background:#c5f6dc;
  box-shadow:0 0 0 5px rgba(197,246,220,.07);
}
.afterHero__side h2{margin:18px 0 7px;font-size:27px;letter-spacing:-.035em}
.afterHero__side p{margin:0;color:var(--sop-muted);line-height:1.55}
.afterHero__steps{display:grid;gap:8px;margin-top:22px}
.afterHero__step{
  display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:10px;
  padding:11px 0;border-top:1px solid rgba(255,255,255,.075);
  text-decoration:none;color:inherit;
}
.afterHero__stepNum{font-size:10px;color:rgba(255,255,255,.38);font-weight:850;letter-spacing:.1em}
.afterHero__stepLabel{font-size:13px;font-weight:720}
.afterHero__stepArrow{color:rgba(255,255,255,.34)}
.afterHero__step:hover .afterHero__stepArrow{color:#fff;transform:translateX(2px)}

.portalRail{
  display:grid;
  grid-template-columns:1.45fr .8fr .8fr;
  gap:12px;
}
.portalRail__card{
  position:relative;overflow:hidden;
  min-height:260px;
  padding:26px;
  border:1px solid rgba(255,255,255,.095);
  border-radius:24px;
  background:rgba(255,255,255,.035);
  color:inherit;text-decoration:none;
}
.portalRail__card--radio{
  min-height:330px;
  background:
    radial-gradient(28rem 22rem at 85% 20%,rgba(255,137,189,.11),transparent 58%),
    linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
}
.portalRail__label{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.46);font-weight:850}
.portalRail__card h3{margin:16px 0 8px;font-size:clamp(24px,3vw,40px);letter-spacing:-.045em}
.portalRail__card p{max-width:42ch;margin:0;color:rgba(255,255,255,.59);line-height:1.55}
.portalRail__footer{position:absolute;left:26px;right:26px;bottom:22px;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:12px}
.portalRail__meter{height:1px;flex:1;background:linear-gradient(90deg,rgba(255,137,189,.7),rgba(142,168,255,.18))}
.portalRail__card:hover{border-color:rgba(255,255,255,.18);background-color:rgba(255,255,255,.05)}

.portalUtility{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
}
.portalUtility a{
  min-height:120px;padding:18px;
  display:flex;flex-direction:column;justify-content:space-between;
  border:1px solid rgba(255,255,255,.08);
  border-radius:19px;background:rgba(255,255,255,.025);
  text-decoration:none;color:inherit;
}
.portalUtility a:hover{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14)}
.portalUtility b{font-size:15px}
.portalUtility span{color:rgba(255,255,255,.47);font-size:11px;line-height:1.4}

/* universal command/search */
.portalCommandTrigger{
  position:static;
  right:auto;
  bottom:auto;
  z-index:auto;
  flex:0 0 auto;
  min-height:40px;
  display:flex;align-items:center;gap:9px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:999px;
  background:rgba(9,10,16,.80);
  color:rgba(255,255,255,.79);
  box-shadow:0 16px 42px rgba(0,0,0,.32);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  font:700 11px/1 system-ui,-apple-system,sans-serif;
  letter-spacing:.03em;
  cursor:pointer;
}
.portalCommandTrigger:hover{border-color:rgba(255,255,255,.2);color:#fff;background:rgba(16,17,25,.92)}
.portalCommandTrigger kbd{
  padding:4px 6px;border:1px solid rgba(255,255,255,.10);border-radius:7px;
  background:rgba(255,255,255,.055);font:700 9px/1 system-ui;color:rgba(255,255,255,.53)
}
.portalCommand[hidden]{display:none!important}
.portalCommand{
  position:fixed;inset:0;z-index:10020;
  display:grid;place-items:start center;
  padding:clamp(60px,11vh,110px) 16px 30px;
  background:rgba(4,5,9,.62);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.portalCommand__panel{
  width:min(720px,100%);
  max-height:min(700px,78vh);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.13);
  border-radius:26px;
  background:rgba(12,13,20,.96);
  box-shadow:0 38px 110px rgba(0,0,0,.62);
}
.portalCommand__search{
  display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;
  padding:17px 18px;border-bottom:1px solid rgba(255,255,255,.085);
}
.portalCommand__searchIcon{font-size:17px;color:rgba(255,255,255,.46)}
.portalCommand__input{
  min-width:0;width:100%;
  border:0!important;outline:0!important;background:transparent!important;
  color:#fff!important;font:650 18px/1.3 system-ui,-apple-system,sans-serif!important;
  box-shadow:none!important;
}
.portalCommand__input::placeholder{color:rgba(255,255,255,.32)}
.portalCommand__esc{font-size:9px;letter-spacing:.08em;color:rgba(255,255,255,.36);border:1px solid rgba(255,255,255,.08);padding:5px 7px;border-radius:7px}
.portalCommand__body{overflow:auto;max-height:calc(min(700px,78vh) - 62px);padding:12px}
.portalCommand__hint{padding:12px 10px 7px;color:rgba(255,255,255,.33);font-size:9px;letter-spacing:.14em;text-transform:uppercase;font-weight:900}
.portalCommand__results{display:grid;gap:3px}
.portalCommand__item{
  display:grid;grid-template-columns:38px 1fr auto;gap:12px;align-items:center;
  min-height:56px;padding:8px 10px;
  border-radius:14px;color:inherit;text-decoration:none;border:1px solid transparent;
}
.portalCommand__item:hover,.portalCommand__item.is-active{
  background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.07)
}
.portalCommand__icon{
  width:38px;height:38px;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(135deg,rgba(255,137,189,.10),rgba(142,168,255,.08));
  border:1px solid rgba(255,255,255,.065);font-size:13px;font-weight:900;
}
.portalCommand__title{display:block;font-size:13px;font-weight:780}
.portalCommand__meta{display:block;margin-top:3px;color:rgba(255,255,255,.43);font-size:10px}
.portalCommand__type{color:rgba(255,255,255,.30);font-size:9px;letter-spacing:.1em;text-transform:uppercase;font-weight:800}
.portalCommand__empty{padding:34px 18px;text-align:center;color:rgba(255,255,255,.42);font-size:13px}

/* refined authenticated/project surfaces */
.portalV26Shell{
  --page-width:1180px;
}
.portalV26Shell .wrap,.portalV26Shell .pageWrap{max-width:var(--page-width)}
.portalV26Shell .projectCard,.portalV26Shell .accountCard{
  border-radius:22px!important;
  background:linear-gradient(150deg,rgba(255,255,255,.052),rgba(255,255,255,.025))!important;
}
.portalV26Eyebrow{
  color:rgba(255,255,255,.42);font-size:10px;font-weight:850;letter-spacing:.16em;text-transform:uppercase;
}

/* mobile */
@media(max-width:900px){
  .afterHero{grid-template-columns:1fr;padding-top:72px}
  .afterHero h1{max-width:9ch}
  .portalRail{grid-template-columns:1fr 1fr}
  .portalRail__card--radio{grid-column:1/-1}
  .portalUtility{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .portalCommandTrigger{min-width:38px;padding:0 10px}
  .portalCommandTrigger span{display:none}
  .portalCommandTrigger kbd{display:none}
  .afterHero h1{font-size:clamp(52px,16vw,78px)}
  .portalRail{grid-template-columns:1fr}
  .portalRail__card--radio{grid-column:auto}
}
@media(max-width:520px){
  .portalUtility{grid-template-columns:1fr 1fr}
  .portalUtility a{min-height:105px}
  .portalCommand{padding-top:42px}
  .portalCommand__panel{border-radius:20px}
}
@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important}
  .featureCard,.portalRail__card,.portalCommand__item{transition:none!important}
}


/* authenticated continue strip */
.portalContinue{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;
}
.portalContinue__item,.portalContinue__signin,.portalContinue__empty{
  min-height:112px;padding:16px;
  border:1px solid rgba(255,255,255,.08);border-radius:18px;
  background:rgba(255,255,255,.027);color:inherit;text-decoration:none;
}
.portalContinue__item{
  display:grid;grid-template-columns:32px 1fr auto;gap:11px;align-items:center;
}
.portalContinue__item:hover{background:rgba(255,255,255,.052);border-color:rgba(255,255,255,.15)}
.portalContinue__icon{
  width:32px;height:32px;display:grid;place-items:center;border-radius:10px;
  background:linear-gradient(135deg,rgba(255,137,189,.10),rgba(142,168,255,.08));
  border:1px solid rgba(255,255,255,.06);font-size:12px;font-weight:900;
}
.portalContinue__copy{min-width:0;display:flex;flex-direction:column;gap:3px}
.portalContinue__copy small{font-size:8px;letter-spacing:.11em;text-transform:uppercase;color:rgba(255,255,255,.35);font-style:normal}
.portalContinue__copy b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.portalContinue__copy em{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:rgba(255,255,255,.42);font:normal 9px/1.3 system-ui}
.portalContinue__go{color:rgba(255,255,255,.28)}
.portalContinue__signin,.portalContinue__empty{
  grid-column:1/-1;display:flex;align-items:center;justify-content:center;
  color:rgba(255,255,255,.52);font-size:12px;text-align:center;
}
@media(max-width:900px){.portalContinue{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.portalContinue{grid-template-columns:1fr}}


/* Signals refresh — cleaner discovery surface */
.signals-page{
  background:
    radial-gradient(60rem 34rem at 8% -8%,rgba(142,168,255,.08),transparent 60%),
    #08090f!important;
}
.signals-nav{
  background:rgba(8,9,15,.82)!important;
  border-bottom:1px solid rgba(255,255,255,.075)!important;
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
}
.signals-brand span{letter-spacing:.04em}
.signals-brand small{opacity:.42!important;letter-spacing:.12em}
.signal-card{
  border-radius:20px!important;
  border-color:rgba(255,255,255,.085)!important;
  background:linear-gradient(150deg,rgba(255,255,255,.048),rgba(255,255,255,.022))!important;
  overflow:hidden;
}
.signal-card:hover{border-color:rgba(255,255,255,.16)!important;transform:translateY(-2px)}
.signal-thumb img{filter:saturate(.82) contrast(1.03)}
.signals-panel{
  border-radius:22px!important;
  border-color:rgba(255,255,255,.09)!important;
  background:rgba(255,255,255,.035)!important;
}
.signals-kicker{letter-spacing:.15em!important;color:rgba(255,255,255,.38)!important}

/* FollowLikes gets the same outer-shell language without changing its game UI */
.fl-header{
  background:rgba(8,9,15,.84)!important;
  border-bottom-color:rgba(255,255,255,.075)!important;
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
}
.fl-brand-mark{box-shadow:none!important}
.fl-nav a{border-radius:999px!important}
.fl-nav a:hover{background:rgba(255,255,255,.055)!important}

/* v2.7.1 — global control cleanup: search belongs to the header, never the viewport edge. */
.portalCommandTrigger--header{position:static!important;inset:auto!important;margin:0!important;box-shadow:none}
@media(max-width:860px){
  .portalCommandTrigger--header span,.portalCommandTrigger--header kbd{display:none!important}
  .portalCommandTrigger--header{width:38px;min-width:38px;height:38px;padding:0!important;justify-content:center}
}


/* v2.8 edge guard — search only exists inside a page header. */
.portalCommandTrigger{position:static!important;inset:auto!important;right:auto!important;bottom:auto!important}
.portalCommandTrigger:not(.portalCommandTrigger--header){display:none!important}
.portalCommandTrigger--header{display:inline-flex!important}