:root{
  --bg:#F4F7F5;--surface:#FFFFFF;--surface-2:#EDF2EF;--ink:#172127;--muted:#5F6D6A;--line:#D9E1DD;
  --accent:#0E8A6E;--accent-ink:#0B6B56;--accent-soft:#DDF2EA;
  --warn:#A6660A;--warn-soft:#FBEFD9;--danger:#C2372E;--danger-soft:#FBE4E1;--night:#3A4C99;--night-soft:#E4E8F8;
  --shadow:0 1px 2px rgba(23,33,39,.06),0 4px 14px rgba(23,33,39,.05);
  --r:14px;--font:"IBM Plex Sans KR","Apple SD Gothic Neo","Noto Sans KR",system-ui,sans-serif;--brand:"Gowun Dodum",var(--font);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:dark;
  --bg:#0F1513;--surface:#171F1D;--surface-2:#1F2927;--ink:#EAF0ED;--muted:#97A5A0;--line:#28332F;
  --accent:#3EC49E;--accent-ink:#7FE0C3;--accent-soft:#14352B;
  --warn:#E5A94A;--warn-soft:#3A2B10;--danger:#F0705F;--danger-soft:#3E1B17;--night:#98A8F0;--night-soft:#232B4D;
  --shadow:0 1px 2px rgba(0,0,0,.4)}}
:root[data-theme="dark"]{color-scheme:dark;
  --bg:#0F1513;--surface:#171F1D;--surface-2:#1F2927;--ink:#EAF0ED;--muted:#97A5A0;--line:#28332F;
  --accent:#3EC49E;--accent-ink:#7FE0C3;--accent-soft:#14352B;
  --warn:#E5A94A;--warn-soft:#3A2B10;--danger:#F0705F;--danger-soft:#3E1B17;--night:#98A8F0;--night-soft:#232B4D;
  --shadow:0 1px 2px rgba(0,0,0,.4)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.55}
a{color:var(--accent-ink);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3{line-height:1.25;text-wrap:balance;margin:0}
.wrap{max-width:780px;margin:0 auto;padding-inline:16px}
.muted{color:var(--muted)}
.num{font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* header */
.top{position:sticky;top:0;z-index:20;background:var(--surface);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;height:56px}
.brand{font-family:var(--brand);font-size:22px;color:var(--ink);letter-spacing:-.01em;display:flex;align-items:center;gap:8px}
.brand:hover{text-decoration:none}
.brand svg{width:26px;height:26px}
.now{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--muted)}
#now-chip{font-variant-numeric:tabular-nums;background:var(--surface-2);border-radius:999px;padding:4px 10px;color:var(--ink)}
.now-day{font-weight:600}.now-day.hol{color:var(--danger)}

/* hero */
.hero{padding-block:28px 8px}
.hero h1{font-family:var(--brand);font-size:clamp(26px,5.5vw,36px);font-weight:400}
.hero p{margin:8px 0 0;color:var(--muted);max-width:36em}
.hol-note{margin:14px 0 0;padding:10px 14px;border-radius:10px;background:var(--danger-soft);color:var(--danger);font-weight:500;font-size:14px}
.cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.btn{appearance:none;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:10px 16px;font:inherit;font-size:15px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.btn.primary:disabled{opacity:.7}
.btn:hover{text-decoration:none;border-color:var(--accent)}
.btn.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-ink)}

/* section */
section{margin-block:26px}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}
.sec-h h2{font-size:18px}
.sec-h .more{font-size:14px}
.eyebrow{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}

/* grids */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.tile{display:flex;flex-direction:column;gap:2px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px;color:var(--ink);box-shadow:var(--shadow)}
.tile:hover{text-decoration:none;border-color:var(--accent)}
.tile b{font-size:16px}.tile small{color:var(--muted);font-variant-numeric:tabular-nums}
.cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.cat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px;color:var(--ink);display:flex;flex-direction:column;gap:4px;box-shadow:var(--shadow);position:relative}
.cat:hover{text-decoration:none;border-color:var(--accent)}
.cat .k{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.cat .k.p{color:var(--accent-ink)}.cat .k.h{color:var(--night)}.cat .k.e{color:var(--danger)}
.cat .k.s{color:var(--night)}
.cat.ext{border-color:var(--night-soft);background:linear-gradient(var(--surface),var(--surface)) padding-box}
.cat.ext:hover{border-color:var(--night)}
.cat.ext b::after{content:" ↗";font-size:12px;color:var(--muted);font-weight:400;white-space:nowrap}
.cat .d{margin-top:4px;line-height:1.45}
.cat b{font-size:17px}.cat small{color:var(--muted)}
.sido-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px}
.sido-list a{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 12px;color:var(--ink);display:flex;flex-wrap:wrap;gap:2px 8px;justify-content:space-between;align-items:baseline}
.sido-list a>span{white-space:nowrap}
.sido-list a:hover{border-color:var(--accent);text-decoration:none}
.sido-list small{color:var(--muted);font-size:12px}

