:root{
  --sandbox-graphite:#101a17;
  --sandbox-mineral:#173b36;
  --sandbox-mineral-2:#20544b;
  --sandbox-mint:#59e3bc;
  --sandbox-mint-deep:#168567;
  --sandbox-violet:#7868e6;
  --sandbox-violet-soft:#ebe8ff;
  --sandbox-copper:#b95f22;
  --sandbox-canvas:#eef5f2;
  --sandbox-surface:#ffffff;
  --sandbox-ink:#142420;
  --sandbox-muted:#5b706a;
  --sandbox-line:#ccd9d5;
  --sandbox-danger:#c64252;
  --sandbox-warning:#b97010;
  --navy:var(--sandbox-graphite);
  --navy-2:var(--sandbox-mineral);
  --blue:var(--sandbox-mint-deep);
  --red:var(--sandbox-violet);
  --bg:var(--sandbox-canvas);
  --surface:var(--sandbox-surface);
  --ink:var(--sandbox-ink);
  --muted:var(--sandbox-muted);
  --line:var(--sandbox-line);
  --green:var(--sandbox-mint-deep);
  --amber:var(--sandbox-warning);
  --shadow:0 16px 40px rgba(16,42,35,.08);
  --ja-navy:var(--sandbox-graphite);
  --ja-blue:var(--sandbox-mint-deep);
  --ja-red:var(--sandbox-violet);
  --ja-ink:var(--sandbox-ink);
  --ja-muted:var(--sandbox-muted);
  --ja-line:var(--sandbox-line);
  --ja-page:var(--sandbox-canvas);
  --ja-green:var(--sandbox-mint-deep);
}

html,body{background:var(--sandbox-canvas)}
body{max-width:100%;overflow-x:hidden;color:var(--sandbox-ink)}

