:root {
  --gw-ink:#172033;
  --gw-strong:#0f172a;
  --gw-muted:#697386;
  --gw-line:rgba(148,163,184,.28);
  --gw-accent:#635bff;
  --gw-surface:linear-gradient(145deg,rgba(255,255,255,.98),rgba(246,248,252,.94));
  --gw-shadow:0 34px 90px rgba(15,23,42,.24),0 8px 26px rgba(15,23,42,.10),inset 0 1px 0 rgba(255,255,255,.92);
}

:is(#global-modal-overlay,#img-flow-wrap,#cmd-overlay,#prompt-library-overlay,#folder-manager-overlay,#speech-onboarding-overlay,#universal-model-overlay,#tracker-overlay,#dg-overlay,#visual-lib-overlay,#modeler-overlay,#agents-overlay,#podcast-overlay,#voice-overlay,#notepad-overlay,#notepad-tts-overlay,#ntts-translate-popup,#org-modal-overlay,#ob-overlay,#tw-overlay,#custom-confirm-overlay) {
  font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",sans-serif;
}

:is(#global-modal-overlay,#cmd-overlay,#prompt-library-overlay,#folder-manager-overlay,#speech-onboarding-overlay,#universal-model-overlay,#tracker-overlay,#dg-overlay,#visual-lib-overlay,#modeler-overlay,#agents-overlay,#podcast-overlay,#voice-overlay,#notepad-overlay,#notepad-tts-overlay,#ntts-translate-popup,#org-modal-overlay,#ob-overlay,#tw-overlay,#custom-confirm-overlay) {
  background:radial-gradient(circle at 18% 5%,rgba(129,140,248,.17),transparent 29%),radial-gradient(circle at 86% 92%,rgba(192,132,252,.11),transparent 30%),rgba(15,23,42,.50)!important;
  backdrop-filter:blur(18px) saturate(118%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(118%)!important;
}

:is(.custom-modal,#img-flow-box,.cmd-card,.prompt-modal,.folder-modal,.speech-modal,.universal-sheet,.tracker-modal,.dg-modal,.visual-modal,.modeler-modal,.podcast-card,.voice-card,.notepad-modal,#notepad-tts-card,.ntts-translate-box,.org-modal,#ob-modal,#tw-modal,.confirm-modal),
#agents-overlay>div {
  color:var(--gw-ink)!important;
  background:var(--gw-surface)!important;
  border:1px solid rgba(255,255,255,.82)!important;
  border-radius:22px!important;
  box-shadow:var(--gw-shadow)!important;
}

:is(.custom-modal,#img-flow-box,.cmd-card,.prompt-modal,.folder-modal,.speech-modal,.universal-sheet,.tracker-modal,.dg-modal,.visual-modal,.podcast-card,.voice-card,.notepad-modal,#notepad-tts-card,.ntts-translate-box,.org-modal,#ob-modal,#tw-modal,#agents-overlay>div) :is(h1,h2,h3,h4,h5,strong) {
  color:var(--gw-strong)!important;
}

:is(.custom-modal,#img-flow-box,.cmd-card,.prompt-modal,.folder-modal,.speech-modal,.universal-sheet,.tracker-modal,.dg-modal,.visual-modal,.podcast-card,.voice-card,.notepad-modal,#notepad-tts-card,.ntts-translate-box,.org-modal,#ob-modal,#tw-modal,#agents-overlay>div) :is(p,small,label) {
  color:var(--gw-muted)!important;
}

:is(.prompt-header,.folder-header,.speech-header,.us-header,.visual-header,.modeler-header,.dg-header,.org-modal-header,.notepad-header,#ntts-header,.cmd-header,.cmd-tabs,.visual-tabs,.dg-toolbar,.dg-filter-bar,.org-tabs) {
  background:rgba(255,255,255,.74)!important;
  border-color:var(--gw-line)!important;
}

:is(.prompt-sidebar,.folder-sidebar,.prompt-grid-container,.folder-content-area,.visual-grid,.us-content,.us-footer) {
  background:rgba(247,249,252,.72)!important;
  border-color:var(--gw-line)!important;
}

:is(.ifh-opt,.ifh-style,.ifh-chip,.cmd-item,.prompt-card,.folder-chat-card,.speech-lang-btn,.us-category,.us-btn,.us-persona,.agent-card,.voice-option,.dg-card,.eq-card,.ntts-voice-pill,.ntts-lang-btn,.org-member-row) {
  color:var(--gw-ink)!important;
  background:rgba(255,255,255,.74)!important;
  border:1px solid var(--gw-line)!important;
  box-shadow:0 7px 18px rgba(15,23,42,.045),inset 0 1px 0 #fff!important;
}

:is(.ifh-opt,.ifh-style,.ifh-chip,.cmd-item,.prompt-card,.folder-chat-card,.speech-lang-btn,.us-btn,.us-persona,.agent-card,.voice-option,.dg-card,.ntts-voice-pill,.ntts-lang-btn):hover,
:is(.ifh-style,.ifh-chip,.category-btn,.folder-btn,.us-btn,.us-persona,.ntts-voice-pill,.dg-chip).active {
  color:#4338ca!important;
  background:rgba(245,243,255,.96)!important;
  border-color:rgba(99,91,255,.45)!important;
}

:is(.modal-input,.ifh-input,.dg-search,.dg-sort,.org-input,.modeler-input,#notepad-textarea,#notepad-tts-textarea,#agents-overlay input,#agents-overlay textarea,.pod-voice-select) {
  color:var(--gw-ink)!important;
  background:rgba(255,255,255,.82)!important;
  border:1px solid var(--gw-line)!important;
}

:is(.modal-input,.ifh-input,.dg-search,.dg-sort,.org-input,.modeler-input,#notepad-textarea,#notepad-tts-textarea,#agents-overlay input,#agents-overlay textarea,.pod-voice-select):focus {
  border-color:rgba(99,91,255,.58)!important;
  box-shadow:0 0 0 4px rgba(99,91,255,.09)!important;
}

#img-flow-backdrop {
  background:radial-gradient(circle at 20% 8%,rgba(129,140,248,.17),transparent 30%),rgba(15,23,42,.50)!important;
  backdrop-filter:blur(18px) saturate(120%);
}
#img-flow-box {
  width:min(480px,calc(100% - 28px))!important;
  padding:20px 18px 16px!important;
}
#img-flow-inner { position:relative; z-index:1; }
#img-flow-box .ifh-stage { display:flex; flex-direction:column; gap:14px; }
#img-flow-box .ifh-hero {
  position:relative;
  overflow:hidden;
  padding:18px 18px 16px;
  border-radius:22px;
  background:
    radial-gradient(circle at top right,rgba(99,91,255,.13),transparent 38%),
    linear-gradient(180deg,rgba(255,255,255,.92),rgba(248,250,255,.74));
  border:1px solid rgba(255,255,255,.88);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.94),0 10px 28px rgba(15,23,42,.06);
}
#img-flow-box .ifh-hero-head { display:flex; align-items:center; gap:14px; }
#img-flow-box .ifh-hero-icon {
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  font-size:1.4rem;
  border-radius:16px;
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(235,239,255,.86));
  border:1px solid rgba(255,255,255,.94);
  box-shadow:0 12px 22px rgba(99,91,255,.10);
}
#img-flow-box .ifh-hero-copy { display:flex; flex-direction:column; gap:4px; min-width:0; }
#img-flow-box .ifh-eyebrow {
  margin-bottom:10px;
  color:#6b7280!important;
  font-size:.70rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}