/* breadcrumb */
.crumb{font-size:13px;color:var(--muted);padding-top:14px;display:flex;flex-wrap:wrap;gap:6px}
.crumb a{color:var(--muted)}.crumb span::before{content:"›";margin-right:6px}

/* page head */
.ph{padding-block:10px 6px}
.ph h1{font-size:clamp(22px,5vw,30px);font-weight:700;letter-spacing:-.01em}
.ph p{margin:6px 0 0;color:var(--muted)}
.tabs{display:flex;gap:6px;overflow-x:auto;padding-block:10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.tabs::-webkit-scrollbar{display:none}
.tabs a{white-space:nowrap;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 12px;font-size:14px;color:var(--ink)}
.tabs a.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.tabs a:hover{text-decoration:none;border-color:var(--accent)}

/* filters */
.filters{position:sticky;top:56px;z-index:10;background:var(--bg);padding-block:8px;border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.filters .sw{display:inline-flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:7px 12px;font-size:14px;cursor:pointer;user-select:none}
.filters .sw input{accent-color:var(--accent);width:18px;height:18px;margin:0}
.filters input[type=search]{flex:1;min-width:140px;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:8px 14px;font:inherit;font-size:14px}
.chips{display:flex;gap:6px;overflow-x:auto;padding-block:8px 4px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chips button{white-space:nowrap;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:5px 11px;font:inherit;font-size:13px;cursor:pointer}
.chips button.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
.summary{font-size:14px;color:var(--muted);padding-block:8px}
.summary b{color:var(--ink)}

/* rows */
ul.list li.ad-li{list-style:none}
ul.list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
li.row{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 14px 12px;display:grid;grid-template-columns:1fr auto;gap:4px 12px;box-shadow:var(--shadow)}
li.row .nm{font-size:17px;font-weight:600;grid-column:1;display:flex;flex-wrap:wrap;align-items:center;gap:6px}
li.row .kind{font-size:12px;font-weight:500;color:var(--muted);border:1px solid var(--line);border-radius:6px;padding:1px 6px}
li.row .kind.er{color:var(--danger);border-color:var(--danger)}
li.row .st{grid-column:1;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-variant-numeric:tabular-nums}
li.row .today-h{font-size:15px;font-weight:500}
li.row .addr{grid-column:1;font-size:14px;color:var(--muted)}
li.row .inf{grid-column:1;font-size:13px;color:var(--muted)}
li.row .dist{grid-column:2;grid-row:1;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums;text-align:right}
li.row .call{grid-column:2;grid-row:2/5;align-self:center;display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--accent-soft);color:var(--accent-ink);border-radius:12px;padding:10px 14px;font-weight:600;font-size:14px;white-space:nowrap}
li.row .call.er{background:var(--danger-soft);color:var(--danger)}
li.row .call:hover{text-decoration:none;filter:brightness(.96)}
li.row .call svg{width:16px;height:16px;flex:none}
li.row details{grid-column:1/-1;font-size:13px}
li.row summary{cursor:pointer;color:var(--muted);list-style:none;display:inline-flex;align-items:center;gap:4px}
li.row summary::-webkit-details-marker{display:none}
li.row summary::after{content:"▾";font-size:11px}
li.row details[open] summary::after{content:"▴"}
.wk{width:100%;border-collapse:collapse;margin-top:6px;font-variant-numeric:tabular-nums}
.wk td,.wk th{padding:4px 6px;border-top:1px solid var(--line);text-align:left;font-weight:400}
.wk th{color:var(--muted);width:4.5em;font-size:12px}
.wk td.off{color:var(--muted)}
.wk td.cur{font-weight:600;color:var(--accent-ink);background:var(--accent-soft)}
.badge{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;border-radius:999px;padding:3px 10px;background:var(--surface-2);color:var(--muted)}
.badge::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.8}
.badge.open{background:var(--accent-soft);color:var(--accent-ink)}
.badge.soon{background:var(--warn-soft);color:var(--warn)}
.badge.before{background:var(--night-soft);color:var(--night)}
.badge.closed{background:var(--surface-2);color:var(--muted)}
.badge.unknown{background:var(--warn-soft);color:var(--warn)}
.badge.unknown::before{opacity:.45}
.badge.none{background:var(--surface-2);color:var(--muted)}
.badge.none::before{display:none}
.empty{padding:28px;text-align:center;color:var(--muted);background:var(--surface);border:1px dashed var(--line);border-radius:var(--r)}

/* hub live */
.live{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px;box-shadow:var(--shadow)}
.live h3{font-size:16px;display:flex;align-items:baseline;gap:8px}
.live .cnt{color:var(--accent-ink);font-variant-numeric:tabular-nums}
.live+.live{margin-top:10px}
ul.mini{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:14px}
ul.mini li{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;border-top:1px solid var(--line);padding-top:8px}
ul.mini .tel{margin-left:auto;font-variant-numeric:tabular-nums}
.live .more{display:inline-block;margin-top:10px;font-size:14px}
.skeleton{height:60px;border-radius:10px;background:linear-gradient(90deg,var(--surface-2),var(--surface),var(--surface-2));background-size:200% 100%;animation:sk 1.2s linear infinite}
@keyframes sk{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.skeleton{animation:none}}

/* article */
.article{max-width:680px}
.article h1{font-size:clamp(24px,5vw,32px);font-weight:700;margin-top:12px}
.article .lead{color:var(--muted);font-size:17px;margin:10px 0 24px}
.article h2{font-size:19px;margin:28px 0 8px}
.article p,.article li{font-size:16px}
.article ul,.article ol{padding-left:22px}
.article li{margin-block:4px}
.article a{text-decoration:underline;text-underline-offset:3px}
.art-list{display:grid;gap:10px}
.art-list a{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;color:var(--ink);display:block;box-shadow:var(--shadow)}
.art-list a:hover{border-color:var(--accent);text-decoration:none}
.art-list b{display:block;font-size:16px}.art-list span{font-size:14px;color:var(--muted)}

/* ads */
.ad{margin-block:18px;min-height:90px;display:flex;align-items:center;justify-content:center}
.ad.ph-ad{border:1px dashed var(--line);border-radius:10px;color:var(--muted);font-size:12px;background:var(--surface-2)}

/* footer */
footer{margin-top:40px;border-top:1px solid var(--line);padding-block:24px 32px;font-size:13px;color:var(--muted)}
footer .wrap{display:flex;flex-direction:column;gap:10px}
footer nav{display:flex;flex-wrap:wrap;gap:6px 16px}
footer a{color:var(--muted)}
.note{font-size:13px;color:var(--muted);background:var(--surface-2);border-radius:10px;padding:10px 14px;margin-top:16px}
@media (max-width:480px){
  li.row{grid-template-columns:1fr auto}
  li.row .call{padding:9px 11px;font-size:13px}
  .top .wrap{height:52px}
  .filters{top:52px}
}

/* 태그 변형 */
li.row .kind.night{color:var(--night);border-color:var(--night)}
li.row .kind.sun{color:var(--accent-ink);border-color:var(--accent)}

/* 통계 타일 */
.grid.stats{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.tile.stat{gap:2px}
.tile.stat b{font-size:24px;font-variant-numeric:tabular-nums;color:var(--accent-ink);line-height:1.1}
.tile.stat small:first-child{color:var(--muted);font-size:13px}

/* 페이지네이션 */
.pager{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:center;margin-block:20px}
.pager a,.pager span{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:8px 12px;font-size:14px;color:var(--ink);min-width:42px;text-align:center}
.pager a:hover{border-color:var(--accent);text-decoration:none}
.pager .cur{background:var(--ink);color:var(--bg);border-color:var(--ink);font-weight:600}
.pager .off{color:var(--muted);opacity:.5}
.pager .gap{border:0;background:none;min-width:0;padding:8px 2px;color:var(--muted)}