:root { font-family: "Yu Gothic UI", "Meiryo", sans-serif; color: #20322f; background: #f4f6f3; font-synthesis: none; --green: #154c47; --line: #dbe3dc; }
* { box-sizing: border-box; } body { margin: 0; } button, input, select { font: inherit; } button, select, summary { cursor: pointer; } button { color: inherit; } a { color: var(--green); text-underline-offset: 3px; } button:disabled { cursor: default; opacity: .5; } [hidden] { display: none !important; } :focus-visible { outline: 3px solid #277e76; outline-offset: 3px; }
.header { min-height: 88px; display: flex; justify-content: space-between; align-items: center; padding: 20px 4%; border-bottom: 1px solid var(--line); background: white; gap: 20px; }.brand { display: flex; align-items: center; gap: 24px; color: #243934; text-decoration: none; font-size: 14px; font-weight: 700; }.brand img { width: 200px; height: auto; }.brand span { padding-left: 24px; border-left: 1px solid var(--line); }.header nav { display: flex; gap: 24px; font-size: 13px; }.header nav a { text-decoration: none; }
main { max-width: 1640px; margin: auto; padding: 32px 4% 24px; }.heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 26px; }h1 { font-size: clamp(23px, 2.3vw, 32px); letter-spacing: .02em; margin: 8px 0; } h2 { margin: 0 0 18px; font-size: 18px; } h3 { font-size: 15px; line-height: 1.6; margin: 8px 0; }p { line-height: 1.8; } .heading p:not(.eyebrow) { margin: 4px 0; font-size: 14px; color: #5a6e65; }.eyebrow { font-size: 11px; font-weight: 750; letter-spacing: .14em; color: #598071; margin: 0 0 8px; }.source-pill { background: #e6ede4; color: #466651; border-radius: 30px; padding: 10px 16px; white-space: nowrap; font-size: 11px; }
.workspace { display: grid; grid-template-columns: 326px minmax(0, 1fr); gap: 20px; align-items: start; }.sidebar { display: grid; gap: 16px; }.card { background: white; border: 1px solid var(--line); border-radius: 13px; padding: 22px; }.step { font-size: 11px; background: #edf2ea; border-radius: 5px; padding: 5px 7px; margin-right: 6px; color: #5b7663; }.tabs, .presets { display: flex; gap: 4px; background: #f0f3ee; padding: 4px; border-radius: 8px; margin-bottom: 18px; }.tabs button, .presets button { border: 0; background: none; padding: 8px 6px; border-radius: 5px; flex: 1; font-size: 12px; }.tabs button[aria-pressed=true], .presets button[aria-pressed=true] { background: white; box-shadow: 0 1px 4px #20322f15; color: #154c47; font-weight: 700; }label { font-size: 12px; display: block; font-weight: 650; }input[type=text], input:not([type]), input[type=file] { width: 100%; min-width: 0; margin-top: 8px; padding: 12px; border: 1px solid #becdc1; border-radius: 7px; background: #fcfdfb; font-size: 13px; } input[type=file] { padding: 9px 6px; font-size: 11px; }.help { font-size: 11px; line-height: 1.8; color: #617268; margin: 10px 0; }.primary { background: var(--green); color: white; padding: 12px; border: 1px solid var(--green); border-radius: 7px; font-size: 13px; width: 100%; font-weight: 650; }.secondary { background: white; border: 1px solid #b6c7bc; border-radius: 7px; padding: 9px 14px; font-size: 12px; }.text-button { background: none; border: 0; padding: 8px 0; color: #235d4e; text-decoration: underline; text-underline-offset: 3px; font-size: 11px; }.error { color: #ab2030; font-size: 12px; }
.layer-row { display: flex; gap: 9px; align-items: flex-start; padding: 9px 0; border-bottom: 1px solid #eff2ed; font-size: 12px; line-height: 1.6; }.layer-row input { margin: 4px 0 0; accent-color: #154c47; width: 15px; height: 15px; flex-shrink: 0; }.swatch { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 7px; }.layer-row small { display: block; color: #758178; font-size: 10px; font-weight: 400; }.extra-layers { margin-top: 14px; }.extra-layers summary { font-size: 12px; font-weight: 650; line-height: 1.8; }.extra-layers summary span { font-size: 10px; color: #768779; margin-left: 5px; }.opacity-label { display: flex; justify-content: space-between; margin-top: 20px; font-size: 11px; }input[type=range] { width: 100%; accent-color: #396b55; margin: 10px 0 0; }
.map-card { min-width: 0; border: 1px solid var(--line); border-radius: 13px; overflow: hidden; background: white; position: sticky; top: 16px; }.map-toolbar { padding: 12px 16px; display: flex; gap: 8px; align-items: center; justify-content: space-between; font-size: 13px; }.map-toolbar>div { display: flex; align-items: center; gap: 16px; }.map-toolbar select { border: 1px solid var(--line); padding: 6px; border-radius: 5px; background: white; font-size: 11px; }#regulations-map { height: 590px; background: #e6ece8; cursor: crosshair; }.leaflet-container { font-family: inherit; }.map-footer { padding: 14px 17px; }.map-key { display: flex; gap: 17px; flex-wrap: wrap; font-size: 10px; align-items: center; }.map-key span { display: flex; align-items: center; gap: 6px; }.point-key { display: inline-block; width: 12px; height: 12px; border: 2px solid #e00000; border-radius: 50%; }.route-key { width: 16px; height: 8px; border: 2px solid #145dc4; background: #145dc415; }#map-status, #did-status { font-size: 10px; color: #6e786e; margin: 7px 0 0; }.reg-location-marker { box-sizing: border-box; border: 3px solid #e00000; border-radius: 50%; background: rgb(255 255 255 / 45%); box-shadow: 0 0 0 2px #fff, 0 2px 5px 2px rgb(0 0 0 / 25%); }
.results-section { margin: 36px 0; }.section-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 20px; }.section-heading h2 { margin-bottom: 7px; }.section-heading p:not(.eyebrow) { font-size: 12px; color: #637266; margin: 0; }#result-actions { display: flex; gap: 16px; align-items: center; white-space: nowrap; font-size: 12px; }.result-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 13px; }.result-card { background: white; border: 1px solid var(--line); border-radius: 10px; padding: 19px; min-width: 0; }.result-card h3 { margin: 0 0 10px; }.badge { display: inline-block; font-size: 11px; font-weight: 650; padding: 5px 9px; border-radius: 4px; background: #eff2ed; color: #68746b; }.badge.overlap { background: #fff0d8; color: #90540a; }.badge.unknown, .badge.boundary { background: #fae9e7; color: #a24539; }.badge.visual { background: #f9e5ef; color: #9b3c6b; }.result-card p, .result-card li { font-size: 11px; color: #57655b; overflow-wrap: anywhere; }.result-card ul { padding-left: 17px; max-height: 230px; overflow-y: auto; }.result-card li { margin: 7px 0; line-height: 1.8; }.result-card a, .result-card summary { font-size: 11px; }.result-card summary { margin-top: 12px; }.result-card .card-actions { display: flex; gap: 15px; align-items: center; flex-wrap: wrap; }.sources { border: 1px solid var(--line); padding: 15px; border-radius: 8px; margin-top: 16px; font-size: 12px; }.sources p { overflow-wrap: anywhere; }.sources ul { padding-left: 20px; }.sources li { margin-bottom: 7px; font-size: 11px; overflow-wrap: anywhere; }
.follow-up { padding: 28px; background: #e9efe5; border: 1px solid #d8e1d1; border-radius: 13px; }.follow-up>div>p:not(.eyebrow) { font-size: 12px; color: #5e6e60; }.follow-up h2 { margin: 8px 0; }.follow-up-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 26px; margin-top: 25px; }.follow-up-grid article+article { padding-left: 25px; border-left: 1px solid #ccd8c5; }.follow-up-grid p { font-size: 11px; color: #61715f; }.follow-up-grid a { font-size: 11px; }.manual-tag { font-size: 10px; color: #698060; }.scope { font-size: 11px; color: #74806e; margin: 24px 0; }.scope p { margin: 7px 0; }footer { border-top: 1px solid var(--line); padding-top: 16px; display: flex; gap: 20px; justify-content: space-between; color: #829080; font-size: 10px; line-height: 1.8; }footer div { display: flex; gap: 16px; flex-shrink: 0; }.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }.skip { position: absolute; top: -80px; }.skip:focus { top: 0; z-index: 1000; background: white; padding: 12px; }
.result-jump { display: block; font-size: 11px; line-height: 1.8; margin-top: 10px; }
@media (min-width: 1440px) { #regulations-map { height: 650px; } }
@media (max-width: 1050px) { .workspace { grid-template-columns: 285px minmax(0,1fr); }.card { padding: 17px; }.map-toolbar>div { gap: 10px; }.map-toolbar { flex-wrap: wrap; }.brand span { display: none; }.result-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.source-pill { display: none; } }
@media (max-width: 760px) { main { padding: 24px 16px; }.header { padding: 16px; flex-wrap: wrap; gap: 14px; }.brand img { width: 170px; }.header nav { font-size: 11px; gap: 18px; }.workspace { grid-template-columns: minmax(0,1fr); }.sidebar { grid-template-columns: minmax(0,1fr); }.map-card { position: static; }#regulations-map { height: 480px; }.section-heading { display: block; }#result-actions { margin-top: 16px; }.result-grid { grid-template-columns: minmax(0,1fr); }.follow-up { padding: 20px; }.follow-up-grid { grid-template-columns: minmax(0,1fr); gap: 18px; }.follow-up-grid article+article { padding: 15px 0 0; border-left: 0; border-top: 1px solid #ccd8c5; }footer { display: block; }footer div { margin-top: 10px; } }
@media print { .header nav, .sidebar, .map-card, .presets, #result-actions, .card-actions, .text-button { display: none !important; } main { padding: 0; } .result-grid { display: block; }.result-card { break-inside: avoid; margin-bottom: 8px; }.result-card ul { max-height: none; }.follow-up { background: white; } }

.public-notice { padding: 13px 17px; border: 1px solid #d9e5d9; border-radius: 8px; background: #edf3e8; font-size: 12px; color: #436147; margin: 0 0 20px; }
#privacy { scroll-margin-top: 20px; }