:root{--black:#080808;--panel:#141414;--line:#282828;--yellow:#ffd21f;--paper:#fffaf0;--red:#d83b32;--green:#20a46b;font-family:Inter,system-ui,Segoe UI,Arial,sans-serif;background:#0b0b0b;color:#fff}*{box-sizing:border-box}body{margin:0;display:grid;grid-template-columns:250px 1fr;min-height:100vh;background:#0b0b0b}.sidebar{background:#050505;border-right:1px solid #242424;padding:18px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;overflow-y:auto}.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:900;margin-bottom:18px}.brand span{display:grid;place-items:center;width:34px;height:34px;border-radius:8px;background:var(--yellow);color:#000}.sidebar-group-label{margin:14px 4px 6px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:900;color:#888}.sidebar-group{display:grid;gap:4px}.sidebar a{color:#ddd;text-decoration:none;font-weight:800;padding:10px 12px;border-radius:8px;font-size:14px;display:flex;align-items:center;justify-content:space-between;gap:8px}.sidebar a:hover,.sidebar a.nav-active{background:#171717;color:var(--yellow)}.nav-count{display:inline-grid;place-items:center;min-width:22px;height:20px;border-radius:999px;background:#2a2a2a;color:#fff;font-size:11px;padding:0 6px}.sidebar a.nav-active .nav-count{background:var(--yellow);color:#080808}.customer-home-link{margin-top:18px;padding:12px;border-radius:8px;border:1px solid #333;color:var(--yellow)!important;text-decoration:none;font-weight:900;text-align:center;display:block!important}.customer-home-link:hover{background:#171717}
.nav-toggle{display:none;position:fixed;top:14px;left:14px;z-index:1100;width:44px;height:44px;border-radius:10px;background:#080808;border:1px solid #2a2a2a;padding:0;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.nav-toggle span{display:block;width:20px;height:2px;background:#fff;border-radius:2px;transition:transform .2s,opacity .2s}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.nav-backdrop{position:fixed;inset:0;background:#000000a8;backdrop-filter:blur(2px);z-index:1080}
.nav-backdrop[hidden]{display:none}
.topbar-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.home-back{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.app{padding:24px;max-width:1320px;width:100%;margin:auto}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.eyebrow{margin:0 0 6px;color:var(--yellow);font-size:12px;text-transform:uppercase;font-weight:900;letter-spacing:.08em}h1,h2,h3{margin:0 0 12px}h1{font-size:38px}.route{display:none}.route.active{display:block}.panel{background:#141414;border:1px solid #282828;border-radius:10px;padding:18px}.login{max-width:440px}.login-lead{color:#cfcfcf;line-height:1.5;margin:-4px 0 16px}.inline-link{color:var(--yellow);font-weight:900}.hero-strip{min-height:240px;border-radius:10px;padding:26px;display:flex;align-items:end;background:linear-gradient(90deg,#090909 0%,#090909d0 45%,#09090950),url('/assets/hero-gcc-auto.png') center/cover;border:1px solid #282828}.hero-strip p{max-width:560px;color:#ddd}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:16px 0}.metric{background:#151515;border:1px solid #2b2b2b;border-radius:10px;color:#fff;text-align:left;padding:18px;cursor:pointer;transition:border-color .15s,transform .15s}.metric:hover{border-color:var(--yellow);transform:translateY(-1px)}.metric strong{display:block;color:var(--yellow);font-size:32px;line-height:1.1}.metric span{font-weight:800;color:#ddd;font-size:13px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:16px}.card{background:#fff;color:#141414;border-radius:10px;padding:16px;border:1px solid #e4deca}.card.dark{background:#141414;color:#fff;border-color:#282828}.btn{border:0;border-radius:10px;background:var(--yellow);color:#070707;font-weight:900;padding:13px 16px;min-height:44px;cursor:pointer}.btn.secondary{background:#2d2d2d;color:#fff}.btn.full{width:100%}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}label{display:block;font-weight:900;margin:10px 0 6px}input,textarea{width:100%;border:1px solid #3a3a3a;border-radius:10px;background:#0d0d0d;color:#fff;padding:13px;font-size:16px}textarea{min-height:94px}.state,.selected{margin-top:12px;color:#cfcfcf}.camera-box{height:220px;border:2px dashed #4b4b4b;border-radius:10px;display:grid;place-items:center;color:#aaa;background:#0d0d0d}.badge{display:inline-flex;border-radius:999px;padding:6px 10px;font-weight:900;font-size:12px}.pending{background:#fff0b8;color:#111}.verified{background:#e4f8ed;color:#0b6d42}.disputed,.rejected{background:#ffe4e1;color:#a6221a}.draft{background:#eee;color:#333}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.tabs button{background:#191919;color:#fff;border:1px solid #333;border-radius:10px;padding:10px 12px;font-weight:800}.toast{position:fixed;right:18px;bottom:18px;z-index:20;background:#111;border-left:5px solid var(--yellow);padding:13px 15px;border-radius:10px}
*:focus-visible{outline:2px solid var(--yellow);outline-offset:2px}
@media(max-width:900px){
  body{grid-template-columns:1fr}
  .nav-toggle{display:flex}
  .sidebar{position:fixed;top:0;left:0;z-index:1090;width:min(280px,86vw);height:100vh;transform:translateX(-100%);transition:transform .25s ease;box-shadow:0 18px 60px #000a;padding-top:64px}
  body.nav-open .sidebar{transform:translateX(0)}
  body.nav-open .nav-backdrop[hidden]{display:block}
  .sidebar nav,.sidebar-group{grid-template-columns:1fr}
  .app{padding:14px;padding-top:64px}
  .metrics,.grid2{grid-template-columns:1fr}
  .topbar{align-items:flex-start;gap:12px;flex-direction:column;padding-left:54px;min-height:48px}
} 

.brand-logo-link{align-items:flex-start;flex-direction:column;gap:8px}.brand-logo{display:block;width:auto;object-fit:contain}.brand-logo-horizontal{height:48px;max-width:190px;filter:drop-shadow(0 10px 22px #0008)}.brand-context{display:inline-flex!important;width:auto!important;height:auto!important;border-radius:999px!important;background:#1a1808!important;color:var(--yellow)!important;padding:4px 10px;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.brand span:not(.brand-context){background:transparent!important;color:transparent!important;background-image:url('/brand/icon-only.svg')!important;background-size:contain!important;background-repeat:no-repeat!important;background-position:center!important;border-radius:0!important}@media(max-width:900px){.brand-logo-link{flex-direction:row;align-items:center}.brand-logo-horizontal{height:40px;max-width:160px}}
.funnel-bar{height:8px;background:linear-gradient(90deg,var(--yellow),#ffd21f88);border-radius:4px;margin-top:8px;min-width:4px}
.funnel-stage .funnel-bar{transition:width .3s ease}

/* Sprint F portal polish — QR camera frame + readability */
.camera-box{position:relative;display:grid;place-items:center;height:220px;border:2px dashed #3a3a3a;border-radius:12px;background:radial-gradient(circle at 50% 40%,#1c1c1c,#0a0a0a 80%);overflow:hidden}
.camera-frame{position:absolute;inset:14% 14% 22% 14%;border-radius:14px;pointer-events:none}
.camera-corner{position:absolute;width:28px;height:28px;border:3px solid var(--yellow);border-radius:3px}
.camera-corner.tl{top:0;left:0;border-right:0;border-bottom:0}
.camera-corner.tr{top:0;right:0;border-left:0;border-bottom:0}
.camera-corner.bl{bottom:0;left:0;border-right:0;border-top:0}
.camera-corner.br{bottom:0;right:0;border-left:0;border-top:0}
.camera-hint{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);color:#cfcfcf;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.features-section-sub{margin:-4px 0 14px;color:#bdbdbd;font-size:14px;line-height:1.5}
.hero-strip h2{font-size:clamp(22px,3vw,32px)}
.metric strong{font-size:32px}
.tabs button{transition:background .15s,color .15s,border-color .15s}
.tabs button:hover{background:#222;color:var(--yellow);border-color:#444}
.tabs button.active{background:var(--yellow);color:#080808;border-color:var(--yellow)}
.empty-card{background:#141414;border:1px dashed #3a3a3a;color:#bdbdbd;border-radius:10px;padding:24px;text-align:center}
.empty-card h3{color:#ddd;margin:0 0 6px}
.card.empty{border-style:dashed}
.workshop-qr-panel{margin-top:4px}
.workshop-qr-head{margin-bottom:12px}
.workshop-number-label{margin:0 0 12px;color:#ddd;font-size:15px}
.workshop-number-label strong{color:var(--yellow);font-size:18px;letter-spacing:.04em}
.workshop-qr-wrap{display:flex;justify-content:flex-start;margin:0}
.workshop-qr-wrap .qr{width:220px;height:220px;border-radius:12px;border:1px solid #333;background:#fff;padding:10px;object-fit:contain}
.profile-workshop-qr{display:flex;flex-wrap:wrap;gap:18px;align-items:flex-start}
.profile-workshop-qr-copy{flex:1;min-width:220px}
.profile-workshop-qr-copy .meta{margin:8px 0 0}
.profile-workshop-qr img{width:200px;height:200px;border-radius:12px;border:1px solid #333;background:#fff;padding:8px;object-fit:contain}

/* Enterprise polish: visual consistency only, no behavior changes. */
.panel,.card,.hero-strip{box-shadow:0 18px 46px #00000022}
.panel{margin-bottom:16px}
.card{transition:transform .15s,box-shadow .15s}
.card:hover{transform:translateY(-1px);box-shadow:0 16px 38px #00000024}
.selected{border-left:4px solid var(--yellow);background:#101010;border-radius:10px;padding:12px}
.state{min-height:24px}
select{width:100%;border:1px solid #3a3a3a;border-radius:10px;background:#0d0d0d;color:#fff;padding:13px;font-size:16px}
.toolbar{display:flex;align-items:end;gap:12px;flex-wrap:wrap;background:#111;border:1px solid #282828;border-radius:10px;padding:12px;margin-bottom:14px}
.toolbar label{min-width:220px;flex:1}
.tabs button.active,.tabs button:focus{background:var(--yellow);color:#080808;border-color:var(--yellow)}
input::placeholder,textarea::placeholder{color:#777}
@media(min-width:1500px){.app{max-width:1500px}}

/* Enterprise mobile hardening — visual only, no behavior changes. */
@media(max-width:900px){
  .sidebar .brand-logo-link{
    display:grid!important;
    grid-template-columns:110px 86px;
    align-items:center;
    width:100%;
    max-width:100%;
    min-width:0;
    overflow:hidden;
    gap:6px;
  }

  .sidebar .brand-logo-horizontal{
    width:110px!important;
    height:36px;
    max-width:110px;
    flex:0 1 auto;
  }

  .sidebar .brand-context{
    width:86px!important;
    max-width:86px;
    overflow:hidden;
    text-overflow:clip;
    white-space:nowrap;
    font-size:10px;
    padding:4px 8px!important;
    flex-shrink:0;
  }

  .sidebar a{
    min-width:0;
  }

  .nav-count{
    flex-shrink:0;
  }
}
.workshop-app-steps{margin:12px 0 18px;padding-left:20px;color:#cfcfcf;line-height:1.6}
.workshop-app-steps li{margin-bottom:8px}
.workshop-app-download-inline{margin-top:18px;border-color:#3a3a3a}
.workshop-app-download-inline h3{margin:0 0 8px}

/* Enterprise workshop redesign — visual only, no API or workflow changes. */
:root{
  --workshop-bg:#070707;
  --workshop-panel:#101010;
  --workshop-panel-2:#151515;
  --workshop-line:#2b2b2b;
  --workshop-red:#d83b32;
  --workshop-yellow:#ffd21f;
}

body{
  background:
    radial-gradient(circle at 92% 6%, #d83b3222 0, transparent 28rem),
    radial-gradient(circle at 12% 12%, #ffd21f18 0, transparent 24rem),
    linear-gradient(180deg,#080808 0%,#0d0d0d 46%,#070707 100%);
  color:#f4f4f4;
}

.sidebar{
  background:linear-gradient(180deg,#030303,#0b0b0b);
  border-right:1px solid #28220b;
  box-shadow:18px 0 46px #00000055;
}

.sidebar-group-label{
  color:#ffd21f;
  opacity:.82;
}

.sidebar a{
  border:1px solid transparent;
  color:#d8d8d8;
  transition:background .16s,border-color .16s,color .16s,transform .16s;
}

.sidebar a:hover,
.sidebar a.nav-active{
  background:linear-gradient(90deg,#241f09,#121212);
  border-color:#4a3f12;
  color:#ffd21f;
  transform:translateX(2px);
}

.customer-home-link{
  background:#111;
  border-color:#3a2f08;
}

.app{
  max-width:1540px;
}

.topbar{
  padding:12px 0 20px;
  border-bottom:1px solid #282828;
}

.topbar h1{
  font-size:clamp(28px,3vw,42px);
  letter-spacing:.01em;
}

.topbar-actions{
  background:#101010;
  border:1px solid #2a2a2a;
  border-radius:12px;
  padding:8px;
  box-shadow:0 16px 40px #00000035;
}

.hero-strip{
  min-height:360px;
  align-items:stretch;
  border-radius:14px;
  border:1px solid #342c10;
  padding:0;
  overflow:hidden;
  background:
    linear-gradient(90deg,#050505 0%,#050505ef 44%,#05050578 72%,#05050538 100%),
    url('/assets/hero-gcc-auto.png') center/cover;
  box-shadow:0 28px 80px #00000070;
}

.hero-strip>div{
  width:min(720px,100%);
  padding:38px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}

.hero-strip h2{
  font-size:clamp(36px,5vw,66px);
  line-height:.95;
  max-width:620px;
}

.hero-strip p{
  color:#e1e1e1;
  font-size:16px;
  line-height:1.6;
}

.hero-strip::after{
  content:"";
  align-self:stretch;
  margin:26px 26px 26px auto;
  width:min(320px,32vw);
  border:1px solid #3b330e;
  border-radius:14px;
  background:
    linear-gradient(180deg,#141414cc,#090909ee),
    repeating-linear-gradient(90deg,#ffd21f22 0 1px,transparent 1px 42px);
  box-shadow:inset 0 1px 0 #ffffff12,0 18px 48px #00000070;
}

.metrics{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}

.metric{
  min-height:148px;
  border:1px solid #302a12;
  background:
    linear-gradient(145deg,#171717,#0d0d0d),
    radial-gradient(circle at 90% 0%,#ffd21f22,transparent 9rem);
  box-shadow:0 20px 52px #00000042;
}

.metric strong{
  color:#ffd21f;
  font-size:clamp(34px,4vw,48px);
}

.metric span{
  color:#e5e5e5;
}

.panel,
.card.dark,
.selected{
  background:linear-gradient(180deg,#151515,#101010);
  border:1px solid #2d2d2d;
  color:#f1f1f1;
  box-shadow:0 22px 58px #00000042;
}

.card{
  background:#121212;
  color:#f2f2f2;
  border:1px solid #2d2d2d;
}

.card h3,
.panel h2,
.panel h3{
  color:#fff;
}

.features-section-sub,
.meta,
.state{
  color:#b9b9b9;
}

label{
  color:#f1f1f1;
}

input,
textarea,
select{
  background:#090909;
  color:#fff;
  border:1px solid #373737;
  box-shadow:inset 0 1px 0 #ffffff08;
}

input:focus,
textarea:focus,
select:focus{
  outline:2px solid #ffd21f;
  border-color:#ffd21f;
}

.btn{
  border-radius:10px;
  box-shadow:0 12px 28px #ffd21f24;
}

.btn.secondary{
  background:#181818;
  color:#fff;
  border:1px solid #383838;
  box-shadow:none;
}

.toolbar,
.tabs{
  background:#101010;
  border:1px solid #282828;
  border-radius:12px;
  padding:12px;
}

.tabs button{
  background:#111;
  border-color:#333;
}

.camera-box{
  min-height:300px;
  background:
    radial-gradient(circle at 50% 35%,#25200c,#0a0a0a 70%),
    linear-gradient(135deg,#111,#050505);
  border:1px solid #4a4100;
  box-shadow:inset 0 0 0 1px #ffffff08;
}

.camera-frame{
  border:1px solid #ffd21f2a;
}

.badge.pending,
.pending{
  background:#2a2208;
  color:#ffd21f;
}

.badge.verified,
.verified{
  background:#0f2b1d;
  color:#77e0a3;
}

.badge.disputed,
.badge.rejected,
.disputed,
.rejected{
  background:#32110f;
  color:#ff9a90;
}

.workshop-qr-panel,
.workshop-mobile-app-panel{
  border-color:#3b330e;
}

@media(max-width:900px){
  .topbar{
    border-bottom:0;
  }

  .hero-strip{
    min-height:520px;
  }

  .hero-strip>div{
    padding:26px;
  }

  .hero-strip::after{
    display:none;
  }

  .metrics{
    grid-template-columns:1fr;
  }
}