:root{--bg:#edf5f7;--ink:#102a33;--sea:#0e7490;--deep:#062f3f;--card:#fff;--muted:#647881;--line:#d6e3e7;--surf:#dc6b2f;--lure:#087f8c;--float:#7e57c2;--danger:#b42318;--ok:#137333}
*{box-sizing:border-box}html{background:var(--deep)}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,"Noto Sans KR",sans-serif;min-height:100vh}button,input,select,textarea{font:inherit}.topbar{display:flex;justify-content:space-between;align-items:center;padding:16px clamp(14px,4vw,48px);background:linear-gradient(135deg,var(--deep),#0c6177);color:#fff;position:sticky;top:0;z-index:1000;box-shadow:0 6px 22px #001d2a38}.brand{display:flex;gap:11px;align-items:center}.brand img{width:48px;height:48px;border-radius:14px}.topbar h1{margin:0;font-size:clamp(21px,4vw,32px)}.topbar p{margin:4px 0 0;opacity:.82;font-size:13px}.header-actions{display:flex;gap:8px}.ghost{background:transparent;border:1px solid #ffffff80;color:#fff}main{padding:14px clamp(10px,3vw,36px) 32px}.notice{position:relative;display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:#fff8d8;border:1px solid #f5d46b;border-radius:14px;padding:12px 44px 12px 14px;margin-bottom:12px}.notice span{color:#645a2e;font-size:13px}.notice-close{position:absolute;right:8px;top:7px;background:transparent;color:#5e552d;font-size:22px;padding:2px 8px}.filters{display:flex;gap:9px;align-items:center;flex-wrap:wrap;background:#fff;padding:11px;border-radius:16px;box-shadow:0 8px 30px #0b3b4a12}.method-filters{display:flex;gap:10px}.filters label{font-weight:700;white-space:nowrap}.filters input,.filters select{padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff}.filters #speciesFilter{min-width:160px}.photo-only{display:flex;align-items:center;gap:5px}.photo-only input{width:18px;height:18px;padding:0}button{cursor:pointer;border:0;border-radius:10px;background:var(--sea);color:#fff;padding:10px 14px;font-weight:700}button:disabled{opacity:.55;cursor:wait}.summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:13px 0}.summary article{background:#fff;border-radius:15px;padding:13px;display:flex;align-items:baseline;gap:8px;box-shadow:0 4px 15px #0b3b4a0b}.summary strong{font-size:27px;color:var(--sea)}.summary span{color:var(--muted)}.layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(330px,.75fr);gap:13px;min-height:640px}.view-panel{min-width:0}#mapWrap{position:relative}#map{height:640px;border-radius:18px;overflow:hidden;box-shadow:0 12px 32px #082f4019}.map-legend{position:absolute;z-index:500;bottom:13px;left:13px;background:#fff;padding:8px 10px;border-radius:11px;box-shadow:0 4px 18px #0003;font-size:12px}.dot:before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:4px}.dot+ .dot{margin-left:8px}.dot.surf:before{background:var(--surf)}.dot.lure:before{background:var(--lure)}.dot.float:before{background:var(--float)}#listPanel{height:640px;overflow:auto;background:#fff;border-radius:18px;padding:13px}.list-head{display:flex;justify-content:space-between;align-items:center;position:sticky;top:-13px;background:#fff;padding:11px 0;z-index:2;border-bottom:1px solid #eef4f5}.list-head h2{margin:0}.list-head span{font-size:12px;color:var(--muted)}.catch-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;margin:12px 0;background:#fff;box-shadow:0 4px 14px #102a3309}.photo-wrap{display:block;border:0;padding:0;border-radius:0;width:100%;background:#dbe8ec;overflow:hidden}.catch-card img{display:block;width:100%;height:190px;object-fit:cover}.photo-placeholder{height:92px;display:grid;place-items:center;background:linear-gradient(135deg,#e7f0f2,#d7e5e9);color:#71858d;font-size:13px}.catch-body{padding:12px}.catch-title{font-weight:800;margin:0 0 7px;font-size:16px;line-height:1.35}.badges{display:flex;gap:6px;flex-wrap:wrap}.badge{font-size:12px;padding:4px 7px;border-radius:999px;background:#e9f4f7;color:#07586b}.badge.surf{background:#fff0e8;color:#9c421c}.badge.lure{background:#e3f6f7;color:#04616a}.badge.float{background:#f0eafd;color:#5d3993}.meta{font-size:12px;color:var(--muted);margin:8px 0}.summary-text{font-size:14px;line-height:1.48;margin:8px 0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.source-link{display:inline-block;margin-top:6px;color:var(--sea);font-weight:700;text-decoration:none}.submit-card{margin-top:13px;background:#fff;border-radius:18px;padding:16px;box-shadow:0 6px 20px #0b3b4a0c}.submit-card summary{cursor:pointer;font-weight:800;font-size:18px}.form-help{font-size:13px;color:var(--muted)}.submit-card form{display:grid;gap:10px;margin-top:13px}.submit-card input,.submit-card select,.submit-card textarea{width:100%;padding:11px;border:1px solid var(--line);border-radius:10px;background:#fff}.submit-card textarea{min-height:88px;resize:vertical}.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.file-box{display:flex;justify-content:center;align-items:center;padding:12px;border:1px dashed var(--sea);border-radius:10px;color:var(--sea);font-weight:700;cursor:pointer}.file-box input{position:absolute;width:1px;height:1px;opacity:0}.consent{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--muted)}.consent input{width:18px;height:18px;padding:0;margin:0;flex:0 0 auto}.success{color:var(--ok)}.error{color:var(--danger)}.empty,.loading,.error-box{padding:40px 14px;text-align:center;color:var(--muted)}.error-box{color:var(--danger)}footer a{color:var(--sea)}footer{text-align:center;color:var(--muted);padding:18px;font-size:12px}.marker-pin{width:36px;height:36px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--sea);border:3px solid white;box-shadow:0 2px 8px #0005}.marker-pin.surf{background:var(--surf)}.marker-pin.lure{background:var(--lure)}.marker-pin.float{background:var(--float)}.marker-pin span{display:block;transform:rotate(45deg);text-align:center;line-height:29px;color:#fff;font-size:13px}.leaflet-popup-content img{width:220px;max-height:135px;object-fit:cover;border-radius:8px}.leaflet-popup-content h3{margin:8px 0 5px}.leaflet-popup-content p{margin:5px 0}.marker-cluster-small,.marker-cluster-medium,.marker-cluster-large{background:#0e749055}.marker-cluster-small div,.marker-cluster-medium div,.marker-cluster-large div{background:#0e7490;color:#fff}.mobile-tabs{display:none}dialog{border:0;border-radius:15px;padding:0;background:#081e27;max-width:min(94vw,900px);box-shadow:0 20px 60px #0008}dialog::backdrop{background:#00151dcc}dialog img{display:block;max-width:94vw;max-height:88vh;object-fit:contain}dialog button{position:absolute;right:8px;top:8px;border-radius:50%;width:38px;height:38px;padding:0;background:#000a;font-size:22px}
@media(max-width:900px){.layout{grid-template-columns:1fr}.layout,#map,#listPanel{height:auto;min-height:480px}#map{height:56vh;min-height:430px}.summary{grid-template-columns:1fr 1fr 1fr}.catch-card img{height:180px}.header-actions button{padding:9px 11px}}
@media(max-width:620px){body{padding-bottom:58px}.topbar{padding:11px 12px}.brand img{width:41px;height:41px}.topbar p{font-size:11px}.header-actions{gap:5px}.header-actions button{font-size:12px;padding:8px}.filters{gap:7px}.method-filters{width:100%;justify-content:space-between}.filters #speciesFilter{flex:1 1 46%;min-width:0}.filters select{flex:1 1 34%}.filters #refreshBtn{flex:1}.summary{gap:6px}.summary article{display:block;padding:9px}.summary strong{display:block;font-size:22px}.summary span{font-size:12px}.mobile-tabs{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:0;right:0;bottom:0;z-index:1200;background:#fff;border-top:1px solid var(--line);padding-bottom:max(5px,env(safe-area-inset-bottom))}.mobile-tabs button{border-radius:0;background:#fff;color:var(--muted);padding:12px 5px}.mobile-tabs button.active{color:var(--sea);box-shadow:inset 0 3px var(--sea)}.layout{display:block;min-height:0}.layout .view-panel,.submit-card.view-panel{display:none}.layout .view-panel.active,.submit-card.view-panel.active{display:block}#map{height:calc(100vh - 286px);min-height:390px;border-radius:14px}#listPanel{height:calc(100vh - 286px);min-height:390px;border-radius:14px}.submit-card{margin-top:0}.two{grid-template-columns:1fr}.map-legend{bottom:9px;left:9px}.notice{font-size:13px}}