/* Canonical source inside the legacy HybridRoot konsole as well as the local app shell.
   Shared by the web shell, standalone console and production blueprints.
   Contract: design-system/alice-3/OVERLAY-MASTER.md. */
:root {
  --vc-overlay-surface: linear-gradient(180deg, rgba(6,20,28,.93), rgba(4,12,18,.96));
  --vc-overlay-outline: rgba(39,232,224,.26);
  --vc-overlay-divider: rgba(39,232,224,.14);
  --vc-overlay-text: #DFFBFF;
  --vc-overlay-muted: #AEBDC3;
  --vc-overlay-cut: polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px);
  --vc-overlay-font: "Segoe UI", system-ui, -apple-system, sans-serif;
}
.vc-overlay-panel {
  box-sizing: border-box; position: relative; display: flex; flex-direction: column;
  min-width: 0; min-height: 0; width: 100%; overflow: hidden;
  background: var(--vc-overlay-surface); color: var(--vc-overlay-text);
  border: 1px solid var(--vc-overlay-outline); border-radius: 0;
  box-shadow: 0 26px 70px #000000A6, inset 0 0 0 1px rgba(39,232,224,.06);
  clip-path: var(--vc-overlay-cut); -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px);
  font-family: var(--vc-overlay-font); letter-spacing: 0;
}
.vc-overlay-panel *, .vc-overlay-panel *::before, .vc-overlay-panel *::after { box-sizing: border-box; letter-spacing: 0; }
.vc-overlay-head {
  position: sticky; top: 0; z-index: 2; flex: 0 0 auto; min-height: 52px;
  display: flex; align-items: center; gap: 12px; padding: 4px 10px 4px 16px;
  border-bottom: 1px solid var(--vc-overlay-divider);
}
.vc-overlay-head > :is(h1,h2,h3,h4,b,strong,.vc-overlay-title) {
  flex: 1; min-width: 0; margin: 0; font: 700 11px/1.4 var(--vc-overlay-font);
  letter-spacing: 0; text-transform: uppercase; color: var(--vc-overlay-text);
  overflow-wrap: anywhere;
}
.vc-overlay-icon {
  position: relative; appearance: none; display: inline-grid; place-items: center;
  flex: 0 0 44px; width: 44px; height: 44px; min-width: 44px; min-height: 44px;
  padding: 0; margin: 0; border: 0; border-radius: 0; background: transparent;
  color: var(--vc-overlay-text); cursor: pointer; touch-action: manipulation;
}
.vc-overlay-icon::before {
  content: ""; position: absolute; inset: 7px; pointer-events: none;
  border: 1px solid var(--vc-overlay-outline); background: rgba(5,18,25,.7);
  clip-path: polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
}
.vc-overlay-icon svg { position: relative; width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; pointer-events: none; }
.vc-overlay-icon:hover { color: #27E8E0; }
.vc-overlay-icon:hover::before { border-color: rgba(39,232,224,.72); }
.vc-overlay-panel :focus-visible { outline: 2px solid #9CEFE9; outline-offset: 2px; border-radius: 0; }
.vc-overlay-icon:focus-visible { outline-offset: -3px; }
.vc-overlay-icon[hidden] { display: none; }
.vc-overlay-body {
  flex: 1 1 auto; min-height: 0; min-width: 0; overflow: auto; overscroll-behavior: contain;
  padding: 16px 16px 22px; overflow-wrap: anywhere; scrollbar-color: #285153 transparent;
  -webkit-overflow-scrolling: touch; font-size: 14px; line-height: 1.6;
}
.vc-overlay-panel .vc-overlay-body :is(h1,h2,h3) { font-size: 16px; line-height: 1.4; margin: 0 0 12px; }
.vc-overlay-body p { font-size: 14px; line-height: 1.6; color: var(--vc-overlay-muted); }
.vc-overlay-body :is(.sub,.s) { line-height: 1.6; white-space: normal; overflow-wrap: anywhere; }
.vc-overlay-panel .vc-overlay-body * { letter-spacing: 0; }
.vc-overlay-panel .vc-overlay-body :is(.vc-overlay-section,.card,.state,.item,.kpi,.vc-an-hint,.vc-chamber-copyblock,.vc-chamber-section,.vc-chamber-metric,.vc-chamber-quick-metric,.vc-chamber-risk,.vc-chamber-provider,.vc-chamber-traffic,.vc-chamber-health button,.vc-secure-step),
.vc-overlay-section {
  min-width: 0; padding: 16px 0; margin: 0; background: transparent; border: 0;
  border-bottom: 1px solid var(--vc-overlay-divider); border-radius: 0; box-shadow: none;
  -webkit-backdrop-filter: none; backdrop-filter: none; max-height: none; overflow: visible;
}
.vc-overlay-body .card:last-child, .vc-overlay-section:last-child { border-bottom: 0; }
.vc-overlay-body .list { gap: 0; }
.vc-overlay-body :is(.badge,.state) { border-radius: 0; }
.vc-overlay-panel :is(.btn,input:not([type="checkbox"]):not([type="radio"]),select,textarea) {
  min-height: 44px; max-width: 100%; border-radius: 0; white-space: normal;
}
.vc-overlay-panel :is(button,a,summary) { touch-action: manipulation; }
.vc-overlay-panel .vc-overlay-body button, .vc-overlay-body summary { min-width: 44px; min-height: 44px; border-radius: 0; }
.vc-overlay-body a { display: inline-flex; align-items: center; min-height: 44px; }
.vc-overlay-body .btn { line-height: 1.5; }
.vc-overlay-footer { flex: 0 0 auto; padding: 12px 16px; border-top: 1px solid var(--vc-overlay-divider); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }

.vc-sheet, .vc-drawer-sheet, .vc-public-overlay {
  position: fixed; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center;
  box-sizing: border-box; top: var(--vc-overlay-viewport-top, 0px); bottom: auto;
  height: var(--vc-overlay-viewport-height, 100dvh);
  padding: max(18px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
}
.vc-sheet-backdrop, .vc-drawer-backdrop {
  position: absolute; inset: 0; appearance: none; border: 0; border-radius: 0; padding: 0;
  background: rgba(0,0,0,.38); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); cursor: pointer;
}
.vc-sheet-panel, .vc-drawer-panel {
  max-width: 760px; max-height: 100%;
  animation: vc-overlay-enter .24s cubic-bezier(.22,1,.36,1);
}
.vc-drawer-sheet[aria-hidden="true"], .vc-drawer-sheet.hidden { display: none; }
.vc-sheet-body { display: block; }
.vc-sheet-body .item { align-items: flex-start; gap: 12px; }
.vc-sheet-body .item strong { min-width: 96px; }
.vc-sheet-body .item .s { overflow: visible; text-overflow: clip; color: var(--vc-overlay-muted); font-size: 14px; }
.vc-explain-status { display: block; font-size: 12px; color: var(--vc-overlay-muted); }
.vc-explain-status[data-tone="critical"] { color: #FFB7BF; }
.vc-explain-status[data-tone="observe"] { color: #F3C890; }
.vc-drawer-body :is(.vc-chamber-left,.vc-chamber-right) { display: grid; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
.vc-drawer-body .vc-chamber-nav { display: none; }
.vc-public-overlay { display: none; background: rgba(0,0,0,.38); }
.vc-public-overlay.on { display: flex; }
.vc-public-overlay .vc-overlay-panel { max-width: 760px; max-height: 100%; }
.console-zone { position: absolute; padding: 0; width: 214px; }
.console-zone .vc-overlay-body { margin-top: 0; height: auto; padding: 12px; }
.console-zone .scorebox { position: static; margin-top: 16px; padding: 16px 0; border-top: 1px solid var(--vc-overlay-divider); }
.console-zone .rbox { padding: 12px 0; border-bottom: 1px solid var(--vc-overlay-divider); }
.console-zone .vc-overlay-head { padding-inline: 12px; }
.console-zone .vc-overlay-icon { display: none; }
@media (max-width: 900px) {
  aside.console-zone { left: max(8px,var(--si-l)); right: max(8px,var(--si-r)); width: auto; padding: 0; }
  .console-zone .vc-overlay-icon { display: inline-grid; }
  .console-zone .vc-overlay-head { padding-inline: 16px 10px; }
  .console-zone .vc-overlay-body { padding: 16px; }
  .console-zone .titel { font-size: 14px; line-height: 1.5; }
  .console-zone .nav a { font-size: 13px; min-height: 44px; }
  .console-zone .fav { min-height: 44px; }
}
@keyframes vc-overlay-enter { from { opacity: 0; transform: scale(.96); } }
@media (max-width: 720px) {
  .vc-sheet, .vc-drawer-sheet, .vc-public-overlay { padding-inline: max(8px, env(safe-area-inset-left)) max(8px, env(safe-area-inset-right)); }
  .vc-overlay-body { padding-inline: 16px; }
}
@media (prefers-reduced-motion: reduce) { .vc-sheet-panel, .vc-drawer-panel { animation: none; } }
