/* Golden Wolf // NOIR BLUE — responsive UI layer. All existing business controls remain. */
:root{
  color-scheme:dark;
  --gw-bg:#02060e;--gw-ink:#f5faff;--gw-muted:#96adc8;
  --gw-panel:#071221;--gw-panel-2:#0a2038;--gw-line:#1d456e;
  --gw-gold:#33baff;--gw-blue:#009dff;--gw-green:#42dbbb;--gw-red:#ff7588;
  --gw-shadow:rgba(0,0,0,.48);
  --gw-electric:#00b8ff;--gw-royal:#075cea;--gw-rim:#28659f;
  font-synthesis:none;
}
html{scroll-behavior:smooth;scroll-padding-top:116px}
body{
  background:radial-gradient(ellipse 76% 43% at 89% 3%,rgba(4,66,139,.28),transparent 68%),
    radial-gradient(ellipse 55% 70% at 3% 72%,rgba(0,73,154,.09),transparent 73%),#02060e;
  min-height:100dvh;
}
::selection{background:rgba(0,184,255,.38);color:white}
a{color:#55caff}a:hover{color:#d9f7ff}
.top{
  position:sticky;top:0;z-index:30;
  background:rgba(2,7,17,.92);border-bottom:1px solid rgba(33,122,205,.4);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
}
.top::after{content:"";position:absolute;inset:auto 0 0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(0,184,255,.55),transparent);pointer-events:none}
.top-inner{max-width:1600px;min-height:76px;padding:12px clamp(17px,3vw,45px);gap:18px}
.brand{display:inline-flex;gap:11px;align-items:center;font-size:18px;
  letter-spacing:.055em;font-weight:850;line-height:1.14;white-space:normal}
