@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+KR:wght@400;500;600;700&family=Manrope:wght@500;700;800&display=swap";:root{font-family:Noto Sans KR,Sora,system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body,#root{width:100%;min-height:100%}body{margin:0;min-height:100vh;background:#f5f9ff}a{color:inherit}:root{--txt: #0f172a;--muted: #475569;--line: rgba(15, 23, 42, .16);--glass: rgba(255, 255, 255, .78);--aqua: #0ea5a4;--orange: #f97316}*{box-sizing:border-box}.app{min-height:100vh;color:var(--txt);position:relative;overflow-x:hidden;font-family:IBM Plex Sans KR,sans-serif}.bg-grid{position:fixed;inset:0;z-index:-3;background:linear-gradient(rgba(15,23,42,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(15,23,42,.05) 1px,transparent 1px);background-size:38px 38px;background-color:#f5f9ff}.bg-orb{position:fixed;width:520px;height:520px;border-radius:999px;filter:blur(75px);z-index:-2}.orb-a{left:-120px;top:-140px;background:#67e8f933}.orb-b{right:-120px;top:100px;background:#fdba7440}.shell{width:min(1160px,92vw);margin:18px auto 34px}.glass{background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.topnav{position:sticky;top:10px;z-index:20;border-radius:999px;padding:10px 16px;display:flex;align-items:center;justify-content:space-between}.brand{font-family:Manrope,IBM Plex Sans KR,sans-serif;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:12px;color:#1e293b}.topnav nav{display:flex;gap:10px;flex-wrap:wrap}.topnav a{color:#0f172a;text-decoration:none;font-size:13px;padding:6px 10px;border-radius:999px;border:1px solid transparent;transition:.18s ease}.topnav a:hover{border-color:var(--line);background:#ffffffb3}.nav-plain-btn{color:#0f172a;font-size:13px;padding:6px 10px;border-radius:999px;border:1px solid transparent;background:transparent;cursor:pointer}.nav-plain-btn:hover{border-color:var(--line);background:#ffffffb3}.hero{margin-top:12px;border-radius:30px;padding:clamp(24px,5vw,52px);position:relative;overflow:visible}.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:18px;align-items:center}.hero-copy{min-width:0}.hero-photo-wrap{justify-self:end;width:140px;max-width:100%;border-radius:20px;overflow:hidden;border:2px solid var(--line);background:#fff;box-shadow:0 16px 30px #0f172a24}.hero-photo{width:100%;height:auto;display:block;object-fit:cover}.kicker{margin:0;font-family:Manrope,IBM Plex Sans KR,sans-serif;font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#334155}.hero h1{margin:14px 0 0;font-family:Manrope,IBM Plex Sans KR,sans-serif;font-weight:700;font-size:clamp(32px,5.4vw,54px);line-height:1.15;letter-spacing:-.02em;text-wrap:balance}.lead{margin:18px 0 0;max-width:60ch;color:var(--muted);font-size:clamp(15px,2vw,18px)}.hero-note{margin:12px 0 0;color:#334155;font-size:15px;font-weight:600}.hero-cta{margin-top:22px;display:flex;gap:10px;flex-wrap:wrap}.btn{text-decoration:none;color:#0f172a;padding:11px 16px;border-radius:12px;border:1px solid var(--line);font-size:14px;font-weight:700;background:#ffffffd1;transition:transform .16s ease,filter .16s ease}.btn-main{background:linear-gradient(90deg,#14b8a6,#38bdf8);border:0;color:#fff}.btn:hover{transform:translateY(-2px);filter:brightness(1.03)}.bento{margin-top:12px;display:grid;grid-template-columns:repeat(12,1fr);gap:12px}.card{border-radius:22px;padding:18px}.card h2{margin:0 0 12px;font-family:Manrope,IBM Plex Sans KR,sans-serif;font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:#334155}.large,.stats{grid-column:1 / -1}.stack,.contact{grid-column:span 6}.card-head{display:grid;gap:4px}.card-sub{margin:0;font-size:12px;color:#64748b}.project-list{display:grid;gap:10px}.project{border-top:1px solid rgba(15,23,42,.14);padding-top:10px}.project:first-child{border-top:0;padding-top:0}.project-meta{display:flex;align-items:center;justify-content:space-between;gap:8px}.project h3{margin:0;font-size:17px}.project small{color:#0f172a;font-size:11px;font-weight:800;background:#a7f3d0;padding:4px 8px;border-radius:999px}.project p{margin:6px 0 0;color:var(--muted);font-size:14px;line-height:1.55}.stats ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;gap:10px}.stats li{border:1px solid var(--line);border-radius:14px;padding:10px;height:100%;min-height:84px;display:flex;flex-direction:column;justify-content:center;gap:4px;background:#ffffff9e}.stats strong{font-size:15px}.stats span{font-size:13px;color:var(--muted)}.chips{display:flex;flex-wrap:wrap;gap:8px}.chips span{font-size:13px;font-weight:700;padding:6px 10px;border-radius:999px;border:1px solid var(--line);background:#ffffffd1}.contact p{margin:8px 0;color:var(--muted);font-size:14px}.contact b{color:#0f172a}.contact a{color:#0f172a;text-decoration:underline;text-underline-offset:2px}.contact-row{display:inline-flex;align-items:center;gap:8px}.copy-btn{border:1px solid var(--line);background:#ffffffe6;color:#0f172a;border-radius:8px;padding:3px 8px;font-size:12px;font-weight:700;cursor:pointer}.foot{margin:12px 2px 0;text-align:right;font-size:12px;color:#64748b;letter-spacing:.04em}.reveal{animation:up .7s ease both}@keyframes up{0%{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}@media(max-width:980px){.large,.stats,.stack,.contact{grid-column:1 / -1}.topnav{border-radius:16px;flex-direction:column;align-items:flex-start;gap:8px}.stats ul{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px){.stats ul{grid-template-columns:1fr}}.project-link{display:block;text-decoration:none;color:inherit;border-radius:14px;padding:10px;margin:0 -10px;transition:background .15s ease,transform .15s ease}.project-link:hover{background:#ffffff8c;transform:translateY(-1px)}.project-cta{margin-top:8px;font-size:13px;font-weight:700;color:#0f766e}.detail{margin-top:12px;border-radius:26px;padding:clamp(20px,3vw,30px)}.detail-title{margin:8px 0 0;font-size:clamp(30px,5vw,52px);line-height:1.1;letter-spacing:-.02em}.detail-title-row{margin-top:2px;display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.detail-title-row .detail-title{margin:8px 0 0}.detail-title-cta.right{display:flex;flex-direction:column;align-items:flex-end;gap:6px;margin-top:6px}.btn-cta-large{padding:15px 22px;font-size:16px;font-weight:800;border-radius:14px;border:0;color:#fff;background:linear-gradient(90deg,#2563eb,#06b6d4);white-space:nowrap;box-shadow:0 10px 20px #2563eb38}.btn-cta-large:hover{filter:brightness(1.05);transform:translateY(-2px)}.detail-meta{margin-top:10px;display:flex;gap:8px;flex-wrap:wrap}.detail-meta span{border:1px solid var(--line);background:#ffffffb8;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:700;color:#334155}.detail-summary{margin-top:8px;color:var(--muted);font-size:16px;line-height:1.65}.detail-grid{margin-top:14px;display:grid;grid-template-columns:repeat(12,1fr);gap:12px}.detail-intro{margin-top:14px}.detail-card{grid-column:span 6;border:1px solid var(--line);background:#ffffffa6;border-radius:16px;padding:14px}.detail-card h3{margin:0 0 8px;font-size:16px}.detail-card ul{margin:0;padding-left:18px;color:var(--muted);font-size:14px;line-height:1.6;display:grid;gap:6px}.text-emphasis{color:#0f172a;font-weight:800;background:linear-gradient(90deg,#2dd4bf3d,#7dd3fc33);border-radius:6px;padding:0 4px}.inline-code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;font-size:.94em;color:#0f172a;background:#94a3b833;border:1px solid rgba(148,163,184,.35);border-radius:6px;padding:1px 5px}.detail-stack{grid-column:1 / -1}.detail-actions{margin-top:14px}.detail-admin-hint{margin:0;color:var(--muted);font-size:13px;font-weight:600}@media(max-width:980px){.detail-card{grid-column:1 / -1}}@media(max-width:980px){.detail-title-row{flex-direction:column;align-items:flex-start}.detail-title-cta.right{align-items:flex-start}.btn-cta-large{width:100%;text-align:center}}.detail-media{margin-top:14px;border:1px solid var(--line);background:#ffffffb3;border-radius:16px;padding:14px}.detail-media h3{margin:0;font-size:16px}.detail-media-help{margin:8px 0 0;color:var(--muted);font-size:14px}.media-grid{margin-top:10px;display:grid;grid-template-columns:repeat(12,1fr);gap:10px}.media-card{grid-column:span 6;margin:0;border:1px solid var(--line);border-radius:12px;background:#ffffffd9;overflow:hidden}.media-card img,.media-card video,.media-card iframe{display:block;width:100%;aspect-ratio:16 / 9;object-fit:cover;border:0;background:#e2e8f0}.media-image-btn{display:block;width:100%;border:0;padding:0;background:transparent;cursor:zoom-in}.media-video-wrap{position:relative}.media-zoom-btn{position:absolute;right:8px;top:8px;z-index:2;border:1px solid rgba(203,213,225,.35);background:#0f172abf;color:#f8fafc;border-radius:8px;font-size:12px;font-weight:700;padding:6px 10px;cursor:pointer}.media-card figcaption{padding:8px 10px;font-size:13px;color:#475569}.lightbox{position:fixed;inset:0;z-index:1000;background:#020617cc;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);display:grid;place-items:center;padding:20px}.lightbox-panel{margin:0;width:min(1100px,95vw);max-height:90vh;position:relative;border-radius:16px;overflow:hidden;background:#0f172a;border:1px solid rgba(148,163,184,.4)}.lightbox-panel img{display:block;width:100%;max-height:calc(90vh - 54px);object-fit:contain;background:#020617}.lightbox-panel video{display:block;width:100%;max-height:calc(90vh - 54px);object-fit:contain;background:#020617}.lightbox-panel figcaption{color:#cbd5e1;font-size:13px;padding:10px 14px 12px}.lightbox-close{position:absolute;right:10px;top:10px;border:1px solid rgba(203,213,225,.35);background:#0f172abf;color:#f8fafc;border-radius:8px;font-size:12px;font-weight:700;padding:6px 10px;cursor:pointer}@media(max-width:980px){.media-card{grid-column:1 / -1}}
@media(max-width:980px){.hero-grid{grid-template-columns:1fr!important;align-items:start}.hero-copy{min-width:0}.hero-photo-wrap{justify-self:start;width:min(180px,46vw)}.hero h1{word-break:keep-all}.lead,.hero-note{max-width:100%;word-break:keep-all;overflow-wrap:anywhere}}

.project-side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;max-width:55%}
.project-stack-mini{font-size:10px !important;font-weight:700;background:#e2e8f0 !important;color:#334155 !important;white-space:normal;line-height:1.25;text-align:right}
@media(max-width:640px){.project-side{max-width:62%}.project-stack-mini{text-align:left}}

.project-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}
.project-stack-mini-bottom{font-size:10px;font-weight:700;color:#475569;background:#e2e8f0;border-radius:999px;padding:4px 8px;white-space:nowrap;max-width:60%;overflow:hidden;text-overflow:ellipsis}
@media(max-width:640px){.project-bottom{flex-wrap:wrap}.project-stack-mini-bottom{max-width:100%;white-space:normal}}

/* 기술스택 미니 태그 색상 톤다운 */
.project-stack-mini-bottom{
  background:#e5e7eb !important;
  border:1px solid #cbd5e1 !important;
  color:#334155 !important;
}