@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+KR:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans','Noto Sans KR',sans-serif;color:#1d2723;background:#f3f4ee;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px}.shell{min-height:100vh;padding:0 32px 24px}.topbar{height:70px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d9ded5}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:#1c2823;font-size:12px;letter-spacing:.12em;font-weight:700}.brand b{font-weight:400;color:#758078}.brand-mark{height:27px;width:27px;border-radius:50%;display:grid;place-items:center;background:#213a30;color:#c9ed92;font-family:Georgia,serif;font-size:17px;font-style:italic}.phase,.eyebrow,.section-label,.panel footer,.map-chip,.map-status,.selection-kicker{font-family:'DM Mono',monospace;letter-spacing:.08em}.phase{font-size:10px;color:#66716a}.phase i,.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#99c766;margin-right:8px}.workspace{height:calc(100vh - 118px);min-height:650px;display:grid;grid-template-columns:minmax(0,1fr) 380px;margin-top:22px;background:#fff;border:1px solid #e2e5de;box-shadow:0 12px 42px #24382c0b}.map-wrap{position:relative;overflow:hidden;background:#edf0e9;border-right:1px solid #e5e8e1;min-width:0}#map{position:absolute;inset:0}.panel{position:relative;display:flex;flex-direction:column;padding:30px 25px 17px;overflow-y:auto}.eyebrow{font-size:9px;color:#79915e}.panel h1{font-size:29px;line-height:1.25;letter-spacing:-.055em;margin:10px 0 8px;font-weight:600}.intro{font-size:12px;line-height:1.75;color:#78817b;margin:0}.rule{height:1px;flex:none;background:#e8ebe5;margin:18px 0}.selection{padding:1px 0 0}.selection-kicker{font-size:8px;color:#8d9a8c}.selection h2{font-size:24px;letter-spacing:-.05em;margin:8px 0 3px;color:#293a30}.dong-code{margin:0;color:#99a198;font:9px 'DM Mono',monospace}.scores{display:grid;gap:9px;margin-top:16px}.score-card{padding:12px 13px 11px;background:#f6f8f3;border:1px solid #edf0e9}.score-card:nth-child(2){background:#f4f8f4}.score-label{font-size:10px;color:#657168}.score-value{display:flex;align-items:baseline;gap:5px;margin:3px 0 1px;color:#294633;font-size:32px;line-height:1.2;font-weight:600;letter-spacing:-.05em}.score-value small{font-size:12px;font-weight:500;letter-spacing:0;color:#6d7a70}.score-rank{display:flex;align-items:center;justify-content:space-between;font-size:9px;color:#89938b}.score-rank span:first-child{font-weight:600;color:#52734c}.population-row{display:flex;justify-content:space-between;align-items:center;padding:11px 2px 0;color:#838d85;font-size:10px}.population-row b{font-size:11px;color:#45574b}.section-label{font-size:10px;color:#65716a;margin-bottom:7px}.layer-row{display:flex;gap:10px;align-items:center;margin:7px 0;cursor:pointer}.layer-row input{accent-color:#62844d}.swatch{width:24px;height:3px;flex:none}.green{background:#8dbc6e}.park{background:#40905b}.roads{background:#858f89}.boundary{height:14px;width:20px;border:1px solid #718a68;background:#e6ede0}.layer-row b,.layer-row small{display:block}.layer-row b{font-size:11px;font-weight:600}.layer-row small{font-size:9px;color:#929a93;margin-top:3px}.method-note{background:#f6f7f3;padding:11px 12px;margin-top:14px;color:#6e786f}.note-title{display:flex;align-items:center;gap:7px;font-size:10px;font-weight:600;color:#536354}.note-icon{flex:none;border:1px solid #97a98a;border-radius:50%;width:15px;height:15px;text-align:center;font-size:9px;line-height:14px}.method-note p{font-size:9px;line-height:1.65;margin:7px 0 0}.panel footer{display:flex;justify-content:space-between;gap:8px;font-size:7px;color:#a0a8a0;margin-top:auto;padding-top:15px}.panel footer a{color:inherit;text-decoration:none}.map-chip{position:absolute;z-index:600;top:16px;left:16px;background:#fffffff0;padding:10px 12px;font-size:9px;color:#66746a;box-shadow:0 2px 12px #21332612}.map-chip b{color:#355540}.chip-sep{color:#b5beb4;padding:0 5px}.map-status{position:absolute;z-index:600;top:54px;left:16px;background:#fffffff0;padding:8px 11px;font-size:8px;color:#778277;box-shadow:0 2px 12px #2133260b}.map-status.error{color:#a64137}.map-legend{position:absolute;z-index:600;bottom:17px;left:16px;display:flex;align-items:center;gap:12px;background:#fffffff2;padding:10px 12px;font-size:9px;color:#68736b;box-shadow:0 2px 12px #21332612}.legend-item{display:flex;align-items:center;gap:6px}.legend-item i{display:block;width:14px;height:10px}.legend-green{border:1px solid #75a45b;background:#a8ca8e}.legend-park{border:1px solid #31734a;background:#54a76c;border-radius:2px}.legend-boundary{border:1px solid #718a68;background:#e6ede0}.north{position:absolute;right:16px;top:16px;z-index:600;background:#fffffff0;width:30px;height:40px;display:flex;flex-direction:column;align-items:center;justify-content:center;font:9px 'DM Mono',monospace;color:#536257}.north span{font-size:17px;line-height:15px}.leaflet-container{font-family:inherit;background:#edf0e9}.leaflet-control-zoom{border:0!important;box-shadow:0 2px 12px #21332614!important}.leaflet-control-zoom a{color:#375341!important;border:0!important}.leaflet-control-attribution{font-size:8px!important;background:#ffffffdc!important}.dong-tooltip{font-family:'Noto Sans KR',sans-serif;font-size:11px}
@media(max-width:900px){.shell{padding:0 12px 12px}.topbar{height:58px}.workspace{height:auto;min-height:calc(100vh - 82px);grid-template-columns:1fr;grid-template-rows:minmax(55vh,1fr) auto;margin-top:12px}.map-wrap{min-height:460px;border-right:0;border-bottom:1px solid #e5e8e1}.panel{padding:22px 20px 16px}.panel footer{margin-top:18px}.scores{grid-template-columns:1fr 1fr}.method-note{margin-top:10px}}
@media(max-width:520px){.phase{font-size:8px}.map-legend{gap:8px;left:10px;bottom:10px;padding:8px 9px;font-size:8px}.map-chip{left:10px;top:10px;padding:8px 9px;font-size:8px}.map-status{left:10px;top:43px}.north{right:10px;top:10px}.scores{grid-template-columns:1fr 1fr}.score-card{padding:10px}.score-value{font-size:27px}.score-rank{display:block}.score-rank span{display:block}.score-rank span+span{margin-top:3px}}