.brand img{width:42px;height:42px;filter:drop-shadow(0 0 12px rgba(0,155,255,.43));flex:none}
.brand b{color:#10b8ff}.brand small{font-size:9px;letter-spacing:.25em;display:block;
  margin-top:5px;font-weight:700;color:#8faecb}
.top-actions{flex-wrap:wrap;justify-content:flex-end}
#user-label{font-weight:700;font-size:13px;color:#c8dcf1}
.environment{color:#5dd4ff;border-color:#1c5d96;background:#06182b}
.button{background:linear-gradient(145deg,#0b1f34,#071322);border:1px solid #255780;
  color:#eaf6ff;border-radius:12px;font-weight:750;box-shadow:inset 0 1px rgba(255,255,255,.045);
  transition:border-color .17s,background .17s,box-shadow .17s,transform .17s;min-height:40px}
.button:hover{border-color:#1cb5ff;box-shadow:0 0 20px rgba(0,138,255,.15)}
.button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid #55caff;outline-offset:3px
}
.button.primary{
  background:linear-gradient(108deg,#33c9ff 0%,#057cef 46%,#0052d9 100%);
  border:1px solid #2fc7ff;color:#fff;text-shadow:0 1px 1px rgba(0,0,0,.35);
  box-shadow:0 9px 25px rgba(0,100,239,.24),inset 0 1px 0 rgba(255,255,255,.38)
}
.button.primary:hover{box-shadow:0 12px 34px rgba(0,145,255,.33)}
button:disabled{opacity:.5}
.eyebrow,.card-title small,.sidebar .label{color:#38c3ff}
.card{
  background:linear-gradient(148deg,rgba(10,29,51,.95),rgba(4,13,25,.98));
  border:1px solid rgba(51,115,174,.53);border-radius:19px;
  box-shadow:0 19px 50px rgba(0,0,0,.32),inset 0 1px 0 rgba(182,229,255,.07)
}
.card-title h2,.card h2{letter-spacing:-.027em}
input,select,textarea{
  background:#040d19;color:#f5faff;border-color:#264f75;min-height:46px;
  border-radius:11px;box-shadow:inset 0 1px 2px rgba(0,0,0,.25)
}
input:focus,textarea:focus,select:focus{border-color:#29b9ff}
input::placeholder,textarea::placeholder{color:#89a3bf}
.notice{background:rgba(12,39,66,.84);border-left-color:#17adff;color:#aebfce}
.notice.success{border-color:#42dbbb}.notice.error{border-color:#ff7588}
#message{margin:0 auto;padding-top:10px}
.auth-wrap{
  max-width:1600px;margin:0 auto;padding:clamp(18px,2vw,36px);
  min-height:calc(100dvh - 76px);
  grid-template-columns:minmax(0,1.19fr) minmax(340px,.81fr);
  gap:clamp(20px,2vw,44px);align-items:stretch
}
.hero{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:650px;border-radius:24px;padding:clamp(27px,4vw,65px);
  display:flex;flex-direction:column;justify-content:end;
  background:linear-gradient(170deg,rgba(1,9,20,.08),rgba(1,7,17,.15) 33%,#020710 95%),
   url('/wolf-scene.svg') center center / cover no-repeat;
  border:1px solid rgba(32,134,233,.45);
  box-shadow:0 25px 80px rgba(0,0,0,.4),0 0 33px rgba(0,122,255,.07);
}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;
  background:linear-gradient(10deg,rgba(1,6,14,.98) 0%,rgba(1,8,20,.54) 38%,rgba(1,6,16,.04) 82%)}
.hero::after{content:"";position:absolute;left:5%;right:5%;bottom:0;height:2px;
  background:linear-gradient(90deg,transparent,#078df0,transparent);box-shadow:0 0 14px #00a5ff}
.hero .eyebrow{font-size:clamp(10px,1vw,13px);letter-spacing:.24em;color:#81dfff}
.hero h1{max-width:660px;font-size:clamp(39px,5vw,70px);letter-spacing:-.056em;
  font-weight:830;line-height:1.07;text-wrap:balance;
  text-shadow:0 3px 14px rgba(0,0,0,.7)}
.hero h1 em{color:#2cbaff;text-shadow:0 0 17px rgba(0,135,255,.35)}
.hero>p{font-size:clamp(15px,1.35vw,20px);color:#c5d6e7;line-height:1.52;
  text-shadow:0 2px 14px #000}
.hero-grid{margin-top:21px;gap:9px}
.hero-grid div{border-color:rgba(40,108,167,.6);background:rgba(2,12,26,.76);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  padding:16px 14px;min-height:84px;line-height:1.45;color:#92b5d9}
.hero-grid strong{font-size:17px;color:#f7fbff}
.hero .notice{background:rgba(3,17,33,.78);font-size:12px;max-width:730px;
  border:1px solid #164f7e;border-left:3px solid #098ce7;line-height:1.5}
.hero-wordmark{position:absolute;top:38px;left:clamp(25px,4vw,64px);
  display:flex;align-items:center;gap:15px}
.hero-wordmark img{width:66px;height:66px;filter:drop-shadow(0 0 24px rgba(13,156,255,.6))}
.hero-wordmark span{font-weight:860;font-size:clamp(19px,2.5vw,30px);letter-spacing:.13em;
  text-shadow:0 2px 10px #000}
.hero-wordmark b{color:#35bfff}
.hero-wordmark small{display:block;color:#b8d3eb;letter-spacing:.27em;font-size:9px;
  margin-top:6px}
.auth-card{
  max-width:none;justify-self:stretch;align-self:center;
  padding:clamp(23px,3vw,48px);position:relative;overflow:hidden;
  background:linear-gradient(145deg,rgba(8,25,45,.97),rgba(3,10,23,.98));
  border:1px solid #2389d7;box-shadow:0 0 36px rgba(0,116,255,.17),0 30px 70px rgba(0,0,0,.45)
}
.auth-card::before{content:"";position:absolute;inset:0 0 auto;height:2px;
  background:linear-gradient(90deg,transparent,#00baff,transparent);box-shadow:0 0 15px #02a5ff}
.auth-card .auth-kicker{font-size:11px;letter-spacing:.26em;color:#3cc8ff;
  font-weight:900;text-transform:uppercase}
.auth-card h2{font-size:clamp(26px,3vw,39px);letter-spacing:-.045em;margin:10px 0 8px}
.auth-card .auth-subtitle{margin:0 0 24px;color:#a9c5df}
.auth-card .tabs{background:#030c19;padding:5px;border:1px solid #224b76;
  border-radius:13px;margin-bottom:22px}
.auth-card .tabs .button{border-color:transparent;background:transparent;flex:1;
  min-height:44px}
.auth-card .tabs .button.active{color:#f7fdff;border-color:#2eacfc;
  background:linear-gradient(120deg,#04396c,#0755a2);
  box-shadow:inset 0 1px rgba(255,255,255,.17),0 0 14px rgba(0,134,255,.12)}
.auth-card label{color:#c5d7e9}
.auth-card #auth-submit{width:100%;min-height:53px;margin-top:8px}
.auth-card .stack{gap:17px}
.auth-card .auth-footnote{display:flex;align-items:start;gap:10px;
  margin:21px 0 0;padding:17px 13px;border:1px solid #174870;
  border-radius:13px;background:rgba(10,43,76,.45);color:#a7c4dc;line-height:1.55;
  font-size:12px}
.auth-card .auth-footnote svg{width:21px;height:21px;flex:none;stroke:#28baff}
.field-wrap{position:relative}
.field-wrap input{padding-right:47px}
.password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);
  width:36px;height:36px;border:0;background:transparent;color:#93b5d5;font-size:18px;
  border-radius:8px;display:grid;place-items:center}
.password-toggle:hover{color:#3dcaff;background:#0b2d4e}
.auth-tools{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:0}
.auth-tools .text-link{color:#45c9ff;background:transparent;border:0;padding:5px;
  font-weight:700;font-size:13px;text-decoration:underline;text-underline-offset:4px}
.auth-secure{display:flex;gap:7px;align-items:center;font-size:12px;color:#94b1cc}
.auth-secure::before{content:"";width:10px;height:10px;border:2px solid #2fd2fc;
  border-radius:50%;box-shadow:0 0 8px #168fe5}
.auth-card [id=register-details]{display:grid;gap:12px}
.auth-card [id=register-details][hidden]{display:none!important}
.ecosystem-link{color:#85d9ff;text-decoration:none;display:inline-flex;
  gap:8px;align-items:center;font-size:13px;padding:8px 0}
.ecosystem-link:hover{text-decoration:underline}
.workspace{
  grid-template-columns:260px minmax(0,1fr);
  min-height:calc(100dvh - 76px);
}
.sidebar{
  position:sticky;top:76px;align-self:start;height:calc(100dvh - 76px);overflow-y:auto;
  border-right:1px solid #1d4770;background:linear-gradient(165deg,#071a30,#020914);
  box-shadow:inset -1px 0 rgba(0,124,255,.14);padding:24px 17px;
  scrollbar-width:thin;scrollbar-color:#2f628e transparent
}
.sidebar::before{content:"";display:block;width:61px;height:61px;margin:0 8px 14px;
  background:url('/wolf-mark.svg') center/contain no-repeat;
  filter:drop-shadow(0 0 14px rgba(0,153,255,.45))}
.sidebar .label{margin:12px 11px 20px;color:#d5e8ff;font-weight:800}
.sidebar .navitem{color:#a1b9d0;border-radius:11px;letter-spacing:.005em;
  margin-bottom:6px;transition:background .15s,border .15s}
.sidebar .navitem:hover,.sidebar .navitem.active{border-color:#207bbd;
  background:linear-gradient(90deg,rgba(0,133,255,.3),rgba(10,42,77,.8));
  color:#f8fbff;box-shadow:inset 3px 0 #19baff}
.main{max-width:1510px;padding:clamp(17px,2.3vw,40px)}
.command-hero{position:relative;overflow:hidden;border:1px solid #1a6aaa;
  border-radius:19px;padding:clamp(20px,3vw,40px);margin-bottom:24px;
  background:linear-gradient(95deg,rgba(1,10,22,.95),rgba(1,13,31,.88) 54%,rgba(1,18,43,.42)),
   url('/wolf-scene.svg') right 43% / cover no-repeat;
  box-shadow:inset 0 1px rgba(255,255,255,.04),0 17px 38px rgba(0,0,0,.3)}
.command-hero::after{content:"";position:absolute;left:0;bottom:0;width:75%;height:2px;
  background:linear-gradient(90deg,#009cf8,transparent);box-shadow:0 0 15px #009cf8}
.command-hero .eyebrow{color:#65d4ff}
.command-hero h2{max-width:700px;font-size:clamp(23px,3.1vw,38px);
  letter-spacing:-.038em;margin:9px 0 5px}
.command-hero p{margin:5px 0 19px;color:#b8cce0;max-width:640px;line-height:1.55}
.command-hero .ecosystem-access{display:flex;gap:11px;flex-wrap:wrap}
.command-hero .ecosystem-access a{border:1px solid #1c639e;border-radius:11px;
  padding:10px 15px;background:rgba(3,19,42,.77);text-decoration:none;color:#d6edff;
  font-weight:750;font-size:13px}
.command-hero .ecosystem-access a:hover{background:rgba(5,78,138,.65);border-color:#26baff}
.command-hero .ecosystem-access a[aria-current=page]{background:linear-gradient(110deg,#08477a,#0662ab);
  border-color:#28bbff}
.workspace-head{margin-bottom:23px}
.workspace-head h1{font-size:clamp(28px,3vw,39px);color:#e9f6ff}
.org-picker{max-width:350px}
.metrics{gap:14px}
.metric{position:relative;overflow:hidden;min-height:116px;border:1px solid #1f507d;
  background:linear-gradient(140deg,#0b213b,#061324);border-radius:15px;
  box-shadow:inset 0 1px rgba(255,255,255,.04)}
.metric::before{content:"";position:absolute;inset:0 0 auto;height:2px;
  background:linear-gradient(90deg,#00a6fa,transparent)}
.metric span{font-size:12px;color:#a4bfd9}.metric strong{color:#f3faff;font-size:29px}
.section{scroll-margin-top:104px}
ul.clean li small{display:block;margin:5px 0}
ul.clean li .button{margin:8px 8px 4px 0}
.footer{text-align:center;color:#7f99b3;border-top-color:#19426a}
.dialog-backdrop{background:#000}
dialog.security-dialog{
  border:1px solid #207ec1;border-radius:19px;padding:0;color:#f4faff;
  background:linear-gradient(155deg,#091f39,#030a15 85%);
  box-shadow:0 0 0 1px rgba(20,148,233,.15),0 30px 120px #000,0 0 65px rgba(0,126,255,.2);
  width:min(460px,calc(100vw - 28px));max-height:min(86dvh,730px);overflow:auto
}
dialog.security-dialog::backdrop{background:rgba(0,5,12,.79);backdrop-filter:blur(11px)}
.dialog-header{display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:23px 23px 8px}
.dialog-header h2{margin:0;letter-spacing:-.035em;font-size:24px}
.dialog-content{padding:14px 23px 23px}
.dialog-content p{color:#b2cce4;line-height:1.55;margin:0 0 20px}
.dialog-content label{color:#d1e4f4}
.dialog-content .button.primary{width:100%;min-height:51px;margin-top:18px}
.dialog-content .mini-help{color:#91afcb;font-size:12px;margin:17px 0 0}
.dialog-icon{width:47px;height:47px;margin-bottom:13px;
  background:url('/wolf-mark.svg') center/contain no-repeat;filter:drop-shadow(0 0 10px #159df6)}
.icon-close{border:1px solid #2b527b;color:#bdd9ed;background:#071a2d;border-radius:9px;
  width:37px;height:37px}
.dialog-secret{overflow-wrap:anywhere;border:1px dashed #2873aa;border-radius:12px;
  padding:15px;background:#03101f;color:#bce9ff;user-select:all}
@media(max-width:1160px){
  .auth-wrap{grid-template-columns:minmax(0,1fr) minmax(320px,.9fr);gap:16px}
  .hero{padding:29px;min-height:630px}
  .hero-wordmark{left:29px}
  .workspace{grid-template-columns:220px minmax(0,1fr)}
}
@media(max-width:850px){
  .top-inner{min-height:64px}.brand img{height:36px;width:36px}
  .top{position:sticky}
  .auth-wrap{grid-template-columns:1fr;gap:0;padding:0 0 35px}
  .hero{border-radius:0;min-height:400px;padding:25px 22px 27px;
    justify-content:end;border-left:0;border-right:0;
    background-position:center 34%}
  .hero-wordmark{top:20px;left:22px;gap:10px}
  .hero-wordmark img{width:45px;height:45px}
  .hero-wordmark span{font-size:18px}.hero h1{font-size:clamp(32px,6vw,45px)}
  .hero>p{margin:8px 0}.hero-grid{margin-top:14px}
  .hero-grid div{padding:11px;font-size:12px;min-height:67px}
  .hero-grid strong{font-size:15px}
  .hero .notice{display:none}
  .auth-card{max-width:min(620px,calc(100% - 30px));width:100%;
    margin:-13px auto 0;z-index:2;box-shadow:0 15px 50px rgba(0,0,0,.55)}
  .workspace{grid-template-columns:1fr}
  .sidebar{position:sticky;top:64px;height:auto;max-width:100vw;overflow-x:auto;
    overflow-y:hidden;display:flex;gap:7px;align-items:center;
    padding:9px 13px;background:rgba(3,13,27,.96);
    border-bottom:1px solid #1b5e9a;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);
    scrollbar-width:none;z-index:10}
  .sidebar::-webkit-scrollbar{display:none}
  .sidebar::before,.sidebar .label{display:none}
  .sidebar .navitem{flex:none;margin:0;padding:10px 12px}
  .main{padding:22px 15px 50px}.command-hero{margin-bottom:23px}
  .section{scroll-margin-top:130px}
}
@media(max-width:540px){
  .top-inner{padding:9px 12px;gap:6px;min-height:64px}
  .brand{font-size:13px;gap:6px}.brand img{width:32px;height:32px}
  .brand small{font-size:7px;letter-spacing:.12em}
  #user-label{max-width:92px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .top-actions{gap:5px}.top-actions .button.small{padding:7px 8px;font-size:11px}
  .hero{min-height:363px;padding:18px 16px 21px}
  .hero-wordmark{left:17px;top:17px}
  .hero h1{font-size:32px}
  .hero>p{font-size:13px;line-height:1.42}
  .hero-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .hero-grid div{font-size:10px;padding:9px 6px}
  .hero-grid strong{font-size:13px}
  .auth-card{max-width:calc(100% - 24px);padding:22px 18px}
  .auth-card h2{font-size:29px}
  .auth-tools{align-items:center}
  .command-hero{padding:23px 18px;background-position:73% center}
  .command-hero h2{font-size:25px}
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .metric{min-height:101px;padding:14px}
  .metric strong{font-size:24px}
  .panels{gap:11px}
  .card{padding:19px 15px}
  .main{padding:16px 12px 40px}
  .grid2{grid-template-columns:1fr}
  .sidebar{top:63px}
  .section{scroll-margin-top:133px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important}
}