@font-face{font-family:Manrope;src:url('assets/manrope-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url('assets/manrope-600.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:Manrope;src:url('assets/manrope-800.woff2') format('woff2');font-weight:800;font-display:swap}
:root{color-scheme:dark;--paper:#050d21;--ink:#edf2f7;--muted:#9aafc6;--line:#293c56;--orange:#f6a033;--green:#89c8d8}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 14px/1.65 Manrope,Arial,sans-serif;-webkit-font-smoothing:antialiased}
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:5;opacity:.032;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23n)' opacity='.65' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{outline:2px solid var(--orange);outline-offset:5px}
::selection{background:#f6a033;color:#050d21}
.skip-link{position:absolute;top:8px;left:16px;padding:10px 16px;background:var(--ink);color:var(--paper);z-index:10;transform:translateY(-160%)}
.skip-link:focus{transform:none}
.page-shell{width:min(1300px,100%);margin:auto;padding:0 clamp(24px,5vw,76px)}
.site-header{display:flex;align-items:center;justify-content:space-between;min-height:120px;border-bottom:1px solid var(--line);gap:24px}
.studio-brand{display:flex;align-items:center;gap:16px}
.brand-symbol{display:block;width:17px;height:68px;overflow:hidden}
.brand-type{display:flex;flex-direction:column;gap:2px;font-size:13px;font-weight:800;letter-spacing:.19em;line-height:1.6}
.brand-type>span:last-child{font-weight:400;font-size:10px;letter-spacing:.46em}
.header-right{display:flex;align-items:center;gap:34px}
.place{font-size:9px;letter-spacing:.14em;color:var(--muted)}
.language-switch{display:flex;align-items:center;gap:4px;font-size:11px}
.language-switch>span{color:var(--line)}
.language-switch button{padding:8px 5px;border:0;background:none;cursor:pointer;color:var(--muted)}
.language-switch button[aria-pressed=true]{color:var(--ink);font-weight:800}
.intro{padding:52px 0 34px;display:grid;grid-template-columns:1.8fr 1fr;gap:40px;align-items:end}
.status{display:flex;align-items:center;gap:8px;font-size:9px;font-weight:600;letter-spacing:.15em;color:var(--muted);margin-bottom:20px}
.status-dot{width:6px;height:6px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 4px #ed842b14}
h1{font-size:clamp(44px,6.4vw,87px);font-weight:800;line-height:1.07;letter-spacing:-.058em;margin:0}
.title-second{color:var(--green)}
.title-dot{color:var(--orange)}
.intro-side{padding-bottom:6px;max-width:330px;justify-self:end;width:100%}
.small-rule{display:block;width:32px;height:2px;background:var(--orange);margin-bottom:16px}
.studio-description{font-size:clamp(15px,1.5vw,19px);font-weight:600;line-height:1.6;margin:0 0 12px;letter-spacing:-.025em}
.coming-copy{font-size:12px;line-height:1.7;color:var(--muted);margin:0 0 20px}
.text-link{display:inline-flex;gap:24px;align-items:center;font-size:11px;font-weight:800;padding:0 0 5px;border-bottom:1px solid var(--ink)}
.text-link>span{font-size:18px;line-height:1;transition:transform .3s}
.text-link:hover>span{transform:translate(3px,-3px)}
.drawing-section{position:relative}
.drawing-toolbar{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px;padding:13px 0}
.drawing-label{display:flex;align-items:center;gap:14px;font-size:8px;letter-spacing:.13em;font-weight:600;color:var(--muted)}
.drawing-index{font-size:10px;font-weight:600;color:var(--orange)}
.creative-modes{display:flex;align-items:center;gap:22px}
.creative-modes button{cursor:pointer;border:0;background:none;padding:5px 0;position:relative;font-size:10px;color:var(--muted);transition:color .2s}
.creative-modes button::after{content:'';height:3px;width:3px;border-radius:50%;position:absolute;right:-8px;top:50%;background:var(--orange);opacity:0;transform:translateY(-50%)}
.creative-modes button[aria-pressed=true]{color:var(--ink);font-weight:800}
.creative-modes button[aria-pressed=true]::after{opacity:1}
.creative-modes button:hover{color:var(--orange)}
.drawing-stage{position:relative;padding:26px 0 16px;isolation:isolate;overflow:hidden;background:var(--paper)}
.drawing-grid{position:absolute;inset:0 0 40px;opacity:.4;z-index:-1;background-image:linear-gradient(#587ca433 1px,transparent 1px),linear-gradient(90deg,#587ca433 1px,transparent 1px);background-size:36px 36px;mask-image:linear-gradient(transparent,#0008 20%,#000 70%,transparent)}
.model-wrap{position:relative;width:100%;aspect-ratio:2264/755;margin:0 auto;background:var(--paper);transform:translate3d(var(--model-x,0px),var(--model-y,0px),0);transition:transform .45s ease-out}
.model-wrap img{width:100%;height:100%;display:block;mix-blend-mode:screen;filter:invert(1) contrast(2);opacity:.55;transition:opacity 1.8s ease}
.model-wrap.ready img{opacity:.4}
.model-wrap.static img{opacity:.78}
.model-wrap canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.drawing-caption{display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--muted);font-size:9px;padding:16px 0 0;letter-spacing:.025em}
.motion-toggle{display:grid;place-items:center;width:26px;height:26px;border:1px solid var(--line);border-radius:50%;background:transparent;cursor:pointer;transition:color .2s,border-color .2s}
.motion-toggle:hover{border-color:var(--orange);color:var(--orange)}
.motion-toggle svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.4}
.motion-toggle .play-glyph{display:none}
.motion-toggle[aria-pressed=true] .play-glyph{display:block}
.motion-toggle[aria-pressed=true] .pause-glyph{display:none}
.cross{position:absolute;width:9px;height:9px;z-index:2;color:var(--muted);opacity:.6}
.cross::before,.cross::after{content:'';background:currentColor;position:absolute}
.cross::before{width:9px;height:1px;top:4px}.cross::after{height:9px;width:1px;left:4px}
.cross-tl{top:18px;left:0}.cross-tr{top:18px;right:0}.cross-bl{bottom:57px;left:0}.cross-br{bottom:57px;right:0}
.contest-banner{position:relative;display:grid;grid-template-columns:1fr 1.65fr 1.4fr auto;align-items:center;gap:30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 0;transition:background .3s}
.contest-banner::before{content:'';position:absolute;inset:0 -20px;background:#10203a;z-index:-1;opacity:0;transition:opacity .35s}
.contest-banner:hover::before{opacity:1}
.contest-note{display:flex;align-items:flex-start;gap:8px;font-size:8px;letter-spacing:.11em;color:var(--muted);font-weight:600;max-width:120px}
.live-dot{display:block;width:5px;height:5px;background:var(--green);border-radius:50%;margin-top:5px;flex:0 0 auto}
.contest-title{font-size:clamp(18px,2.1vw,27px);font-weight:800;line-height:1.25;letter-spacing:-.04em}
.contest-detail{display:flex;flex-direction:column;font-size:9px;gap:1px;color:var(--muted)}
.contest-detail strong{font-size:clamp(20px,2.1vw,27px);letter-spacing:-.04em;color:var(--ink);font-weight:600}
.contest-detail strong>span{color:var(--orange)}
.prize-caption{font-size:8px}
.contest-arrow{display:grid;place-items:center;width:43px;height:43px;border:1px solid var(--line);border-radius:50%;font-size:22px;transition:transform .3s,background .3s,border-color .3s}
.contest-banner:hover .contest-arrow{transform:translate(3px,-3px);background:var(--orange);border-color:var(--orange);color:var(--paper)}
.site-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 0 30px;font-size:8px;letter-spacing:.09em;color:var(--muted)}
.footer-line{height:1px;width:32px;background:var(--line)}
html[lang=mn] h1{font-size:clamp(40px,5.9vw,78px);letter-spacing:-.06em}
@media(min-width:1500px){.intro{padding-top:72px}.drawing-stage{padding-top:40px;padding-bottom:24px}.site-header{min-height:140px}}
@media(max-width:760px){
  .page-shell{padding-inline:24px}.site-header{min-height:100px;gap:12px}.brand-symbol{height:58px;width:14.56px}.studio-brand{gap:12px}.brand-type{font-size:11px;letter-spacing:.14em}.brand-type>span:last-child{font-size:9px}.place{display:none}.header-right{gap:0}
  .intro{padding:36px 0 24px;grid-template-columns:1fr;gap:25px}.intro-side{display:grid;grid-template-columns:1fr auto;gap:10px 18px;max-width:none;justify-self:start;align-items:start;padding:0}.intro-side .small-rule{display:none}.studio-description{font-size:14px;margin:0}.coming-copy{font-size:11px;margin:0;grid-column:1}.text-link{grid-column:2;grid-row:1 / 3;align-self:end;font-size:10px;gap:16px;margin-bottom:4px}h1{font-size:clamp(43px,10.5vw,72px)}html[lang=mn] h1{font-size:clamp(37px,9.2vw,66px)}
  .drawing-toolbar{gap:12px;align-items:center}.drawing-label{font-size:7px;gap:8px;max-width:145px}.creative-modes{gap:14px}.creative-modes button{font-size:9px}.creative-modes button::after{right:-6px;width:2px;height:2px}.drawing-stage{padding-top:27px}.model-wrap{width:118%;margin-left:-9%}.drawing-grid{background-size:24px 24px}.cross-bl,.cross-br{bottom:57px}.drawing-caption{font-size:8px;max-width:100%;padding-top:20px;gap:8px}.motion-toggle{flex:0 0 auto}
  .contest-banner{grid-template-columns:1fr 1fr auto;gap:14px;padding:20px 0}.contest-note{grid-column:1 / -1;max-width:none;font-size:7px;align-items:center}.live-dot{margin:0}.contest-title{font-size:19px}.contest-detail{font-size:8px}.contest-detail strong{font-size:21px}.contest-arrow{width:32px;height:32px;font-size:18px}.site-footer{gap:14px;font-size:7px;line-height:1.8;padding-top:20px;align-items:flex-start}.footer-line{display:none}.site-footer>span:first-child{max-width:150px}.site-footer>span:last-child{max-width:155px;text-align:right}
}
@media(max-width:400px){.page-shell{padding-inline:20px}.intro-side{grid-template-columns:1fr;gap:8px}.text-link{grid-column:1;grid-row:auto;justify-self:start;align-self:start;margin-top:5px}.contest-banner{gap:12px}.contest-title{font-size:17px}.contest-detail strong{font-size:19px}.contest-detail>span:first-child{max-width:110px}.drawing-label{max-width:130px}.creative-modes{gap:11px}.creative-modes button{font-size:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}.model-wrap{transform:none!important}}