#img-flow-box .ifh-badge {
  display:inline-flex;
  align-items:center;
  margin-top:12px;
  padding:7px 11px;
  border-radius:999px;
  background:rgba(255,255,255,.88);
  border:1px solid rgba(148,163,184,.22);
  color:#5b6473!important;
  font-size:.74rem;
  font-weight:700;
}
#img-flow-box .ifh-note,
#img-flow-box .ifh-panel {
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.66);
  border:1px solid rgba(148,163,184,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.88);
}
#img-flow-box .ifh-note {
  color:var(--gw-muted)!important;
  font-size:.88rem;
  line-height:1.45;
}
#img-flow-box .ifh-provider-stack { display:flex; flex-direction:column; gap:14px; }
#img-flow-box .ifh-provider-title {
  margin:2px 4px 8px;
  color:#7a8393!important;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}
#img-flow-box .ifh-opts { display:flex; flex-direction:column; gap:7px; }
#img-flow-box .ifh-opts.ifh-opts-compact { gap:8px; }
#img-flow-box .ifh-opt {
  display:flex!important;
  align-items:center;
  gap:10px;
  min-height:62px;
}
#img-flow-box .ifh-opt .ifh-icon {
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  flex-shrink:0;
  font-size:1.2rem;
  border-radius:10px;
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(239,243,255,.78));
  border:1px solid rgba(255,255,255,.95);
}
#img-flow-box .ifh-opt .ifh-info { flex:1; min-width:0; }
#img-flow-box .ifh-opt .ifh-info strong {
  display:block;
  margin-bottom:2px;
  font-size:.86rem;
  letter-spacing:-.01em;
}
#img-flow-box .ifh-opt .ifh-info small {
  display:block;
  line-height:1.3;
  font-size:.7rem;
}
#img-flow-box .ifh-arrow {
  color:#9aa3b2!important;
  font-size:1rem;
  font-weight:800;
}
#img-flow-box .ifh-section-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
#img-flow-box .ifh-section-meta {
  color:#8b94a3!important;
  font-size:.73rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
}
#img-flow-box :is(.ifh-title,.ifh-section-label) { color:var(--gw-strong)!important; }
#img-flow-box :is(.ifh-subtitle,.ifh-back,.ifh-info small) { color:var(--gw-muted)!important; }
.ifh-dot,.ob-dot,.tw-dot { background:#d9dee8!important; }
.ifh-dot.active,.ob-dot.active,.tw-dot.active { width:18px!important;border-radius:999px!important;background:linear-gradient(90deg,#6d67ff,#8b5cf6)!important; }
#img-flow-box .ifh-styles {
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:6px;
  margin-bottom:0!important;
}
#img-flow-box .ifh-style {
  display:flex!important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-height:54px;
  padding:7px 5px!important;
  text-align:center!important;
}
#img-flow-box .ifh-style .ifh-sicon {
  margin-bottom:0!important;
  font-size:1.05rem;
}
#img-flow-box .ifh-style-copy {
  display:flex;
  flex-direction:column;
  gap:4px;
}
#img-flow-box .ifh-style-copy strong {
  font-size:.96rem;
  line-height:1.2;
}
#img-flow-box .ifh-style-copy small {
  color:var(--gw-muted)!important;
  font-size:.76rem;
  line-height:1.38;
}
#img-flow-box .ifh-input { margin-bottom:0!important; }
#img-flow-box .ifh-chips-wrap { gap:5px!important; }
#img-flow-box .ifh-chip {
  min-height:30px;
  padding:5px 9px!important;
  font-size:.7rem!important;
  font-weight:650;
}
#img-flow-box .ifh-back { margin-top:2px!important; }

