:root{color-scheme:dark;font-family:Inter,"Segoe UI",Helvetica,Arial,sans-serif;background:#000;color:#eee}*{box-sizing:border-box}body{margin:0}a{color:inherit}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #fff;outline-offset:5px}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.gateway-entrance{min-height:100svh;display:grid;grid-template-columns:1fr 1fr;align-items:center;position:relative;padding:5rem max(1rem,8vw)}.gateway-axis{pointer-events:none;position:absolute;inset:0;display:grid;grid-template-rows:1fr auto 1fr;justify-items:center;align-items:stretch;gap:2rem}.gateway-axis span{width:1px;background:linear-gradient(transparent,#ffffff60);margin-top:clamp(4rem,14vh,12rem)}.gateway-axis span:last-child{background:linear-gradient(#ffffff60,transparent);margin:0 0 clamp(8rem,20vh,16rem)}.gateway-axis img{width:clamp(64px,2cm,88px);height:clamp(64px,2cm,88px);object-fit:contain;filter:drop-shadow(-2px 0 3px #7466a522) drop-shadow(2px 0 3px #60a69b22)}.gateway-choice{justify-self:center;position:relative;padding:1.25rem 1.5rem;text-decoration:none;font-size:clamp(.75rem,1.25vw,.95rem);letter-spacing:.22em;font-weight:400;color:#bcbcbc;border:1px solid transparent;border-radius:2px;background:transparent}.gateway-choice:after{content:"";position:absolute;bottom:.65rem;left:1.5rem;right:calc(1.5rem + .22em);height:1px;background:linear-gradient(90deg,#9585c4,#aac5d1,#b6cdb7,#d1c3a6,#c293a5);opacity:0;transition:opacity .18s}.gateway-choice:hover,.gateway-choice:focus-visible{color:#fff}.gateway-choice:hover:after,.gateway-choice:focus-visible:after{opacity:.7}.gateway-footer{position:fixed;bottom:max(1.3rem,env(safe-area-inset-bottom));left:0;right:0;text-align:center;font-size:.65rem;color:#888;letter-spacing:.025em}.gateway-footer nav{display:flex;align-items:center;justify-content:center;gap:.65rem}.gateway-footer a{text-decoration:none;display:inline-flex;align-items:center;min-height:32px}.gateway-footer a:hover{color:#eee}.gateway-footer p{font-size:.6rem;margin:.35rem 0 0;color:#777}.gateway-entry{position:fixed;inset:0;width:min(29rem,calc(100vw - 2rem));max-width:none;max-height:calc(100dvh - 1.5rem);margin:auto;padding:0;overflow:auto;border:0;background:transparent;color:#eee;scrollbar-width:thin}.gateway-entry::backdrop{background:#0009;backdrop-filter:blur(5px)}.gateway-entry .gateway-start-panel{position:relative;inset:auto;width:100%;max-height:none;margin:0;padding:1rem;border:1px solid #ffffff35;border-radius:.65rem;background:#080808f5;overflow:visible;box-shadow:none}.gateway-entry .home-start-heading{padding-right:2rem}.gateway-entry .editor-start-dialog :is(button,input,select){color:#eee;background:#111;border-color:#ffffff30}.gateway-entry .editor-start-dialog small{color:#999}.gateway-entry .editor-start-dialog label,.gateway-entry .editor-start-dialog legend{color:#aaa}.gateway-entry #recent-work{width:100%;margin:.6rem 0 0;padding:.7rem .75rem;border:1px solid #ffffff35;border-radius:.65rem;background:#080808f5;min-height:0;backdrop-filter:none}.gateway-entry #recent-work .recent-work-heading{padding:0 0 .5rem}.gateway-entry #recent-work h2{margin:0;font-size:.8rem}.gateway-entry .recent-work-list[data-carousel="true"] .recent-project{flex:0 0 105px;width:105px;min-width:105px}.gateway-entry .recent-project-preview{height:65px;min-height:65px}.gateway-entry .recent-project-info{padding:.35rem}.gateway-entry .recent-project-info h3{font-size:.62rem}.gateway-entry .recent-project-info p{font-size:.55rem}.gateway-entry .recent-project-reopen{font-size:.6rem}.gateway-entry .recent-work-state{min-height:3.8rem;padding:.5rem;background:transparent;border:0}.gateway-entry .recent-work-state h3{font-size:.72rem}.gateway-entry .recent-work-state p{font-size:.65rem}.gateway-entry .recent-work-state>small,.gateway-entry .recent-work-mark{display:none}.gateway-entry-footer{position:static;margin:.65rem 0 .15rem}.gateway-entry-footer p{margin:.1rem 0}.gateway-page .recent-gallery-dialog,.gateway-page .recent-removal-dialog{background:#090909;color:#eee;border:1px solid #ffffff40;max-height:85dvh;overflow:auto}.gateway-page .recent-gallery-dialog{width:min(92vw,70rem)}.gateway-page .recent-gallery-dialog::backdrop,.gateway-page .recent-removal-dialog::backdrop{background:#000b}.gateway-noscript{position:fixed;bottom:6rem;text-align:center;width:100%;font-size:.75rem;color:#aaa}@media(max-width:480px){.gateway-entrance{padding-inline:.4rem}.gateway-choice{letter-spacing:.13em;padding:1rem .75rem;font-size:.7rem}.gateway-axis{gap:1.5rem}.gateway-entry{width:calc(100vw - 1rem)}.gateway-entry .editor-start-presets{grid-template-columns:repeat(4,minmax(0,1fr))}.gateway-entry .editor-start-presets button{font-size:.6rem}.gateway-entry .editor-start-presets small{font-size:.5rem}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
.gateway-entry #recent-work-list{min-height:0;height:auto}.gateway-entry .recent-work-body{min-height:0}.gateway-entry .recent-work-carousel{min-height:0}.gateway-entry .recent-work-list[data-carousel="true"]{min-height:0}.gateway-entry .recent-project{min-height:0}.gateway-entry .recent-work-preview-media{height:100%}
.gateway-page{display:block;overflow-x:hidden}.gateway-page .gateway-error{position:fixed;bottom:7rem;left:1rem;right:1rem;text-align:center;color:#ddd;font-size:.75rem}.gateway-page .recent-gallery-heading{display:flex;justify-content:space-between;gap:1rem}.gateway-page .recent-gallery-list .recent-project{min-width:0}.gateway-entry .recent-work-preview{height:65px;min-height:65px;aspect-ratio:auto}.gateway-entry .recent-work-preview img{height:100%;width:100%;object-fit:cover}.gateway-entry .recent-work-list[data-carousel="true"]{scroll-behavior:auto}
.gateway-entry .editor-start-presets button{max-width:5rem}
.gateway-page .gateway-footer p{display:block}
.gateway-page .gateway-footer{display:block;min-height:0;height:auto;padding:0;border:0;background:transparent;gap:0}
.gateway-entry .recent-project{padding:0;gap:0}.gateway-entry #recent-work-view-all{position:absolute;top:.35rem;right:.7rem;min-height:32px}.gateway-entry #recent-work .recent-work-heading{padding-right:4.5rem}
.gateway-logo {
  --editor-prism:conic-gradient(#f17b85,#edaa73,#ece18a,#84d9a3,#83dce2,#839fe9,#bd91e4,#f17b85);
  position:relative;
  isolation:isolate;
  width:clamp(64px,2cm,88px);
  aspect-ratio:1;
  pointer-events:auto;
  transition:transform 280ms ease,filter 280ms ease;
}
.gateway-logo:hover {transform:scale(1.045);filter:drop-shadow(0 0 12px #c1b0ee30) drop-shadow(0 5px 9px #ffffff10)}
@media(prefers-reduced-motion:reduce) {
  .gateway-logo {transition:none}
  .gateway-logo:hover {transform:none}
}
.gateway-axis .gateway-logo img {display:block;width:100%;height:100%;filter:none}
.gateway-logo::after {
  content:"";
  position:absolute;
  inset:0;
  background:var(--editor-prism);
  mask:url('/assets/official-gateway-logo.png') center / contain no-repeat;
  -webkit-mask:url('/assets/official-gateway-logo.png') center / contain no-repeat;
  mix-blend-mode:multiply;
  opacity:.85;
  pointer-events:none;
}

/* Settle over the Editor choice while leaving the central brand unobstructed. */
.gateway-entry {
  left:max(calc(50vw + 3.5rem),calc(71vw - 14.5rem));
  right:auto;
  width:min(29rem,calc(50vw - 4.5rem));
  margin-block:auto;
  margin-inline:0;
}
.gateway-entry::backdrop {background:rgba(0,0,0,.15);backdrop-filter:none}
@media(max-width:54rem) {
  .gateway-entry {
    top:8rem;
    bottom:auto;
    left:50%;
    width:min(29rem,calc(100vw - 1rem));
    max-height:calc(100dvh - 9rem);
    margin:0;
    transform:translateX(-50%);
  }
  .gateway-page:has(.gateway-entry[open]) .gateway-axis {
    grid-template-rows:.5rem auto 1fr;
    gap:1rem;
    padding-top:.5rem;
  }
  .gateway-page:has(.gateway-entry[open]) .gateway-axis span {margin:0}
  .gateway-page:has(.gateway-entry[open]) .gateway-axis span:last-child {margin-bottom:1rem}
}

/* Symmetric one-pixel lines fade outward toward the established text choices. */
.gateway-entrance{--gateway-logo-size:clamp(64px,2cm,88px);--gateway-inner-gap:clamp(12px,2vw,20px);--gateway-line-length:clamp(4px,calc((100vw - var(--gateway-logo-size)) / 2 - 128px),128px);--gateway-vertical-line:clamp(56px,8vh,80px);--gateway-text-gap:8px;--gateway-choice-x:1.5rem;--gateway-choice-y:1.25rem}
.gateway-home,.gateway-account{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap}
.gateway-home{bottom:calc(50% + var(--gateway-logo-size) / 2 + var(--gateway-inner-gap) + var(--gateway-vertical-line) + var(--gateway-text-gap) - var(--gateway-choice-y))}
.gateway-account{top:calc(50% + var(--gateway-logo-size) / 2 + var(--gateway-inner-gap) + var(--gateway-vertical-line) + var(--gateway-text-gap) - var(--gateway-choice-y))}
.gateway-studio,.gateway-editor{position:absolute;top:50%;transform:translateY(-50%);white-space:nowrap}
.gateway-studio{right:calc(50% + var(--gateway-logo-size) / 2 + var(--gateway-inner-gap) + var(--gateway-line-length) + var(--gateway-text-gap) - var(--gateway-choice-x))}
.gateway-editor{left:calc(50% + var(--gateway-logo-size) / 2 + var(--gateway-inner-gap) + var(--gateway-line-length) + var(--gateway-text-gap) - var(--gateway-choice-x))}
.gateway-page:not(:has(.gateway-entry[open])) .gateway-axis{top:50%;bottom:auto;height:calc(var(--gateway-logo-size) + 2 * var(--gateway-inner-gap) + 2 * var(--gateway-vertical-line));transform:translateY(-50%);grid-template-rows:var(--gateway-vertical-line) var(--gateway-logo-size) var(--gateway-vertical-line);gap:var(--gateway-inner-gap)}
.gateway-axis span,.gateway-axis span:last-child{width:1px;margin:0;background:linear-gradient(to bottom,transparent,#ffffff35)}
.gateway-axis span:last-child{background:linear-gradient(to bottom,#ffffff35,transparent)}
.gateway-entrance::before,.gateway-entrance::after{content:"";position:absolute;top:50%;height:1px;pointer-events:none;width:var(--gateway-line-length)}
.gateway-entrance::before{right:calc(50% + var(--gateway-logo-size) / 2 + var(--gateway-inner-gap));background:linear-gradient(to right,transparent,#ffffff35)}
.gateway-entrance::after{left:calc(50% + var(--gateway-logo-size) / 2 + var(--gateway-inner-gap));background:linear-gradient(to right,#ffffff35,transparent)}
@media(max-width:480px){.gateway-entrance{--gateway-choice-x:.75rem;--gateway-choice-y:1rem}}
