/* Copper Puffin Software · "Blueprint" theme (palette from the norselabs.net Architect's Desk) for Architect's Desk for AWS.
   Dark Nordic night, warm copper linework, drafting title block. Matches copperpuffin.com. */
:root {
  --display: Georgia, "Times New Roman", serif; --display-track: .02em; --display-case: none; --num-font: "JetBrains Mono", monospace;
  --bg: #0b2545; --bar-bg: #0a2140; --panel: #0d2a4d; --card-bg: rgba(10, 33, 64, .7); --finding-bg: rgba(8, 26, 52, .6);
  --line: rgba(160, 216, 255, .14); --line-2: rgba(160, 216, 255, .26);
  --ink: #d7ecff; --ink-2: #a9c8e6; --ink-strong: #ffffff; --muted: #7fa3c7;
  --accent: #5ee1ff; --accent-hover: #8deaff; --accent-2: #ffd166; --accent-soft: rgba(94, 225, 255, .14); --on-accent: #062039; --focus: #5ee1ff; --link: #5ee1ff;
  --hover: rgba(94, 225, 255, .09); --field-bg: rgba(4, 20, 42, .55); --tile-bg: rgba(255,255,255,.02); --tile-hover: rgba(94,225,255,.06); --btn-bg: rgba(4, 20, 42, .5); --kbd-bg: rgba(255,255,255,.04);
  --chip-bg: rgba(4, 22, 46, .9); --chip-line: rgba(160, 216, 255, .22); --track: rgba(160, 216, 255, .12); --switch-knob: #a9c8e6;
  --canvas-bg: #0e3160; --grid-minor: rgba(150, 205, 255, .09); --grid-major: rgba(150, 205, 255, .2);
  --node-bg: #0b2a52; --node-stroke: rgba(170, 225, 255, .55); --edge: #9fdcff; --edge-hover: #ffffff;
  --grp-fill: transparent; --grp-stroke: rgba(170, 225, 255, .5); --grp-ink: #cfe8ff; --tag-bg: #0e3160;
  --vpc-fill: rgba(94, 225, 255, .03); --az-fill: transparent; --az-stroke: rgba(255, 209, 102, .7); --subnet-fill: rgba(150, 205, 255, .04); --subnet-stroke: rgba(170, 225, 255, .4);
  --pub-fill: rgba(130, 255, 190, .045); --pub-stroke: rgba(130, 255, 190, .55);
  --c-edge: #ffd166; --c-network: #5ee1ff; --c-compute: #ff9f6b; --c-data: #7cf0b5; --c-integration: #ff8fd0; --c-security: #ff6b7a; --c-ops: #c3a6ff; --c-group: #a9c8e6; --c-identity: #ffb86b; --c-zt: #4fe3c1; --c-detect: #c6ef6a;
  --sev-crit: #ff4d6d; --sev-high: #ff7b54; --sev-med: #ffd166; --sev-low: #8fd3ff; --sev-info: #7fa3c7; --good: #7cf0b5;
  --hud-bg: rgba(9, 33, 66, .86); --scrim: rgba(3, 14, 30, .62); --toast-bg: #e6f6ff; --toast-ink: #062039;
  --shadow: 0 6px 20px rgba(0,0,0,.25); --shadow-lg: 0 18px 50px rgba(0, 0, 0, .45);
  --wordmark-filter: brightness(1.15);
  --copper: #d4824a; --copper-2: #e7a36d;
}
body { background: var(--bg); }
.topbar { background: linear-gradient(180deg, #0b2547, #0a2140); box-shadow: inset 0 -1px 0 rgba(160,216,255,.08); }
.stage { background: radial-gradient(ellipse 90% 70% at 50% 0%, #123a6e 0%, #0e3160 55%, #0b2a54 100%); }
.grid-bg { fill: transparent; }
.node-card { stroke-dasharray: none; }
.node-label { font-family: var(--ui); font-size: 11px; letter-spacing: .01em; }
.grp-label { font-family: var(--mono); letter-spacing: .08em; text-transform: uppercase; font-size: 10.5px; }
.tabs button, .pal-h, .tc-k, .hud-k { font-family: var(--mono); }
.stage::after { content: ""; position: absolute; inset: 10px; border: 1px solid rgba(160, 216, 255, .22); pointer-events: none; border-radius: 3px; }
.titleblock { display: grid; position: absolute; right: 22px; top: 22px; width: 260px; border: 1px solid rgba(160,216,255,.5); background: rgba(10, 37, 74, .88); font: 500 10.5px var(--mono); color: var(--ink); text-transform: uppercase; letter-spacing: .08em; pointer-events: none; box-shadow: var(--shadow); }
.tb-row { display: grid; grid-template-columns: 76px 1fr; border-top: 1px solid rgba(160,216,255,.3); }
.tb-row:first-child { border-top: 0; }
.tb-row span { padding: 7px 10px; color: var(--muted); border-right: 1px solid rgba(160,216,255,.3); }
.tb-row b { padding: 7px 10px; font-weight: 600; color: var(--ink-strong); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tb-row.tb-brand b { color: var(--accent-hover); }
.hud, .minimap { border-radius: 6px; }
.card, .cline, .finding, .pal-item, .tcard { border-radius: 8px; }
.tbtn, .btn, .search, .num, .field select { border-radius: 7px; }
.tbtn.primary { box-shadow: 0 0 0 1px rgba(200,240,255,.2) inset, 0 4px 18px rgba(94,225,255,.22); }
.zt-card .ring-fg { stroke: var(--c-zt); }
@media (max-width: 1020px) { .titleblock { display: none; } }

/* Copper Puffin branding stays copper on the blue theme */
.brand-mark { color: var(--copper); }
.brand h1 .for { color: var(--copper-2); }