/* die2harddie2fly Studio OS v0.8 — digital home / guided environment */
:root{
  --d2-orange:#f26522;
  --d2-orange-hot:#ff7a2f;
  --d2-black:#0a0a0b;
  --d2-black-2:#111214;
  --d2-black-3:#18191c;
  --d2-paper:#f2ede6;
  --d2-cream:#e6ded2;
  --d2-ink:#151515;
  --d2-muted:#8e887f;
  --d2-grid:rgba(255,255,255,.045);
}
html{background:var(--d2-black)}
body{background:var(--d2-black);}
body.d2-sound-on{--sound-energy:1}
body:not(.d2-sound-on){--sound-energy:0}

/* Login: welcoming rather than corporate, without turning the whole screen orange. */
.auth-screen{background:var(--d2-black)}
.v07-auth-art{background:
  radial-gradient(circle at 55% 42%,rgba(242,101,34,.16),transparent 24%),
  radial-gradient(circle at 74% 16%,rgba(242,101,34,.08),transparent 22%),
  linear-gradient(135deg,#09090a,#121214 55%,#0c0c0d)!important;color:var(--d2-paper)!important;position:relative;overflow:hidden}
.v07-auth-art:after{content:"";position:absolute;inset:-20%;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:46px 46px;transform:perspective(500px) rotateX(64deg) translateY(28%);opacity:.55;pointer-events:none}
.v07-auth-art .auth-mark{position:relative;z-index:2;opacity:.72;filter:saturate(.95)}
.v07-auth-art .auth-tag,.v07-auth-art .micro{position:relative;z-index:2}.v07-auth-art .auth-tag em{color:var(--d2-orange)}
.auth-form{position:relative}.client-entry-switch{display:block;margin-top:8px;color:#e3a77f!important}.client-key-form{gap:16px!important;margin-top:16px!important}.client-key-form h2{font-family:var(--display);font-size:42px;line-height:.92;margin:6px 0}.client-key-head{display:flex;justify-content:space-between;align-items:center}.client-key-head button{color:#9b9489}

/* The AI is a moving character in the environment, not another panel icon. */
.d2-guide-ball{--ball-x:calc(100vw - 94px);--ball-y:calc(100vh - 92px);position:fixed;left:0;top:0;transform:translate3d(var(--ball-x),var(--ball-y),0);width:66px;height:66px;border:0;background:transparent;z-index:140;padding:0;transition:transform .9s cubic-bezier(.2,.85,.18,1),opacity .24s;filter:drop-shadow(0 18px 26px rgba(0,0,0,.38));}
.d2-guide-ball[hidden]{display:none!important}.ball-shell{position:absolute;inset:9px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 24%,#ffc39b 0 5%,#ff8b42 12%,#e75c17 45%,#8f2d05 100%);border:1px solid rgba(255,255,255,.32);box-shadow:inset 0 -11px 20px rgba(79,17,0,.28),inset 0 9px 14px rgba(255,255,255,.18),0 0 26px rgba(242,101,34,.2);animation:d2BallFloat 3.6s ease-in-out infinite}.ball-mark{font-family:var(--display);font-weight:900;font-size:15px;letter-spacing:-.08em;color:#140a05;text-shadow:0 1px rgba(255,255,255,.14)}.ball-shine{position:absolute;left:11px;top:8px;width:11px;height:7px;border-radius:50%;background:rgba(255,255,255,.5);filter:blur(1px);transform:rotate(-25deg)}
.ball-orbit{position:absolute;inset:2px;border:1px solid rgba(242,101,34,.36);border-radius:50%;transform:rotate(24deg) scaleY(.45);animation:d2Orbit 6s linear infinite}.ball-orbit.o2{inset:0;border-color:rgba(255,255,255,.15);transform:rotate(-38deg) scaleY(.58);animation-duration:8.5s;animation-direction:reverse}.ball-orbit.o3{inset:6px;border-style:dashed;border-color:rgba(242,101,34,.3);transform:rotate(75deg) scaleY(.39);animation-duration:4.8s}.ball-ping{position:absolute;inset:15px;border:1px solid rgba(242,101,34,.34);border-radius:50%;opacity:0}
.d2-guide-ball.thinking .ball-shell{animation-duration:1.15s;box-shadow:inset 0 -11px 20px rgba(79,17,0,.28),0 0 42px rgba(242,101,34,.5)}.d2-guide-ball.thinking .ball-orbit{animation-duration:1.35s}.d2-guide-ball.listening .ball-shell{box-shadow:0 0 0 5px rgba(242,101,34,.07),0 0 36px rgba(242,101,34,.38)}.d2-guide-ball.speaking .ball-ping{animation:d2Ping 1s ease-out infinite}.d2-guide-ball.music .ball-shell{animation:d2MusicBall .62s ease-in-out infinite alternate}.d2-guide-ball.guide-focus{filter:drop-shadow(0 12px 42px rgba(242,101,34,.5))}
.d2-guide-ball:hover .ball-shell{scale:1.06}

/* First-time setup */
.onboarding{position:fixed;inset:0;z-index:130;background:
 radial-gradient(circle at 50% 42%,rgba(242,101,34,.11),transparent 26%),
 radial-gradient(circle at 22% 16%,rgba(255,255,255,.035),transparent 20%),
 #080809;color:var(--d2-paper);display:grid;place-items:center;overflow:hidden;padding:30px}
.onboarding[hidden]{display:none!important}.onboarding:before{content:"";position:absolute;inset:-20%;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:54px 54px;transform:perspective(600px) rotateX(68deg) translateY(28%);opacity:.45}.onboarding-noise{position:absolute;inset:0;opacity:.09;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.23'/%3E%3C/svg%3E")}.onboarding-stage{position:relative;z-index:2;width:min(820px,100%);text-align:center;display:grid;place-items:center;min-height:520px}.onboarding-card{width:min(680px,100%);display:grid;place-items:center;gap:18px;animation:d2OnboardIn .65s both}.onboarding-card .kicker{font-family:var(--mono);font-size:8px;letter-spacing:.18em;color:#a39b91}.onboarding-card h1{font-family:var(--display);font-size:clamp(58px,10vw,118px);line-height:.78;letter-spacing:-.045em;margin:8px 0}.onboarding-card h1 em{font-family:Georgia,serif;font-weight:400;color:var(--d2-orange)}.onboarding-card h2{font-family:var(--display);font-size:clamp(38px,6vw,72px);line-height:.9;margin:8px 0}.onboarding-card p{max-width:520px;color:#aaa39a;line-height:1.7;font-size:12px}.onboarding-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.onboarding-actions button{min-width:128px;padding:13px 18px;border-radius:999px;border:1px solid #363638;background:#151517;color:#e8e3dc}.onboarding-actions button:hover,.onboarding-actions button.active{border-color:rgba(242,101,34,.7);background:rgba(242,101,34,.12);color:#fff}.onboarding-actions button.primary{background:var(--d2-orange)!important;border-color:var(--d2-orange)!important;color:#130a05!important}.onboarding-progress{position:absolute;z-index:4;bottom:29px;left:50%;transform:translateX(-50%);display:flex;gap:7px}.onboarding-progress i{width:22px;height:2px;background:#38383a;transition:.3s}.onboarding-progress i.done,.onboarding-progress i.active{background:var(--d2-orange)}.onboarding-skip{position:absolute;right:28px;top:24px;z-index:5;background:none;color:#777;border:0;font-family:var(--mono);font-size:8px;letter-spacing:.12em}.onboarding-skip:hover{color:#ddd}.language-grid,.source-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;width:min(520px,100%)}.language-grid button,.source-grid button{padding:18px;border:1px solid #2d2e31;border-radius:18px;background:rgba(255,255,255,.025);color:#ddd;text-align:left}.language-grid button b,.source-grid button b{display:block;font-size:15px;margin-bottom:5px}.language-grid button span,.source-grid button span{font-family:var(--mono);font-size:7px;color:#777}.language-grid button:hover,.source-grid button:hover,.language-grid button.active,.source-grid button.active{border-color:rgba(242,101,34,.56);background:rgba(242,101,34,.07)}
.name-build{display:flex;justify-content:center;gap:.02em;font-family:var(--display);font-size:clamp(58px,9vw,110px);font-weight:800;line-height:.9;letter-spacing:-.03em;flex-wrap:wrap}.name-build span{opacity:0;transform:translateY(28px) rotate(6deg);animation:d2Letter .42s forwards}.identity-role{font-family:var(--mono);font-size:10px;letter-spacing:.23em;color:var(--d2-orange);margin-top:6px}.tour-demo{width:min(700px,100%);height:260px;position:relative;border:1px solid #2b2c2f;border-radius:26px;background:rgba(255,255,255,.018);overflow:hidden}.tour-demo:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:30px 30px}.tour-node{position:absolute;top:100px;width:118px;padding:12px;border:1px solid #33353a;border-radius:16px;background:#141517;text-align:left;font-size:9px;z-index:2}.tour-node b{display:block;font-size:12px;margin-bottom:4px}.tour-node:nth-child(1){left:6%}.tour-node:nth-child(2){left:29%}.tour-node:nth-child(3){left:53%}.tour-node:nth-child(4){left:77%}.tour-node.done{border-color:rgba(242,101,34,.5)}.tour-line{position:absolute;top:129px;height:1px;background:linear-gradient(90deg,#35363b,var(--d2-orange),#35363b);left:18%;right:10%;z-index:1}.tour-line:after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:var(--d2-orange);top:-3px;left:0;box-shadow:0 0 12px rgba(242,101,34,.6);animation:d2Data 3.6s linear infinite}

/* Home becomes a room, not a dashboard. */
#workspace{position:relative}.v07-home-head{margin-bottom:20px}.v07-home-head h1{font-family:var(--display)!important;font-weight:700!important;letter-spacing:-.035em!important}.v07-home-head p{max-width:520px}.home-orb-panel{min-height:330px!important;border-radius:30px!important;position:relative}.home-orb-panel:after{content:"YOUR SPACE / LIVE";position:absolute;right:22px;top:18px;font-family:var(--mono);font-size:7px;letter-spacing:.16em;color:#766e63}.home-orb{opacity:.15;pointer-events:none}.home-orb-label{letter-spacing:.2em!important}.d2-home-message{position:absolute;left:24px;bottom:22px;font-family:var(--mono);font-size:7px;letter-spacing:.13em;color:#6a6258}

/* Project canvas hierarchy */
.canvas-topline{padding:3px 0}.canvas-mode-switch{display:flex;gap:5px;padding:3px;border-radius:999px;background:#d7cfc4;border:1px solid #bfb4a7}.canvas-mode-switch button{border:0!important;background:transparent!important;color:#756c61!important;height:28px!important;padding:0 10px!important}.canvas-mode-switch button.active{background:#171717!important;color:#f2ede6!important}.canvas-orientation{font-family:var(--mono);font-size:7px;color:#6f675d;letter-spacing:.07em}.node-canvas{min-height:610px!important;height:min(75vh,820px)!important}.studio-node{transition:border-color .16s,box-shadow .16s,transform .22s,opacity .22s!important}.studio-node.stage-node{width:244px;min-height:126px;border-color:#555;background:linear-gradient(180deg,#18191b,#111214)}.studio-node.stage-node .node-type{color:var(--d2-orange)}.studio-node.project-root{width:246px;background:linear-gradient(155deg,#f26522,#b53e0a);border-color:#ff9b61;color:#130a05}.studio-node.project-root .node-type,.studio-node.project-root .node-foot span,.studio-node.project-root p{color:#4a1b07}.studio-node.project-root .node-status-dot{background:#111}.studio-node.detail-node{width:205px;min-height:96px}.studio-node .node-meta{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px}.studio-node .node-meta i{font-style:normal;font-family:var(--mono);font-size:6px;padding:3px 5px;border:1px solid #494a4d;border-radius:999px;color:#999}.studio-node .node-meta i.done{color:#b8d58e;border-color:#536540}.studio-node .node-meta i.active{color:#ffaf81;border-color:#7e4527}.node-canvas[data-focus="big"] .detail-node{opacity:0;pointer-events:none;transform:scale(.88)}.node-canvas[data-focus="big"] .edge-detail{opacity:0}.node-canvas[data-focus="stage"] .detail-node{opacity:.5}.node-canvas[data-focus="detail"] .detail-node{opacity:1}.node-line{transition:opacity .2s,stroke .2s}.node-line.stage-edge{stroke:rgba(242,101,34,.38);stroke-width:1.8}.node-line.edge-detail{stroke:rgba(90,83,76,.5)}.stage-lane{position:absolute;top:110px;height:1060px;width:282px;border-left:1px dashed rgba(96,86,76,.28);border-right:1px dashed rgba(96,86,76,.12);border-radius:30px;pointer-events:none}.stage-lane span{position:absolute;top:-28px;left:12px;font-family:var(--mono);font-size:7px;letter-spacing:.12em;color:#786f64}.stage-lane.active{background:linear-gradient(180deg,rgba(242,101,34,.045),transparent 65%);border-left-color:rgba(242,101,34,.28)}

/* Client portal is purposefully smaller and quieter. */
.client-portal{min-height:100dvh;background:
 radial-gradient(circle at 72% 8%,rgba(242,101,34,.10),transparent 24%),#0a0a0b;color:#f2ede6;padding:34px clamp(18px,4vw,58px);font-family:var(--sans)}.client-portal[hidden]{display:none!important}.client-portal-shell{max-width:1180px;margin:0 auto}.client-portal-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding-bottom:28px;border-bottom:1px solid #28282a}.client-portal-head h1{font-family:var(--display);font-size:clamp(52px,7vw,90px);line-height:.82;margin:12px 0 10px}.client-portal-head p{color:#8c8984}.client-portal-mark{width:54px;height:54px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#ffb17c,#f26522 46%,#8d2e06);display:grid;place-items:center;color:#130a05;font-family:var(--display);font-weight:900}.client-progress{margin:36px 0}.client-progress-top{display:flex;justify-content:space-between;font-family:var(--mono);font-size:8px;color:#8b8985;margin-bottom:10px}.client-progress-track{height:4px;background:#242426;overflow:hidden;border-radius:999px}.client-progress-track i{display:block;height:100%;background:var(--d2-orange)}.client-stage-map{display:grid;grid-template-columns:repeat(6,minmax(120px,1fr));gap:8px;overflow:auto;padding:8px 0 18px}.client-stage{min-width:128px;padding:16px;border:1px solid #2b2b2e;border-radius:18px;background:#111214;position:relative}.client-stage:after{content:"";position:absolute;right:-9px;top:50%;width:9px;height:1px;background:#3b3b3e}.client-stage:last-child:after{display:none}.client-stage span{font-family:var(--mono);font-size:7px;color:#6f6f72}.client-stage b{display:block;margin:12px 0 5px;font-size:14px}.client-stage p{font-size:9px;color:#77787d;line-height:1.5}.client-stage.done{border-color:#3f4b35}.client-stage.done span{color:#a6c489}.client-stage.active{border-color:rgba(242,101,34,.7);box-shadow:inset 0 0 0 1px rgba(242,101,34,.09)}.client-stage.active span{color:#ff9a5d}.client-public-nodes{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin-top:20px}.client-public-node{padding:16px;border:1px solid #2d2d30;border-radius:18px;background:#121214}.client-public-node span{font-family:var(--mono);font-size:7px;color:#f28a4b}.client-public-node h3{font-size:16px;margin:9px 0 5px}.client-public-node p{font-size:10px;line-height:1.55;color:#7d7e82}.client-portal .client-exit{background:none;color:#8a8986;border:0;padding:0}

/* Audio visual energy. This is state-reactive; third-party embeds cannot expose raw spectrum data. */
body.d2-sound-on .music-bars i{animation:v07bars .7s ease-in-out infinite alternate}.music-pill.alive{border-color:rgba(242,101,34,.45);background:rgba(242,101,34,.08)}.music-pill.alive:after{content:"LIVE";font-family:var(--mono);font-size:6px;color:#f28b4d}.node-line.audio-linked{stroke:rgba(242,101,34,.65)}

/* Guide highlight used by the physical tour. */
.d2-tour-highlight{position:relative!important;z-index:145!important;box-shadow:0 0 0 2px rgba(242,101,34,.42),0 0 44px rgba(242,101,34,.18)!important;border-radius:14px!important}.d2-tour-tip{position:fixed;z-index:146;width:min(320px,calc(100vw - 32px));background:rgba(14,14,15,.96);border:1px solid #353537;border-radius:20px;padding:16px;color:#eee;box-shadow:0 18px 70px rgba(0,0,0,.48);backdrop-filter:blur(24px)}.d2-tour-tip .micro{color:#f28b4d}.d2-tour-tip h3{font-size:17px;margin:8px 0 5px}.d2-tour-tip p{font-size:10px;color:#98989b;line-height:1.55;margin-bottom:12px}.d2-tour-tip button{border-radius:999px;padding:9px 13px;border:1px solid #38383a;background:#1b1b1d;color:#eee}.d2-tour-tip button.primary{background:var(--d2-orange)!important;color:#130a05!important}

@keyframes d2BallFloat{50%{transform:translateY(-4px) rotate(3deg)}}
@keyframes d2Orbit{to{rotate:360deg}}
@keyframes d2Ping{0%{opacity:.65;scale:.65}100%{opacity:0;scale:2.3}}
@keyframes d2MusicBall{to{transform:translateY(-2px) scale(1.04)}}
@keyframes d2OnboardIn{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}
@keyframes d2Letter{to{opacity:1;transform:none}}
@keyframes d2Data{to{left:100%}}

@media(max-width:900px){.d2-guide-ball{width:58px;height:58px}.onboarding-stage{min-height:470px}.client-stage-map{grid-template-columns:repeat(6,140px)}.tour-demo{height:310px}.tour-node{width:102px}.tour-node:nth-child(1){left:3%}.tour-node:nth-child(2){left:27%}.tour-node:nth-child(3){left:51%}.tour-node:nth-child(4){left:75%}}
@media(max-width:650px){.onboarding{padding:18px}.onboarding-stage{min-height:560px}.onboarding-skip{right:18px;top:18px}.language-grid,.source-grid{grid-template-columns:1fr}.onboarding-card h1{font-size:64px}.name-build{font-size:58px}.tour-demo{height:360px}.tour-node{left:50%!important;transform:translateX(-50%);top:auto}.tour-node:nth-child(1){top:24px}.tour-node:nth-child(2){top:107px}.tour-node:nth-child(3){top:190px}.tour-node:nth-child(4){top:273px}.tour-line{left:50%;right:auto;top:60px;height:250px;width:1px;background:linear-gradient(#35363b,var(--d2-orange),#35363b)}.tour-line:after{left:-3px;top:0;animation:d2DataMobile 3.6s linear infinite}.client-portal{padding:24px 16px}.client-portal-head h1{font-size:56px}.stage-lane{display:none}.node-canvas{min-height:570px!important}}
@keyframes d2DataMobile{to{top:100%}}
@media(prefers-reduced-motion:reduce){.ball-shell,.ball-orbit,.ball-ping,.tour-line:after,.name-build span{animation:none!important}.d2-guide-ball{transition:none!important}}
/* In v0.8 the moving ball replaces the old static AI launch dots/orbit. */
.ai-dock,#aiMobile{display:none!important}.assistant .ai-orbit{height:30px!important;min-height:30px!important;width:30px!important;margin:0 auto 2px!important;opacity:.42}.assistant .ai-particle,.assistant .ai-glyph,.assistant .wave{display:none!important}.assistant .ai-core{width:7px;height:7px}
body.onboarding-active .d2-guide-ball{width:104px;height:104px;filter:drop-shadow(0 20px 55px rgba(242,101,34,.3))}body.onboarding-active .ball-shell{inset:14px}body.onboarding-active .ball-mark{font-size:20px}body.onboarding-active .ball-shine{left:19px;top:15px;width:15px;height:9px}