:is(.modal-btn.primary,.ifh-gen-btn,.org-btn-primary,.ob-btn-next,.tw-btn-next,#notepad-tts-generate) {
  color:#fff!important;
  background:linear-gradient(135deg,#6d67ff,#7046d9)!important;
  border-color:rgba(91,76,220,.45)!important;
  box-shadow:0 10px 22px rgba(99,91,255,.23),inset 0 1px 0 rgba(255,255,255,.25)!important;
}

:is(.modal-btn.secondary,.org-btn-ghost,.ntts-translate-cancel) {
  color:#596477!important;
  background:rgba(255,255,255,.74)!important;
  border:1px solid var(--gw-line)!important;
}

.notepad-tabs-container { background:rgba(244,246,250,.86)!important;border-color:var(--gw-line)!important; }
.note-tab { color:#7b8495!important;background:rgba(235,239,245,.76)!important; }
.note-tab.active { color:var(--gw-strong)!important;background:#fff!important;border-color:var(--gw-line)!important; }
.modeler-body,.lab-editor,.preview-content pre,.CodeMirror { color-scheme:dark; }
.modeler-controls { background:rgba(255,255,255,.92)!important;border-color:rgba(255,255,255,.74)!important;box-shadow:0 22px 50px rgba(0,0,0,.28)!important; }
.pod-status,.pod-setup-title,.voice-card h3,.org-member-name,.dg-card-name,.agent-name { color:var(--gw-strong)!important;text-shadow:none!important; }
.org-member-email,.dg-card-meta,.pod-voice-label,.notepad-status { color:var(--gw-muted)!important; }
.tracker-progress-bg,.pod-audio-progress { background:rgba(226,232,240,.9)!important;border-color:var(--gw-line)!important; }

.geek-panel {
  color:var(--gw-ink)!important;
  background:rgba(255,255,255,.92)!important;
  border-color:rgba(255,255,255,.76)!important;
  border-left:3px solid var(--gw-accent)!important;
  box-shadow:-18px 12px 44px rgba(15,23,42,.18),inset 0 1px 0 #fff!important;
}
.geek-panel h3,.stat-group span { color:var(--gw-strong)!important; }
.stat-group label { color:var(--gw-muted)!important; }

/* Shared Project Code Lab frame language. Independent tools keep their
   natural width, while full-height tools are constrained by the overlay's
   18px desktop inset instead of touching the viewport edges. */
body > [id^="ind-tool-"][id$="-overlay"] {
  padding:18px!important;
  box-sizing:border-box!important;
}
body > [id^="ind-tool-"][id$="-overlay"] :is(.it-card,.music-studio-modal,.vt-card) {
  max-height:calc(100dvh - 36px)!important;
  border-radius:22px!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.16)!important;
  box-shadow:0 34px 90px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.12)!important;
}
#ind-tool-music-gen-overlay .music-studio-modal {
  height:calc(100dvh - 36px)!important;
}
#ind-tool-music-gen-overlay .music-studio-scroll {
  height:100%!important;
  max-height:100%!important;
}

