.drawings-page{ min-width:320px; background:var(--bg0);
}

.wide-wrap{ width:min(1480px,100%); margin-inline:auto; padding-inline:clamp(18px,3vw,42px);
}

.drawings-hero{ position:relative; overflow:hidden; min-height:590px; color:#eef1fa; background: radial-gradient(circle at 78% 22%,rgba(255,180,84,.2),transparent 24%), linear-gradient(135deg,#080d1a 0%,#111a32 54%,#1b2138 100%);
}

.drawings-hero::before{ content:""; position:absolute; inset:0; opacity:.18; background-image: linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px); background-size:48px 48px; mask-image:linear-gradient(110deg,#000,transparent 76%);
}

.drawings-hero::after{ content:"A-TE-00(11)1000"; position:absolute; right:-18px; bottom:-42px; color:transparent; font-family:var(--display); font-size:clamp(76px,14vw,220px); font-weight:800; line-height:1; letter-spacing:.015em; white-space:nowrap; -webkit-text-stroke:1px rgba(238,241,250,.1);
}

.drawings-nav{ position:relative; z-index:2; display:flex; min-height:88px; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid rgba(238,241,250,.13);
}

.brand{ display:inline-flex; align-items:baseline; gap:13px; color:inherit; text-decoration:none;
}

.brand > span{ font-family:var(--display); font-size:29px; font-weight:800; line-height:.9; text-transform:uppercase;
}

