:root{--font-sans: "SUIT Variable", "Pretendard Variable", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;--color-bg: #07101d;--color-bg-elevated: #0d1728;--color-bg-panel: rgba(8, 16, 31, .82);--color-bg-panel-strong: rgba(12, 23, 41, .94);--color-bg-soft: rgba(255, 255, 255, .04);--color-line: rgba(164, 192, 255, .14);--color-line-strong: rgba(164, 192, 255, .3);--color-text: #eef4ff;--color-text-dim: #95a8d4;--color-grid-major: rgba(84, 120, 200, .12);--color-grid-minor: rgba(84, 120, 200, .06);--color-network: #53c8ff;--color-compute: #7df0c2;--color-database: #f4a261;--color-storage: #99c17d;--color-integration: #d98bff;--color-analytics: #ffd166;--color-external: #ff7c8f;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-7: 32px;--space-8: 40px;--space-9: 56px;--radius-sm: 12px;--radius-md: 18px;--radius-lg: 26px;--radius-xl: 34px;--shadow-soft: 0 24px 64px rgba(0, 0, 0, .34);--shadow-panel: 0 28px 90px rgba(0, 0, 0, .42);--shadow-focus: 0 0 0 1px rgba(255, 255, 255, .18), 0 0 0 4px rgba(125, 240, 194, .14);--transition-fast: .16s ease;--transition-medium: .26s ease;--viewport-inset: 12px;--overlay-width: clamp(296px, 24vw, 336px);--overview-width: min(1024px, calc(100vw - (2 * var(--viewport-inset))));--hud-width: min(320px, calc(100vw - (2 * var(--viewport-inset))));--details-width: min(432px, calc(100vw - (2 * var(--viewport-inset))));--overlay-top: clamp(88px, 11vh, 120px)}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;height:100%;min-height:100%;overflow:hidden;overscroll-behavior:none}body{font-family:var(--font-sans);background:radial-gradient(circle at top left,rgba(217,139,255,.14),transparent 28%),radial-gradient(circle at top right,rgba(83,200,255,.18),transparent 34%),radial-gradient(circle at bottom center,rgba(255,209,102,.08),transparent 32%),var(--color-bg);color:var(--color-text);overflow:hidden}.passwordGateShell{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 18% 18%,rgba(83,200,255,.18),transparent 26%),radial-gradient(circle at 82% 20%,rgba(217,139,255,.16),transparent 28%),linear-gradient(180deg,#050b15fa,#08101ffa)}.passwordGateCard{width:min(420px,calc(100vw - 48px));padding:28px;border-radius:24px;border:1px solid rgba(255,255,255,.08);background:#0a121feb;box-shadow:0 28px 90px #00000075}.passwordGateEyebrow{margin:0 0 8px;color:var(--color-network);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.passwordGateCard h1{margin:0;font-size:28px}.passwordGateBody{margin:10px 0 20px;color:var(--color-text-dim)}.passwordGateForm{display:grid;gap:14px}.passwordGateField{display:grid;gap:8px}.passwordGateField span{font-size:13px;color:var(--color-text-dim)}.passwordGateField input{width:100%;height:48px;padding:0 14px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:#ffffff0a;color:var(--color-text);outline:none}.passwordGateField input:focus{border-color:#53c8ffb8;box-shadow:var(--shadow-focus)}.passwordGateError{margin:0;color:#ff9cab;font-size:13px}.passwordGateButton{height:48px;border:0;border-radius:14px;background:linear-gradient(135deg,#53c8ffe6,#7df0c2e6);color:#04101d;font-weight:800}button,input{font:inherit}button{cursor:pointer}.viewerShell,.topologyApp{width:100%;height:100%;min-height:100%}.viewerShell{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100dvh;overflow:hidden;isolation:isolate}.viewerSceneLayer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden}.viewerHudLayer{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100dvh;z-index:40;pointer-events:none;overflow:hidden}.viewerHudLayer>*{pointer-events:auto}.canvasSection{position:relative;width:100%;height:100%;min-height:100%;overflow:hidden;padding:0;isolation:isolate}.canvasStage{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}.canvasViewport{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;width:100%;min-height:100svh;height:100svh;border-radius:0;border:0;background:radial-gradient(circle at 20% 14%,rgba(83,200,255,.14),transparent 28%),radial-gradient(circle at 82% 20%,rgba(217,139,255,.14),transparent 30%),radial-gradient(circle at 55% 78%,rgba(125,240,194,.08),transparent 34%),linear-gradient(180deg,#050b15fa,#08101ff5);box-shadow:inset 0 0 0 1px #ffffff0a;cursor:grab;touch-action:none;z-index:0;isolation:isolate}.canvasViewport:active{cursor:grabbing}.canvasViewport:before,.canvasViewport:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.canvasViewport:before{background:linear-gradient(90deg,rgba(83,200,255,.04),transparent 22%,transparent 78%,rgba(217,139,255,.04)),radial-gradient(circle at center,transparent 42%,rgba(83,200,255,.05) 100%)}.canvasViewport:after{background-image:linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px);background-size:100% 7px;opacity:.12}.canvasGrid,.canvasWorld,.edgeLayer,.canvasWorldLayer{position:absolute}.canvasGrid{top:-20%;right:-20%;bottom:-20%;left:-20%;pointer-events:none}.canvasGrid-major{background-image:linear-gradient(var(--color-grid-major) 1px,transparent 1px),linear-gradient(90deg,var(--color-grid-major) 1px,transparent 1px);background-size:220px 220px}.canvasGrid-minor{background-image:linear-gradient(var(--color-grid-minor) 1px,transparent 1px),linear-gradient(90deg,var(--color-grid-minor) 1px,transparent 1px);background-size:44px 44px}.canvasWorld{inset:0 auto auto 0;transform-origin:0 0;will-change:transform;backface-visibility:hidden;isolation:isolate}.canvasWorldLayer,.canvasWorldLayer--edges,.canvasWorldLayer--groups,.canvasWorldLayer--nodes{top:0;right:0;bottom:0;left:0}.canvasWorldLayer--edges{z-index:20;pointer-events:none}.canvasWorldLayer--groups{z-index:10;pointer-events:none}.canvasWorldLayer--nodes{z-index:30;pointer-events:none}.canvasWorldLayer--nodes .nodeCard{pointer-events:auto}.edgeLayer{top:0;right:0;bottom:0;left:0;overflow:visible;pointer-events:none}.edge path{fill:none;stroke-width:2.4;stroke-linecap:round;vector-effect:non-scaling-stroke}.edge-network path,.edge-dns path{stroke:#53c8ffa3}.edge-serves path,.edge-hosts path,.edge-storage path{stroke:#7df0c29e}.edge-invoke path{stroke:#d98bffad}.edge-data path,.edge-orchestration path{stroke:#ffd166a8}.edge.is-inferred path{stroke-dasharray:10 10;opacity:.74}.edge.is-flow-boundary-in path{stroke:color-mix(in srgb,var(--color-external) 42%,var(--color-network) 58%);stroke-width:3.6;opacity:.98}.edge.is-flow-boundary-out path{stroke:color-mix(in srgb,var(--color-analytics) 78%,white 12%);stroke-width:3.4;opacity:.96}.edge.is-flow-internal path{stroke-width:1.6;opacity:.26}.edge.is-flow-local path{stroke-width:2;opacity:.46}.canvasChrome,.canvasModeSwitcher,.overlayOverview,.leftOverlayStack,.canvasHud,.detailsDrawer{position:absolute}.canvasChrome,.canvasModeSwitcher{z-index:12}.overlayOverview,.leftOverlayStack,.canvasHud{z-index:11}.detailsDrawer{z-index:13}.overlayOverview,.canvasModeSwitcher,.canvasHud,.detailsDrawer{pointer-events:auto}.canvasChrome,.leftOverlayStack{pointer-events:none}.canvasChrome>*,.leftOverlayStack>*{pointer-events:auto}.canvasChrome{inset:var(--viewport-inset) var(--viewport-inset) auto var(--viewport-inset);display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:var(--space-2)}.canvasModeSwitcher{top:var(--viewport-inset);left:var(--viewport-inset);right:var(--viewport-inset);width:max-content;margin-inline:auto;padding:4px 8px;border-radius:999px}.modeSwitchRail{display:inline-flex;align-items:center;gap:var(--space-2)}.modeSwitchButton{border:0;background:transparent;color:var(--color-text-dim);padding:0;font-size:13px;line-height:1.2;transition:color var(--transition-fast),opacity var(--transition-fast)}.modeSwitchButton:hover{color:var(--color-text)}.modeSwitchButton.is-active{color:var(--color-text);font-weight:700}.modeSwitchDivider{color:var(--color-text-dim);font-size:12px}.chromeIdentity{padding:var(--space-2) var(--space-3)}.chromeIdentity--minimal{display:inline-flex;align-items:center}.chromeIdentity--minimal strong{font-size:14px;line-height:1.2;white-space:nowrap}.identityRow{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);flex-wrap:wrap}.identityRow strong{font-size:.95rem;line-height:1.2}.brandSignals,.chromeActions,.panelActionsInline,.searchMetaRow,.detailMetaRow,.canvasActions{display:flex;flex-wrap:wrap;gap:var(--space-2)}.chromeActions{justify-content:flex-end}.chromeActions--minimal{gap:var(--space-1)}.eyebrow,.groupEyebrow{margin:0 0 var(--space-2);color:var(--color-text-dim);letter-spacing:.18em;text-transform:uppercase;font-size:.6875rem}.panel,.metaBadge,.summaryCard,.detailsBlock{border:1px solid var(--color-line);background:linear-gradient(180deg,var(--color-bg-panel-strong),var(--color-bg-panel));-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:var(--shadow-soft)}.groupCard,.nodeCard{border:1px solid var(--color-line);background:linear-gradient(180deg,#0c1729f0,#08101fe6)}.panel{border-radius:var(--radius-lg);padding:var(--space-4)}.toolbarToggle,.ghostButton,.filterChip{border:1px solid var(--color-line);background:#ffffff0d;color:var(--color-text);transition:transform var(--transition-fast),border-color var(--transition-fast),background var(--transition-fast),opacity var(--transition-fast)}.toolbarToggle,.ghostButton{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:38px;border-radius:999px;padding:0 var(--space-3)}.toolbarToggle{min-width:5.5rem}.toolbarToggle--minimal{min-width:0;min-height:28px;padding:0 var(--space-2);font-size:13px}.toolbarToggle strong{display:inline-flex;align-items:center;justify-content:center;min-width:1.75rem;height:1.75rem;border-radius:999px;background:#ffffff14;color:var(--color-text-dim);font-size:.75rem}.toolbarToggle.is-active,.toolbarToggle:hover,.ghostButton:hover,.filterChip:hover,.nodeCard:hover{transform:translateY(-1px)}.toolbarToggle.is-active{border-color:#53c8ff6b;background:#53c8ff24}.toolbarToggle:disabled,.ghostButton:disabled,.filterChip:disabled{opacity:.48;cursor:not-allowed;transform:none}.overlayOverview{top:var(--overlay-top);left:var(--viewport-inset);right:var(--viewport-inset);width:var(--overview-width);margin-inline:auto;z-index:5}.metaBadgeGrid,.summaryStrip{display:grid;gap:var(--space-3)}.metaBadgeGrid{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:var(--space-4)}.summaryStrip{grid-template-columns:repeat(4,minmax(0,1fr))}.metaBadge,.summaryCard{border-radius:var(--radius-md);padding:var(--space-4)}.metaBadge span,.summaryLabel,.panelHeader span,.helperText,.searchField span,.detailList dt,.relationCard p,.relationCard small,.emptyText,.hudMetric span{color:var(--color-text-dim)}.metaBadge strong,.summaryCard strong,.hudMetric strong{display:block;margin-top:var(--space-1);font-size:1.15rem}.summaryCard small,.helperText,.groupCard p,.nodeCard p,.nodeCard small,.detailBullets,.detailList,.relationList,.detailsDrawerHeader p,.relationCard p,.relationCard small{margin:0;font-size:.8125rem;line-height:1.6}.summaryCard small{display:none}.leftOverlayStack{top:var(--overlay-top);left:var(--viewport-inset);width:var(--overlay-width);display:grid;gap:var(--space-2);z-index:5}.overlayPanel{padding:var(--space-3);max-height:min(68vh,40rem);overflow:auto}.overlaySearch,.overlayFilters{width:100%}.panelHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-2)}.panelHeader h2,.panelHeader h3,.detailsDrawerHeader h2{margin:0;font-size:1.0625rem}.compactHeader{align-items:center}.searchField{display:grid;gap:var(--space-2)}.searchField--minimal{gap:0}.searchField--minimal span{display:none}.searchField input{border:1px solid var(--color-line);border-radius:var(--radius-sm);background:#ffffff0d;color:var(--color-text);padding:var(--space-2) var(--space-3);outline:none;transition:border-color var(--transition-fast),box-shadow var(--transition-fast),background var(--transition-fast)}.searchField input:focus{border-color:#ffffff52;box-shadow:var(--shadow-focus);background:#ffffff14}.stackSection+.stackSection{margin-top:var(--space-5);padding-top:var(--space-5);border-top:1px solid var(--color-line)}.chipGrid,.chipRow{display:flex;flex-wrap:wrap;gap:var(--space-2)}.filterChip{display:inline-flex;align-items:center;justify-content:space-between;gap:var(--space-2);min-width:7rem;border-radius:999px;padding:.625rem .875rem}.filterChip.is-compact{min-width:auto}.filterChip strong{color:var(--color-text-dim)}.filterChip[data-tone=network],.badge[data-tone=network],.nodeHintLine[data-tone=network],.networkHintCard[data-tone=network]{--tone: var(--color-network)}.filterChip[data-tone=compute],.badge[data-tone=compute],.nodeHintLine[data-tone=compute],.networkHintCard[data-tone=compute]{--tone: var(--color-compute)}.filterChip[data-tone=database],.badge[data-tone=database],.nodeHintLine[data-tone=database],.networkHintCard[data-tone=database]{--tone: var(--color-database)}.filterChip[data-tone=storage],.badge[data-tone=storage],.nodeHintLine[data-tone=storage],.networkHintCard[data-tone=storage]{--tone: var(--color-storage)}.filterChip[data-tone=integration],.badge[data-tone=integration],.nodeHintLine[data-tone=integration],.networkHintCard[data-tone=integration]{--tone: var(--color-integration)}.filterChip[data-tone=analytics],.badge[data-tone=analytics],.nodeHintLine[data-tone=analytics],.networkHintCard[data-tone=analytics]{--tone: var(--color-analytics)}.filterChip[data-tone=external],.badge[data-tone=external],.nodeHintLine[data-tone=external],.networkHintCard[data-tone=external]{--tone: var(--color-external)}.filterChip.is-active{border-color:color-mix(in srgb,var(--tone) 72%,white 10%);background:color-mix(in srgb,var(--tone) 18%,transparent)}.canvasHud{left:var(--viewport-inset);bottom:var(--viewport-inset);width:var(--hud-width)}.canvasHud--minimal{width:auto;padding:4px 8px}.hudMetrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-2);margin-bottom:var(--space-3)}.hudMetric{padding:var(--space-3);border-radius:var(--radius-sm);background:#ffffff0a;border:1px solid rgba(255,255,255,.06)}.canvasActions--minimal{align-items:center;flex-wrap:nowrap;gap:var(--space-1)}.ghostButton--icon{min-width:34px;min-height:34px;padding:0 var(--space-2);font-size:15px}.scaleReadout{display:inline-flex;align-items:center;justify-content:center;min-width:64px;min-height:34px;padding:0 var(--space-2);color:var(--color-text-dim);font-size:12px}.groupCard{--group-drop-shadow: 0 8px 18px rgba(0, 0, 0, .16);position:absolute;overflow:hidden;border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:inset 0 0 0 1px #ffffff05,var(--group-drop-shadow);contain:paint}.groupCard:before,.groupCard:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.groupCard:before{border:1px dashed rgba(255,255,255,.16);border-radius:inherit}.groupCard:after{opacity:.06}.groupCard[data-tone=network]:after{background:radial-gradient(circle at top left,var(--color-network),transparent 58%)}.groupCard[data-tone=compute]:after{background:radial-gradient(circle at top left,var(--color-compute),transparent 58%)}.groupCard[data-tone=database]:after{background:radial-gradient(circle at top left,var(--color-database),transparent 58%)}.groupCard[data-tone=storage]:after{background:radial-gradient(circle at top left,var(--color-storage),transparent 58%)}.groupCard[data-tone=integration]:after{background:radial-gradient(circle at top left,var(--color-integration),transparent 58%)}.groupCard[data-tone=analytics]:after{background:radial-gradient(circle at top left,var(--color-analytics),transparent 58%)}.groupCard[data-tone=external]:after{background:radial-gradient(circle at top left,var(--color-external),transparent 58%)}.groupCard h3,.groupCard p,.groupEyebrow{position:relative;z-index:1}.groupCard h3{margin:0;font-size:1.625rem}.groupCard p{margin-top:var(--space-2)}.nodeCard{--node-ring: rgba(255, 255, 255, .18);--node-drop-shadow: 0 6px 16px rgba(0, 0, 0, .16);position:absolute;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-2);padding:var(--space-4);border-radius:var(--radius-md);text-align:left;color:var(--color-text);outline:none;overflow:hidden;transform:translateZ(0);will-change:transform;isolation:isolate;contain:paint;box-shadow:inset 0 0 0 1px var(--node-ring),var(--node-drop-shadow)}.nodeCard:after{content:"";position:absolute;inset:auto 0 0 0;height:3px;background:color-mix(in srgb,var(--tone) 80%,white 10%);opacity:.8}.nodeCard[data-size=sm]{width:188px;min-height:104px}.nodeCard[data-size=md]{width:220px;min-height:124px}.nodeCard[data-size=lg]{width:252px;min-height:142px}.nodeCard[data-tone=network]{--tone: var(--color-network);--node-ring: rgba(83, 200, 255, .22)}.nodeCard[data-tone=compute]{--tone: var(--color-compute);--node-ring: rgba(125, 240, 194, .22)}.nodeCard[data-tone=database]{--tone: var(--color-database);--node-ring: rgba(244, 162, 97, .22)}.nodeCard[data-tone=storage]{--tone: var(--color-storage);--node-ring: rgba(153, 193, 125, .22)}.nodeCard[data-tone=integration]{--tone: var(--color-integration);--node-ring: rgba(217, 139, 255, .22)}.nodeCard[data-tone=analytics]{--tone: var(--color-analytics);--node-ring: rgba(255, 209, 102, .22)}.nodeCard[data-tone=external]{--tone: var(--color-external);--node-ring: rgba(255, 124, 143, .22)}.nodeCard.is-selected{border-color:#ffffff57;transform:translateY(-2px) scale(1.02);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tone) 84%,white 10%),0 16px 34px #00000047}.nodeCard:hover{z-index:180!important}.nodeTopline{width:100%;display:flex;justify-content:space-between;gap:var(--space-2);align-items:center}.nodeCard strong{position:relative;z-index:1;font-size:1rem;line-height:1.35}.nodeCard--network{gap:var(--space-1)}.nodeNetworkHeadline{color:color-mix(in srgb,var(--tone) 34%,var(--color-text) 66%)}.nodeHintStack,.networkHintList{display:grid;gap:var(--space-1)}.nodeHintLine,.networkHintCard{--tone: var(--color-line-strong);border:1px solid color-mix(in srgb,var(--tone) 32%,var(--color-line) 68%);background:color-mix(in srgb,var(--tone) 10%,transparent)}.nodeHintLine{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--space-2);width:100%;padding:.3125rem .5rem;border-radius:999px;color:var(--color-text-dim);overflow:hidden}.nodeHintLabel,.networkHintLabel{color:color-mix(in srgb,var(--tone) 58%,var(--color-text-dim) 42%);font-size:.625rem;letter-spacing:.12em;text-transform:uppercase}.nodeHintValue{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--color-text)}.statusPill,.badge{display:inline-flex;align-items:center;border-radius:999px;padding:.375rem .625rem;font-size:.6875rem;line-height:1}.statusPill{border:1px solid var(--color-line);color:var(--color-text-dim);background:#ffffff0a}.badge{border:1px solid color-mix(in srgb,var(--tone) 58%,white 8%);background:color-mix(in srgb,var(--tone) 16%,transparent);color:color-mix(in srgb,var(--tone) 72%,white 22%)}.detailsDrawer{top:16px;right:calc((var(--details-width) + 16px) * -1);bottom:16px;width:var(--details-width);opacity:0;transition:right var(--transition-medium),bottom var(--transition-medium),opacity var(--transition-fast);pointer-events:none}.detailsDrawer.is-open{right:16px;opacity:1;pointer-events:auto}.detailsPanel{height:100%;display:grid;align-content:start;gap:var(--space-4);overflow:auto;padding:var(--space-5)}.detailsDrawerHeader{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-4);padding-bottom:var(--space-4);border-bottom:1px solid var(--color-line)}.detailsBlock{display:grid;gap:var(--space-4);border-radius:var(--radius-md);padding:var(--space-4)}.networkDetailHeadline{margin:0;color:var(--color-text);font-size:.9375rem}.networkHintCard{display:grid;gap:var(--space-1);border-radius:var(--radius-sm);padding:var(--space-3)}.networkHintCard strong{font-size:.9375rem;color:var(--color-text)}.detailList{display:grid;gap:var(--space-3)}.detailList div{display:grid;gap:var(--space-1);padding-bottom:var(--space-3);border-bottom:1px solid var(--color-line)}.detailList div:last-child{padding-bottom:0;border-bottom:0}.detailList dd{margin:0;line-height:1.5}.relationList,.detailBullets{display:grid;gap:var(--space-3)}.relationCard{display:grid;gap:var(--space-2);padding:var(--space-3);border-radius:var(--radius-sm);background:#ffffff0a;border:1px solid rgba(255,255,255,.06)}.relationCard strong{display:block}.detailBullets{padding-left:1.125rem}.viewerShell[data-interacting=true] .canvasViewport:after{opacity:.07}.viewerShell[data-interacting=true] .groupCard,.viewerShell[data-interacting=true] .nodeCard{transition:none}.viewerShell[data-interacting=true] .groupCard{--group-drop-shadow: 0 2px 8px rgba(0, 0, 0, .1)}.viewerShell[data-interacting=true] .nodeCard{--node-drop-shadow: 0 2px 8px rgba(0, 0, 0, .1)}.viewerShell[data-interacting=true] .nodeCard.is-selected{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tone) 84%,white 10%),0 10px 22px #0003}@media (max-width: 1280px){.metaBadgeGrid,.summaryStrip{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 980px){:root{--overlay-top: clamp(96px, 22vw, 144px);--details-width: calc(100vw - (2 * var(--viewport-inset)))}.canvasSection{padding:0}.canvasViewport{min-height:100svh;height:100svh}.canvasChrome{inset:var(--viewport-inset) var(--viewport-inset) auto var(--viewport-inset)}.chromeActions{justify-content:flex-start}.chromeActions--minimal{justify-content:flex-end}.overlayOverview,.leftOverlayStack{left:var(--viewport-inset);right:var(--viewport-inset);width:auto}.canvasHud{left:var(--viewport-inset);right:var(--viewport-inset);bottom:var(--viewport-inset);width:auto}.canvasHud--minimal{right:auto}.detailsDrawer{top:auto;left:var(--viewport-inset);right:var(--viewport-inset);bottom:calc(-1 * (min(72svh,640px) + var(--viewport-inset)));width:auto;max-height:min(72svh,640px)}.detailsDrawer.is-open{right:var(--viewport-inset);bottom:var(--viewport-inset)}.detailsPanel{max-height:inherit}}@media (max-width: 720px){.metaBadgeGrid,.summaryStrip,.hudMetrics{grid-template-columns:1fr}.detailsDrawerHeader,.identityRow{flex-direction:column;align-items:flex-start}.toolbarToggle,.ghostButton{min-width:0}.canvasActions--minimal{flex-wrap:wrap}}