@media(min-width:821px){
  :is(#flux-assisted-studio,.ave-root,#gallery-video-stitcher) {
    inset:18px!important;
    width:auto!important;
    height:auto!important;
    max-width:none!important;
    max-height:none!important;
    border:1px solid rgba(255,255,255,.16)!important;
    border-radius:22px!important;
    overflow:hidden!important;
    box-shadow:0 34px 90px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.12)!important;
  }
  #gallery-video-stitcher .gvs-shell { height:100%!important;border-radius:inherit!important;overflow:hidden!important; }
}

@media(max-width:700px){
  :is(.custom-modal,#img-flow-box,.prompt-modal,.folder-modal,.speech-modal,.universal-sheet,.tracker-modal,.dg-modal,.visual-modal,.podcast-card,.voice-card,#notepad-tts-card,.ntts-translate-box,.org-modal,#ob-modal,#tw-modal,#agents-overlay>div){
    width:calc(100% - 20px)!important;
    max-width:none!important;
    max-height:calc(100dvh - 20px)!important;
    border-radius:22px!important;
  }
  #img-flow-box { padding:18px 14px 14px!important; }
  #img-flow-box .ifh-hero { padding:16px 14px 14px; }
  #img-flow-box .ifh-hero-head { align-items:flex-start; }
  #img-flow-box .ifh-styles { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  #img-flow-box .ifh-opt { min-height:58px; }
  #img-flow-box .ifh-style { min-height:unset; }
}

@media(max-width:820px){
  body > [id^="ind-tool-"][id$="-overlay"] { padding:10px!important; }
  body > [id^="ind-tool-"][id$="-overlay"] :is(.it-card,.music-studio-modal,.vt-card) {
    max-height:calc(100dvh - 20px)!important;
    border-radius:18px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  :is(#global-modal-overlay,#img-flow-wrap,#cmd-overlay) * { animation-duration:.01ms!important;transition-duration:.01ms!important; }
}

/* One input language across every Light-mode workspace: editable boxes are
   deliberately high-contrast black, while native toggles and media controls
   retain their platform appearance. The :not() ID raises specificity above
   older tool-local !important declarations without requiring per-tool fixes. */
html.light-mode body:not(#asksary-input-theme) :is(
  input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
  textarea,
  select
) {
  color-scheme:dark!important;
  background:#050505!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  caret-color:#fff!important;
  border-color:#2d3036!important;
  opacity:1!important;
}
html.light-mode body:not(#asksary-input-theme) :is(input,textarea)::placeholder {
  color:#a9adb5!important;
  -webkit-text-fill-color:#a9adb5!important;
  opacity:1!important;
}
html.light-mode body:not(#asksary-input-theme) select option {
  background:#050505!important;
  color:#fff!important;
}
html.light-mode body:not(#asksary-input-theme) :is(input,textarea):focus {
  border-color:#8b5cf6!important;
  box-shadow:0 0 0 3px rgba(139,92,246,.18)!important;
  outline:none!important;
}

@media(min-width:821px){
  html body.coding-lab-open #code-canvas-container.coding-lab-split,
  html body #code-canvas-container.architect-workspace {
    position:fixed!important;
    inset:18px!important;
    width:auto!important;
    height:auto!important;
    max-width:none!important;
    max-height:none!important;
    border:1px solid rgba(255,255,255,.16)!important;
    border-radius:22px!important;
    overflow:hidden!important;
    box-shadow:0 34px 90px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.12)!important;
  }
  html body #global-modal-overlay[data-variant="web-architect"] {
    padding:18px!important;
    align-items:stretch!important;
    background:rgba(0,0,0,.72)!important;
    backdrop-filter:blur(14px)!important;
  }
  html body #global-modal-overlay[data-variant="web-architect"] .custom-modal {
    width:100%!important;
    height:calc(100dvh - 36px)!important;
    max-height:calc(100dvh - 36px)!important;
    border:1px solid rgba(255,255,255,.16)!important;
    border-radius:22px!important;
    overflow:hidden!important;
    box-shadow:0 34px 90px rgba(0,0,0,.42)!important;
  }
}