/* Restrained, Apple-inspired liquid glass for application chrome only. */
:root{
  --ui-canvas:#dceff1;
  --ui-canvas-deep:#cce4e8;
  --ui-ink:#132735;
  --ui-muted:#5e7180;
  --ui-accent:#147d82;
  --ui-accent-strong:#09646d;
  --ui-line:rgba(28,73,84,.15);
  --ui-panel:rgba(248,253,253,.78);
  --ui-panel-soft:rgba(242,251,251,.68);
  --liquid-fill:rgba(221,246,247,.16);
  --liquid-fill-strong:rgba(255,255,255,.34);
  --liquid-edge:rgba(255,255,255,.92);
  --liquid-shadow:0 22px 58px rgba(20,65,78,.16),0 3px 10px rgba(20,65,78,.08),inset 0 1px 0 rgba(255,255,255,.94),inset 0 -1px 0 rgba(32,87,98,.10);
  --liquid-radius:22px;
}
html[data-theme=dark]{
  --ui-canvas:#0d141a;
  --ui-canvas-deep:#111d25;
  --ui-ink:#edf5f7;
  --ui-muted:#9eb0ba;
  --ui-accent:#70d4d0;
  --ui-accent-strong:#92e3df;
  --ui-line:rgba(211,237,242,.12);
  --ui-panel:rgba(21,31,39,.92);
  --ui-panel-soft:rgba(25,38,47,.84);
  --liquid-fill:rgba(26,39,48,.60);
  --liquid-fill-strong:rgba(31,47,57,.73);
  --liquid-edge:rgba(220,249,250,.25);
  --liquid-shadow:0 22px 56px rgba(0,0,0,.34),0 2px 10px rgba(0,0,0,.20),inset 0 1px 0 rgba(224,253,252,.22),inset 0 -1px 0 rgba(0,0,0,.24);
}

