.portfolio-page{color:#0f172a;background:radial-gradient(circle at 0 0,#2563eb33,#0000 28%),linear-gradient(135deg,#0f172a 0%,#111827 45%,#1e293b 100%);min-height:100vh;padding:32px 0}.a4-page{box-sizing:border-box;break-after:page;page-break-after:always;background:#fff;border-radius:22px;width:210mm;min-height:297mm;margin:0 auto 28px;padding:18mm;box-shadow:0 28px 80px #00000047}.hero-section{border-bottom:1px solid #e2e8f0;grid-template-columns:1.5fr .9fr;gap:28px;padding-bottom:34px;display:grid}.eyebrow{letter-spacing:.22em;color:#2563eb;margin:0 0 14px;font-size:12px;font-weight:800}.hero-section h1{letter-spacing:-.04em;color:#0f172a;margin:0;font-size:34px;line-height:1.28}.hero-desc{color:#475569;margin-top:18px;font-size:14px;line-height:1.8}.hero-card{color:#fff;background:linear-gradient(145deg,#0f172a,#1e3a8a);border-radius:22px;flex-direction:column;justify-content:flex-end;align-self:stretch;padding:24px;display:flex}.hero-card p{color:#93c5fd;margin:0 0 8px;font-size:12px}.hero-card strong{margin-bottom:12px;font-size:24px}.hero-card span{color:#dbeafe;font-size:13px;line-height:1.7}.section{margin-top:34px}.section-title{align-items:center;gap:12px;margin-bottom:16px;display:flex}.section-title span{color:#2563eb;background:#eff6ff;border-radius:13px;justify-content:center;align-items:center;width:38px;height:38px;font-weight:800;display:flex}.section-title h2{letter-spacing:-.02em;margin:0;font-size:23px}.highlight-box{background:#f8fbff;border:1px solid #dbeafe;border-radius:22px;padding:24px}.highlight-box strong{color:#1e3a8a;margin-bottom:12px;font-size:19px;display:block}.highlight-box p{color:#475569;margin:0;font-size:14px;line-height:1.85}.strength-grid{grid-template-columns:repeat(2,1fr);gap:14px;display:grid}.strength-grid div,.tech-grid div{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:18px}.strength-grid strong,.tech-grid strong{color:#1e3a8a;margin-bottom:9px;font-size:15px;display:block}.strength-grid p,.tech-grid p{color:#64748b;margin:0;font-size:13px;line-height:1.65}.project-list{flex-direction:column;gap:24px;display:flex}.project-card{background:#fff;border:1px solid #e2e8f0;border-radius:24px;padding:24px;box-shadow:0 12px 30px #0f172a0f}.project-card.large{padding:28px}.project-head{justify-content:space-between;gap:20px;margin-bottom:18px;display:flex}.project-index{color:#2563eb;letter-spacing:.12em;margin:0 0 6px;font-size:11px;font-weight:800}.project-head h3{letter-spacing:-.02em;margin:0 0 6px;font-size:22px}.project-head span{color:#64748b;font-size:14px}.project-head em{white-space:nowrap;color:#1d4ed8;background:#eff6ff;border-radius:999px;height:fit-content;padding:8px 12px;font-size:12px;font-style:normal;font-weight:700}.project-body{grid-template-columns:repeat(3,1fr);gap:13px;display:grid}.project-body p{color:#475569;background:#f8fafc;border-radius:16px;margin:0;padding:15px;font-size:13px;line-height:1.7}.project-body b{color:#0f172a;margin-bottom:8px;font-size:14px;display:block}.stack-list{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.stack-list span{color:#334155;background:#f1f5f9;border-radius:999px;padding:7px 11px;font-size:12px;font-weight:600}.tech-grid{grid-template-columns:repeat(2,1fr);gap:14px;display:grid}.closing-section{color:#fff;background:#0f172a;border-radius:24px;margin-top:34px;padding:28px}.closing-section h2{margin:0 0 12px;font-size:22px}.closing-section p{color:#cbd5e1;margin:0;font-size:14px;line-height:1.85}@page{size:A4;margin:0}@media print{html,body{-webkit-print-color-adjust:exact;print-color-adjust:exact;background:#fff;margin:0;padding:0}.portfolio-page{background:#fff;padding:0}.a4-page{width:210mm;height:297mm;min-height:297mm;box-shadow:none;page-break-after:always;break-after:page;border-radius:0;margin:0;padding:18mm}.a4-page:last-child{page-break-after:auto;break-after:auto}}:root{--bg:#f3f4f6;--bg-soft:#eaecf0;--surface:#fff;--border:#e3e6ea;--border-strong:#d3d7de;--text:#18181b;--text-muted:#5b5b66;--text-faint:#9a9aa5;--accent:#2563eb;--accent-soft:#eff4ff;--accent-border:#d4e0ff;--font-sans:"Pretendard Variable", Pretendard, system-ui, -apple-system, "Noto Sans KR", sans-serif;--font-mono:var(--font-sans);--font-code:"JetBrains Mono", "Cascadia Code", Consolas, "SF Mono", Menlo, monospace;--maxw:980px;--radius:14px;--ease-out:cubic-bezier(.22, 1, .36, 1)}@media (prefers-color-scheme:dark){:root{--bg:#0e0e11;--bg-soft:#141417;--surface:#151519;--border:#26262b;--border-strong:#303036;--text:#f4f4f5;--text-muted:#a1a1aa;--text-faint:#6b6b74;--accent:#6ea8ff;--accent-soft:#6ea8ff1a;--accent-border:#6ea8ff47}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;font-size:16px}body{background:var(--bg);color:var(--text);font-family:var(--font-sans);letter-spacing:-.01em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.65;overflow-x:hidden}a{color:inherit;text-decoration:none}button{cursor:pointer;background:0 0;border:none;font-family:inherit}ul{list-style:none}img{max-width:100%;display:block}::selection{background:var(--accent-soft);color:var(--accent)}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-strong);border:3px solid var(--bg);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--text-faint)}.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 2rem}.section{padding:5.5rem 0}@media (width<=640px){.section{padding:4rem 0}}.eyebrow{font-family:var(--font-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--accent);font-size:.72rem;font-weight:500}.section-head{align-items:baseline;gap:.9rem;margin-bottom:2.5rem;display:flex}.section-head .idx{font-family:var(--font-mono);color:var(--text-faint);font-size:.8rem}.section-head h2{letter-spacing:-.03em;color:var(--text);font-size:clamp(1.5rem,3.5vw,2rem);font-weight:650}.section-head .rule{background:var(--border);flex:1;align-self:center;height:1px}.muted{color:var(--text-muted)}.btn{border-radius:10px;align-items:center;gap:.5rem;padding:.7rem 1.35rem;font-size:.9rem;font-weight:550;transition:transform .18s,background .18s,border-color .18s,color .18s;display:inline-flex}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{filter:brightness(1.05);transform:translateY(-2px)}.btn-ghost{border:1px solid var(--border-strong);color:var(--text)}.btn-ghost:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}.band{color:#eef1f7;background:radial-gradient(1100px 460px at 72% -12%,#386ee652,#0000 62%),linear-gradient(162deg,#0d1224 0%,#141c38 58%,#0b1126 100%);position:relative}.band:after{content:"";background:#ffffff14;height:1px;position:absolute;bottom:0;left:0;right:0}.band .eyebrow{color:#88abff}.band .muted{color:#eef1f7ad}.band .btn-ghost{color:#eef1f7;border-color:#ffffff42}.band .btn-ghost:hover{color:#fff;border-color:#fff}.band-chip{color:#eef1f7d9;background:#ffffff12;border:1px solid #ffffff29;border-radius:20px;align-items:center;gap:8px;padding:.3rem .8rem;font-size:.78rem;display:inline-flex}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.6rem;transition:border-color .2s,box-shadow .2s,transform .2s;box-shadow:0 1px 2px #1018280a}.card-hover:hover{border-color:var(--border-strong);transform:translateY(-3px);box-shadow:0 12px 30px #0f172a0f}.tag{font-family:var(--font-mono);letter-spacing:.01em;color:var(--text-muted);background:var(--bg-soft);border:1px solid var(--border);border-radius:7px;align-items:center;padding:.28rem .6rem;font-size:.72rem;display:inline-flex}.tag-accent{color:var(--accent);background:var(--accent-soft);border-color:var(--accent-border)}.code-block{color:#d6def0;font-family:var(--font-code);white-space:pre;background:#0d1224;border:1px solid #1e2742;border-radius:10px;margin-top:.7rem;padding:.9rem 1rem;font-size:.74rem;line-height:1.65;overflow-x:auto}.media-slot{border:1.5px dashed var(--border-strong);background:var(--bg-soft);text-align:center;min-height:150px;color:var(--text-faint);border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:.4rem;padding:1rem;display:flex}.reveal{opacity:0}.reveal.visible{opacity:1;animation:reveal-up .75s var(--ease-out) var(--d,0s) backwards}@keyframes reveal-up{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}.rise{animation:reveal-up .8s var(--ease-out) var(--d,0s) backwards}.band{isolation:isolate;overflow:hidden}.band:before{content:"";z-index:-1;filter:blur(10px);pointer-events:none;background:radial-gradient(circle,#6ea8ff38,#0000 65%);border-radius:50%;width:520px;height:520px;animation:16s ease-in-out infinite alternate drift;position:absolute;top:-200px;right:-120px}.band-grid{z-index:-1;pointer-events:none;background-image:linear-gradient(#ffffff09 1px,#0000 1px),linear-gradient(90deg,#ffffff09 1px,#0000 1px);background-size:44px 44px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(70% 60% at 70% 30%,#000 20%,#0000 75%);mask-image:radial-gradient(70% 60% at 70% 30%,#000 20%,#0000 75%)}@keyframes drift{0%{transform:translate(0)scale(1)}to{transform:translate(-140px,80px)scale(1.15)}}.pulse-dot{position:relative}.pulse-dot:after{content:"";background:inherit;border-radius:50%;animation:2.2s ease-out infinite pulse;position:absolute;inset:0}@keyframes pulse{0%{opacity:.7;transform:scale(1)}to{opacity:0;transform:scale(2.8)}}.shine{background:linear-gradient(100deg,#88abff 20%,#c9d8ff 45%,#88abff 70%) 0 0/220% 100%;color:#0000;-webkit-background-clip:text;background-clip:text;animation:6s ease-in-out infinite shine}@keyframes shine{0%,to{background-position:100% 0}50%{background-position:0 0}}.stats{background:#ffffff1f;border:1px solid #ffffff1f;border-radius:14px;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;max-width:620px;margin-top:3rem;display:grid;overflow:hidden}.stats>div{background:#0d1224b8;padding:1rem 1.1rem}.stats b{letter-spacing:-.02em;color:#fff;font-size:1.35rem;font-weight:700;display:block}.stats span{color:#eef1f799;font-size:.76rem}@media (width<=520px){.stats b{font-size:1.05rem}.stats>div{padding:.8rem}}.badge{color:var(--text-muted);background:var(--bg-soft);border:1px solid var(--border);white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:.18rem .55rem;font-size:.7rem;font-weight:600;display:inline-flex}.badge-live{color:#047857;background:#10b9811a;border-color:#10b9814d}.badge-live:before{content:"";background:#10b981;border-radius:50%;width:6px;height:6px;animation:2s ease-out infinite live;box-shadow:0 0 #10b98180}@keyframes live{to{box-shadow:0 0 0 6px #10b98100}}@media (prefers-color-scheme:dark){.badge-live{color:#6ee7b7}}.glance{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:.9rem;display:grid}.glance-card{background:var(--surface);border:1px solid var(--border);transition:transform .25s var(--ease-out), border-color .2s ease, box-shadow .25s ease;border-radius:12px;flex-direction:column;gap:.35rem;padding:1.1rem 1.1rem 1rem;display:flex;position:relative}.glance-card:hover{border-color:var(--accent-border);transform:translateY(-4px);box-shadow:0 14px 30px #0f172a14}.glance-card.is-featured{border-color:var(--accent-border);background:linear-gradient(180deg, var(--accent-soft), var(--surface) 70%)}.glance-top{justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.3rem;display:flex}.glance-num{font-family:var(--font-mono);color:var(--text-faint);font-size:.72rem}.glance-title{letter-spacing:-.02em;font-size:.95rem;font-weight:650;line-height:1.4}.glance-meta{color:var(--text-faint);font-size:.72rem}.glance-hl{color:var(--accent);margin-top:auto;padding-top:.6rem;font-size:.78rem;font-weight:600}.glance-hl:before{content:"→ "}.project-card{position:relative;overflow:hidden}.project-card.is-featured{border-color:var(--accent-border)}.project-card.is-featured:before{content:"";background:linear-gradient(90deg, var(--accent), #34d399, var(--accent));background-size:200% 100%;height:3px;animation:5s linear infinite bar-flow;position:absolute;inset:0 0 auto}@keyframes bar-flow{to{background-position:-200% 0}}.hl-list{flex-wrap:wrap;gap:.5rem;display:flex}.hl-list li{background:var(--bg-soft);border:1px solid var(--border);border-radius:9px;align-items:center;gap:.45rem;padding:.4rem .75rem;font-size:.8rem;font-weight:550;display:inline-flex}.hl-check{color:#fff;background:var(--accent);border-radius:50%;flex-shrink:0;place-items:center;width:16px;height:16px;font-size:.6rem;display:inline-grid}.ai-note{background:var(--accent-soft);border:1px solid var(--accent-border);border-radius:10px;align-items:center;gap:.6rem;margin-top:.9rem;padding:.7rem .9rem;display:flex}.ai-note-k{font-family:var(--font-mono);color:var(--accent);letter-spacing:.06em;flex-shrink:0;font-size:.66rem;font-weight:600}.meter{background:var(--border);border-radius:4px;height:4px;margin-top:.45rem;overflow:hidden}.meter span{height:100%;width:var(--w);border-radius:inherit;background:var(--accent);transform-origin:0;transition:transform 1.1s var(--ease-out) .35s;display:block;transform:scaleX(0)}.visible .meter span{transform:scaleX(1)}.shot{border:1px solid var(--border);background:#fff;border-radius:12px;overflow:hidden}.shot img{transition:transform .5s var(--ease-out)}.shot:hover img{transform:scale(1.02)}.link-arrow{font-family:var(--font-mono);color:var(--accent);font-size:.75rem}.link-arrow span{transition:transform .2s;display:inline-block}.link-arrow:hover span{transform:translate(2px,-2px)}.arch{background:var(--bg-soft);border:1px solid var(--border);border-radius:12px;grid-template-columns:1fr 44px 1fr 44px 1fr;align-items:center;gap:.4rem;padding:1.2rem;display:grid}.arch-col{flex-direction:column;gap:.45rem;display:flex}.arch-cap{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);text-align:center;font-size:.6rem}.arch-node{text-align:center;background:var(--surface);border:1px solid var(--border);border-radius:9px;padding:.55rem .6rem;font-size:.8rem;font-weight:550}.arch-mcp{font-family:var(--font-mono);color:var(--accent);border-color:var(--accent-border);background:var(--accent-soft)}.arch-ai{color:#fff;background:var(--accent);border-color:var(--accent);padding:.8rem .6rem}.arch-flow{background:var(--border-strong);border-radius:2px;height:2px;position:relative;overflow:hidden}.arch-flow span{background:linear-gradient(90deg, transparent, var(--accent), transparent);width:40%;animation:1.8s linear infinite flow;position:absolute;inset:0}@keyframes flow{0%{transform:translate(-100%)}to{transform:translate(260%)}}@keyframes flow-y{0%{transform:translateY(-100%)}to{transform:translateY(260%)}}.arch-infra{border-top:1px dashed var(--border-strong);font-family:var(--font-mono);color:var(--text-muted);flex-wrap:wrap;grid-column:1/-1;justify-content:center;gap:.4rem 1.2rem;margin-top:.7rem;padding-top:.8rem;font-size:.68rem;display:flex}@media (width<=640px){.arch{grid-template-columns:1fr}.arch-flow{justify-self:center;width:2px;height:26px}.arch-flow span{background:linear-gradient(180deg, transparent, var(--accent), transparent);width:100%;height:40%;animation-name:flow-y}}.trouble{border:1px solid var(--border);background:var(--bg-soft);border-radius:12px;padding:.95rem 1.1rem;transition:border-color .2s}.trouble:hover,.trouble.is-open{border-color:var(--border-strong)}.trouble-head{text-align:left;width:100%;color:inherit;align-items:flex-start;gap:.7rem;display:flex}.trouble-num{background:var(--accent);color:#fff;width:22px;height:22px;font-family:var(--font-mono);border-radius:7px;flex-shrink:0;justify-content:center;align-items:center;margin-top:1px;font-size:.72rem;font-weight:700;display:flex}.trouble-titles{flex-direction:column;flex:1;gap:.3rem;min-width:0;display:flex}.trouble-title{font-size:.92rem;font-weight:600}.trouble-result{color:var(--text-muted);font-size:.8rem;line-height:1.5}.trouble-result-k{font-family:var(--font-mono);color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent-border);border-radius:5px;margin-right:.45rem;padding:.05rem .35rem;font-size:.62rem;font-weight:700}.trouble-chev{color:var(--text-faint);transition:transform .3s var(--ease-out);font-size:1.1rem;line-height:1}.trouble.is-open .trouble-chev{transform:rotate(180deg)}.collapse{transition:grid-template-rows .4s var(--ease-out);grid-template-rows:0fr;grid-template-columns:minmax(0,1fr);display:grid}.collapse-inner{min-width:0;min-height:0;padding-left:calc(22px + .7rem);overflow:hidden}.trouble.is-open .collapse{grid-template-rows:1fr}@media (width<=560px){.collapse-inner{padding-left:0}}.action-list{flex-direction:column;gap:.3rem;display:flex}.action-list li{color:var(--text-muted);padding-left:.9rem;font-size:.85rem;line-height:1.6;position:relative}.action-list li:before{content:"";background:var(--accent);opacity:.7;border-radius:50%;width:5px;height:5px;position:absolute;top:.62em;left:0}@media (width<=560px){.section-head .rule{display:none}.section-head .link-arrow{margin-left:auto}}.work-list{flex-direction:column;gap:.7rem;display:flex}.work-row{background:var(--surface);border:1px solid var(--border);transition:transform .25s var(--ease-out), border-color .2s ease, box-shadow .25s ease;border-radius:12px;grid-template-columns:36px 1fr auto;align-items:center;gap:1rem;padding:1.1rem 1.2rem;display:grid}.work-row:hover{border-color:var(--accent-border);transform:translate(4px);box-shadow:0 10px 26px #0f172a0f}.work-row.is-featured{border-color:var(--accent-border);background:linear-gradient(90deg, var(--accent-soft), var(--surface) 60%)}.work-row .arrow{color:var(--text-faint);transition:transform .2s,color .2s}.work-row:hover .arrow{color:var(--accent);transform:translate(4px)}@media (width<=560px){.work-row{grid-template-columns:1fr auto}.work-row .glance-num{display:none}}.scroll-progress{z-index:200;background:linear-gradient(90deg, var(--accent), #34d399);transform-origin:0;pointer-events:none;height:2px;position:fixed;top:0;left:0;right:0}.nav-link{position:relative}.nav-link:after{content:"";height:2px;transition:transform .3s var(--ease-out);background:currentColor;border-radius:2px;position:absolute;bottom:-2px;left:0;right:0;transform:scaleX(0)}.nav-link:hover:after{opacity:.5;transform:scaleX(1)}.nav-link.active:after{opacity:1;background:var(--nav-accent,var(--accent));transform:scaleX(1)}.mobile-menu{animation:menu-in .3s var(--ease-out)}.mobile-menu a{animation:reveal-up .5s var(--ease-out) var(--d,0s) backwards}@keyframes menu-in{0%{opacity:0}to{opacity:1}}@media print{.site-header,.no-print{display:none!important}.reveal{opacity:1!important;transform:none!important}.trouble .collapse{grid-template-rows:1fr!important}.trouble-chev,.scroll-progress{display:none!important}.meter span{transform:scaleX(1)!important}.rise,.reveal.visible{animation:none!important}.band:before,.band-grid{display:none!important}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;transition-delay:0s!important;animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important}.reveal{opacity:1}}