.sandbox-gate-story,
.sandbox-topbar,
.architecture-topbar{
  background-color:var(--sandbox-graphite);
  background-image:
    radial-gradient(circle at 82% 4%,rgba(89,227,188,.13),transparent 27%),
    linear-gradient(rgba(89,227,188,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(89,227,188,.045) 1px,transparent 1px),
    linear-gradient(135deg,#101a17,#16322d);
  background-size:auto,32px 32px,32px 32px,auto;
}
.sandbox-gate-story{color:#f4fbf8}
.sandbox-gate-story p{color:#c7d8d2}
.sandbox-gate-story footer,.sandbox-brand>.sandbox-brand-context small{color:#9eb8b0}
.sandbox-environment{border-color:rgba(89,227,188,.42);color:var(--sandbox-mint);background:rgba(89,227,188,.06)}
.sandbox-capabilities,.sandbox-enterprise,.sandbox-connections{border-color:rgba(89,227,188,.22);background:rgba(7,25,21,.42)}
.sandbox-capabilities{background:rgba(89,227,188,.2)}
.sandbox-capabilities li{background:rgba(9,31,26,.72)}
.sandbox-capabilities span,.sandbox-enterprise article span,.sandbox-connections p{color:#adcbc2}
.connection-status.connected{color:#092d23;background:var(--sandbox-mint)}
.connection-status.planned{color:#3e347b;background:#dcd7ff}
.sandbox-public-explainer{border-color:rgba(120,104,230,.55);background:rgba(120,104,230,.12)}
.sandbox-public-explainer:hover{border-color:#a79cf2;background:rgba(120,104,230,.2)}

.sandbox-auth-card{background:
  radial-gradient(circle at 18% 14%,rgba(89,227,188,.14),transparent 28%),
  radial-gradient(circle at 86% 84%,rgba(120,104,230,.11),transparent 30%),
  #f7faf9}
.sandbox-auth-card>div,.sandbox-auth-card>form{border-color:#bfd0ca;border-radius:8px;box-shadow:0 22px 54px rgba(14,43,35,.12)}
.sandbox-auth-card span{color:var(--sandbox-violet)}
.sandbox-auth-card input{border-color:#9db5ad;border-radius:5px;background:#fbfdfc}
.sandbox-auth-card input:focus{outline:3px solid rgba(89,227,188,.28);border-color:var(--sandbox-mint-deep)}
.sandbox-auth-card button{border-radius:5px;color:#09261f;background:var(--sandbox-mint)}
.sandbox-auth-card button:hover{background:#72eccb}
.sandbox-auth-card .auth-error{color:var(--sandbox-danger)}

.sandbox-app{background:
  radial-gradient(circle at 94% 2%,rgba(120,104,230,.08),transparent 24%),
  var(--sandbox-canvas)}
.sandbox-topbar{border-bottom:1px solid rgba(89,227,188,.18);box-shadow:0 5px 18px rgba(8,27,22,.18)}
.sandbox-only{color:#ddd8ff;background:rgba(120,104,230,.22);border:1px solid rgba(167,156,242,.42)}
.sandbox-user>span{color:#0e3028;background:var(--sandbox-mint)}
.sandbox-user small{color:#9eb8b0}
.sandbox-user button{border-color:#5f7e75;border-radius:5px}
.sandbox-user button:hover{border-color:var(--sandbox-mint);background:rgba(89,227,188,.1)}
.sandbox-nav{background:linear-gradient(180deg,#11221e,#173b36)}
.sandbox-nav button{color:#d5e5e0}
.sandbox-nav button:hover{background:rgba(89,227,188,.08)}
.sandbox-nav button.active{border-left-color:var(--sandbox-mint);color:#fff;background:linear-gradient(90deg,rgba(89,227,188,.22),rgba(89,227,188,.07))}
.sandbox-nav button.active svg{color:var(--sandbox-mint)}
.sandbox-nav small{color:#92afa6}
.sandbox-main{background:transparent}
.sandbox-page-header{border-bottom-color:#bfd0ca}
.sandbox-page-header p{color:#526d65}
.role-view select{border-color:#a8bdb6;border-radius:5px;background:#fff}

.workspace-lead,.panel,.module-card,.metric-strip,.module-placeholder,.role-matrix,.lifecycle,.journey-model-map,.journey-state-model,.journey-measure-model,.journey-cohort-model,.oversight-section{border-color:var(--sandbox-line);border-radius:7px;box-shadow:var(--shadow)}
.workspace-lead aside,.module-placeholder aside,.section-heading,.journey-model-map>header,.journey-state-model>header,.journey-measure-model>header,.journey-cohort-model>header,.oversight-section>header{background:#f4f8f6}
.workspace-lead aside,.module-placeholder aside{border-left-color:var(--sandbox-line)}
.metric-strip{overflow:hidden;background:var(--sandbox-line)}
.module-card{border-radius:7px}
.module-card:hover{border-color:var(--sandbox-mint-deep);box-shadow:0 15px 34px rgba(20,80,65,.12)}
.module-card svg{stroke:var(--sandbox-mint-deep)}
.module-status{color:#15674f;background:#dcf7ee}
.module-status.connected{color:#4c3eb4;background:var(--sandbox-violet-soft)}
.sandbox-notice{border-left-color:var(--sandbox-violet);color:#443a91;background:#efedff}
.status.active:before,.status.approved:before,.status.completed:before,.status.approved_for_sandbox:before{background:var(--sandbox-mint-deep)}
.status.testing:before{background:var(--sandbox-violet)}
.status.rejected:before,.sandbox-auth-card .auth-error:before{background:var(--sandbox-danger)}
.mini-budget i,.budget-bar i{background:linear-gradient(90deg,var(--sandbox-mint-deep),var(--sandbox-violet))}
.agent-row.selected{box-shadow:inset 4px 0 var(--sandbox-violet);background:#f2f0ff}
.agent-inspector>header,.journey-model-hero,.oversight-lead{background:
  linear-gradient(rgba(89,227,188,.04) 1px,transparent 1px),
  linear-gradient(90deg,rgba(89,227,188,.04) 1px,transparent 1px),
  linear-gradient(135deg,#11221e,#20544b);background-size:28px 28px,28px 28px,auto}
.inspector-actions button.primary{border-color:var(--sandbox-violet);background:var(--sandbox-violet)}
.record-actions button,.inspector-actions button{border-radius:4px}
.journey-semantic-node circle,.public-map-node circle{fill:var(--sandbox-violet)}
.journey-semantic-node.core circle,.public-map-node.journey circle{fill:var(--sandbox-mint-deep)}
.journey-semantic-node.network circle,.public-map-node.network circle{fill:#447db6}
.journey-semantic-node.evidence circle,.public-map-node.evidence circle{fill:#2b9b70}
.journey-semantic-edge.active,.public-map-edges path.active{stroke:var(--sandbox-violet)}
.oversight-status.active,.oversight-status.completed{color:#146347;background:#dff5ec}
.scenario-attention{border-left-color:var(--sandbox-danger);color:#7d303b;background:#fff0f2}

.architecture-topbar{border-bottom:1px solid rgba(89,227,188,.18)}
.architecture-sign-in{border-color:#63847a;border-radius:5px}
.architecture-sign-in:hover,.architecture-sign-in:focus-visible{border-color:var(--sandbox-mint);background:rgba(89,227,188,.1)}
.agent-architecture-body{background:
  radial-gradient(circle at 92% 2%,rgba(120,104,230,.09),transparent 24%),
  var(--sandbox-canvas)}
.architecture-hero{background:
  radial-gradient(circle at 88% 20%,rgba(120,104,230,.2),transparent 28%),
  linear-gradient(rgba(89,227,188,.045) 1px,transparent 1px),
  linear-gradient(90deg,rgba(89,227,188,.045) 1px,transparent 1px),
  linear-gradient(125deg,#101a17,#20544b);background-size:auto,32px 32px,32px 32px,auto}
.architecture-kicker{color:var(--sandbox-violet)}
.architecture-breadcrumb a{color:var(--sandbox-mint-deep)}
.scenario-section,.relationship-section,.core-concepts,.boarding-example,.evidence-section,.disclosure-section,.architecture-next{border-color:var(--sandbox-line);border-radius:12px;box-shadow:var(--shadow)}
.relationship-section>header{background:#f4f8f6}
.scenario-grid span,.concept-inspector>span{color:var(--sandbox-violet)}
.scenario-grid i,.boarding-example li>i{color:#10251f;background:var(--sandbox-mint)}
.architecture-next a{border-radius:5px;background:var(--sandbox-violet)}

@media(max-width:720px){
  .sandbox-gate{grid-template-columns:minmax(0,1fr);width:100%;overflow:hidden}
  .sandbox-gate-story,.sandbox-auth-card,.sandbox-gate-copy,.sandbox-enterprise,.sandbox-connections,.sandbox-public-explainer{min-width:0;max-width:100%}
  .sandbox-gate-story h1,.sandbox-gate-story h2,.sandbox-gate-story p{max-width:100%;overflow-wrap:break-word}
  .sandbox-capabilities,.sandbox-connections>div{min-width:0}
  .sandbox-capabilities li,.sandbox-connections article{min-width:0}
  .architecture-topbar{gap:8px;min-width:0;overflow:hidden}
  .architecture-topbar .sandbox-brand{min-width:0;gap:8px}
  .architecture-topbar .sandbox-brand>.sandbox-wordmark{flex:0 0 auto;font-size:18px}
  .architecture-topbar .sandbox-brand>.sandbox-brand-context{min-width:0;padding-left:8px}
  .architecture-topbar .sandbox-brand>.sandbox-brand-context b{font-size:10px;white-space:nowrap}
  .architecture-topbar .sandbox-brand>.sandbox-brand-context small{display:none}
  .architecture-sign-in{flex:0 0 auto;padding:8px 7px;font-size:.58rem;white-space:nowrap}
  .agent-architecture-page,.architecture-hero,.architecture-hero>div,.architecture-hero aside,.scenario-section,.relationship-section,.core-concepts,.boarding-example,.evidence-section,.disclosure-section,.architecture-next{min-width:0;max-width:100%}
  .architecture-hero h1,.scenario-section h2,.relationship-section h2,.core-concepts h2,.boarding-example h2,.evidence-section h2,.disclosure-section h2,.architecture-next h2{max-width:100%;overflow-wrap:break-word}
  .sandbox-nav{background:#fff}
  .sandbox-nav button{color:var(--sandbox-ink)}
  .sandbox-nav button:hover{background:#edf7f3}
  .sandbox-nav button.active{border-bottom-color:var(--sandbox-mint-deep);color:#123f34;background:#def5ed}
  .sandbox-topbar{background-color:var(--sandbox-graphite)}
}

@media(prefers-reduced-motion:no-preference){
  .module-card,.sandbox-auth-card button,.sandbox-nav button,.architecture-sign-in{transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}
  .module-card:hover{transform:translateY(-2px)}
}