/*
Theme Name: Nickmoa
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nickmoa
*/
/* ===========================================================
   Main stylesheet
   =========================================================== */
:root{
  --bg:#eff6ff; --ink:#20304f; --ink2:#4b5673; --muted:#7b8299; --muted2:#9aa2b6;
  --blue:#3b82f6; --blue2:#2563eb; --coral:#fb7185; --coral2:#f43f5e; --coral-bd:#fecdd3;
  --paper:#fffdf7; --paper-bd:#efe7d4; --card:#fff; --bd:#e6ecf7; --navy:#20304f;
  --r0:#64748b; --r1:#2563eb; --r2:#e11d48;
  --maxw:1200px; --gut:20px;
  --fd:'Jua',sans-serif; --fb:'Noto Sans KR','Noto Sans Symbols 2',sans-serif;
}
@media (max-width:600px){ :root{ --gut:15px; } }

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg);
  background-image:linear-gradient(rgba(59,130,246,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(59,130,246,.045) 1px,transparent 1px);
  background-size:27px 27px;
  color:var(--ink); font-family:var(--fb); -webkit-font-smoothing:antialiased;
}
a{color:var(--blue2);text-decoration:none;} a:hover{color:#1d4ed8;}
img{max-width:100%;display:block;}
button{font-family:var(--fb);cursor:pointer;}
::selection{background:var(--coral-bd);color:#7f1d3a;}
h1,h2,h3,h4,p{margin:0;}

.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gut);}
.sec{padding-block:26px;}
.sec--tight{padding-block:16px;}
.jua{font-family:var(--fd);font-weight:400;}
.emoji{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:100;background:rgba(239,246,255,.9);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);border-bottom:1px solid #dbe6fb;}
.site-header__in{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-block:11px;}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;}
.brand__logo{position:relative;display:inline-flex;align-items:center;padding:5px 13px;}
.brand__logo::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(46deg,rgba(251,113,133,.5) 0 5px,transparent 5px 10px),rgba(251,113,133,.26);border-radius:2px;transform:rotate(-2.2deg);mix-blend-mode:multiply;}
.brand__logo span{position:relative;font-family:var(--fd);font-size:27px;color:var(--ink);}
.brand__tag{font-size:11px;color:var(--muted);font-weight:700;}
.nav{display:flex;gap:14px;font-weight:700;font-size:13px;flex-wrap:wrap;list-style:none;margin:0;padding:0;}
.nav li{margin:0;list-style:none;}
.nav a{color:var(--ink2);white-space:nowrap;}
.nav a.is-active,.nav .current-menu-item>a,.nav .current_page_item>a,.nav .current-menu-parent>a,.nav .current_page_parent>a{color:var(--blue2);}
.spacer{flex:1;min-width:8px;}
.search{position:relative;flex:0 1 auto;}
.search input{font-size:13px;padding:8px 13px 8px 31px;border:1.5px solid #cddbf5;border-radius:999px;background:#fff;width:clamp(140px,40vw,190px);outline:none;color:var(--ink);font-family:var(--fb);}
.search input:focus{border-color:var(--blue);}
.search__ic{position:absolute;left:11px;top:50%;transform:translateY(-50%);font-size:13px;opacity:.6;}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy);color:#c3cfe6;margin-top:8px;}
.site-footer__in{display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start;padding-block:30px;}
.site-footer__brand{flex:1 1 260px;}
.site-footer__brand .jua{font-size:24px;color:#fff;}
.site-footer__brand p{margin-top:8px;font-size:12px;color:#93a3c7;line-height:1.6;max-width:320px;}
.fcol{flex:1 1 150px;}
.fcol h4{font-size:11px;font-weight:800;color:#7f93bb;margin-bottom:9px;}
.fcol a{display:block;color:#c3cfe6;font-size:13px;margin-bottom:7px;}
.site-footer__bar{border-top:1px solid rgba(255,255,255,.08);}
.site-footer__bar div{padding-block:15px;font-size:11.5px;color:#7f93bb;}

/* ---------- Buttons ---------- */
.btn{font-weight:800;font-size:12.5px;border-radius:9px;padding:9px 15px;border:1.5px solid transparent;cursor:pointer;transition:background .13s,transform .1s,box-shadow .13s;}
.btn--blue{background:var(--blue);color:#fff;border-color:var(--blue);box-shadow:0 3px 8px rgba(59,130,246,.32);}
.btn--blue:hover{background:var(--blue2);}
.btn--coral{background:var(--coral);color:#fff;border-color:var(--coral);box-shadow:0 3px 8px rgba(251,113,133,.35);}
.btn--coral:hover{background:var(--coral2);}
.btn--ghost{background:#fff;color:var(--ink2);border-color:#e2e8f3;}
.btn--ghost:hover{background:#f4f6fb;}
.btn-sm{font-weight:800;font-size:11px;border-radius:7px;padding:5px 10px;border:1.5px solid;background:#fff;cursor:pointer;}
.btn-copy{color:var(--r2);border-color:var(--coral-bd);}
.btn-copy:hover{background:#fff1f2;}
.btn-collect{color:var(--blue2);border-color:#bfdbfe;}
.btn-collect:hover{background:#eff6ff;}
.btn-collect.is-on{background:var(--blue);color:#fff;border-color:var(--blue);}

/* ---------- Hero ---------- */
.hero{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;}
.hero h1{font-family:var(--fd);font-size:clamp(26px,4.2vw,42px);line-height:1.16;}
.hero p{font-size:14px;color:var(--ink2);max-width:430px;line-height:1.65;text-wrap:pretty;margin-bottom:7px;}
.c-coral{color:var(--coral);} .c-blue{color:var(--blue);}

/* ---------- Counter ---------- */
.counter{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start;}
.counter__left{flex:2 1 380px;min-width:300px;}
.counter__right{flex:1 1 300px;min-width:280px;position:sticky;top:74px;}
.sub{font-size:12.5px;color:var(--muted);margin-top:5px;}
.eyebrow{font-family:var(--fd);font-size:22px;}

.pads{display:flex;flex-wrap:wrap;gap:9px;margin:15px 0 2px;}
.pad{position:relative;cursor:pointer;padding:11px 15px 12px;min-width:86px;background:var(--paper);border:1.5px solid var(--paper-bd);border-radius:3px 12px 3px 3px;box-shadow:0 1.5px 0 rgba(0,0,0,.05);transition:transform .16s,box-shadow .16s,border-color .16s;}
.pad::before{content:"";position:absolute;top:-7px;left:13px;width:32px;height:13px;opacity:.85;mix-blend-mode:multiply;transform:rotate(-5deg);border-radius:1px;background:repeating-linear-gradient(45deg,rgba(148,163,184,.4) 0 4px,transparent 4px 8px),rgba(148,163,184,.2);}
.pad__l{font-family:var(--fd);font-size:17px;line-height:1;color:var(--ink);}
.pad__t{font-size:10px;color:#9aa2b6;margin-top:5px;}
.pad.is-active{transform:translateY(-3px) scale(1.05);}

.pens{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px;align-items:center;}
.pens__lb{font-size:11px;font-weight:800;color:var(--muted);}
.pen{position:relative;font-weight:700;font-size:12px;padding:7px 13px 7px 23px;border-radius:999px;border:1.5px solid #dbe4f5;background:#fff;color:var(--ink2);transition:all .14s;}
.pen::before{content:"";position:absolute;left:9px;top:50%;transform:translateY(-50%) rotate(-45deg);width:9px;height:6px;border-radius:2px 2px 0 0;background:var(--pen,#94a3b8);}
.pen.is-active{color:var(--ink);}
.result-head{display:flex;align-items:baseline;gap:9px;margin:19px 0 12px;flex-wrap:wrap;}
.result-head .t{font-family:var(--fd);font-size:17px;}
.result-head .c{font-size:12px;color:var(--muted);}

.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(152px,1fr));gap:17px 13px;}

/* ---------- Nick card (flip) ---------- */
.nick-card{perspective:1100px;}
.nick-card__inner{position:relative;width:100%;height:236px;cursor:pointer;transform-style:preserve-3d;transition:transform .42s cubic-bezier(.2,.75,.25,1);}
.nick-card.is-flipped .nick-card__inner{transform:rotateY(180deg);}
.nick-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:3px 3px 12px 3px;padding:23px 14px 12px;display:flex;flex-direction:column;overflow:hidden;}
.nick-face--front{background:linear-gradient(var(--paper),#fefaf0);border:1px solid var(--paper-bd);box-shadow:0 1.5px 0 rgba(0,0,0,.05),0 7px 16px rgba(37,73,153,.09);}
.nick-face--front::after{content:"";position:absolute;right:0;bottom:0;width:24px;height:24px;background:linear-gradient(135deg,transparent 48%,#e8dfc8 50%,#faf4e4 66%);border-bottom-right-radius:11px;box-shadow:-2px -2px 4px rgba(0,0,0,.05) inset;}
.nick-face--back{transform:rotateY(180deg);background:linear-gradient(#fbfcff,#f1f5ff);border:1px solid #d9e4fb;border-radius:12px 3px 3px 3px;box-shadow:0 1.5px 0 rgba(0,0,0,.05),0 7px 16px rgba(37,73,153,.1);padding:13px 13px 11px;}
.tape{position:absolute;top:-11px;left:50%;transform:translateX(-50%) rotate(-2.5deg);width:92px;height:25px;opacity:.92;box-shadow:0 1px 2px rgba(0,0,0,.09);mix-blend-mode:multiply;border-radius:1px;}
.tp0{background:radial-gradient(rgba(59,130,246,.6) 1.4px,transparent 1.7px) 0 0/8px 8px,rgba(96,165,250,.32);}
.tp1{background:repeating-linear-gradient(45deg,rgba(251,113,133,.55) 0 4px,transparent 4px 8px),rgba(251,113,133,.24);}
.tp2{background:repeating-linear-gradient(rgba(52,211,153,.45) 0 3px,transparent 3px 9px),repeating-linear-gradient(90deg,rgba(52,211,153,.45) 0 3px,transparent 3px 9px),rgba(52,211,153,.2);}
.tp3{background:repeating-linear-gradient(90deg,rgba(251,191,36,.55) 0 5px,transparent 5px 10px),rgba(251,191,36,.24);}
.tp4{background:repeating-linear-gradient(-45deg,rgba(167,139,250,.5) 0 2px,transparent 2px 7px),rgba(167,139,250,.22);}
.tp5{background:repeating-linear-gradient(rgba(249,168,212,.55) 0 1px,transparent 1px 9px),repeating-linear-gradient(90deg,rgba(249,168,212,.55) 0 1px,transparent 1px 9px),rgba(249,168,212,.26);}
.rbadge{position:absolute;top:9px;right:9px;display:flex;align-items:center;gap:3px;font-weight:700;font-size:10px;padding:2px 8px;border-radius:999px;}
.rb0{color:var(--r0);background:rgba(100,116,139,.12);}
.rb1{color:var(--r1);background:rgba(37,99,235,.12);}
.rb2{color:var(--r2);background:rgba(225,29,72,.13);}
.nick-name{font-weight:800;font-size:23px;color:var(--ink);line-height:1.15;word-break:break-all;margin-top:4px;letter-spacing:-.01em;}
.nick-mean{font-size:12px;color:var(--muted);line-height:1.4;margin-top:6px;}
.grow{flex:1;}
.nick-actions{display:flex;gap:7px;}
.nick-actions .btn-sm{flex:1;padding:7px 0;text-align:center;}
.nick-hint{text-align:center;font-size:9.5px;color:#b3b8c9;margin-top:7px;letter-spacing:.02em;}
.back-lb{font-weight:700;font-size:10px;color:#60a5fa;letter-spacing:.06em;margin-bottom:5px;}
.back-nu{font-size:11.5px;color:#4b5673;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.back-vlb{font-weight:700;font-size:10px;color:var(--muted2);margin:9px 0 5px;}
.back-vars{display:flex;flex-wrap:wrap;gap:5px;}
.var-chip{font-weight:600;font-size:12px;color:#334155;background:#fff;border:1px solid #dbe4f5;border-radius:7px;padding:5px 9px;cursor:pointer;}
.var-chip:hover{background:#eef4ff;}
.back-deco{width:100%;font-weight:800;font-size:12px;color:#fff;background:var(--coral);border:none;border-radius:8px;padding:7px 0;cursor:pointer;box-shadow:0 2px 6px rgba(251,113,133,.35);}
.back-deco:hover{background:var(--coral2);}

/* ---------- 뽑기판 board ---------- */
.ppan{background:linear-gradient(155deg,#3b82f6,#2f6fe0);border-radius:18px;padding:15px;box-shadow:0 12px 28px rgba(37,73,153,.26);}
.ppan__hd{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.ppan__hd .t{font-family:var(--fd);font-size:19px;color:#fff;display:flex;align-items:center;gap:6px;}
.ppan__badge{font-size:10px;font-weight:800;color:#dbeafe;background:rgba(255,255,255,.18);padding:3px 9px;border-radius:999px;}
.ppan__msg{font-size:11.5px;color:#eaf2ff;margin:5px 0 11px;font-weight:600;}
.ppan__inner{background:#fbfcff;border-radius:12px;padding:10px;box-shadow:inset 0 2px 6px rgba(0,0,0,.06);}
.ppan__grid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;}
.ppan__ft{display:flex;align-items:center;justify-content:space-between;margin-top:10px;font-size:10.5px;color:#dbeafe;font-weight:600;}
.ppan__note{margin:9px 4px 0;font-size:11px;color:#93a3c7;line-height:1.5;}
.cap{position:relative;aspect-ratio:1/1;cursor:pointer;border-radius:8px;background:linear-gradient(140deg,#fff,#e9f1ff);border:1px solid #d0defb;box-shadow:0 2px 4px rgba(37,73,153,.12),inset 0 -3px 6px rgba(37,73,153,.06);display:flex;align-items:center;justify-content:center;transition:transform .12s;}
.cap:hover{transform:translateY(-2px) rotate(-1.5deg);}
.cap__n{font-family:var(--fd);font-size:clamp(14px,2.3vw,21px);color:#9bb6ec;}
.cap__hint{position:absolute;bottom:3px;font-size:7px;font-weight:800;color:#bcd0f4;letter-spacing:.04em;}
.cap.is-open{cursor:default;flex-direction:column;padding:4px 3px;text-align:center;overflow:hidden;box-shadow:none;animation:peelin .24s ease both;}
.cap.is-open:hover{transform:none;}
.cap.is-open.o0{background:#f3f5fb;border-color:#e2e8f3;}
.cap.is-open.o1{background:#eef4ff;border-color:#c7dbfb;}
.cap.is-open.o2{background:#fff1f4;border-color:var(--coral-bd);}
.cap__r{position:absolute;top:3px;right:4px;font-size:7px;font-weight:800;}
.cap__nick{font-weight:800;font-size:clamp(10px,1.6vw,14px);color:var(--ink);line-height:1.05;word-break:break-all;}
.cap__mean{font-size:8px;color:#8791a8;margin-top:1px;line-height:1.1;}
.cap__copy{margin-top:3px;font-weight:800;font-size:8.5px;color:var(--r2);background:#fff;border:1px solid var(--coral-bd);border-radius:5px;padding:2px 7px;cursor:pointer;}

/* ---------- Dakku ---------- */
.dk-head{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:4px;}
.dk-head h2{font-family:var(--fd);font-size:clamp(22px,3vw,30px);}
.dk-tools{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin-bottom:12px;}
.dk-tools .lb{font-size:11px;font-weight:800;color:var(--muted);}
.dk-sw{width:30px;height:30px;border-radius:8px;cursor:pointer;border:2px solid #e2e8f3;box-shadow:0 1px 3px rgba(0,0,0,.08);}
.dk-sw.is-on{border-color:var(--blue);}
.dboard{position:relative;min-height:250px;border-radius:18px;border:1.5px solid #d3e0fb;padding:20px;box-shadow:inset 0 2px 12px rgba(37,73,153,.07);}
.dboard.bg0{background:repeating-linear-gradient(#dfeaff 0 1px,transparent 1px 24px),repeating-linear-gradient(90deg,#dfeaff 0 1px,transparent 1px 24px),#f4f8ff;}
.dboard.bg1{background:radial-gradient(#cddcff 1.7px,transparent 1.9px) 0 0/22px 22px,#f6f9ff;}
.dboard.bg2{background:repeating-linear-gradient(45deg,#eaf7f0 0 14px,#f1fbf6 14px 28px);}
.dnotes{display:flex;flex-wrap:wrap;gap:15px;}
.dnote{position:relative;width:152px;background:var(--paper);border:1px solid var(--paper-bd);border-radius:2px 10px 2px 2px;box-shadow:0 4px 10px rgba(37,73,153,.13);padding:21px 12px 12px;animation:peelin .22s ease both;}
.dnote__tape{position:absolute;top:-8px;left:50%;transform:translateX(-50%) rotate(-2deg);width:66px;height:17px;opacity:.9;mix-blend-mode:multiply;}
.dnote__x{position:absolute;top:4px;right:5px;width:19px;height:19px;border-radius:50%;border:none;background:rgba(32,48,79,.08);color:var(--muted);font-size:13px;line-height:1;cursor:pointer;}
.dnote__x:hover{background:var(--coral-bd);color:var(--r2);}
.dnote__n{font-weight:800;font-size:16px;color:var(--ink);word-break:break-all;line-height:1.2;}
.dnote__m{font-size:10.5px;color:#8791a8;margin-top:3px;line-height:1.35;}
.dk-empty{text-align:center;padding:44px 20px;color:#94a3c0;}
.dk-empty .em{font-size:34px;}
.dk-empty .t{margin-top:10px;font-weight:800;color:#607196;}
.dk-empty .s{font-size:12.5px;margin-top:5px;}
.dk-soon{position:absolute;bottom:10px;right:15px;font-size:10.5px;color:#9db0d4;font-weight:600;}

/* ---------- Deco ---------- */
.deco{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start;}
.deco__panel{flex:1 1 300px;min-width:280px;background:var(--paper);border:1px solid var(--paper-bd);border-radius:14px;padding:17px;box-shadow:0 4px 12px rgba(37,73,153,.08);}
.deco__panel .lb{font-size:11px;font-weight:800;color:var(--muted);margin-bottom:7px;}
.deco__panel input{width:100%;font-size:15px;font-weight:700;padding:10px 12px;border:1.5px solid #cddbf5;border-radius:9px;outline:none;color:var(--ink);font-family:var(--fb);}
.deco__panel input:focus{border-color:var(--blue);}
.deco__prev{margin-top:6px;min-height:52px;display:flex;align-items:center;justify-content:center;padding:12px;border-radius:10px;background:linear-gradient(#eff6ff,#e7f0ff);border:1px dashed #b9cef2;font-size:20px;font-weight:800;word-break:break-all;text-align:center;}
.deco__frames{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;}
.deco__frames button{font-size:13px;color:#334155;background:#fff;border:1px solid #dbe4f5;border-radius:8px;padding:6px 11px;cursor:pointer;font-family:var(--fb);}
.deco__frames button:hover{background:#eef4ff;}
.deco__acts{display:flex;gap:8px;margin-top:14px;}
.deco__acts .btn{flex:1;padding:10px 0;text-align:center;}
.deco__groups{flex:1.3 1 340px;min-width:300px;}
.dgroup{margin-bottom:13px;}
.dgroup__t{font-size:11.5px;font-weight:800;color:var(--ink2);margin-bottom:6px;}
.dchars{display:flex;flex-wrap:wrap;gap:6px;}
.dchar{font-size:16px;min-width:40px;color:var(--ink);background:#fff;border:1px solid var(--bd);border-radius:9px;padding:8px 10px;cursor:pointer;transition:transform .1s,box-shadow .1s;font-family:var(--fb);}
.dchar:hover{transform:translateY(-2px);box-shadow:0 5px 12px rgba(37,73,153,.13);}

/* ---------- Shelves ---------- */
.shelf{margin-top:26px;}
.shelf__hd{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;}
.shelf__hd h3{font-family:var(--fd);font-size:21px;}
.shelf__badge{font-size:10px;font-weight:800;color:var(--blue2);background:#e5edff;padding:3px 9px;border-radius:999px;}
.shelf__cnt{font-size:11px;color:var(--muted2);}
.shelf__more{margin-left:auto;font-size:12px;font-weight:700;color:var(--blue);}
.shelf__intro{margin:7px 0 13px;font-size:12.5px;color:#6b7590;line-height:1.65;max-width:760px;text-wrap:pretty;}
.chips{display:flex;flex-wrap:wrap;gap:10px;}
.nchip{position:relative;background:#fff;border:1px solid var(--bd);border-radius:11px;padding:11px 13px;flex:1 1 172px;min-width:158px;max-width:236px;transition:box-shadow .14s,transform .14s;}
.nchip:hover{box-shadow:0 7px 16px rgba(37,73,153,.12);transform:translateY(-2px);}
.nchip__top{display:flex;align-items:center;gap:6px;}
.nchip__dot{width:7px;height:7px;border-radius:50%;flex:none;}
.nchip__n{font-weight:800;font-size:15px;color:var(--ink);word-break:break-all;line-height:1.2;}
.nchip__m{font-size:11.5px;color:var(--muted);margin-top:4px;line-height:1.5;}
.nchip__acts{display:flex;gap:6px;margin-top:9px;}
.ledge{height:9px;margin-top:14px;border-radius:2px;background:linear-gradient(#e4b97e,#d9a95f);box-shadow:0 4px 8px rgba(160,110,40,.18);}

/* ---------- Popular + recommend ---------- */
.two-col{display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start;}
.two-col > div{flex:1 1 320px;min-width:300px;}
.sec-h2{font-family:var(--fd);font-size:24px;margin-bottom:12px;}
.pop-list{display:flex;flex-direction:column;gap:8px;}
.pop-row{display:flex;align-items:center;gap:11px;padding:10px 13px;border-radius:11px;background:#fff;border:1px solid var(--bd);}
.pop-row.top{background:#fffdf5;}
.pop-rank{flex:none;width:24px;height:24px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-size:13px;}
.pop-n{font-weight:800;font-size:14px;color:var(--ink);}
.pop-m{font-size:11px;color:var(--muted2);}
.pop-c{margin-left:auto;font-size:11px;color:var(--muted);font-weight:700;white-space:nowrap;}

/* ---------- Knowledge + FAQ ---------- */
.grid-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:13px;}
.kcard{background:#fff;border:1px solid var(--bd);border-radius:13px;padding:15px;}
.kcard .h{font-family:var(--fd);font-size:15px;color:var(--blue);}
.kcard p{margin-top:7px;font-size:12.5px;color:#6b7590;line-height:1.6;}
.grid-rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:11px;}
.rule{background:#fff;border:1px solid var(--bd);border-radius:12px;padding:13px 14px;}
.rule.note{background:#eef4ff;border:1px dashed #b9cef2;}
.rule .h{font-weight:800;color:var(--ink);font-size:13.5px;}
.rule.note .h{color:var(--blue2);}
.rule p{margin-top:5px;font-size:12px;color:#6b7590;line-height:1.55;}
.faq{display:flex;flex-direction:column;gap:9px;}
.faq-item{background:#fff;border:1px solid var(--bd);border-radius:12px;overflow:hidden;}
.faq-q{width:100%;display:flex;align-items:center;gap:10px;text-align:left;padding:14px 16px;background:none;border:none;cursor:pointer;}
.faq-q .q{font-family:var(--fd);font-size:15px;color:var(--coral);flex:none;}
.faq-q .t{font-weight:800;font-size:14px;color:var(--ink);flex:1;}
.faq-q .ar{font-size:15px;color:var(--muted2);transition:transform .2s;flex:none;}
.faq-item.is-open .faq-q .ar{transform:rotate(180deg);}
.faq-a{padding:0 16px 15px 40px;font-size:13px;color:#5b6b8a;line-height:1.7;display:none;}
.faq-item.is-open .faq-a{display:block;animation:fadeup .2s ease both;}

/* ---------- Magazine list ---------- */
.mag-hero h1{font-family:var(--fd);font-size:clamp(28px,4.6vw,44px);}
.mag-hero p{margin-top:9px;font-size:14px;color:#6b7590;max-width:580px;line-height:1.65;text-wrap:pretty;}
.cat-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px;}
.cat-chip{font-weight:800;font-size:12.5px;padding:8px 15px;border-radius:999px;cursor:pointer;border:1.5px solid #dbe4f5;background:#fff;color:var(--ink2);transition:all .14s;font-family:var(--fb);}
.thumb{position:relative;display:flex;align-items:center;justify-content:center;}
.thumb__lb{font-family:ui-monospace,Menlo,monospace;font-size:11px;opacity:.7;letter-spacing:.05em;}
.thumb__cat{position:absolute;top:10px;left:10px;font-weight:800;font-size:10px;color:#fff;padding:3px 9px;border-radius:999px;}
.feat{text-decoration:none;display:flex;flex-wrap:wrap;background:#fff;border:1px solid var(--bd);border-radius:18px;overflow:hidden;box-shadow:0 6px 18px rgba(37,73,153,.09);margin-bottom:30px;transition:box-shadow .15s,transform .15s;}
.feat:hover{box-shadow:0 14px 30px rgba(37,73,153,.15);transform:translateY(-3px);}
.feat__thumb{flex:1 1 360px;min-height:230px;}
.feat__thumb .thumb__lb{font-size:12px;}
.feat__badge{position:absolute;top:14px;right:14px;font-weight:800;font-size:10px;color:var(--ink);background:rgba(255,255,255,.9);padding:4px 10px;border-radius:999px;}
.feat__body{flex:1 1 320px;padding:28px clamp(18px,3vw,32px);display:flex;flex-direction:column;justify-content:center;}
.feat__eyebrow{font-weight:800;font-size:11px;letter-spacing:.1em;}
.feat__body h2{margin:9px 0 0;font-family:var(--fd);font-size:clamp(22px,3vw,31px);line-height:1.25;}
.feat__body p{margin-top:13px;font-size:14px;color:#5b6b8a;line-height:1.7;text-wrap:pretty;}
.feat__meta{margin-top:18px;font-size:12px;color:var(--muted2);}
.list-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:14px;}
.list-head .t{font-family:var(--fd);font-size:17px;}
.list-head .c{font-size:12px;color:var(--muted2);}
.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:20px;}
.post{text-decoration:none;display:flex;flex-direction:column;background:#fff;border:1px solid var(--bd);border-radius:15px;overflow:hidden;transition:box-shadow .15s,transform .15s;}
.post:hover{box-shadow:0 12px 26px rgba(37,73,153,.14);transform:translateY(-3px);}
.post__thumb{aspect-ratio:16/10;}
.post__body{padding:14px 15px 15px;display:flex;flex-direction:column;flex:1;}
.post__body h3{font-weight:800;font-size:16px;color:var(--ink);line-height:1.36;}
.post__body p{margin-top:8px;font-size:12.5px;color:var(--muted);line-height:1.55;flex:1;}
.post__meta{margin-top:13px;font-size:11px;color:var(--muted2);}

/* ---------- Article detail ---------- */
.art{max-width:760px;margin:0 auto;padding-block:24px 8px;padding-inline:var(--gut);}
.art-back{font-size:13px;font-weight:700;color:var(--muted);}
.art-cat{display:inline-block;margin-top:14px;font-weight:800;font-size:11px;color:#fff;padding:4px 11px;border-radius:999px;}
.art h1{margin-top:13px;font-family:var(--fd);font-size:clamp(26px,4.2vw,38px);line-height:1.3;text-wrap:pretty;}
.art-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:15px;}
.art-meta .by{font-size:13px;color:var(--muted);}
.art-cover-wrap{max-width:900px;margin:0 auto;padding-block:14px 0;padding-inline:var(--gut);}
.art-cover{aspect-ratio:16/7;border-radius:16px;border:1px solid var(--bd);}
.art-cover .thumb__lb{font-size:13px;letter-spacing:.06em;}
.art-body{max-width:740px;margin:0 auto;padding-block:8px 20px;padding-inline:var(--gut);}
.art-body p{margin-top:16px;font-size:16px;color:#374357;line-height:1.85;text-wrap:pretty;}
.art-body h2{margin-top:30px;font-weight:800;font-size:20px;color:var(--ink);line-height:1.4;border-left:3px solid var(--coral);padding-left:12px;}
.art-ul{margin-top:14px;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px;}
.art-ul li{position:relative;padding-left:20px;font-size:15.5px;color:#374357;line-height:1.6;}
.art-ul li::before{content:"";position:absolute;left:2px;top:9px;width:7px;height:7px;border-radius:50%;background:var(--coral);}
.art-ol{margin-top:14px;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;}
.art-ol li{display:flex;gap:11px;font-size:15.5px;color:#374357;line-height:1.6;}
.art-ol .num{flex:none;font-family:var(--fd);font-size:15px;color:var(--blue);}
.art-nick{margin-top:16px;background:#fff;border:1px solid var(--bd);border-radius:13px;padding:8px;display:flex;flex-direction:column;}
.art-nick__row{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;}
.art-nick__row:hover{background:#f6f9ff;}
.art-nick__n{font-weight:800;font-size:15px;color:var(--ink);min-width:92px;}
.art-nick__m{font-size:13px;color:var(--muted);flex:1;}
.art-tip{position:relative;margin:22px 0 6px;background:linear-gradient(var(--paper),#fefaf0);border:1px solid var(--paper-bd);border-radius:3px 12px 3px 3px;padding:18px 16px 15px;box-shadow:0 3px 10px rgba(37,73,153,.07);}
.art-tip::before{content:"";position:absolute;top:-9px;left:18px;width:60px;height:17px;background:repeating-linear-gradient(45deg,rgba(251,191,36,.55) 0 5px,transparent 5px 10px),rgba(251,191,36,.24);opacity:.9;mix-blend-mode:multiply;transform:rotate(-2deg);}
.art-tip .h{font-family:var(--fd);font-size:14px;color:#f59e0b;margin-bottom:5px;}
.art-tip .x{font-size:14.5px;color:#5b5340;line-height:1.7;}
.art-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:28px;}
.art-tag{font-size:12px;font-weight:700;color:#5b6b8a;background:#e9eefb;padding:5px 11px;border-radius:999px;}
.art-cta{margin-top:24px;padding:18px;border-radius:14px;background:#fff;border:1px solid var(--bd);display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.art-cta .t{flex:1;min-width:200px;}
.art-cta .t .h{font-family:var(--fd);font-size:16px;color:var(--ink);}
.art-cta .t .s{font-size:12.5px;color:var(--muted);margin-top:3px;}
.related h2{font-family:var(--fd);font-size:22px;margin-bottom:15px;}

/* ---------- Skeleton + empty ---------- */
.skl{border-radius:12px;background:linear-gradient(90deg,#e9effb 25%,#f6f9ff 45%,#e9effb 65%);background-size:200% 100%;animation:shimmer 1.3s ease infinite;height:236px;}
.empty{padding:42px 20px;text-align:center;color:#8b93a8;background:#fff;border:1.5px dashed #cddbf5;border-radius:14px;}
.empty .em{font-size:30px;}
.empty .t{margin-top:8px;font-weight:800;color:var(--ink2);}
.empty .s{font-size:12px;margin-top:4px;}

/* ---------- Toast ---------- */
.toast{position:fixed;left:50%;bottom:28px;z-index:9999;background:var(--navy);color:#fff;font-weight:800;font-size:14px;padding:12px 22px;border-radius:13px;box-shadow:0 10px 26px rgba(0,0,0,.28);transform:translate(-50%,16px) rotate(-1.5deg);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;}
.toast.show{opacity:1;transform:translate(-50%,0) rotate(-1.5deg);}

/* ---------- Animations ---------- */
@keyframes peelin{0%{opacity:0;transform:scale(.9) rotate(1deg);}100%{opacity:1;transform:scale(1) rotate(0);}}
@keyframes fadeup{0%{opacity:0;transform:translateY(12px);}100%{opacity:1;transform:none;}}
@keyframes shimmer{0%{background-position:-150% 0;}100%{background-position:150% 0;}}
.fadeup{animation:fadeup .4s ease both;}

/* ---------- Responsive ---------- */
@media (max-width:600px){
  .ppan__grid{grid-template-columns:repeat(4,1fr);}
  .counter__right{position:static;}
  .sec{padding-block:22px;}
  .hero h1{font-size:26px;}
}
@media (max-width:420px){
  .card-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));}
}
/* ===========================================================
   WordPress integration additions
   =========================================================== */
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;word-wrap:normal!important;}
.skip-link{position:absolute;left:-9999px;top:0;z-index:1000;background:#fff;color:var(--blue2);padding:8px 14px;border-radius:0 0 8px 0;font-weight:800;}
.skip-link:focus{left:0;}

/* --- Article body: rich WP content --- */
.art-body h3{margin-top:24px;font-weight:800;font-size:17px;color:var(--ink);line-height:1.45;}
.art-body h4{margin-top:20px;font-weight:800;font-size:15px;color:var(--ink2);}
.art-body ul,.art-body ol{margin-top:14px;padding-left:22px;color:#374357;font-size:15.5px;line-height:1.75;}
.art-body ul li,.art-body ol li{margin-top:7px;}
.art-body a{color:var(--blue2);text-decoration:underline;text-underline-offset:2px;}
.art-body strong{color:var(--ink);}
.art-body img{border-radius:12px;margin:18px auto;}
.art-body figure{margin:18px 0;}
.art-body figcaption{font-size:12px;color:var(--muted);text-align:center;margin-top:6px;}
.art-body blockquote{margin:20px 0;padding:12px 18px;border-left:3px solid var(--blue);background:#f4f8ff;border-radius:0 10px 10px 0;color:#374357;font-size:15.5px;line-height:1.75;}
.art-body blockquote p{margin-top:0;}
.art-body code{font-family:ui-monospace,Menlo,monospace;font-size:.9em;background:#eef2fb;padding:2px 6px;border-radius:5px;}
.art-body pre{margin:18px 0;padding:15px;background:#1e293b;color:#e2e8f0;border-radius:12px;overflow:auto;font-size:13px;line-height:1.6;}
.art-body pre code{background:none;padding:0;color:inherit;}
.art-body table{width:100%;border-collapse:collapse;margin:18px 0;font-size:14px;}
.art-body th,.art-body td{border:1px solid var(--bd);padding:9px 11px;text-align:left;}
.art-body th{background:#f4f8ff;font-weight:800;}
.art-body hr{border:none;border-top:1px solid var(--bd);margin:26px 0;}

/* WP alignment + captions */
.alignleft{float:left;margin:6px 20px 12px 0;}
.alignright{float:right;margin:6px 0 12px 20px;}
.aligncenter{margin-left:auto;margin-right:auto;}
.alignwide{max-width:1000px;margin-left:auto;margin-right:auto;}
.alignfull{max-width:100%;}
.wp-caption{max-width:100%;}
.wp-caption-text,.wp-element-caption{font-size:12px;color:var(--muted);text-align:center;margin-top:6px;}
.sticky .post{border-color:var(--coral-bd);}

/* Cover image (single) */
.art-cover img{width:100%;height:100%;object-fit:cover;border-radius:16px;}
.post__thumb img{width:100%;height:100%;object-fit:cover;}
.feat__thumb img{width:100%;height:100%;object-fit:cover;min-height:230px;}

/* --- Pagination --- */
.nm-pagination{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:34px;}
.nm-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 12px;border-radius:10px;border:1.5px solid #dbe4f5;background:#fff;color:var(--ink2);font-weight:800;font-size:13px;}
.nm-pagination .page-numbers.current{background:var(--blue);border-color:var(--blue);color:#fff;}
.nm-pagination a.page-numbers:hover{border-color:var(--blue);color:var(--blue2);}
.nm-pagination .dots{border:none;background:none;}

/* single prev/next */
.art-nav{max-width:740px;margin:26px auto 0;padding-inline:var(--gut);display:flex;gap:12px;flex-wrap:wrap;}
.art-nav a{flex:1 1 220px;background:#fff;border:1px solid var(--bd);border-radius:12px;padding:13px 15px;transition:box-shadow .15s,transform .15s;}
.art-nav a:hover{box-shadow:0 8px 18px rgba(37,73,153,.12);transform:translateY(-2px);}
.art-nav .lb{font-size:11px;font-weight:800;color:var(--muted2);}
.art-nav .tt{font-weight:800;font-size:14px;color:var(--ink);margin-top:4px;line-height:1.4;}
.art-nav .next{text-align:right;}

/* --- Comments --- */
.comments{max-width:740px;margin:34px auto 0;padding-inline:var(--gut);}
.comments h2{font-family:var(--fd);font-size:22px;margin-bottom:16px;}
.commentlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;}
.commentlist ul{list-style:none;padding-left:22px;margin-top:14px;}
.comment-body{background:#fff;border:1px solid var(--bd);border-radius:13px;padding:15px;}
.comment-author{font-weight:800;font-size:14px;color:var(--ink);}
.comment-author img{border-radius:50%;vertical-align:middle;margin-right:8px;}
.comment-meta{font-size:11px;color:var(--muted2);margin:4px 0 8px;}
.comment-content{font-size:14px;color:#374357;line-height:1.7;}
.comment-content p{margin-top:10px;}
.comment-respond{margin-top:24px;background:#fff;border:1px solid var(--bd);border-radius:14px;padding:18px;}
.comment-respond .comment-reply-title{font-family:var(--fd);font-size:18px;margin-bottom:12px;}
.comment-form label{display:block;font-size:12px;font-weight:800;color:var(--muted);margin:10px 0 5px;}
.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url],.comment-form textarea{width:100%;padding:10px 12px;border:1.5px solid #cddbf5;border-radius:9px;font-family:var(--fb);font-size:14px;color:var(--ink);outline:none;}
.comment-form input:focus,.comment-form textarea:focus{border-color:var(--blue);}
.comment-form .form-submit{margin-top:14px;}
.comment-form .submit{font-weight:800;font-size:13px;border-radius:9px;padding:10px 20px;border:none;background:var(--blue);color:#fff;cursor:pointer;box-shadow:0 3px 8px rgba(59,130,246,.32);}

/* --- Generic page --- */
.page-wrap{max-width:820px;margin:0 auto;padding-block:26px 34px;padding-inline:var(--gut);}
.page-wrap>h1{font-family:var(--fd);font-size:clamp(26px,4vw,38px);line-height:1.25;margin-bottom:6px;}
.page-lead{font-size:13px;color:var(--muted);margin-bottom:18px;}

/* --- Archive hero --- */
.arch-hero{padding-block:6px 4px;}
.arch-hero h1{font-family:var(--fd);font-size:clamp(26px,4.4vw,40px);}
.arch-hero p{margin-top:8px;font-size:13.5px;color:#6b7590;max-width:600px;line-height:1.6;}

/* --- 404 --- */
.nf{max-width:640px;margin:0 auto;text-align:center;padding-block:60px 70px;padding-inline:var(--gut);}
.nf .code{font-family:var(--fd);font-size:clamp(66px,14vw,120px);color:var(--blue);line-height:1;}
.nf h1{font-family:var(--fd);font-size:24px;margin-top:6px;}
.nf p{font-size:14px;color:var(--ink2);margin-top:12px;line-height:1.7;}
.nf .acts{margin-top:24px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}
.nf .search{margin:22px auto 0;max-width:340px;}
.nf .search input{width:100%;}

/* --- Mobile nav toggle --- */
.nav-toggle{display:none;background:none;border:1.5px solid #cddbf5;border-radius:9px;width:38px;height:38px;align-items:center;justify-content:center;font-size:17px;color:var(--ink2);}
@media (max-width:820px){
  .nav-toggle{display:inline-flex;}
  .site-header__in{flex-wrap:nowrap;}
  .nav{position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:rgba(239,246,255,.98);backdrop-filter:blur(9px);border-bottom:1px solid #dbe6fb;padding:6px 0;box-shadow:0 12px 24px rgba(37,73,153,.12);display:none;}
  .site-header{position:sticky;}
  .site-header.nav-open .nav{display:flex;}
  .nav li{width:100%;}
  .nav a{padding:12px var(--gut);border-top:1px solid #e6ecf7;width:100%;display:block;}
  .nav li:first-child a{border-top:none;}
  .search input{width:clamp(120px,32vw,170px);}
}
@media (max-width:560px){
  .brand__tag{display:none;}
  .search{display:none;}
  .nav .search{display:block;padding:12px var(--gut);}
}

/* Footer non-affiliation notice (legal/E-E-A-T) */
.site-footer__note{padding:14px 0 0;border-top:1px solid rgba(148,163,184,.18);margin-top:8px}
.site-footer__note p{max-width:820px;margin:0;font-size:12.5px;line-height:1.6;color:#94a3b8}
.site-footer__legal{display:flex;flex-wrap:wrap;gap:8px 18px;margin-bottom:10px}
.site-footer__legal a{font-size:13px;color:#cbd5e1;text-decoration:none}
.site-footer__legal a:hover{color:#fff;text-decoration:underline}