html{background:var(--ui-canvas)}
body{
  background:
    radial-gradient(ellipse 54% 38% at 3% 5%,rgba(45,176,174,.25),transparent 68%),
    radial-gradient(ellipse 48% 34% at 96% 6%,rgba(61,136,184,.20),transparent 70%),
    radial-gradient(ellipse 42% 32% at 52% 96%,rgba(64,177,166,.14),transparent 72%),
    linear-gradient(148deg,var(--ui-canvas) 0%,#e8f4f5 45%,var(--ui-canvas-deep) 100%);
  color:var(--ui-ink);
  letter-spacing:-.012em;
}
.ambient{
  z-index:0;
  opacity:1;
  background:
    radial-gradient(circle at 16% 28%,rgba(37,180,174,.13),transparent 23%),
    radial-gradient(circle at 83% 42%,rgba(49,137,190,.13),transparent 25%),
    radial-gradient(circle at 58% 75%,rgba(91,203,183,.10),transparent 22%),
    linear-gradient(rgba(35,121,132,.032) 1px,transparent 1px),
    linear-gradient(90deg,rgba(35,121,132,.032) 1px,transparent 1px);
  background-size:auto,auto,auto,34px 34px,34px 34px;
  -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.78),rgba(0,0,0,.20) 82%,transparent);
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.78),rgba(0,0,0,.20) 82%,transparent);
}
.ambient:before,.ambient:after{z-index:0;filter:blur(58px);opacity:.34;animation-duration:36s}
.workspace{position:relative;z-index:1}
.ambient:before{
  inset:12vh auto auto 16vw;
  width:38vw;height:38vw;
  background:conic-gradient(from 210deg,rgba(34,185,174,.38),rgba(88,154,207,.24),rgba(154,130,205,.13),rgba(34,185,174,.38));
  border-radius:42% 58% 56% 44%;
}
.ambient:after{
  inset:auto 9vw 4vh auto;
  width:34vw;height:34vw;
  background:conic-gradient(from 35deg,rgba(62,151,195,.30),rgba(61,200,175,.30),rgba(110,190,213,.20),rgba(62,151,195,.30));
  border-radius:58% 42% 46% 54%;
}
.liquid-glass-defs{position:absolute;overflow:hidden;pointer-events:none}
html[data-theme=dark] body{
  background:
    radial-gradient(ellipse 54% 38% at 3% 5%,rgba(37,172,168,.13),transparent 68%),
    radial-gradient(ellipse 48% 34% at 96% 6%,rgba(51,121,166,.13),transparent 70%),
    linear-gradient(148deg,var(--ui-canvas),#101b22 48%,var(--ui-canvas-deep));
}

/* Content is a calm medical workspace, not a wall of frosted cards. */
.card,.stage-card,.requirement-card,.scene,.continuity-card,.timeline-row,
.brief-metrics div,.script-scenes article,.script-status,.ai-understanding,
.prompt-details,.platform-option,.project-row,.history-panel,.history-list-section{
  border-color:var(--ui-line)!important;
  background:var(--ui-panel)!important;
  box-shadow:0 12px 34px rgba(28,70,80,.085),inset 0 1px rgba(255,255,255,.72)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.card:before,.stage-card:before,.requirement-card:before,.scene:before,
.continuity-card:before,.timeline-row:before,.brief-metrics div:before,
.script-scenes article:before,.script-status:before,.ai-understanding:before,
.prompt-details:before,.platform-option:before,.project-row:before{display:none!important}
.stage-card{padding:30px;border-radius:22px;background:linear-gradient(150deg,rgba(252,255,255,.84),rgba(239,249,249,.70))!important}
.scene{border-radius:16px;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.scene:hover{transform:translateY(-2px);border-color:rgba(20,125,130,.26)!important;box-shadow:0 14px 34px rgba(28,53,67,.10)!important}
html[data-theme=dark] .stage-card{background:linear-gradient(150deg,rgba(24,36,44,.92),rgba(18,29,37,.84))!important}

/* True-looking glass material: blur, specular rim, soft refraction and pointer light. */
.topbar,.stage-nav,.stage-footer,dialog[open]>form,.platform-select,.project-switcher,.login-card{
  --glass-pointer-x:50%;--glass-pointer-y:0%;
  isolation:isolate;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--liquid-edge) 76%,transparent)!important;
  background:
    radial-gradient(circle at var(--glass-pointer-x) var(--glass-pointer-y),rgba(255,255,255,.48),transparent 27%),
    linear-gradient(112deg,rgba(255,255,255,.16),rgba(124,222,220,.06) 48%,rgba(71,150,202,.08)),
    linear-gradient(145deg,var(--liquid-fill-strong),var(--liquid-fill))!important;
  box-shadow:var(--liquid-shadow)!important;
  backdrop-filter:blur(18px) saturate(175%) contrast(104%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(175%) contrast(104%)!important;
}
/* Persistent navigation is repainted on every click. Keep its glass depth but
   avoid the expensive SVG refraction and large-radius blur on that hot path. */
.topbar,.stage-nav,.stage-footer{
  backdrop-filter:blur(8px) saturate(130%)!important;
  -webkit-backdrop-filter:blur(8px) saturate(130%)!important;
}
.topbar:before,.stage-nav:before,.stage-footer:before,dialog[open]>form:before,
.platform-select:before,.project-switcher:before,.login-card:before{
  content:""!important;display:block!important;position:absolute!important;z-index:-1!important;
  inset:1px!important;width:auto!important;height:auto!important;border-radius:inherit!important;
  background:
    linear-gradient(115deg,rgba(255,255,255,.24),transparent 22% 74%,rgba(67,183,202,.15)),
    radial-gradient(ellipse 68% 25% at var(--glass-pointer-x) 0%,rgba(255,255,255,.72),transparent 70%)!important;
  opacity:.64;transform:none!important;transition:opacity .25s ease!important;pointer-events:none;
  filter:url(#liquid-edge-refraction);
}
.topbar:before,.stage-nav:before,.stage-footer:before{filter:none}
.topbar:after,.stage-nav:after,.stage-footer:after,dialog[open]>form:after,
.platform-select:after,.project-switcher:after,.login-card:after{
  content:"";position:absolute;z-index:2;inset:0;padding:1px;border-radius:inherit;pointer-events:none;
  background:linear-gradient(122deg,rgba(255,255,255,.96),rgba(187,255,246,.48) 24%,rgba(120,209,230,.22) 48%,rgba(190,173,255,.20) 70%,rgba(255,255,255,.80));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
}

.topbar{top:10px;min-height:68px;border-radius:21px;padding:9px 12px 9px 15px}
.brand{min-width:300px}.brand-mark{border-radius:13px;background:linear-gradient(145deg,#1e8f91,#256f91);box-shadow:0 7px 18px rgba(18,91,112,.20),inset 0 1px rgba(255,255,255,.5)}
.stage-nav{gap:4px;padding:6px;border-radius:18px}
.stage-nav button{min-height:46px;border-radius:13px;font-size:16px}
.stage-nav button.active{border-color:rgba(255,255,255,.86);background:linear-gradient(145deg,rgba(255,255,255,.58),rgba(199,239,239,.30));box-shadow:0 7px 19px rgba(32,91,99,.13),inset 0 1px rgba(255,255,255,.86),inset 0 -1px rgba(43,139,145,.10)}
html[data-theme=dark] .stage-nav button.active{background:rgba(112,212,208,.13);border-color:rgba(174,239,236,.24)}
.stage-footer{bottom:14px;border-radius:22px;padding:11px 12px}
.stage-footer:after{height:auto;top:0;background:none;filter:none}

dialog::backdrop{background:rgba(13,24,31,.34);backdrop-filter:blur(12px) saturate(90%);-webkit-backdrop-filter:blur(12px) saturate(90%)}
dialog[open]>form{border-radius:28px!important;background-color:var(--liquid-fill)!important}
dialog[open]>form:before{opacity:.55}
.platform-select,.project-switcher{border-radius:15px!important}
.login-card{border-radius:30px!important}
.login-card{background:radial-gradient(circle at var(--glass-pointer-x) var(--glass-pointer-y),rgba(255,255,255,.50),transparent 28%),linear-gradient(145deg,rgba(255,255,255,.40),rgba(213,242,243,.18))!important}
.login-page{grid-template-columns:minmax(0,1fr);width:100%;overflow:hidden}
.login-card{width:100%!important;max-width:500px;min-width:0}
.password-field{min-width:0}.password-field input{width:auto!important}

/* Product hierarchy and status surfaces. */
.project-header{padding:8px 4px}.project-header:after{content:"";display:block;width:74px;height:3px;margin-top:16px;border-radius:99px;background:linear-gradient(90deg,var(--ui-accent),rgba(69,173,181,.15))}
.section-head{padding-bottom:16px;border-bottom:1px solid var(--ui-line)}
.script-success-receipt{border-color:rgba(29,175,151,.34)!important;background:linear-gradient(130deg,rgba(56,207,177,.18),rgba(228,250,246,.52))!important;box-shadow:inset 0 1px rgba(255,255,255,.70)!important}
.script-status{background:rgba(244,252,252,.58)!important;box-shadow:none!important}
.selector-row{background:linear-gradient(135deg,rgba(255,255,255,.42),rgba(214,242,242,.26))!important}
.scene-top span:first-child,.tag.ready{color:var(--ui-accent-strong)}
.state-pill{border-color:rgba(35,156,154,.25);background:rgba(223,249,246,.28);box-shadow:inset 0 1px rgba(255,255,255,.55)}
html[data-theme=dark] .script-success-receipt{background:linear-gradient(130deg,rgba(28,145,128,.24),rgba(22,54,56,.58))!important}
html[data-theme=dark] .script-status{background:rgba(22,39,47,.68)!important}
html[data-theme=dark] .selector-row{background:linear-gradient(135deg,rgba(54,82,91,.46),rgba(26,54,60,.32))!important}
html[data-theme=dark] .state-pill{background:rgba(71,190,179,.10)}

/* Controls: quieter, more dimensional, never neon. */
.primary-button{
  border-radius:13px;border-color:rgba(255,255,255,.32);
  background:linear-gradient(180deg,#238f91,#12737a)!important;
  box-shadow:0 8px 18px rgba(17,105,112,.19),inset 0 1px rgba(255,255,255,.42),inset 0 -1px rgba(0,45,55,.20)!important;
}
.primary-button:hover{transform:translateY(-1px) scale(1.01);box-shadow:0 11px 23px rgba(17,105,112,.24),inset 0 1px rgba(255,255,255,.48)!important}
.primary-button:before{display:none}
.secondary-button,.compact-button,.icon-button{border-color:var(--ui-line);background:rgba(255,255,255,.52);box-shadow:inset 0 1px rgba(255,255,255,.72),0 3px 9px rgba(25,54,69,.05)}
html[data-theme=dark] .secondary-button,html[data-theme=dark] .compact-button,html[data-theme=dark] .icon-button{background:rgba(255,255,255,.055)}
.eyebrow,.brand small{color:var(--ui-accent);letter-spacing:.13em}
.project-header h1{font-size:clamp(30px,3.4vw,40px);letter-spacing:-.035em}
.section-head h2{font-size:29px;letter-spacing:-.025em}
.project-header p,.section-head p{color:var(--ui-muted)}
input,textarea,select{border-color:var(--ui-line)!important;background:var(--ui-panel-soft)!important;box-shadow:inset 0 1px 2px rgba(22,48,61,.045)!important}
input:focus,textarea:focus,select:focus{border-color:rgba(20,125,130,.55)!important;box-shadow:0 0 0 4px rgba(20,125,130,.10)!important}

@media(max-width:760px){
  .topbar{top:6px;width:calc(100% - 12px);border-radius:18px}
  .brand{min-width:0}.brand span:last-child{display:none}
  .stage-card{padding:20px 16px}
  .stage-nav{overflow-x:auto;grid-template-columns:repeat(4,minmax(92px,1fr));scrollbar-width:none}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .topbar:before,.stage-nav:before,.stage-footer:before,dialog[open]>form:before,.platform-select:before,.project-switcher:before,.login-card:before{filter:none}
}
html[data-glass-quality=reduced] .topbar:before,
html[data-glass-quality=reduced] .stage-nav:before,
html[data-glass-quality=reduced] .stage-footer:before,
html[data-glass-quality=reduced] dialog[open]>form:before,
html[data-glass-quality=reduced] .platform-select:before,
html[data-glass-quality=reduced] .project-switcher:before,
html[data-glass-quality=reduced] .login-card:before{filter:none}
@supports not (backdrop-filter:blur(1px)){
  .topbar,.stage-nav,.stage-footer,dialog[open]>form,.platform-select,.project-switcher,.login-card{background:var(--ui-panel)!important}
}