:root{--bg: #ffffff;--bg-soft: #f5f6f8;--fg: #16181d;--muted: #5f6673;--border: #e3e6eb;--accent: #3b5bfd;--accent-soft: #eef1ff;--radius: 14px;--shadow: 0 1px 2px rgb(0 0 0 / .04), 0 4px 16px rgb(0 0 0 / .04);--max: 1080px;--font: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Pretendard", "Noto Sans KR", "Malgun Gothic", "Segoe UI", Roboto, sans-serif;color-scheme:light dark}@media(prefers-color-scheme:dark){:root{--bg: #0f1115;--bg-soft: #181b21;--fg: #e9ebef;--muted: #9aa1ad;--border: #2a2e37;--accent: #7d93ff;--accent-soft: #1d2340;--shadow: none}}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-padding-top:80px}body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font);font-size:16px;line-height:1.7;word-break:keep-all;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased;min-height:100dvh;display:flex;flex-direction:column}main{flex:1}img{max-width:100%;height:auto}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3{line-height:1.3;letter-spacing:-.01em}.container{width:100%;max-width:var(--max);margin:0 auto;padding:0 16px}.muted{color:var(--muted)}.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;z-index:100;background:var(--bg);padding:8px}.site-header{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:saturate(180%) blur(12px);-webkit-backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--border);padding-top:env(safe-area-inset-top)}.header-inner{display:flex;align-items:center;gap:16px;min-height:60px;flex-wrap:wrap}.logo{display:flex;align-items:center;gap:8px;font-weight:800;font-size:1.1rem;color:var(--fg)}.logo:hover{text-decoration:none}.nav{display:flex;gap:4px;margin-left:auto}.nav a{padding:8px 12px;border-radius:999px;color:var(--muted);font-weight:600;font-size:.95rem;white-space:nowrap}.nav a:hover{background:var(--bg-soft);text-decoration:none}.nav a[aria-current=page]{color:var(--fg);background:var(--bg-soft)}.lang-switch{font-size:.85rem;font-weight:600;padding:6px 12px;border:1px solid var(--border);border-radius:999px;color:var(--fg);white-space:nowrap}.lang-switch:hover{text-decoration:none;background:var(--bg-soft)}@media(max-width:720px){.header-inner{gap:0 12px;padding-top:8px}.lang-switch{margin-left:auto}.nav{order:3;width:100%;margin:4px -16px 0;padding:0 12px 8px;overflow-x:auto;scrollbar-width:none;width:calc(100% + 32px)}.nav::-webkit-scrollbar{display:none}.nav a{padding:6px 12px}}.lang-suggest{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center;background:var(--accent-soft);padding:10px 16px;font-size:.9rem}.lang-suggest[hidden]{display:none}.lang-suggest a{font-weight:700}.lang-suggest button{background:none;border:0;color:var(--muted);cursor:pointer;font-size:1rem;padding:4px 8px}.site-footer{border-top:1px solid var(--border);margin-top:64px;padding:28px 0 calc(28px + env(safe-area-inset-bottom));font-size:.9rem;color:var(--muted)}.footer-inner nav{display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:8px}.footer-inner a{color:var(--muted)}.footer-inner p{margin:0}.hero{padding:56px 0 32px}.hero h1{font-size:clamp(1.9rem,5vw,3rem);margin:0 0 12px}.hero p{font-size:clamp(1rem,2.4vw,1.2rem);color:var(--muted);margin:0 0 24px;max-width:40em}.btns{display:flex;gap:10px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:46px;padding:0 20px;border-radius:999px;font-weight:700;background:var(--accent);color:#fff;border:1px solid var(--accent)}.btn:hover{text-decoration:none;filter:brightness(1.08)}.btn.ghost{background:transparent;color:var(--fg);border-color:var(--border)}.section{margin-top:40px}.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:16px}.section-head h2{margin:0;font-size:1.35rem}.page-head{padding:40px 0 8px}.page-head h1{margin:0 0 8px;font-size:clamp(1.7rem,4.5vw,2.4rem)}.page-head p{margin:0;color:var(--muted)}.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}.card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;transition:transform .15s,border-color .15s}.card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 40%,var(--border))}.card-body{padding:18px;display:flex;flex-direction:column;gap:6px}.post-card .cover{display:block;width:100%;aspect-ratio:16 / 9;object-fit:cover}.post-card h3{margin:0;font-size:1.1rem}.post-card h3 a{color:var(--fg)}.post-card h3 a:after{content:"";position:absolute;inset:0}.post-card{position:relative}.post-card p{margin:0;color:var(--muted);font-size:.95rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.post-card time{font-size:.85rem;color:var(--muted)}.app-card{display:flex;align-items:center;gap:4px;color:var(--fg);padding-left:16px}.app-card:hover{text-decoration:none}.app-card strong{font-size:1.05rem}.app-card .muted{font-size:.9rem;line-height:1.5}.app-emoji{font-size:2.2rem;width:64px;height:64px;flex:none;display:grid;place-items:center;background:var(--bg-soft);border-radius:16px}.badge{align-self:flex-start;font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent)}.tags{display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0;list-style:none}.tags a{display:inline-block;padding:4px 12px;border-radius:999px;background:var(--bg-soft);color:var(--muted);font-size:.85rem}.ad{margin:32px 0;min-height:100px;text-align:center}.ad-placeholder{display:grid;place-items:center;border:2px dashed var(--border);border-radius:var(--radius);color:var(--muted);font-size:.8rem;letter-spacing:.1em}.article{max-width:720px;margin:0 auto}.article-head{padding:40px 0 8px}.article-head h1{font-size:clamp(1.7rem,5vw,2.4rem);margin:0 0 12px}.article-meta{color:var(--muted);font-size:.9rem;display:flex;flex-wrap:wrap;gap:4px 12px}.article-cover{width:100%;border-radius:var(--radius);margin-top:20px}.prose{font-size:1.06rem;line-height:1.85}.prose h2{font-size:1.45rem;margin:2.2em 0 .6em}.prose h3{font-size:1.2rem;margin:1.8em 0 .5em}.prose p,.prose ul,.prose ol{margin:0 0 1.2em}.prose li{margin:.3em 0}.prose img{border-radius:10px}.prose blockquote{margin:1.5em 0;padding:.6em 1.2em;border-left:4px solid var(--accent);background:var(--bg-soft);border-radius:0 10px 10px 0;color:var(--muted)}.prose code{background:var(--bg-soft);padding:.15em .4em;border-radius:6px;font-size:.9em}.prose pre{padding:16px;border-radius:12px;overflow-x:auto;font-size:.9rem;line-height:1.6}.prose pre code{background:none;padding:0}.prose table{width:100%;border-collapse:collapse;display:block;overflow-x:auto}.prose th,.prose td{border:1px solid var(--border);padding:8px 12px;text-align:left}.prose hr{border:0;border-top:1px solid var(--border);margin:2.5em 0}.breadcrumb{font-size:.85rem;color:var(--muted)}.breadcrumb a{color:var(--muted)}.app-frame-wrap{margin:20px 0 8px;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--bg-soft)}.app-frame{display:block;width:100%;border:0;height:min(78dvh,760px)}@media(max-width:720px){.app-frame-wrap{margin-left:-16px;margin-right:-16px;border-radius:0;border-left:0;border-right:0}.app-frame{height:calc(100dvh - 150px)}}.app-actions{display:flex;justify-content:flex-end}.app-actions a{font-size:.9rem;font-weight:600}
