@import url("/design-tokens.css");
@import url("/widget.css");
html[data-design="blue"] body {
  isolation: isolate;
  background-color: var(--bg);
  background-image: none;
  color: var(--text);
  font-family: var(--font-ui);
  -webkit-font-smoothing: antialiased;
}
/* Two compositor layers. Solid content surfaces shield long-form text and clinical records. */
html[data-design="blue"] body::before,
html[data-design="blue"] body::after {
  content: "";
  position: fixed;
  inset: -2%;
  z-index: -1;
  pointer-events: none;
}
html[data-design="blue"] body::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1100' height='850' viewBox='0 0 1100 850'%3E%3Cg fill='none' stroke='%232563EB' stroke-width='1'%3E%3Cpath d='M60 150L280 55 465 210 350 440 105 395ZM620 180L895 80 1060 320 920 545 675 460ZM280 55L620 180M465 210L675 460M350 440L545 715 920 545'/%3E%3Ccircle cx='855' cy='610' r='175'/%3E%3Cpath d='M30 670A240 240 0 0 1 400 790'/%3E%3C/g%3E%3Cg fill='%233B82F6'%3E%3Ccircle cx='60' cy='150' r='4'/%3E%3Ccircle cx='280' cy='55' r='4'/%3E%3Ccircle cx='465' cy='210' r='4'/%3E%3Ccircle cx='350' cy='440' r='4'/%3E%3Ccircle cx='620' cy='180' r='4'/%3E%3Ccircle cx='675' cy='460' r='4'/%3E%3Ccircle cx='920' cy='545' r='4'/%3E%3C/g%3E%3C/svg%3E"),
    linear-gradient(#2563EB 1px, transparent 1px), linear-gradient(90deg, #2563EB 1px, transparent 1px);
  background-size: 1100px 850px, 64px 64px, 64px 64px;
  opacity: var(--blue-geometry-opacity);
  animation: piros-blue-drift 54s ease-in-out infinite alternate;
}
html[data-design="blue"] body::after {
  background: radial-gradient(ellipse at 12% 12%, #3B82F6, transparent 58%), radial-gradient(ellipse at 90% 85%, #2563EB, transparent 52%);
  opacity: var(--blue-light-opacity);
  animation: piros-blue-light 42s ease-in-out infinite alternate;
}
@keyframes piros-blue-drift { from { transform: translate3d(-.5%, 0, 0); } to { transform: translate3d(.5%, .7%, 0); } }
@keyframes piros-blue-light { from { transform: translate3d(0, -.5%, 0); opacity: .01; } to { transform: translate3d(0, .5%, 0); opacity: var(--blue-light-opacity); } }
@keyframes piros-blue-enter { from { opacity: .65; transform: translateY(3px); } to { opacity: 1; transform: translateY(0); } }
html[data-design="blue"] :is(h1,h2,h3,.logo-name,.tb-title,.devh-title) { font-family: var(--font-ui); letter-spacing: -.025em; }
html[data-design="blue"] :is(.logo-name,.tb-title) { font-weight:var(--weight-heavy); }
html[data-design="blue"] :is(button,input,select,textarea) { font-family: inherit; }
html[data-design="blue"] :is(.devh-kpi-value,.stat-val,.kpi-val,.kpi-v,.ac-stat-value,td) { font-variant-numeric: tabular-nums; }
html[data-design="blue"] :is(.devh-kpi-label,.devh-kpi-note) { font-size:var(--font-xs); line-height: 1.5; }
html[data-design="blue"] :is(.card,.devh-card,.ac-stat,.ac-type,.facility-selector,.session-warning,.account-dialog) {
  border-radius: var(--radius-surface);
  border: 1px solid var(--border);
  box-shadow: var(--surface-shadow);
  background-color: var(--card);
}

html[data-design="blue"] .workspace-shell .devh-kpis { border: 1px solid var(--border); box-shadow: var(--surface-shadow); }

html[data-design="blue"] .workspace-shell :is(.sb,.topbar) {
  background: linear-gradient(160deg, color-mix(in srgb, var(--s1) 97%, var(--electric)), var(--s1) 70%);
  border-color: var(--border);
}
html[data-design="blue"] :is(.dock-item,.ni,.dash-btn,.context-tab,.facility-choice,.btn,.devh-action,.piros-nav-card,.inp) {
  transition: background-color var(--duration-fast) var(--ease), border-color var(--duration-fast) var(--ease), color var(--duration-fast) var(--ease), box-shadow var(--duration-fast) var(--ease), transform var(--duration-fast) var(--ease);
}
html[data-design="blue"] :is(.dock-item[aria-current="page"],.ni.act,.dash-btn.act) {
  background: color-mix(in srgb, var(--primary) 10%, var(--s1));
  color: var(--acc2);
  box-shadow: inset 3px 0 var(--primary);
}
html[data-design="blue"] .dock-item[aria-current="page"] svg { outline: none; }
html[data-design="blue"] .workspace-shell .sb { transition: width var(--duration-normal) var(--ease), min-width var(--duration-normal) var(--ease); }
html[data-design="blue"] .workspace-shell .main { transition: margin-left var(--duration-normal) var(--ease), width var(--duration-normal) var(--ease); }
html[data-design="blue"] :is(.btn-p,.devh-action.primary) {
  background: var(--primary);
  border-color: var(--primary);
  color: var(--primary-ink);
  box-shadow: 0 2px 3px rgb(37 99 235 / .12);
}
html[data-design="blue"] :is(.btn-p,.devh-action.primary):hover:not(:disabled) { background: var(--primary-hover); border-color: var(--primary-hover); color: var(--primary-ink); }
html[data-design="blue"] :is(.inp,.ac-input) { border-radius: var(--radius-control); }
html[data-design="blue"] :is(button,a,input,select,textarea,summary,[tabindex]):focus-visible { outline: 2px solid var(--acc2); outline-offset: 3px; }
html[data-design="blue"] :is(.piros-nav-card,.facility-choice):hover { border-color: var(--acc); }
html[data-design="blue"] :is(.devh-kpi-value,.ac-stat-value,.kpi-value) { animation: piros-blue-enter var(--duration-normal) var(--ease); }
html[data-design="blue"] .view.act { animation: piros-blue-enter var(--duration-fast) var(--ease)-out; }
html[data-design="blue"] :is(dialog[open],.mo.open .mbox,.account-modal.open .account-dialog) { animation: piros-blue-enter var(--duration-normal) var(--ease); }
html[data-design="blue"] .skeleton { background: var(--s3); }
html[data-design="blue"] :is(.logo-icon,.logo-mark,.logo) linearGradient stop { stop-color: #2563EB; }
html[data-design="blue"] :is(.logo-icon,.logo-mark,.logo) linearGradient stop:last-child { stop-color: #1D4ED8; }
html[data-design="blue"] .piros-av { background: linear-gradient(145deg, #2563EB, #1D4ED8); color: #FFFFFF; }
html[data-design="blue"] .piros-av.has-photo { background: var(--s2); }
html[data-design="blue"] .devh-link { color: var(--acc2); }
html[data-design="blue"] .devh-link.secondary { color: var(--text2); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  html[data-design="blue"] :is(a.card,button.card,.piros-nav-card):hover { transform: translateY(-2px); box-shadow: 0 6px 22px rgb(37 99 235 / .09); }
}
@media (max-width: 640px) {
  html[data-design="blue"] body::before,html[data-design="blue"] body::after { animation: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-design="blue"] *,html[data-design="blue"] *::before,html[data-design="blue"] *::after {
    animation: none !important; transition: none !important; scroll-behavior: auto !important;
  }
}
@media (forced-colors: active), print {
  html[data-design="blue"] body::before,html[data-design="blue"] body::after { display: none !important; }
}

html[data-design="blue"] .studio-page .btn:not(.sec):not(.danger):not(.btn-g) { background: var(--primary); color: var(--primary-ink); }
html[data-design="blue"] .studio-page .btn:not(.sec):not(.danger):not(.btn-g):hover:not(:disabled) { background: var(--primary-hover); }
html[data-design="blue"] .mlr-fill .btn.sec { background: var(--s2); }
html[data-design="blue"] input::placeholder,html[data-design="blue"] textarea::placeholder { color: var(--text2); opacity: 1; }
html[data-design="blue"] [data-web="headline"] em { color: var(--acc2); font-family: var(--font-ui); }

html[data-design="blue"] .logo-tag { color: var(--acc2); }
