
:root{--bg:#081820;--bg2:#0b232b;--panel:#112a33;--line:#294c52;--mint:#b3f3d9;--gold:#e5cb91;--txt:#f0f7f4;--mut:#aac0c1;--serif:Georgia,'Noto Serif KR',serif;--sans:system-ui,-apple-system,'Malgun Gothic','Apple SD Gothic Neo',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--txt);font-family:var(--sans);word-break:keep-all}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}img,svg{max-width:100%}::selection{background:var(--mint);color:#0b272c}.shell{width:min(1220px,calc(100% - 80px));margin-inline:auto}
.header{position:sticky;top:0;z-index:20;min-height:82px;background:#07171df2;backdrop-filter:blur(15px);border-bottom:1px solid #2b4b4e70}.nav{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}.logo{display:flex;align-items:center;gap:12px}.logo-mark{width:45px;height:45px;border:1px solid #65ad9782;border-radius:13px;background:#183a3d;display:grid;place-items:center;font-size:26px;font-weight:900;color:#d8ffee;position:relative;letter-spacing:-.16em;padding-right:5px}.logo-mark>span{font-size:11px;position:absolute;top:5px;right:4px;color:var(--gold)}.logo-name{font-size:22px;font-weight:900;line-height:1;letter-spacing:-.06em}.logo-name>b{color:var(--mint)}.logo-name small{display:block;font-size:8px;font-weight:600;letter-spacing:.14em;color:#9bb8b1;margin-top:8px}.nav-links{display:flex;align-items:center;gap:29px}.nav-links>a{font-size:12px;font-weight:800;color:#bfd0cc;white-space:nowrap}.nav-links>a:hover{color:var(--mint)}.nav-links .nav-outline{padding:10px 14px;color:var(--mint);border:1px solid #6dbca48a;border-radius:6px}
.kicker{display:inline-flex;align-items:center;gap:12px;color:var(--mint);font-size:10px;font-weight:900;letter-spacing:.17em}.kicker i{display:inline-block;width:27px;height:1px;background:var(--mint)}
h1,h2,h3,p{margin-top:0}.home-hero{overflow:hidden;position:relative;background:radial-gradient(ellipse at 75% 26%,#1550476a,transparent 48%),radial-gradient(ellipse at 10% 80%,#806b321b,transparent 42%)}.home-grid{display:grid;grid-template-columns:1fr 1fr;gap:6%;align-items:center;min-height:630px;padding-block:72px}.home-copy h1{font-size:clamp(46px,5vw,73px);letter-spacing:-.075em;line-height:1.25;margin:32px 0 25px;font-weight:850}.home-copy h1 em,.section h2 em,.detail-hero h1 em,.back-project em{font-family:var(--serif);font-weight:450;font-style:italic;color:var(--mint)}.home-copy>p,.detail-hero p{font-size:15px;color:#b0c5c0;line-height:2;max-width:540px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:32px 0 24px}.btn{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;font-size:13px;font-weight:800;padding:16px 20px;border-radius:7px;border:1px solid transparent;transition:transform .2s,background .2s}.btn:hover{transform:translateY(-2px)}.btn>span{font-size:18px;line-height:0}.btn.primary{color:#073029;background:var(--mint)}.btn.primary:hover{background:#d5ffe8}.btn.ghost{color:#d9e7e0;border-color:#4c706c;background:#10262a}.btn.ghost:hover{background:#1e3d3b}.hero-foot{font-size:11px;color:#aec8c0;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.live-dot,.status>i{width:7px;height:7px;display:inline-block;background:#a7f9c8;border-radius:50%;box-shadow:0 0 14px #8cf2bb}.split{width:1px;height:12px;background:#67847d}
.hero-symbol{height:510px;position:relative;display:grid;place-items:center}.symbol-orbit{position:absolute;border:1px solid #6aa38a3f;border-radius:50%;width:445px;height:445px;left:calc(50% - 223px);top:35px}.orbit-two{width:335px;height:335px;left:calc(50% - 167px);top:90px;border-style:dashed;opacity:.72}.symbol-core{width:315px;height:315px;border:1px solid #6daa918c;box-shadow:inset 0 0 70px #368d7640,0 20px 90px #0007;background:radial-gradient(circle at 50% 40%,#1c5449,#0a2328 75%);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:11px;position:relative;z-index:3}.symbol-core::after{content:'';height:17px;width:17px;border:2px solid #9ef1d1;position:absolute;right:41px;top:44px;border-radius:50%;box-shadow:0 0 24px #9ce6c9}.symbol-core>small{color:#a0cbbf;font-size:9px;letter-spacing:.13em}.symbol-core>span{font-size:64px;font-weight:900;letter-spacing:-.075em;white-space:nowrap}.symbol-core>span b{color:var(--mint)}.sparkline{color:var(--gold);letter-spacing:.6em}.symbol-core p{color:#96bdad;letter-spacing:.19em;font-size:9px;margin:5px 0 0}.symbol-chip{display:flex;flex-direction:column;gap:6px;position:absolute;z-index:5;padding:17px 21px;min-width:201px;background:#122e31e8;border:1px solid #68b7a490;border-radius:9px;box-shadow:0 20px 30px #0007}.symbol-chip b{font-size:21px;letter-spacing:-.04em}.symbol-chip small{color:#a8c3b9;font-size:11px}.chip-index{color:var(--gold);font-size:9px;font-weight:850;letter-spacing:.12em}.chip-route{left:0;top:71px;transform:rotate(-5deg)}.chip-je{right:-5px;bottom:80px;transform:rotate(5deg)}.symbol-caption{position:absolute;bottom:0;right:19%;font-size:10px;letter-spacing:.08em;color:#84a59d}
.metrics{background:#0c2128;border-block:1px solid #416b644c}.metrics-grid{display:grid;grid-template-columns:repeat(4,1fr)}.metrics-grid>div{padding:32px 15px;display:flex;flex-direction:column;gap:8px;align-items:center;border-left:1px solid #3156536b}.metrics-grid>div:last-child{border-right:1px solid #3156536b}.metrics-grid b{font-size:36px;letter-spacing:-.04em}.metrics-grid span{color:#9bb7b2;font-size:11px;text-align:center}
.section{padding:108px 0}.section.compact{padding:95px 0}.section-index{font-size:10px;font-weight:850;letter-spacing:.18em;color:var(--gold);display:block;margin-bottom:24px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:41px}.section h2{font-size:clamp(34px,4.2vw,58px);letter-spacing:-.075em;line-height:1.35;margin:0}.section-head>p{max-width:365px;color:#a6c0bd;font-size:13px;line-height:1.9;margin:0}.cards{display:grid;grid-template-columns:1fr 1fr;gap:21px}.proj{border:1px solid #385c5f;background:#102830;border-radius:12px;overflow:hidden;min-width:0}.proj-top{display:flex;align-items:center;justify-content:space-between;padding:21px 25px;border-bottom:1px solid #3e60654d;color:#c2dad2;font-size:10px;letter-spacing:.09em;font-weight:850;gap:10px}.status{letter-spacing:0;color:#bbf1d2}.status i{width:6px;height:6px;margin-right:5px}.status.gold{color:#f1d5a1}.status.gold i{background:var(--gold)}.proj-visual{height:290px;position:relative;display:block;overflow:hidden;background:#102f31}.proj-visual img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.85);transition:transform .3s}.proj-visual:hover img{transform:scale(1.035)}.route-preview{background:radial-gradient(ellipse at 65% 40%,#1c4b43,#0b232b)}.route-map{width:100%;height:100%;display:block}.visual-note,.visual-label{position:absolute;bottom:18px;left:23px;font-size:10px;color:#d8e6dc;background:#102d2fc4;border-radius:4px;padding:7px 10px}.visual-label{color:#fff;background:#04242ab8}.proj-text{padding:29px 28px 31px}.proj-text h3{font-size:32px;letter-spacing:-.04em;margin:0 0 13px}.proj-text>p{font-size:13px;color:#a7c3bd;line-height:1.9;min-height:101px}.tags{display:flex;gap:7px;flex-wrap:wrap;margin:24px 0}.tags span{font-size:10px;color:#b4d5c8;border:1px solid #54796f;padding:7px 10px;border-radius:4px}.proj-actions{display:flex;flex-direction:column}.proj-actions>a{border-top:1px solid #3e5e60;padding:16px 0;display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:850;color:var(--mint)}.proj-actions>a:hover{color:#fff}.proj-actions>a>span{font-size:21px}
.guide-section{background:linear-gradient(115deg,#112c2a,#0a1d25)}.guide-row{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:10%;min-height:350px}.guide-row>div>p{max-width:540px;color:#afc6be;font-size:14px;line-height:2;margin:22px 0 30px}.guide-row h2{font-size:clamp(33px,3.6vw,53px);letter-spacing:-.065em;line-height:1.36}.guide-visual{height:360px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.guide-watermark{position:absolute;font-size:98px;letter-spacing:-.06em;opacity:.045;bottom:7px;right:-5px;font-weight:900}.guide-paper{position:relative;z-index:1;width:75%;background:linear-gradient(135deg,#e4f2e9,#cadcd3);border:1px solid #f8fff3;color:#1d3835;padding:32px 34px;border-radius:7px;box-shadow:25px 32px 0 #27463c,45px 55px 55px #0006;transform:rotate(-4deg)}.guide-paper>span{font-size:10px;letter-spacing:.12em;color:#4f8572}.guide-paper b{display:block;font-size:24px;margin:17px 0 9px}.guide-paper p{font-size:12px;color:#4e675e;margin:0}.guide-paper small{font-size:10px;color:#5b8372}.guide-steps{display:flex;gap:5px;margin:30px 0 20px}.guide-steps i{height:5px;flex:1;background:#8fbfac;border-radius:10px}.guide-steps i:first-child{background:#27745c}.paper-cap{position:absolute;top:16px;right:8%;font-size:10px;letter-spacing:.1em;color:#a4e0c5}
.method{background:#0b2027}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.steps>div{border-top:1px solid #477c6d;padding:25px 12px 0 0}.steps span{font-size:30px;color:var(--gold);font-weight:700}.steps h3{font-size:19px;margin:18px 0 11px}.steps p{color:#a9c2ba;font-size:12px;line-height:1.9;margin:0}.footer{background:#061319;border-top:1px solid #3b625c60;padding:35px 0}.footer-in{display:flex;align-items:center;justify-content:space-between;gap:20px;color:#8ead9f;font-size:10px}.footer-in>div{display:flex;flex-direction:column;gap:7px}.footer-in b{color:var(--mint);font-size:17px;letter-spacing:.08em}.footer-in>a{color:var(--mint)}
.bread{font-size:11px;color:#8fb5a7;padding:24px 0}.bread a{color:#bfd6cb}.bread span{margin-inline:8px}.detail-hero{padding:65px 0 95px;background:radial-gradient(ellipse at 80% 40%,#1a54464a,transparent 50%)}.detail-grid{display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:6%}.detail-hero h1{font-size:clamp(43px,4.4vw,67px);letter-spacing:-.075em;line-height:1.3;margin:35px 0 22px}.detail-visual{height:380px;overflow:hidden;position:relative;border:1px solid #52766b;border-radius:110px 9px 9px 9px;box-shadow:18px 25px 65px #0005}.detail-visual img{width:100%;height:100%;object-fit:cover}.detail-image-tag{position:absolute;left:19px;bottom:18px;padding:9px 14px;border-radius:5px;background:#062121c9;font-size:10px;letter-spacing:.07em;color:#e4fff4}.explain{border-left:2px solid var(--gold);padding-left:14px;margin-top:20px;max-width:490px;font-size:11px!important;color:#90b4a7!important;line-height:1.85!important}.explain strong{color:#dfeddc}
.app-shot-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(250px,.7fr);gap:25px;align-items:center;border:1px solid #3b6061;border-radius:12px;background:#0c2029;padding:20px}.shot-button{display:block;line-height:0;width:100%;background:#081622;border:1px solid #477b74;padding:0;border-radius:8px;overflow:hidden;text-align:left}.shot-button:hover{border-color:var(--mint)}.shot-button img{width:100%;height:auto;display:block;object-fit:contain}.shot-aside{padding:10px}.aside-eyebrow{color:var(--gold);letter-spacing:.12em;font-size:10px}.shot-aside h3{font-size:27px;letter-spacing:-.07em;line-height:1.4;margin:20px 0}.shot-aside p{font-size:12px;color:#adc6bc;line-height:1.9}.shot-aside ul{padding-left:18px;color:#bcd5cb;line-height:2.3;font-size:12px}.small-note{font-size:10px;color:#83aa9e}.broadcast-section{background:#0b2229}.broadcast-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:230px;gap:14px}.broadcast-card{display:block;grid-column:span 3;position:relative;overflow:hidden;background:#193339;border:1px solid #456864;border-radius:9px;padding:0;text-align:left;color:white}.broadcast-card.major{grid-column:span 6;grid-row:span 2}.broadcast-card img{width:100%;height:100%;object-fit:cover;filter:brightness(.84);display:block;transition:transform .3s}.broadcast-card:hover img{transform:scale(1.035);filter:brightness(.94)}.broadcast-card:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#051319dc);pointer-events:none}.broadcast-card>span{position:absolute;left:25px;bottom:24px;z-index:1;display:flex;flex-direction:column;gap:8px}.broadcast-card b{font-size:20px;letter-spacing:-.04em;text-shadow:0 2px 6px #0008}.broadcast-card small{font-size:11px;color:#c4e0d5}.broadcast-card.major b{font-size:29px}.disclaimer{color:#90b5ab;font-size:11px;line-height:1.9;margin:25px 0 0}.photo-dialog{max-width:min(95vw,1350px);max-height:95vh;width:100%;padding:0;border-radius:9px;border:1px solid #568f83;background:#081820;color:white;box-shadow:0 30px 100px #000d}.photo-dialog::backdrop{background:#020a0ce8;backdrop-filter:blur(6px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:17px 23px}.dialog-head div{display:flex;flex-direction:column;gap:5px}.dialog-head small{color:#aac9bb;font-size:11px}.dialog-head button{border:1px solid #57776c;background:#153d35;color:white;border-radius:6px;padding:8px 14px}.photo-dialog img{display:block;width:100%;height:auto;max-height:calc(95vh - 78px);object-fit:contain}
.back-project{padding:65px 0;background:#0b262a}.back-row{display:flex;justify-content:space-between;align-items:center;gap:20px}.back-row small{color:var(--gold);font-size:10px;letter-spacing:.15em}.back-row h2{font-size:29px;margin:14px 0 0}.route-hero .detail-grid{grid-template-columns:1fr 1fr}.route-big{height:400px;border:1px solid #498478;border-radius:14px;background:radial-gradient(ellipse at 50% 60%,#23564d,#0e2c33 65%);position:relative;overflow:hidden}.route-big>span{position:absolute;bottom:12px;right:20px;color:#b8d1c7;font-size:10px;background:#082022bd;padding:6px;border-radius:4px}.route-features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.route-features>article{border:1px solid #466865;border-radius:9px;background:#102831;padding:28px}.route-features article>span{color:var(--gold);font-size:25px}.route-features h3{font-size:21px;margin:22px 0 12px}.route-features p{font-size:13px;color:#b0c9c0;line-height:1.85}.service-link-card{margin-top:35px;border:1px solid #488578;border-radius:12px;padding:35px;background:linear-gradient(135deg,#173b37,#0e252b)}.service-link-card h3{font-size:clamp(22px,3vw,38px);overflow-wrap:anywhere;margin:0}.service-link-card p{font-size:13px;color:#b0c9c0;line-height:1.8;margin:15px 0 26px}
@media(max-width:1050px){.shell{width:calc(100% - 56px)}.home-grid{gap:2%}.hero-symbol{transform:scale(.83);transform-origin:center}.home-copy h1{font-size:56px}.detail-grid{gap:4%}.detail-hero h1{font-size:51px}.app-shot-layout{grid-template-columns:1fr}.shot-aside{padding:15px}.broadcast-grid{grid-auto-rows:195px}}
@media(max-width:760px){.shell{width:calc(100% - 34px)}.header,.nav{min-height:67px}.logo-mark{width:36px;height:36px;font-size:21px}.logo-name{font-size:18px}.logo-name small{font-size:7px}.nav-links{gap:12px}.nav-links a{font-size:10px}.nav-links a:nth-child(2),.nav-links a:nth-child(3){display:none}.nav-links .nav-outline{padding:8px 10px}.home-grid{grid-template-columns:1fr;padding-block:64px 48px;gap:15px;min-height:0}.home-copy h1{font-size:clamp(42px,9vw,62px)}.home-copy>p{font-size:13px}.hero-symbol{height:345px;transform:scale(.76);margin:-13px -25px;transform-origin:center}.symbol-caption{bottom:-65px;font-size:11px;right:10%}.symbol-chip{min-width:175px}.chip-route{left:0}.chip-je{right:0}.hero-foot{font-size:10px}.metrics-grid{grid-template-columns:repeat(2,1fr)}.metrics-grid>div{padding:23px 10px;border-bottom:1px solid #3359536b}.metrics-grid b{font-size:29px}.section,.section.compact{padding:70px 0}.section-head{flex-direction:column;align-items:start;gap:16px;margin-bottom:30px}.section h2{font-size:37px}.section-head>p{font-size:12px}.cards{grid-template-columns:1fr}.proj-visual{height:238px}.proj-text{padding:26px 21px}.proj-text>p{min-height:0}.guide-row{grid-template-columns:1fr;gap:0}.guide-visual{height:260px}.guide-paper{padding:22px 24px;width:70%}.guide-paper b{font-size:21px}.steps{grid-template-columns:1fr 1fr}.steps>div{padding-right:14px}.footer-in{flex-wrap:wrap}.footer-in>span{display:none}.bread{padding:18px 0}.detail-hero{padding:28px 0 60px}.detail-grid,.route-hero .detail-grid{grid-template-columns:1fr;gap:30px}.detail-hero h1{font-size:clamp(39px,8vw,55px)}.detail-hero p{font-size:13px}.detail-visual{height:265px;border-radius:75px 8px 8px 8px}.route-big{height:300px}.app-shot-layout{padding:9px}.shot-aside h3{font-size:24px}.broadcast-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:175px;gap:9px}.broadcast-card,.broadcast-card.major{grid-column:span 1;grid-row:span 1}.broadcast-card.major{grid-column:span 2;grid-row:span 2}.broadcast-card>span{left:13px;bottom:13px}.broadcast-card b{font-size:14px}.broadcast-card.major b{font-size:22px}.broadcast-card small{font-size:10px}.route-features{grid-template-columns:1fr}.back-row{flex-direction:column;align-items:start}.back-row h2{font-size:24px}}
@media(max-width:390px){.nav-links a:first-child{display:none}.home-copy h1{font-size:39px}.hero-symbol{transform:scale(.65);margin:-25px -45px}.symbol-caption{bottom:-100px}.metrics-grid span{font-size:10px}.broadcast-grid{grid-auto-rows:135px}}

/* v0.2.2: Why JEstudio was built — safely independent from the real desktop app */
.origin-story{position:relative;overflow:hidden;padding:76px 0 81px;background:linear-gradient(118deg,#0d262c 0%,#0b2229 56%,#112d2b 100%);border-block:1px solid #47776b55}
.origin-story::before{content:"";position:absolute;top:-225px;left:-175px;width:460px;height:460px;border:1px solid #6daa9140;border-radius:50%;pointer-events:none}
.origin-story-grid{display:grid;grid-template-columns:minmax(0,.83fr) minmax(0,1.17fr);gap:clamp(42px,7vw,110px);align-items:start;position:relative}
.origin-story-heading h2{margin:22px 0 24px;font-size:clamp(36px,3.6vw,52px);line-height:1.35;letter-spacing:-.07em}
.origin-story-heading h2 em{color:var(--mint);font-family:var(--serif);font-weight:450;font-style:italic}
.origin-story-sub{max-width:385px;color:#a5c4b8;font-size:13px;line-height:1.95;margin:0}
.origin-story-sequence{display:flex;align-items:center;flex-wrap:wrap;gap:9px 12px;margin-top:28px;color:#aacbc0;font-size:10px;line-height:1.5}
.origin-story-sequence span{border:1px solid #4a706675;padding:7px 9px;border-radius:4px;background:#102b2d}
.origin-story-sequence i{font-style:normal;color:var(--gold)}
.origin-story-copy{padding:2px 0 0 29px;border-left:1px solid #54887876}
.origin-story-copy p{font-size:14px;line-height:2.07;letter-spacing:-.025em;color:#c8d9d4;margin:0 0 17px}
.origin-story-copy p strong{color:#f2fff9;font-weight:800}
.origin-story-copy blockquote{margin:25px 0 13px;padding:0;color:var(--mint);font-size:clamp(18px,2vw,23px);font-weight:750;letter-spacing:-.04em;line-height:1.6}
.origin-story-signoff{font-size:12px;color:var(--gold);font-weight:750}
@media(max-width:760px){.origin-story{padding:62px 0}.origin-story-grid{grid-template-columns:1fr;gap:28px}.origin-story-heading h2{font-size:clamp(33px,8vw,44px);margin:17px 0}.origin-story-sequence{margin-top:20px;gap:6px}.origin-story-sequence span{font-size:9px;padding:6px}.origin-story-copy{padding:0 0 0 17px}.origin-story-copy p{font-size:13px;line-height:1.95}.origin-story-copy blockquote{font-size:19px}}

/* Keyboard accessibility for clickable project images */
.proj-visual[href]:focus-visible{outline:3px solid #a9f3d3;outline-offset:-4px}
