:root{
  --ink:#1a2330;--sub:#5b6675;--line:#e7e9ee;--bg:#ffffff;--soft:#f7f8fa;
  --brand:#ff5a2d;--brand-dark:#e0431a;--brand-soft:#fff2ec;
  --ok:#0e8a5f;--ok-soft:#e9f7f1;--warn:#8a5b0e;--warn-soft:#fdf3e0;
  --radius:14px;--maxw:860px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic","Segoe UI",Roboto,sans-serif;color:var(--ink);background:var(--bg);line-height:1.65;font-size:16px}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 18px}

/* header */
.site-header{border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:20}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:58px}
.logo{font-weight:800;font-size:1.25rem;letter-spacing:-.02em}
.logo b{color:var(--brand)}
.nav{display:flex;gap:14px;font-size:.92rem;color:var(--sub)}
.nav a:hover{color:var(--ink)}

/* disclosure */
.disclosure{background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-size:.83rem;color:var(--sub);margin:18px 0}

/* hero */
.hero{padding:44px 0 26px}
.hero h1{font-size:1.85rem;letter-spacing:-.03em;line-height:1.3}
.hero p{color:var(--sub);margin-top:10px}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.badge{font-size:.78rem;padding:4px 10px;border-radius:999px;background:var(--soft);border:1px solid var(--line);color:var(--sub)}
.badge.ok{background:var(--ok-soft);color:var(--ok);border-color:transparent}

/* merchant grid */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:20px 0 8px}
.mcard{border:1px solid var(--line);border-radius:var(--radius);padding:16px 14px;background:#fff;transition:box-shadow .15s}
a.mcard:hover{box-shadow:0 4px 14px rgba(20,30,50,.08)}
.mcard .mname{font-weight:700}
.mcard .mcat{font-size:.78rem;color:var(--sub);margin-top:2px}
.mcard .mtag{display:inline-block;margin-top:8px;font-size:.72rem;padding:2px 8px;border-radius:999px}
.mtag.live{background:var(--ok-soft);color:var(--ok)}
.mtag.soon{background:var(--soft);color:var(--sub)}

/* page head */
.page-head{padding:30px 0 6px}
.page-head h1{font-size:1.6rem;letter-spacing:-.03em;line-height:1.35}
.meta-line{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:10px;font-size:.83rem;color:var(--sub)}
.verified{background:var(--ok-soft);color:var(--ok);padding:3px 10px;border-radius:999px;font-weight:600}

/* coupon card */
.coupon{border:1px solid var(--line);border-radius:var(--radius);margin:16px 0;overflow:hidden;background:#fff}
.coupon-head{padding:16px 18px 4px;display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.coupon-head h3{font-size:1.05rem;letter-spacing:-.02em}
.aud{font-size:.74rem;white-space:nowrap;background:var(--warn-soft);color:var(--warn);padding:3px 9px;border-radius:999px;font-weight:600}
.codebox{display:flex;gap:8px;align-items:center;margin:12px 18px;padding:10px 14px;background:var(--brand-soft);border:1.5px dashed var(--brand);border-radius:10px}
.codebox code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:1.15rem;font-weight:700;color:var(--brand-dark);letter-spacing:.04em;flex:1}
.copy-btn{border:0;background:var(--brand);color:#fff;font-weight:700;font-size:.85rem;padding:8px 14px;border-radius:8px;cursor:pointer}
.copy-btn:active{transform:scale(.97)}
.copy-btn.copied{background:var(--ok)}
.conds{padding:0 18px 8px;font-size:.88rem;color:var(--sub)}
.conds li{margin:4px 0 4px 18px}
.coupon-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 18px 16px;flex-wrap:wrap}
.go-btn{display:inline-block;background:var(--ink);color:#fff;font-weight:700;font-size:.9rem;padding:10px 18px;border-radius:10px}
.go-btn:hover{background:#000}
.vdate{font-size:.78rem;color:var(--sub)}

/* sections */
.section{margin:34px 0}
.section h2{font-size:1.25rem;letter-spacing:-.02em;margin-bottom:12px;padding-bottom:8px;border-bottom:2px solid var(--ink)}
.section ol,.section ul{padding-left:20px}
.section li{margin:6px 0}
.callout{background:var(--soft);border-radius:var(--radius);padding:16px 18px;font-size:.9rem}
.callout.trust{border-left:4px solid var(--ok)}
.empty-expired{color:var(--sub);font-size:.9rem;background:var(--soft);border-radius:10px;padding:14px 16px}

/* faq */
.faq details{border:1px solid var(--line);border-radius:10px;margin:8px 0;padding:0}
.faq summary{cursor:pointer;font-weight:600;padding:13px 16px;font-size:.95rem}
.faq details p{padding:0 16px 14px;color:var(--sub);font-size:.9rem}

/* toc / related */
.related{display:flex;gap:8px;flex-wrap:wrap}
.related a{border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-size:.85rem;color:var(--sub)}
.related a:hover{color:var(--ink);border-color:var(--ink)}

/* footer */
.site-footer{border-top:1px solid var(--line);margin-top:56px;padding:28px 0 40px;background:var(--soft)}
.site-footer .cols{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:.82rem;color:var(--sub)}
.site-footer nav{display:flex;gap:14px;flex-wrap:wrap}
.site-footer .biz{margin-top:14px;font-size:.78rem;color:var(--sub);line-height:1.8}

/* toast */
#toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;font-size:.85rem;padding:10px 18px;border-radius:999px;opacity:0;pointer-events:none;transition:all .25s}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media (max-width:560px){
  .hero h1{font-size:1.5rem}
  .page-head h1{font-size:1.32rem}
  .nav{gap:10px;font-size:.85rem}
  .coupon-head{flex-direction:column}
}