.brand b{color:#ffb454}

.brand small{ color:#7f89a7; font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase;
}

.nav-actions{ display:flex; align-items:center; gap:22px;
}

.back-link{ color:#a8b0c8; font-family:var(--mono); font-size:12px; text-decoration:none;
}

.back-link:hover{color:#ffb454}

.route-lang{ display:flex; overflow:hidden; border:1px solid rgba(238,241,250,.22); border-radius:999px;
}

.route-lang button{ min-width:43px; padding:7px 10px; color:#a8b0c8; font-family:var(--mono); font-size:11px; font-weight:700;
}

.route-lang button[aria-pressed="true"]{ color:#231503; background:#ffb454;
}

.drawings-intro{ position:relative; z-index:2; display:flex; min-height:500px; flex-direction:column; justify-content:center; align-items:flex-start; gap:18px; padding-block:72px 96px;
}

.drawings-intro h1{ max-width:800px; font-family:var(--display); font-size:clamp(64px,10vw,132px); font-weight:800; line-height:.82; letter-spacing:.005em; text-transform:uppercase;
}

.hero-lede{ max-width:65ch; color:#b8bfd2; font-size:clamp(17px,2vw,21px);
}

.source-chips{ display:flex; flex-wrap:wrap; gap:9px; margin:12px 0 0; padding:0; list-style:none;
}

.source-chips li{ display:flex; align-items:center; gap:8px; padding:8px 13px; border:1px solid rgba(238,241,250,.16); border-radius:999px; color:#a8b0c8; background:rgba(10,15,30,.46); font-family:var(--mono); font-size:11px;
}

.source-chips strong{color:#eef1fa}

.source-chips .review-chip{ color:#ffc374; border-color:rgba(255,180,84,.32);
}

.review-chip i{ width:7px; height:7px; border-radius:50%; background:#ffb454;
}

.drawings-page section{padding-block:clamp(70px,8vw,112px)}

.section-heading{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr); align-items:end; gap:clamp(24px,5vw,80px); margin-bottom:clamp(30px,5vw,54px);
}

.section-heading > div{ display:flex; flex-direction:column; gap:13px;
}

.section-heading h2{ font-family:var(--display); font-size:clamp(44px,6vw,76px); font-weight:800; line-height:.9; text-transform:uppercase;
}

.section-heading > p{ color:var(--ink2); font-size:clamp(16px,1.7vw,19px);
}

.map-shell{ overflow:hidden; border:1px solid var(--line); border-radius:18px; background:var(--bg1); box-shadow:var(--shadow);
}

.map-controls{ display:grid; grid-template-columns:minmax(180px,.6fr) minmax(300px,2fr) auto; align-items:end; gap:24px; padding:18px 20px; border-bottom:1px solid var(--line);
}

.field-label{ display:flex; flex-direction:column; gap:7px; color:var(--muted); font-family:var(--mono); font-size:10px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
}

.field-label select{ min-height:39px; padding:7px 34px 7px 11px; border:1px solid var(--line); border-radius:8px; color:var(--ink); background:var(--bg2); font:600 13px var(--body);
}

.legend-group{display:flex;flex-direction:column;gap:7px}

.category-legend{ display:flex; min-height:39px; flex-wrap:wrap; align-items:center; gap:7px;
}

.category-button{ display:inline-flex; align-items:center; gap:7px; padding:6px 10px; border:1px solid var(--line); border-radius:999px; color:var(--ink2); font-size:12px; background:var(--bg2);
}

.category-button::before{ content:""; width:9px; height:9px; border-radius:3px; background:var(--category); box-shadow:0 0 0 2px color-mix(in srgb,var(--category) 22%,transparent);
}

.category-button[aria-pressed="false"]{ opacity:.48; text-decoration:line-through;
}

.map-stats{ display:flex; min-width:86px; flex-direction:column; align-items:flex-end; color:var(--muted); font-family:var(--mono); font-size:10px; line-height:1.2; text-transform:uppercase;
}

.map-stats strong{ color:var(--accent); font-family:var(--display); font-size:32px; line-height:1;
}

.map-toolbar{ display:flex; min-height:46px; align-items:center; gap:5px; padding:6px 10px; border-bottom:1px solid var(--line); background:var(--bg2);
}

.map-toolbar button{ display:grid; min-width:34px; min-height:34px; place-items:center; border:1px solid var(--line); border-radius:7px; background:var(--bg1); font-family:var(--mono); font-weight:700;
}

.map-toolbar button:hover{border-color:var(--accent);color:var(--accent)}

.map-toolbar output{ min-width:54px; color:var(--muted); font-family:var(--mono); font-size:11px; text-align:center;
}

.map-toolbar .toolbar-text{ width:auto; margin-left:6px; padding-inline:12px; font-size:11px;
}

.toolbar-hint{ margin-left:auto; color:var(--muted); font-family:var(--mono); font-size:10px;
}

.map-viewport{ position:relative; height:clamp(460px,60vw,780px); overflow:hidden; padding:0; cursor:grab; touch-action:none; background:#e8e8e6; overscroll-behavior:contain;
}

.map-viewport.is-dragging{cursor:grabbing}

.map-scene{ position:absolute; top:0; left:0; width:7021px; height:4967px; transform-origin:0 0; will-change:transform;
}

.map-scene img{ position:absolute; inset:0; display:block; width:7021px; height:4967px; user-select:none;
}

.map-scene svg{ position:absolute; inset:0; width:7021px; height:4967px; overflow:visible;
}

.map-area{ cursor:pointer; opacity:.82; stroke:#15191f; stroke-width:2.4px; vector-effect:non-scaling-stroke; transition:opacity .18s ease,fill-opacity .18s ease;
}

.map-area:hover,
.map-area:focus,
.map-area.is-selected{ opacity:1; fill-opacity:.62; stroke:#fff; stroke-width:3.5px; outline:none;
}

.map-area.is-overlay{stroke-dasharray:8 5}

.map-loading{ position:absolute; inset:50% auto auto 50%; transform:translate(-50%,-50%); padding:9px 14px; border-radius:999px; color:#dfe4f5; background:rgba(10,15,30,.86); font-family:var(--mono); font-size:11px;
}

.map-loading.is-hidden{display:none}

.area-detail{ display:flex; min-height:96px; align-items:flex-start; gap:14px; padding:18px 20px; border-top:1px solid var(--line);
}

.detail-dot{ width:13px; height:13px; flex:none; margin-top:7px; border:2px solid var(--line); border-radius:4px; background:var(--bg2);
}

.detail-kicker{ color:var(--muted); font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase;
}

.area-detail h3{font-size:18px}

.area-detail p:last-child{color:var(--ink2);font-size:13px}

.evidence-strip{ display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); border-radius:14px; margin-top:22px; background:var(--bg1);
}

.evidence-strip article{ position:relative; padding:24px;
}

.evidence-strip article + article{border-left:1px solid var(--line)}

.evidence-strip strong{ color:var(--accent); font-family:var(--display); font-size:44px; line-height:1;
}

.evidence-strip h3{margin:8px 0 5px;font-size:16px}

.evidence-strip p{color:var(--ink2);font-size:13.5px}

.cad-section{ border-block:1px solid var(--line-soft); background:var(--bg2);
}

.conversion-note{ display:flex; align-items:flex-start; gap:18px; margin-bottom:24px; padding:18px; border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line)); border-radius:13px; background:var(--accent-soft);
}

.note-icon{ flex:none; padding:7px 9px; border-radius:6px; color:var(--accent-ink); background:var(--accent); font:800 11px var(--mono);
}

.conversion-note h3{font-size:17px}

.conversion-note p{color:var(--ink2);font-size:14px}

.cad-route-link{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  margin-bottom:24px;padding:12px 15px;border:1px solid var(--line);border-radius:10px;
  color:var(--accent);background:var(--bg1);font:650 11px var(--mono);text-decoration:none;
}

.cad-route-link:hover{border-color:var(--accent);background:var(--accent-soft)}

.cad-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
}

.cad-card{ overflow:hidden; border:1px solid var(--line); border-radius:13px; background:var(--bg1); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}

.cad-card:hover{ transform:translateY(-3px); border-color:var(--accent); box-shadow:var(--shadow);
}

