:root { --ink:#12362e; --forest:#00695c; --mint:#edf7f2; --line:#cde2d8; --paper:#fff; --muted:#5b716a; --danger:#a22a2a; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; min-width:320px; color:var(--ink); background:linear-gradient(145deg,#e3f0e9,#f8fcfa 48%,#dfefe8); font:16px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.shell { width:min(100%,1020px); margin:0 auto; padding:32px 18px 64px; }
.brand { display:flex; align-items:center; gap:11px; margin:0 0 30px 4px; color:var(--forest); }.brand-mark { display:grid; place-items:center; width:38px; height:38px; border-radius:12px; color:#fff; background:var(--forest); font-size:25px; }.brand strong,.brand small { display:block; }.brand strong { font-size:20px; letter-spacing:.01em; }.brand small { font-size:12px; color:var(--muted); }
.card { background:rgba(255,255,255,.94); border:1px solid var(--line); border-radius:20px; padding:clamp(20px,4vw,34px); box-shadow:0 15px 35px rgba(0,74,57,.08); }.login-card { width:min(100%,460px); margin:12vh auto 0; }.eyebrow { margin:0 0 5px; color:var(--forest); font-size:11px; font-weight:800; letter-spacing:.13em; }.card h1,.dashboard h1 { margin:0; font-size:clamp(25px,4vw,34px); letter-spacing:-.03em; }.card h1 + p { margin:8px 0 26px; color:var(--muted); }
form { display:grid; gap:15px; } label { display:grid; gap:6px; color:var(--ink); font-size:14px; font-weight:700; } input,select { width:100%; min-height:44px; border:1px solid #b7d2c5; border-radius:10px; padding:10px 12px; background:#fff; color:var(--ink); font:inherit; font-weight:400; } input:focus,select:focus { outline:3px solid #bde5d5; border-color:var(--forest); } button { min-height:44px; border:0; border-radius:10px; padding:10px 16px; background:var(--forest); color:#fff; cursor:pointer; font:700 14px inherit; transition:transform .15s,background .15s; } button:hover { background:#005348; transform:translateY(-1px); } button:disabled { cursor:wait; opacity:.55; transform:none; }.quiet { min-height:36px; background:#e6f3ed; color:var(--forest); }.quiet:hover { background:#d6ebdf; }.danger { background:#fff0ef; color:var(--danger); }.danger:hover { background:#ffe1de; }.form-error { min-height:1.3em; margin:0; color:var(--danger); font-size:14px; }.dashboard { display:grid; gap:20px; }.dashboard-header { display:flex; align-items:center; justify-content:space-between; gap:15px; }.dashboard-header h1 { font-size:clamp(24px,4vw,31px); }.status { min-height:1.2em; margin:0; color:var(--forest); font-weight:650; }.section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:22px; }.section-heading > div { display:flex; align-items:center; gap:9px; }.section-heading h2 { margin:0; font-size:22px; }.section-heading p { max-width:420px; margin:2px 0 0; color:var(--muted); font-size:14px; }.emoji { font-size:22px; }.routing-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.wide { grid-column:1/-1; }.provider-note { display:flex; flex-wrap:wrap; gap:8px; color:var(--muted); font-size:13px; }.provider-note span { padding:4px 8px; border-radius:99px; background:var(--mint); }.provider-note .off { background:#f7eeee; color:#8a3a3a; }.upload-form { grid-template-columns:1.2fr 1.5fr auto; align-items:end; }.switch-line { display:flex; align-items:center; gap:8px; min-height:44px; font-weight:600; }.switch-line input { width:18px; min-height:18px; }.hint { grid-column:1/-1; margin:0; color:var(--muted); font-size:12px; }.layers-list { display:grid; gap:12px; margin-top:25px; }.layer-card { padding:16px; border:1px solid var(--line); border-radius:14px; background:#fbfefa; }.layer-row { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }.layer-name { margin:0; font-size:17px; }.layer-details { margin:3px 0 0; color:var(--muted); font-size:13px; }.publication { flex:0 0 auto; padding:4px 8px; border-radius:999px; background:#dff2e8; color:#176346; font-size:12px; font-weight:700; }.publication.offline { background:#f6e8e6; color:#8a3a3a; }.layer-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:13px; }.layer-actions button { min-height:34px; padding:6px 11px; }.preview { margin-top:15px; min-height:160px; overflow:hidden; border:1px solid var(--line); border-radius:10px; background:#eff6f1; }.preview svg { display:block; width:100%; height:230px; }.preview-empty { display:grid; place-items:center; min-height:160px; padding:20px; color:var(--muted); text-align:center; font-size:13px; }
.upload-progress { grid-column:1/-1; display:grid; grid-template-columns:minmax(160px,1fr) auto; align-items:center; gap:10px; padding:10px 12px; border-radius:10px; background:var(--mint); color:var(--forest); font-size:13px; font-weight:700; }.upload-progress progress { width:100%; accent-color:var(--forest); }
.forms-catalog { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.forms-catalog article { display:grid; grid-template-columns:auto minmax(0,1fr); gap:3px 10px; align-items:center; padding:13px; border:1px solid var(--line); border-radius:12px; background:#fbfefa; }.forms-catalog strong { grid-row:1/3; display:grid; place-items:center; width:44px; height:44px; border-radius:10px; background:var(--forest); color:#fff; font-size:12px; letter-spacing:.03em; }.forms-catalog span { font-size:14px; font-weight:750; }.forms-catalog small { color:var(--muted); font-size:12px; }
.forms-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:26px; }.forms-heading h3 { margin:0; }.form-responses { display:grid; gap:18px; margin-top:12px; }.form-person-group { display:grid; gap:10px; }.form-person-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:0 2px; }.form-person-heading h4 { margin:0; color:var(--forest); font-size:16px; }.form-person-heading span { color:var(--muted); font-size:12px; font-weight:700; }.form-person-list { display:grid; gap:10px; }.form-response-card { display:grid; gap:13px; padding:16px; border:1px solid var(--line); border-radius:14px; background:#fbfefa; }.form-response-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }.form-response-heading h4 { margin:0; font-size:17px; }.form-response-heading p { margin:4px 0 0; color:var(--muted); font-size:13px; }.form-sheet { display:grid; gap:18px; padding:0; }.form-summary { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:10px; padding:14px; border-radius:12px; background:var(--mint); }.form-summary-item { display:grid; gap:3px; min-width:0; }.form-summary-item span { color:var(--muted); font-size:11px; font-weight:750; letter-spacing:.04em; text-transform:uppercase; }.form-summary-item strong { overflow-wrap:anywhere; font-size:14px; }.form-section { display:grid; gap:10px; }.form-section h5 { margin:0; padding-bottom:8px; border-bottom:2px solid #d9ebe2; color:var(--forest); font-size:16px; }.form-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin:0; }.form-field { min-width:0; padding:11px 12px; border:1px solid var(--line); border-radius:10px; background:#fbfefa; }.form-field dt { color:var(--muted); font-size:12px; font-weight:700; }.form-field dd { margin:5px 0 0; overflow-wrap:anywhere; color:var(--ink); font-size:14px; font-weight:650; white-space:pre-line; }.form-media-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:12px; }.form-media { min-width:0; margin:0; overflow:hidden; border:1px solid var(--line); border-radius:12px; background:#fbfefa; }.form-media img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; background:var(--mint); }.form-media figcaption { padding:9px 10px; color:var(--muted); font-size:12px; font-weight:650; }.form-detail-dialog { width:100vw; max-width:none; height:100vh; max-height:none; margin:0; padding:0; border:0; background:rgba(7,33,27,.48); }.form-detail-dialog::backdrop { background:rgba(7,33,27,.48); }.form-detail-shell { display:grid; grid-template-rows:auto minmax(0,1fr) auto; width:min(100%,1120px); height:100%; margin:0 auto; background:var(--paper); }.form-detail-header { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:20px 24px 16px; border-bottom:1px solid var(--line); background:#fbfefa; }.form-detail-header h2 { margin:0; color:var(--forest); font-size:clamp(20px,3vw,29px); }.form-detail-meta { margin:5px 0 0; color:var(--muted); font-size:14px; }.form-detail-close { display:grid; flex:0 0 auto; place-items:center; width:44px; min-height:44px; padding:0; border-radius:50%; background:#e6f3ed; color:var(--forest); font-size:31px; font-weight:400; line-height:1; }.form-detail-content { min-height:0; overflow:auto; padding:24px; }.form-detail-content > .hint { display:block; margin:30px 0; text-align:center; }.form-detail-footer { display:flex; justify-content:space-between; gap:10px; padding:14px 24px; border-top:1px solid var(--line); background:#fbfefa; }.form-detail-footer #download-form-detail { margin-left:auto; }
.preview-map { width:100%; height:320px; }.preview-note { padding:10px 12px; border-top:1px solid var(--line); background:#fff; color:var(--muted); font-size:12px; }
.layers-map-layout { display:grid; grid-template-columns:minmax(0,1fr) 230px; gap:16px; }.layers-map { width:100%; min-height:480px; overflow:hidden; border:1px solid var(--line); border-radius:14px; background:#e8f1ec; }.layers-map-sidebar { min-width:0; padding:14px; border:1px solid var(--line); border-radius:14px; background:#fbfefa; }.layers-map-list { display:grid; gap:8px; margin:12px 0; }.map-layer-option { display:grid; grid-template-columns:20px minmax(0,1fr); gap:8px; align-items:start; padding:9px; border-radius:9px; background:var(--mint); cursor:pointer; font-weight:650; }.map-layer-option input { width:18px; min-height:18px; margin:2px 0 0; }.map-layer-option small { display:block; overflow:hidden; color:var(--muted); font-size:11px; font-weight:500; text-overflow:ellipsis; white-space:nowrap; }.map-layer-option.loading { opacity:.65; }.map-layer-option.error { background:#fff0ef; color:var(--danger); }.map-layer-option.unsupported { cursor:default; opacity:.7; }.map-layer-option.unsupported input { visibility:hidden; }.leaflet-container { font:13px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
@media (max-width:780px) { .layers-map-layout { grid-template-columns:1fr; }.layers-map { min-height:390px; }.layers-map-sidebar { order:-1; }.layers-map-list { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:650px) { .shell { padding-top:20px; }.login-card { margin-top:5vh; }.dashboard-header,.section-heading { align-items:flex-start; flex-direction:column; }.routing-grid,.upload-form,.forms-catalog,.form-fields { grid-template-columns:1fr; }.wide,.hint { grid-column:auto; }.layers-map-list { grid-template-columns:1fr; }.form-response-heading { align-items:flex-start; }.form-detail-header { padding:16px; }.form-detail-content { padding:16px; }.form-detail-footer { padding:12px 16px; }.form-detail-footer button { padding:8px 10px; }.form-detail-footer #download-form-detail { display:none; } }
