/* 공통 스타일 — 모든 페이지에서 사용 */
:root { --bg:#0b0d17; --bg2:#151a2e; --card:rgba(255,255,255,.07); --line:rgba(255,255,255,.14); --ink:#f3f5ff; --muted:#aab1cc; --accent:#ffd45e; --accent2:#9db0ff; }
* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html,body { margin:0; }
body { background:radial-gradient(1200px 600px at 20% -10%,#26305a 0,transparent 60%),var(--bg); color:var(--ink); min-height:100vh;
  font-family:'Pretendard',-apple-system,BlinkMacSystemFont,'Noto Sans KR','Malgun Gothic','Apple SD Gothic Neo',system-ui,sans-serif; line-height:1.7; word-break:keep-all; overflow-wrap:break-word; }
a { color:var(--accent2); }
.wrap { max-width:960px; margin:0 auto; padding:0 18px; }
header.site { border-bottom:1px solid var(--line); background:rgba(11,13,23,.7); backdrop-filter:blur(8px); position:sticky; top:0; z-index:10; }
header.site .wrap { display:flex; align-items:center; justify-content:space-between; height:56px; }
header.site .logo { font-weight:800; font-size:1.15rem; color:var(--ink); text-decoration:none; }
header.site nav a { color:var(--muted); text-decoration:none; margin-left:16px; font-size:.92rem; }
header.site nav a:hover { color:var(--ink); }
.hero { padding:44px 0 18px; }
.hero h1 { font-size:2.1rem; margin:0 0 8px; letter-spacing:-.02em; }
.hero p { color:var(--muted); max-width:640px; margin:0; }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:16px; margin:26px 0; }
.gcard { display:block; text-decoration:none; color:inherit; background:var(--card); border:1px solid var(--line); border-radius:18px; overflow:hidden; transition:transform .15s,border-color .2s; }
.gcard:hover { transform:translateY(-3px); border-color:var(--accent); }
.gcard .thumb { height:130px; display:flex; align-items:center; justify-content:center; font-size:3.2rem; }
.gcard .body { padding:14px 16px 18px; }
.gcard h3 { margin:0 0 4px; font-size:1.1rem; }
.gcard p { margin:0; color:var(--muted); font-size:.9rem; }
.tag { display:inline-block; font-size:.74rem; padding:1px 9px; border-radius:99px; background:rgba(255,212,94,.18); color:var(--accent); margin-right:4px; margin-bottom:6px; }
.gcard.soon { opacity:.55; pointer-events:none; }
section.text { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:22px 22px; margin:22px 0; }
section.text h2 { margin-top:0; font-size:1.25rem; }
section.text h3 { font-size:1.05rem; margin-bottom:.2em; }
footer.site { border-top:1px solid var(--line); margin-top:50px; padding:26px 0 40px; color:var(--muted); font-size:.88rem; text-align:center; }
footer.site a { color:var(--muted); margin:0 8px; }
.ad-slot { min-height:100px; margin:26px 0; }
article.doc { padding:30px 0; max-width:760px; }
article.doc h1 { font-size:1.8rem; }
article.doc h2 { font-size:1.2rem; margin-top:1.8em; }
.note { background:rgba(255,212,94,.12); border:1px solid rgba(255,212,94,.3); border-radius:12px; padding:10px 14px; font-size:.9rem; }
[hidden] { display:none !important; }
@media (max-width:560px){ .hero h1{font-size:1.7rem} header.site nav a{margin-left:10px;font-size:.85rem} }