.cad-preview{ position:relative; display:block; width:100%; aspect-ratio:1.94/1; overflow:hidden; padding:0; border-bottom:1px solid var(--line); background:#17212a;
}

.cad-preview img{ display:block; width:100%; height:100%; object-fit:cover; image-rendering:auto; transition:transform .25s ease;
}

.cad-preview:hover img{transform:scale(1.04)}

.preview-badge{ position:absolute; top:9px; left:9px; padding:4px 7px; border:1px solid rgba(255,255,255,.22); border-radius:5px; color:#dfe4f5; background:rgba(10,15,30,.78); font:700 9px var(--mono); letter-spacing:.12em; text-transform:uppercase;
}

.cad-copy{padding:16px}

.cad-meta{ display:flex; justify-content:space-between; gap:8px; margin-bottom:7px; color:var(--muted); font:10px var(--mono); text-transform:uppercase;
}

.cad-copy h3{font-size:17px;line-height:1.25}

.cad-copy > p{ margin-top:7px; color:var(--ink2); font-size:13px;
}

.cad-file{ overflow:hidden; margin-top:12px; color:var(--muted); font:10px var(--mono); text-overflow:ellipsis; white-space:nowrap;
}

.structure-section{background:var(--bg0)}

.structure-flow{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin:0; padding:0; list-style:none;
}

.structure-flow li{ position:relative; display:grid; grid-template-columns:52px 1fr; gap:15px; padding:22px; border:1px solid var(--line); background:var(--bg1);
}

.structure-flow li:first-child{border-radius:13px 0 0 13px}
.structure-flow li:last-child{border-radius:0 13px 13px 0}
.structure-flow li + li{border-left:0}

.structure-flow li > span{ display:grid; width:45px; height:45px; place-items:center; border-radius:50%; color:var(--accent); background:var(--accent-soft); font:700 11px var(--mono);
}

.structure-flow h3{font-size:18px}
.structure-flow p{margin-top:5px;color:var(--ink2);font-size:14px}

.preview-dialog{ width:min(720px,calc(100% - 28px)); max-height:calc(100svh - 28px); overflow:auto; padding:0; border:1px solid rgba(238,241,250,.2); border-radius:16px; color:#eef1fa; background:#0d1326; box-shadow:0 30px 90px rgba(0,0,0,.6);
}

.preview-dialog::backdrop{ background:rgba(4,7,14,.78); backdrop-filter:blur(5px);
}

.preview-dialog > img{ display:block; width:100%; min-height:260px; object-fit:contain; background:#17212a; image-rendering:auto;
}

.dialog-close{ position:absolute; z-index:2; top:12px; right:12px; display:grid; width:38px; height:38px; place-items:center; border:1px solid rgba(255,255,255,.25); border-radius:50%; color:#fff; background:rgba(10,15,30,.84); font-size:23px;
}

.dialog-copy{padding:22px}
.dialog-copy h2{font-family:var(--display);font-size:38px;line-height:1;text-transform:uppercase}
.dialog-copy > p{margin-top:9px;color:#a8b0c8;font-size:14px}
.dialog-copy .dialog-file{font:10px var(--mono)}
.dialog-copy .dialog-warning{color:#ffb454}

.drawings-footer{ border-top:1px solid var(--line); padding-block:32px;
}

.drawings-footer .wrap{ display:flex; align-items:center; justify-content:space-between; gap:24px;
}

.drawings-footer p{ color:var(--muted); font:10px var(--mono); text-align:right; text-transform:uppercase;
}

@media (max-width:1000px){ .map-controls{grid-template-columns:190px 1fr} .map-stats{display:none} .cad-grid{grid-template-columns:repeat(2,1fr)} .structure-flow{grid-template-columns:1fr} .structure-flow li:first-child{border-radius:13px 13px 0 0} .structure-flow li:last-child{border-radius:0 0 13px 13px} .structure-flow li + li{border-top:0;border-left:1px solid var(--line)}
}

@media (max-width:760px){ .drawings-nav{align-items:flex-start;padding-block:20px} .brand small,.back-link{display:none} .drawings-intro{min-height:450px} .section-heading{grid-template-columns:1fr;align-items:start} .map-controls{grid-template-columns:1fr} .map-viewport{height:58svh;min-height:400px} .toolbar-hint{display:none} .evidence-strip{grid-template-columns:1fr} .evidence-strip article + article{border-top:1px solid var(--line);border-left:0}
}

@media (max-width:560px){ .drawings-intro h1{font-size:58px} .source-chips li{font-size:9px} .source-chips .review-chip{border-radius:9px} .cad-grid{grid-template-columns:1fr} .conversion-note{flex-direction:column} .drawings-footer .wrap{align-items:flex-start;flex-direction:column} .drawings-footer p{text-align:left}
}

@media (prefers-reduced-motion:reduce){ .map-area,.cad-card,.cad-preview img{transition:none}
}
