/* 3DAYS "Pop Sticker" theme (B안). Loaded after each page's own styles; overrides colors, type and card shapes only. */
@import url("https://fonts.googleapis.com/css2?family=Black+Han+Sans&display=swap");

html:root:root{
  --bg:#FFD23F; --surface:#FFFFFF; --sheet:#FFFFFF; --card:#FFFFFF;
  --ink:#111111; --muted:#3D3D3D; --mut:#3D3D3D; --line:#111111; --soft:#FFF4C7;
  --redSoft:#FFE0D6; --warnSoft:#FFF4C7; --ok:#0E7A47; --warn:#8A5A00;
  --pop-blue:#2F6BFF; --pop-red:#FF5A36; --pop-green:#3BD18A; --pop-purple:#B9A6FF;
  --pop-b:2.5px solid #111111; --pop-sh:4px 4px 0 #111111; --pop-sh-sm:3px 3px 0 #111111;
  --f-display:"Black Han Sans","Bricolage Grotesque","Pretendard Variable",Pretendard,-apple-system,"Apple SD Gothic Neo","Noto Sans KR","Noto Sans SC","Noto Sans TC",system-ui,sans-serif;
  color-scheme:light;
}
/* the pop look is light-only */
@media (prefers-color-scheme:dark){html:root:root{color-scheme:light}}

html body{background:var(--bg);color:var(--ink)}
html :focus-visible{outline:3px solid #111;outline-offset:2px}

/* display type */
html .logo,html .brand,html h1,html .pass-code,html .rank,html .stub-num,html .tee-meta b,html .mtitle b{font-family:var(--f-display);font-weight:400;letter-spacing:0}
html .logo span{color:var(--ink);background:var(--surface);border:var(--pop-b);border-radius:10px;padding:0 6px;box-shadow:var(--pop-sh-sm)}
html .brand i{background:#111;color:#FFD23F;border-radius:10px}

/* sticker surfaces */
html .pass,html .spot,html .box,html .day,html .check,html .ritem,html .bkrow,html .card,html .stop,html .row,html .empty,html .tee-th,html .stat{
  border:var(--pop-b);border-radius:16px;box-shadow:var(--pop-sh);background:var(--surface)}
html .empty{border-style:dashed;box-shadow:none}
html .stat{background:var(--soft);box-shadow:var(--pop-sh-sm)}
html .spot.hit,html .stop.on,html .row.on{box-shadow:6px 6px 0 #111;transform:translate(-2px,-2px)}
html .stop.on{border-color:#111;background:var(--soft)}
html .stop:hover,html .bkrow:hover{border-color:#111}
html .pass-code{color:var(--ink)}
html .stub{border-left:2.5px dashed #111}
@media (max-width:560px){html .stub{border-left:0;border-top:2.5px dashed #111}}
html .deep{background:var(--soft);border:2px solid #111;border-radius:14px}
html .deep.off{background:transparent;border:2px dashed #111}
html .day-h,html .opts div:first-child{background:var(--soft)}
html .prow,html .opts div{border-top:1.5px solid #111}
html .opts,html .detail{border-color:#111}
html .thumb{border:2px solid #111;border-radius:12px}

/* buttons, chips, tabs */
html .btn,html .chip,html .cbtn,html .links a,html .cw button,html .deep a{border:2px solid #111;border-radius:999px;box-shadow:var(--pop-sh-sm);font-weight:700}
html .cbtn{border-radius:14px;background:var(--surface)}
html .btn.pri,html .links a.pri,html .chip[aria-pressed="true"],html .cw button[aria-pressed="true"]{background:#111;color:#FFD23F;border-color:#111}
html .btn:active,html .chip:active,html .cbtn:active,html .links a:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #111}
html .tabs{background:var(--bg)}
html .sheet .tabs{background:var(--soft);border:2px solid #111;border-radius:999px;box-shadow:0 -18px 0 8px var(--sheet)}
html .tab{border-radius:999px;color:var(--ink);background:transparent;font-weight:800}
html .tabs > .tab{border:2px solid transparent}
html .tab[aria-selected="true"]{background:#111;color:#FFD23F;box-shadow:none}
html .lang{background:var(--surface);border:2px solid #111}
html .lang button[aria-pressed="true"]{background:#111;color:#FFD23F;box-shadow:none}
html .home{border:2px solid #111;opacity:1;background:var(--surface);color:#111}

/* inputs */
html .find input,html .search,html select,html textarea.copybox{border:2.5px solid #111;border-radius:14px;background:var(--surface)}
html .find svg{stroke:#111}

/* small accents */
html .num{background:var(--pop-red);color:#111;border:2px solid #111;width:22px;height:22px}
html .price{border:1.5px solid #111;background:var(--surface)}
html .tag{background:var(--surface);border:1.5px solid #111;color:#111}
html .eyebrow{color:#111;background:var(--bg);display:inline-block;padding:2px 8px;border:2px solid #111;border-radius:999px}
html .sheet{border-right:3px solid #111}
html .toast{background:#111;color:#FFD23F;border:2px solid #111}

/* map overlays become stickers too */
html .mtitle,html .player,html .wx,html .hint{border:2px solid #111;box-shadow:var(--pop-sh-sm);background:#FFFFFF}
html .play{background:#111;color:#FFD23F}
html .pin{border:2px solid #111;box-shadow:2px 2px 0 #111}
html .pin.on{background:#111;color:#FFD23F}

/* simple text pages (about / terms) */
html body > main,html body > article{background:var(--surface);border:var(--pop-b);border-radius:20px;box-shadow:var(--pop-sh)}

/* Impeccable polish 2026-11-04: 로고 박스가 아래 설명 글과 겹치던 문제 */
html .logo span{display:inline-block;margin-bottom:8px}
html ::selection{background:#111;color:#FFD23F}