:root{color-scheme:dark}
html,body{margin:0;min-height:100%;overflow:hidden}
.home-shell{position:relative;isolation:isolate;width:100%;max-width:none;height:100svh;min-height:520px;margin:0;padding:0;overflow:hidden;background:#0b1320}
.topbar{position:absolute;z-index:10;top:0;left:0;right:0;display:flex;height:80px;align-items:center;justify-content:space-between;padding:0 clamp(20px,4vw,58px);background:linear-gradient(#090e19d9,transparent);pointer-events:none}
.topbar>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:12px;color:#f3f6fa;text-decoration:none;font-weight:800}.mark{display:block;width:38px;height:38px}.mark img{display:block;width:100%;height:100%}.domain{color:#a8b6c7;font-size:12px}
.world-collision{position:absolute;inset:0;overflow:hidden;background:#0c1421;--top:55%;--bottom:45%;--seam:50%}
.observer-field,.mmo-field{position:absolute;inset:0;overflow:hidden;pointer-events:none;transition:clip-path .48s cubic-bezier(.2,.8,.2,1),filter .38s ease}
.observer-field{clip-path:polygon(0 0,var(--top) 0,var(--bottom) 100%,0 100%);background:radial-gradient(ellipse 52% 80% at 12% 28%,#244867 0,#132d46 53%,transparent 100%),linear-gradient(110deg,#102941,#102035 65%,#0d1a2a)}
.observer-field:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#9fc6ed0a 1px,transparent 1px),linear-gradient(90deg,#9fc6ed0a 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(90deg,#0008,transparent 62%)}
.observer-signals{position:absolute;inset:0;width:100%;height:100%;opacity:.4}.observer-signals path{fill:none;stroke:#83b5dd;stroke-width:1}.observer-signals circle{fill:#b9dfff;filter:drop-shadow(0 0 5px #8fceff)}
.mmo-field{clip-path:polygon(var(--top) 0,100% 0,100% 100%,var(--bottom) 100%);background:radial-gradient(ellipse 75% 95% at 94% 84%,#54321d 0,#302019 46%,transparent 85%),linear-gradient(120deg,#181621,#261819 65%,#362019)}
.mmo-field:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 40% 55% at 76% 80%,#ca8c3f26,transparent 75%),radial-gradient(ellipse 24% 38% at 88% 48%,#c1734520,transparent 75%);animation:magic-breathe 9s ease-in-out infinite alternate}
.arcane-strokes{position:absolute;inset:0;width:100%;height:100%;opacity:.56}.spell-stroke{fill:none;stroke:#d4a562;stroke-width:2.8;stroke-linecap:round;filter:drop-shadow(0 0 8px #d98e4a);stroke-dasharray:12 7;animation:spell-flow 18s linear infinite}.spell-stroke.second{stroke:#efc995;stroke-width:1.4;opacity:.72;animation-duration:24s}.spell-stroke.third{stroke:#8c7b9b;stroke-width:1.6;opacity:.65;animation-duration:21s}
.rune{position:absolute;color:#d9aa67;font:24px Georgia,serif;opacity:.33;text-shadow:0 0 14px #e2a75c;animation:rune-breathe 7s ease-in-out infinite}.rune-one{left:62%;top:30%}.rune-two{left:82%;top:60%;animation-delay:-2.4s}.rune-three{left:71%;top:78%;animation-delay:-4.8s}
.seam{position:absolute;z-index:2;top:-12%;left:var(--seam);width:2px;height:124%;transform:translateX(-50%) rotate(8.1deg);pointer-events:none;background:linear-gradient(180deg,transparent,#bcd7ed80 25%,#f8e6c6a8 50%,#c68b5470 75%,transparent);box-shadow:-6px 0 18px #6da7ce40,6px 0 18px #d69a5f46;transition:left .48s cubic-bezier(.2,.8,.2,1)}
.project{position:absolute;z-index:4;display:flex;width:50%;height:100%;flex-direction:column;justify-content:center;text-decoration:none;cursor:pointer;transition:transform .48s cubic-bezier(.2,.8,.2,1),opacity .35s ease}
.project-observer{top:0;left:0;align-items:flex-start;padding:0 0 9% clamp(40px,8.2vw,128px)}
.project-mmo{right:0;bottom:0;align-items:flex-end;padding:15% clamp(40px,8.2vw,128px) 0 0;text-align:right}
.project-icon{display:grid;width:52px;height:52px;place-items:center;margin-bottom:24px;transition:transform .35s ease}.project-icon img{display:block;width:100%;height:100%}
.observer-icon{border:1px solid #7bb0db;border-radius:13px;background:#193856;padding:7px}.mmo-icon{position:relative;border:1px solid #bd8546;background:#241914;color:#f4d6a6;font:700 19px Georgia,serif;box-shadow:inset 0 0 0 3px #120e0d}
.project-copy{display:block;max-width:400px}.project-copy small{display:block;margin-bottom:12px;font-size:10px;font-weight:800;letter-spacing:.2em}.project-observer small{color:#99c8eb}.project-mmo small{color:#e4b374;font-family:Georgia,serif}
.project-copy strong{display:block;color:#f6f8fb;font-size:clamp(43px,4.7vw,76px);font-weight:800;line-height:1;letter-spacing:-.06em}.project-mmo .project-copy strong{color:#f4e9d8;font-family:Georgia,serif;font-weight:500;letter-spacing:-.045em}
.project-copy>span{display:block;margin-top:13px;color:#b6c9d8;font-size:clamp(13px,1vw,15px);line-height:1.5}.project-mmo .project-copy>span{color:#cbbbaa}
.project-arrow{display:flex;gap:10px;align-items:center;margin-top:25px;padding:10px 13px;border:1px solid currentColor;border-radius:7px;color:#a9d5f3;font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;opacity:0;transform:translateY(7px);transition:opacity .25s ease,transform .25s ease}.project-mmo .project-arrow{border-radius:2px;color:#e4b879;font-family:Georgia,serif}.project-arrow b{font-size:15px}
.project:hover .project-arrow,.project:focus-visible .project-arrow{opacity:1;transform:none}.project:focus-visible{outline:2px solid #ffffff9a;outline-offset:-8px}.project:hover .project-icon{transform:translateY(-5px)}
.world-collision[data-focus=observer]{--top:63%;--bottom:53%;--seam:58%}.world-collision[data-focus=mmo]{--top:47%;--bottom:37%;--seam:42%}
.world-collision[data-focus=observer] .mmo-field,.world-collision[data-focus=mmo] .observer-field{filter:brightness(.52) saturate(.65)}
.world-collision[data-focus=observer] .observer-field,.world-collision[data-focus=mmo] .mmo-field{filter:brightness(1.12) saturate(1.1)}
.world-collision[data-focus=observer] .project-mmo,.world-collision[data-focus=mmo] .project-observer{opacity:.5}
.world-collision[data-focus=observer] .project-observer{transform:translateX(12px)}.world-collision[data-focus=mmo] .project-mmo{transform:translateX(-12px)}
.world-collision.is-committing{pointer-events:none}
.world-collision[data-commit=observer]{--top:110%;--bottom:110%;--seam:106%}
.world-collision[data-commit=mmo]{--top:-10%;--bottom:-10%;--seam:-6%}
.world-collision[data-commit=observer] .project-mmo,.world-collision[data-commit=mmo] .project-observer{opacity:0}
@keyframes magic-breathe{to{opacity:.7;transform:scale(1.04)}}@keyframes spell-flow{to{stroke-dashoffset:-190}}@keyframes rune-breathe{50%{opacity:.57;transform:translateY(-8px)}}
@media(max-width:760px){
  .home-shell{min-height:0}.topbar{height:70px;padding:0 17px}.brand{gap:9px;font-size:15px}.mark{width:32px;height:32px}.domain{max-width:130px;text-align:right;font-size:10px}
  .world-collision{--top:100%;--bottom:0%;--seam:50%}.observer-field{clip-path:polygon(0 0,100% 0,100% 46%,0 54%)}.mmo-field{clip-path:polygon(0 54%,100% 46%,100% 100%,0 100%)}
  .seam{top:50%;left:50%;width:110vw;height:2px;transform:translate(-50%,-50%) rotate(-5deg);background:linear-gradient(90deg,transparent,#d3ddea,#f2d5ae,transparent)}
  .project{width:100%;height:50%;padding:0 8%}.project-observer{top:0;justify-content:center;padding-top:53px}.project-mmo{top:50%;right:0;bottom:auto;justify-content:center;padding-top:0;padding-bottom:0}
  .project-icon{width:46px;height:46px;margin-bottom:14px}.project-copy strong{font-size:clamp(38px,10vw,54px)}.project-copy>span{max-width:310px;margin-top:10px;font-size:12px}.project-arrow{margin-top:15px;padding:8px 10px;font-size:10px}
  .observer-signals{opacity:.24}.arcane-strokes{opacity:.42}.rune{font-size:17px}
  .world-collision[data-focus=observer]{--seam:65%}.world-collision[data-focus=mmo]{--seam:35%}
  .world-collision[data-focus=observer] .observer-field{clip-path:polygon(0 0,100% 0,100% 61%,0 69%)}.world-collision[data-focus=observer] .mmo-field{clip-path:polygon(0 69%,100% 61%,100% 100%,0 100%)}
  .world-collision[data-focus=mmo] .observer-field{clip-path:polygon(0 0,100% 0,100% 31%,0 39%)}.world-collision[data-focus=mmo] .mmo-field{clip-path:polygon(0 39%,100% 31%,100% 100%,0 100%)}
  .world-collision[data-focus] .seam{top:var(--seam);left:50%}
  .world-collision[data-commit=observer] .observer-field{clip-path:polygon(0 0,100% 0,100% 110%,0 110%)}.world-collision[data-commit=observer] .mmo-field{clip-path:polygon(0 110%,100% 110%,100% 100%,0 100%)}
  .world-collision[data-commit=mmo] .observer-field{clip-path:polygon(0 0,100% 0,100% -10%,0 -10%)}.world-collision[data-commit=mmo] .mmo-field{clip-path:polygon(0 -10%,100% -10%,100% 100%,0 100%)}
  .world-collision[data-commit=observer] .seam{top:106%;left:50%}.world-collision[data-commit=mmo] .seam{top:-6%;left:50%}
}
@media(max-height:650px) and (min-width:761px){.project-icon{margin-bottom:12px}.project-copy strong{font-size:clamp(42px,4.3vw,66px)}.project-arrow{margin-top:12px}}
@media(prefers-reduced-motion:reduce){.mmo-field:before,.spell-stroke,.rune{animation:none}.observer-field,.mmo-field,.seam,.project{transition-duration:.15s}}
