/* Portfolio showcase: lightweight transform/opacity motion, no runtime dependency. */
:root{--ease:cubic-bezier(.2,.75,.25,1);--shadow:0 18px 50px #2634220a}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}
.header{height:76px;margin-top:20px;border:1px solid var(--line);border-radius:22px;padding:0 24px;background:var(--surface)}.brand-sign{background:var(--ink);color:var(--bg);border:0;letter-spacing:-1px}.nav a{padding-block:12px}.header-right,.nav{gap:27px}.theme-button{transition:background-color .2s,transform .25s var(--ease)}.theme-button:active{transform:scale(.92)}
.studio-hero{padding:88px 0 78px;display:grid;grid-template-columns:1.22fr 1fr;align-items:center;gap:80px}.studio-hero h1{font-size:clamp(42px,4.5vw,62px);letter-spacing:-3.5px;line-height:1.28;font-weight:650;margin-top:26px}.studio-hero h1 em{font-style:normal;color:var(--accent)}.hero-message .eyebrow{letter-spacing:1.35px;font-size:10px}.hero-copy{margin-top:25px;font-size:15px;line-height:1.95}.hero-footnote{margin-top:38px;display:flex;align-items:center;gap:13px;font:10px Consolas,monospace;letter-spacing:1.2px;color:var(--muted)}.hero-footnote i{width:3px;height:3px;border-radius:50%;background:var(--muted);opacity:.6}
.button{border-radius:100px;padding:13px 22px;min-height:46px;transition:transform .25s var(--ease),opacity .25s}.button:active{transform:scale(.98)}.button:hover{opacity:.92}
.project-desk{position:relative;padding:19px;background:var(--soft);border:1px solid var(--line);border-radius:26px}.desk-label{display:flex;justify-content:space-between;color:var(--muted);font:9px Consolas,monospace;letter-spacing:1.5px;margin:2px 3px 17px}.desk-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.desk-tile{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;min-height:158px;padding:17px;border-radius:16px;overflow:hidden;transition:transform .35s var(--ease)}.desk-tile>svg:last-child{position:absolute;right:15px;bottom:20px;width:13px;height:13px;opacity:.65;transition:transform .35s var(--ease)}.desk-tile>span:not(.tile-symbol){display:flex;flex-direction:column;gap:1px}.desk-tile strong{font-size:13px;font-weight:600;letter-spacing:-.2px}.desk-tile small{font-size:9px;opacity:.75;letter-spacing:.2px}.desk-tile img{width:70px;height:70px;align-self:center;transform:rotate(-9deg);margin:0 0 5px;transition:transform .45s var(--ease);border-radius:16px}
.desk-app{background:#e4ecfa;color:#253b61;border:1px solid #d2deef}.desk-quick{background:#27352a;color:#e6edcf;border:1px solid #27352a}.desk-quick .qmark{width:54px;height:54px;align-self:center;margin:9px 0 11px}.desk-jae{background:#e2e9da;color:#3b5032;border:1px solid #d4dec9}.desk-mine{background:#e1edf1;color:#28607c;border:1px solid #cfdee4}.tile-symbol{font:700 67px/.9 Georgia,serif;align-self:center;letter-spacing:-7px;margin:6px 0 12px;padding-right:8px}.tile-symbol>span{color:#8caa71}.mine-symbol{font:700 45px/1 Arial,sans-serif;letter-spacing:-4px;margin:16px 0 17px;padding:0}.mine-symbol>span{color:#68a2bf}.desk-caption{font:8px Consolas,monospace;letter-spacing:1.2px;color:var(--muted);margin:16px 3px 0}
.project-heading{padding-top:24px;margin-bottom:28px;align-items:center}.project-heading h2{font-size:28px;letter-spacing:-1.5px;margin-top:10px;line-height:1.45}.section-side{font-size:12px;line-height:1.75;color:var(--muted);text-align:right;flex-shrink:0}.project-grid,.server-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.project-card{border-radius:22px;transition:transform .35s var(--ease),border-color .35s,box-shadow .35s}.card-art{height:290px}.card-body{padding:26px}.card-body>p{font-size:14px;min-height:50px}.card-title-row h3{font-size:25px}.status{font-size:10px;border-radius:100px;padding:5px 10px}.status:not(.soon):not(.operating){background:var(--blue-soft);color:var(--blue)}.status:not(.soon):not(.operating) .tiny-dot{background:var(--blue)}.status.operating{background:var(--pill);color:var(--accent)}.status.operating .tiny-dot{background:var(--accent)}
.servers-section{padding-top:74px}.server-grid{align-items:stretch}.server-card{min-width:0;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:var(--surface);transition:border-color .3s,box-shadow .3s}.server-art-link{display:block}.server-art{position:relative;overflow:hidden;height:270px;isolation:isolate}.jaeyoung-art{background:#e5eadc;color:#506340}.minesoft-art{background:#dae8ef;color:#3b657c}.server-art::before{position:absolute;inset:0;content:'';background-image:radial-gradient(currentColor .7px,transparent .7px);background-size:20px 20px;opacity:.14;pointer-events:none}.server-art .art-caption,.server-art .art-number{color:inherit;z-index:1;opacity:.85}.world-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:transform .6s var(--ease)}.world-caption{position:absolute;left:22px;bottom:18px;font:9px Consolas,monospace;letter-spacing:1.6px;opacity:.85}.server-body{padding:26px}.server-category{font-size:11px;color:var(--accent);margin-top:9px;font-weight:500;letter-spacing:.2px}.server-summary{font-size:14px;color:var(--muted);line-height:1.85;margin-top:14px;min-height:52px}
.address-copy{margin-top:22px}.address-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--bg)}.address-label{display:block;font:8px Consolas,monospace;letter-spacing:1.25px;color:var(--muted);margin-bottom:3px}.address-bar code{font:15px Consolas,"SFMono-Regular",monospace;color:var(--ink);user-select:all;overflow-wrap:anywhere}.copy-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex-shrink:0;border-radius:8px;background:var(--surface);min-height:40px;padding:7px 11px;transition:background-color .2s,transform .2s}.copy-button svg{width:15px;height:15px}.copy-button:hover{background:var(--soft)}.copy-button:active{transform:scale(.96)}.copy-button[data-copied]{color:var(--accent)}.address-copy .copy-feedback{font-size:10px!important;line-height:1.6;min-height:21px;padding-top:5px;color:var(--accent);overflow-wrap:anywhere}.server-links{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-top:13px;padding-top:18px;border-top:1px solid var(--line)}.server-links .text-link{font-size:12px}.section-note{font-size:11px;color:var(--muted);margin-top:18px}
.about{padding:88px 0;gap:40px}.about h2{font-size:34px;line-height:1.45}.about .eyebrow{margin-top:10px}.about p{font-size:15px}.contact-band{border-radius:20px;padding:34px;background:var(--soft);border:1px solid var(--line);margin-bottom:20px}.contact-band h2{font-size:22px;margin-top:12px}.contact-band>a{font-size:16px}.contact-band .eyebrow{font-size:9px}.footer{padding-top:24px}
.server-detail-hero{grid-template-columns:1fr 1fr;gap:60px;padding-top:45px}.server-detail-hero .server-art{height:375px;border-radius:24px}.server-detail-hero h1{font-size:48px}.server-detail-hero .lead{font-size:25px}.server-detail-hero .detail-links{align-items:center;gap:15px}.server-detail-hero .server-category{margin:0}.server-detail-hero .address-copy{max-width:410px}.server-detail-hero .description{max-width:430px}.server-detail-hero .text-link{font-size:12px}.join-guide{display:grid;grid-template-columns:1fr 1fr;gap:65px;padding:65px 0}.join-guide h2{font-size:28px;letter-spacing:-1.3px;margin-top:18px}.join-guide>div>p:last-child{color:var(--muted);font-size:14px;max-width:310px;margin-top:13px}.join-guide ol{list-style:none;padding:0;margin:0}.join-guide li{display:flex;gap:20px;padding:21px 0;border-bottom:1px solid var(--line)}.join-guide li:first-child{padding-top:0}.join-guide li>span{font:11px Consolas,monospace;color:var(--accent);padding-top:5px}.join-guide strong{font-size:16px;font-weight:600}.join-guide li p{font-size:13px;color:var(--muted);margin-top:5px}.join-guide code{font:12px Consolas,monospace;color:var(--ink)}.source-note{border-top:1px solid var(--line);padding:22px 0 50px;font-size:11px;color:var(--muted);line-height:1.9}.source-note p+p{margin-top:7px}.inline-source{display:inline-flex;align-items:center;gap:3px;text-decoration:underline;text-underline-offset:3px}.inline-source svg{width:11px;height:11px}.email-box .copy-feedback{flex-basis:100%;min-height:22px}
[data-theme=dark] .desk-app{background:#2b3a52;color:#dce8ff;border-color:#354b6a}[data-theme=dark] .desk-quick{background:#30422f;border-color:#42543b;color:#e0ecc8}[data-theme=dark] .desk-jae{background:#35442d;border-color:#465a39;color:#e0ebd3}[data-theme=dark] .desk-mine{background:#273e48;border-color:#355563;color:#cfebf4}[data-theme=dark] .jaeyoung-art{background:#273829;color:#b1c69d}[data-theme=dark] .minesoft-art{background:#223a48;color:#b2d3e2}[data-theme=dark] .hakgi-art{background:#25374f;color:#e0eafd}[data-theme=dark] .hakgi-art .art-caption,[data-theme=dark] .hakgi-art .art-number,[data-theme=dark] .hakgi-art .preview-label{color:#b0c1d8}
@media(hover:hover) and (pointer:fine){.desk-tile:hover{transform:translateY(-4px)}.desk-tile:hover>svg:last-child{transform:translate(2px,-2px)}.desk-tile:hover img{transform:rotate(-3deg)}.project-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.server-card:hover{border-color:var(--muted)}.server-art-link:hover .world-art{transform:translateY(-4px) scale(1.025)}}
/* Default content stays visible even without JS or IntersectionObserver. */
@keyframes soft-enter{from{opacity:.12;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:no-preference){.is-revealing{animation:soft-enter .65s var(--ease) both}.project-grid>:nth-child(2).is-revealing,.server-grid>:nth-child(2).is-revealing{animation-delay:70ms}}
@media(max-width:1050px){.studio-hero{gap:38px}.studio-hero h1{font-size:49px;letter-spacing:-2.6px}.desk-tile{min-height:148px;padding:15px}.header-right,.nav{gap:20px}.server-summary{min-height:78px}.project-heading h2{font-size:25px}.server-detail-hero{gap:35px}}
@media(max-width:800px){.studio-hero{grid-template-columns:1fr;gap:40px;padding:55px 0 55px}.studio-hero h1{font-size:48px}.project-desk{max-width:550px;width:100%}.hero-footnote{margin-top:27px}.desk-tile{min-height:165px}.project-heading h2{font-size:25px}.section-side{display:none}.project-grid,.server-grid{grid-template-columns:1fr}.card-art{height:300px}.server-art{height:290px}.server-summary{min-height:0}.servers-section{padding-top:50px}.about{padding:60px 0;grid-template-columns:1fr;gap:20px}.about h2{font-size:29px}.about p{font-size:14px}.contact-band{flex-direction:column;align-items:flex-start;gap:23px;padding:27px}.server-detail-hero{grid-template-columns:1fr;gap:25px}.server-detail-hero .server-art{height:300px}.join-guide{grid-template-columns:1fr;gap:30px;padding:45px 0}.server-detail-hero .address-copy{max-width:none}.server-detail-hero h1{font-size:44px}}
@media(max-width:600px){.wrap{width:calc(100% - 36px)}.header{height:66px;padding:0 15px;margin-top:14px;border-radius:18px}.header-right,.nav{gap:17px}.nav .contact-nav,.nav .about-nav{display:none}.brand{font-size:18px;gap:7px}.brand-sign{width:24px;height:24px}.theme-button{width:34px;height:34px}.studio-hero{padding-top:44px}.hero-message .eyebrow{font-size:8px;letter-spacing:1.1px}.studio-hero h1{font-size:42px;letter-spacing:-2.5px;margin-top:22px}.hero-copy{font-size:13px;line-height:1.9;margin-top:19px}.hero-copy br{display:none}.hero-links{gap:18px;margin-top:26px}.hero-links .button{padding:12px 17px;font-size:12px;gap:9px}.hero-links .text-link{font-size:12px;gap:6px}.hero-footnote{font-size:9px}.project-desk{padding:14px;border-radius:21px}.desk-tile{min-height:150px;padding:16px}.desk-tile strong{font-size:12px}.desk-tile small{font-size:8px}.desk-label{font-size:8px}.desk-caption{font-size:7px;letter-spacing:.9px}.project-heading h2{font-size:23px;letter-spacing:-1.2px;max-width:290px}.section-label{font-size:9px;letter-spacing:1.3px}.project-grid,.server-grid{gap:24px}.card-art{height:270px}.card-body,.server-body{padding:22px}.card-body>p,.server-summary{font-size:13px}.card-title-row h3{font-size:24px}.server-art{height:245px}.server-art .art-caption{font-size:9px}.world-caption{font-size:8px;left:20px;bottom:16px}.server-category{font-size:10px}.address-bar{padding:11px 12px}.address-bar code{font-size:14px}.address-bar .copy-button{font-size:11px;padding:7px 10px}.server-links .text-link{font-size:11px}.server-links{gap:12px}.contact-band h2{font-size:20px;line-height:1.5}.contact-band>a{font-size:15px}.server-detail-hero .lead{font-size:23px}.server-detail-hero .server-art{height:260px}.server-detail-hero h1{font-size:40px}.source-note{font-size:10px}.footer-links{flex-wrap:wrap;gap:12px}.detail-hero .description br{display:none}}
@media(max-width:360px){.wrap{width:calc(100% - 28px)}.header{padding-inline:12px}.brand{font-size:17px}.brand-sign{display:none}.header-right,.nav{gap:13px}.studio-hero h1{font-size:36px;letter-spacing:-2px}.hero-links{gap:13px}.hero-links .button{font-size:11px;padding-inline:14px}.hero-links .text-link{font-size:11px}.desk-tile{padding:12px;min-height:145px}.desk-tile>svg:last-child{right:11px;bottom:16px;width:11px}.desk-tile strong{font-size:11px}.card-title-row h3{font-size:22px}.status{font-size:9px;padding:4px 8px}.server-body,.card-body{padding:19px}.server-art{height:225px}.address-bar{gap:8px}.address-bar code{font-size:13px}.server-links{gap:10px}.server-links .text-link{gap:6px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.desk-tile:hover,.project-card:hover,.server-art-link:hover .world-art,.button:hover{transform:none}}
