body[data-mode="library"]{--ink:#1d1a16;--sub:#6f685e;--line:rgba(60,45,30,.14);--glass:rgba(252,249,243,.9);--accent:#2f5d62;--accent2:#d5e4e2;--ok:#b3472b;--bg:#f3efe8}
@media (prefers-color-scheme:dark){body[data-mode="library"]{--ink:#f1ece4;--sub:#a79f93;--line:rgba(255,240,220,.16);--glass:rgba(30,27,24,.88);--accent:#6fb3b8;--accent2:#2a4245;--ok:#e8825f;--bg:#1b1916}
}
body[data-mode="library"] .glass{background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);box-shadow:0 8px 30px rgba(0,0,0,.14)}
body[data-mode="library"] #side{position:absolute;z-index:500;top:12px;left:12px;bottom:12px;width:330px;border-radius:18px;display:flex;flex-direction:column;overflow:hidden}
body[data-mode="library"] #side header{padding:16px 16px 8px}
body[data-mode="library"] #side h1{font-size:18px;margin:0 0 2px;letter-spacing:-.02em}
body[data-mode="library"] #side p.lead{margin:0 0 10px;font-size:12.5px;color:var(--sub);line-height:1.5}
body[data-mode="library"] #q{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:transparent;color:var(--ink);font:inherit;font-size:14px}
body[data-mode="library"] .chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
body[data-mode="library"] .chip{border:1px solid var(--line);background:none;color:var(--ink);border-radius:99px;padding:4px 10px;font:inherit;font-size:12px;cursor:pointer}
body[data-mode="library"] .chip:hover{background:var(--accent2)}
body[data-mode="library"] .chip.on{background:var(--accent);color:#fff;border-color:var(--accent)}
body[data-mode="library"] .chip.vis.on{background:var(--ok);border-color:var(--ok)}
body[data-mode="library"] #cnt{font-size:11.5px;color:var(--sub);margin-top:8px}
body[data-mode="library"] .auth{margin-top:6px;font-size:12px;color:var(--sub);display:flex;gap:6px;align-items:center;flex-wrap:wrap;line-height:1.5}
body[data-mode="library"] .auth b{color:var(--ink);font-weight:600}
body[data-mode="library"] .auth .ok{color:var(--ok)}
body[data-mode="library"] #list{flex:1;overflow:auto;padding:4px 8px 12px}
body[data-mode="library"] .ar{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:0;background:none;color:inherit;font:inherit;padding:7px 8px;border-radius:10px;cursor:pointer}
body[data-mode="library"] .ar:hover{background:var(--accent2)}
body[data-mode="library"] .ar.on{background:var(--accent);color:#fff}
body[data-mode="library"] .ar img,body[data-mode="library"] .ar .ni{width:46px;height:46px;border-radius:8px;object-fit:cover;flex:none;background:var(--accent2)}
body[data-mode="library"] .ar>div{flex:1;min-width:0}
body[data-mode="library"] .ar .n{font-size:13.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body[data-mode="library"] .ar .e{font-size:11.5px;opacity:.7;margin-top:1px}
body[data-mode="library"] .ar .v{flex:none;color:var(--ok);font-weight:700}
body[data-mode="library"] .ar.on .v{color:#fff}
body[data-mode="library"] .pin{width:16px;height:16px;border-radius:50%;background:var(--accent);border:2px solid #fff;box-shadow:0 1px 5px rgba(0,0,0,.4)}
body[data-mode="library"] .pin.vis{background:var(--ok)}
body[data-mode="library"] .pin.on{width:24px;height:24px;margin:-4px 0 0 -4px;box-shadow:0 0 0 4px rgba(47,93,98,.3),0 1px 5px rgba(0,0,0,.4)}
body[data-mode="library"] .leaflet-tooltip{font-family:inherit;font-size:12px;font-weight:600}
body[data-mode="library"] .cl{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--accent);color:#fff;font:700 13px/1 Pretendard,system-ui,sans-serif;border:3px solid rgba(255,255,255,.9);box-shadow:0 1px 6px rgba(0,0,0,.4)}
body[data-mode="library"] .cl.vis{background:var(--ok)}
body[data-mode="library"] .cl{position:relative}
body[data-mode="library"] .cl .vb{position:absolute;right:-7px;top:-7px;font-style:normal;font-size:10px;font-weight:700;line-height:16px;min-width:16px;padding:0 4px;border-radius:8px;background:var(--ok);color:#fff;border:1.5px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.3)}
body[data-mode="library"] #mv{position:absolute;z-index:900;top:12px;right:12px;bottom:12px;width:min(440px,calc(100vw - 372px));border-radius:18px;display:none;flex-direction:column;overflow:hidden}
body[data-mode="library"] #mv.on{display:flex}
body[data-mode="library"] #mv .x{position:absolute;top:10px;right:10px;z-index:2;border:0;background:rgba(0,0,0,.5);color:#fff;border-radius:50%;width:32px;height:32px;font-size:15px;cursor:pointer}
body[data-mode="library"] #mvb{flex:1;overflow:auto}
body[data-mode="library"] #mvb .ph{position:relative;background:var(--accent2);aspect-ratio:4/3;cursor:zoom-in}
body[data-mode="library"] #mvb .ph img{width:100%;height:100%;object-fit:cover;display:block}
body[data-mode="library"] #mvb .bd{padding:14px 18px 22px}
body[data-mode="library"] #mvb h2{font-size:20px;margin:0;letter-spacing:-.02em}
body[data-mode="library"] #mvb .en{font-size:12.5px;color:var(--sub);margin-top:2px}
body[data-mode="library"] .meta{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
body[data-mode="library"] .tag{border:1px solid var(--line);border-radius:99px;padding:3px 10px;font-size:12px}
body[data-mode="library"] .tag.in{background:var(--accent2);border-color:transparent}
body[data-mode="library"] #mvb p{font-size:14.5px;line-height:1.75;margin:0 0 10px}
body[data-mode="library"] #mvb .tip{font-size:13px;color:var(--sub);background:var(--accent2);border-radius:10px;padding:10px 12px;line-height:1.6}
body[data-mode="library"] #mvb .tip b{color:var(--ink)}
body[data-mode="library"] .links{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
body[data-mode="library"] .links a{font-size:12.5px;color:var(--accent);text-decoration:none;border:1px solid var(--line);border-radius:99px;padding:4px 10px}
body[data-mode="library"] .cr{font-size:11px;color:var(--sub);margin-top:14px;line-height:1.5}
body[data-mode="library"] .cr a{color:var(--sub)}
body[data-mode="library"] .nav2{display:flex;gap:6px;margin-top:16px}
body[data-mode="library"] .nav2 .chip{flex:1}
body[data-mode="library"] #lb2{position:fixed;inset:0;z-index:2000;background:rgba(10,8,6,.9);display:none;align-items:center;justify-content:center;padding:16px;cursor:zoom-out}
body[data-mode="library"] #lb2 img{max-width:100%;max-height:92vh;border-radius:6px}
body[data-mode="library"] #sheetbar{display:none}
body[data-mode="library"] .leaflet-control-attribution{font-size:10px}
body[data-mode="library"] #all{max-width:1080px;margin:0 auto;padding:40px 16px 60px}
body[data-mode="library"] #all h2{font-size:22px;margin:0 0 6px;letter-spacing:-.02em}
body[data-mode="library"] #all>p{color:var(--sub);font-size:14px;line-height:1.6;margin:0 0 20px}
body[data-mode="library"] .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
body[data-mode="library"] .card{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--glass)}
body[data-mode="library"] .card img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;background:var(--accent2)}
body[data-mode="library"] .card div{padding:12px 14px 14px}
body[data-mode="library"] .card h3{font-size:15.5px;margin:0}
body[data-mode="library"] .card h3 a{color:inherit;text-decoration:none}
body[data-mode="library"] .card small{display:block;color:var(--sub);font-size:12px;margin:3px 0 8px}
body[data-mode="library"] .card p{font-size:13.5px;line-height:1.65;margin:0}
body[data-mode="library"] .pc{display:block;margin-top:8px;font-size:11px;color:var(--sub);line-height:1.5}
body[data-mode="library"] .pc a{color:inherit}
body[data-mode="library"] .foot{margin-top:28px;font-size:12.5px;color:var(--sub);line-height:1.6}
@media (max-width:720px){body[data-mode="library"] #mv{top:auto;left:8px;right:8px;bottom:8px;width:auto;height:76%}
body[data-mode="library"] #side{top:auto;left:8px;right:8px;bottom:8px;width:auto;height:50%;transition:height .25s}
body[data-mode="library"] #side.min{height:150px}
body[data-mode="library"] #sheetbar{display:block;margin:8px auto 0;width:40px;height:4px;border-radius:2px;background:var(--line);border:0;padding:0;cursor:pointer;flex:none}
body[data-mode="library"] #side header{padding:8px 14px 6px}
body[data-mode="library"] #side p.lead{display:none}
body[data-mode="library"] .chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
body[data-mode="library"] .chips .chip{flex:none}
}