:root {
  --blue: #173cf4;
  --blue-bright: #3156ff;
  --blue-deep: #071a78;
  --ink: #0c1022;
  --cream: #f4f1e9;
  --paper: #fffef9;
  --line: rgba(12, 16, 34, .2);
  --muted: #666b7a;
  --green: #15ba78;
  --amber: #e8a52f;
  --bar-height: 38px;
  --dock-height: 78px;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
  color: var(--ink);
  background: var(--blue);
  font-synthesis: none;
}

* { box-sizing: border-box; }
html, body { width: 100%; min-height: 100%; margin: 0; overflow: hidden; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
[hidden] { display: none !important; }
:where(button, a, input, [tabindex]):focus-visible { outline: 3px solid #8ff1c8; outline-offset: 3px; }
.system-bar :where(button, a):focus-visible, .window-controls button:focus-visible { outline-color: #fff; outline-offset: -3px; }
.app-window:focus-visible { outline: 3px solid #8ff1c8; outline-offset: -3px; }

.boot-screen { position: fixed; inset: 0; z-index: 9999; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; background: #070b19; color: white; transition: opacity .35s ease, visibility .35s ease; }
.boot-screen.is-done { opacity: 0; visibility: hidden; pointer-events: none; }
.boot-lockup { display: flex; flex-direction: column; align-items: center; gap: 9px; }.boot-lockup > div { display: grid; gap: 4px; }.boot-lockup small { color: rgba(255,255,255,.52); font: 7px ui-monospace,Consolas,monospace; letter-spacing: .16em; }.brand-logo { display: block; object-fit: contain; }.boot-logo { width: 188px; height: auto; }
.boot-mark { width: 55px; height: 39px; color: white; }.boot-mark i { width: 16px; height: 33px; }.boot-mark i:first-child { left: 6px; }.boot-mark i:nth-child(2) { left: 28px; }.boot-mark b { width: 16px; height: 16px; right: 0; bottom: 3px; }
.boot-progress { width: min(310px,68vw); height: 5px; overflow: hidden; background: rgba(255,255,255,.14); border-radius: 9px; }.boot-progress i { display: block; width: 0; height: 100%; background: linear-gradient(90deg,var(--blue-bright),#64f0ba); box-shadow: 0 0 14px rgba(100,240,186,.7); transition: width .16s linear; }
.boot-message { color: rgba(255,255,255,.57); font: 9px ui-monospace,Consolas,monospace; letter-spacing: .1em; }.boot-screen button { position: absolute; right: 18px; bottom: 16px; padding: 7px 9px; border: 1px solid rgba(255,255,255,.25); border-radius: 4px; background: transparent; color: rgba(255,255,255,.55); font: 8px ui-monospace; cursor: pointer; }.boot-screen button:hover { color: white; border-color: white; }

.skip-link { position: fixed; top: -60px; left: 12px; z-index: 999; padding: 10px 14px; background: white; border: 2px solid var(--ink); }
.skip-link:focus { top: 8px; }

.system-bar {
  position: fixed; inset: 0 0 auto; height: var(--bar-height); z-index: 200;
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: 0 13px; color: #fff; background: rgba(7, 10, 24, .94);
  border-bottom: 1px solid rgba(255,255,255,.18); backdrop-filter: blur(18px);
  font-size: 12px; letter-spacing: .01em;
}
.system-left, .system-right { display: flex; align-items: center; height: 100%; gap: 4px; }
.system-right { gap: 11px; }
.system-bar button { height: 100%; border: 0; padding: 0 10px; background: transparent; color: #fff; cursor: pointer; }
.system-bar button:hover, .system-bar button[aria-expanded="true"] { background: rgba(255,255,255,.13); }
.brand-button { height: 100% !important; margin: 0 2px; padding: 0 7px !important; display: flex; align-items: center; border-radius: 0; background: transparent !important; }.system-bar .brand-button:hover, .system-bar .brand-button[aria-expanded="true"] { background: rgba(255,255,255,.12) !important; }.bar-brand-logo { width: 104px; height: auto; }
.brand-mark { position: relative; display: inline-block; width: 25px; height: 18px; flex: 0 0 auto; }
.brand-mark i { position: absolute; top: 2px; width: 7px; height: 14px; background: currentColor; transform: skew(-31deg); border-radius: 1px; }
.brand-mark i:first-child { left: 3px; }.brand-mark i:nth-child(2) { left: 12px; }
.brand-mark b { position: absolute; right: 0; bottom: 2px; width: 7px; height: 7px; background: var(--blue-bright); clip-path: polygon(50% 0,100% 100%,0 100%); }
.brand-mark.large { width: 60px; height: 42px; color: var(--ink); }
.brand-mark.large i { width: 17px; height: 34px; top: 2px; }.brand-mark.large i:first-child { left: 7px; }.brand-mark.large i:nth-child(2) { left: 29px; }.brand-mark.large b { width: 17px; height: 17px; bottom: 4px; }
.system-status { display: flex; align-items: center; gap: 7px; color: rgba(255,255,255,.68); }
.system-status i, .contact-signal i { width: 7px; height: 7px; border-radius: 50%; background: #24e99a; box-shadow: 0 0 0 4px rgba(36,233,154,.13); }
.mobile-contact-cta, .mobile-home-icon, .doom-mobile-note { display: none; }
.language-toggle { font-weight: 800; font-size: 15px; }
.command-trigger { display: flex; align-items: center; gap: 7px; border-left: 1px solid rgba(255,255,255,.15) !important; }
kbd { padding: 2px 5px; border: 1px solid currentColor; border-radius: 4px; font: 9px/1.2 ui-monospace, Consolas, monospace; opacity: .6; }
.system-bar time { min-width: 40px; text-align: center; font: 11px ui-monospace, Consolas, monospace; }

.system-menu { position: fixed; z-index: 240; top: calc(var(--bar-height) + 5px); min-width: 220px; padding: 6px; color: var(--ink); background: rgba(255,254,249,.96); border: 1px solid rgba(12,16,34,.38); border-radius: 9px; box-shadow: 0 14px 35px rgba(5,9,38,.3); backdrop-filter: blur(18px); }
.system-menu button, .system-menu a { width: 100%; min-height: 33px; padding: 7px 9px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border: 0; border-radius: 5px; background: transparent; cursor: pointer; font-size: 12px; text-align: start; }
.system-menu button:hover, .system-menu a:hover { background: var(--blue); color: white; }
.system-menu hr { margin: 5px 4px; border: 0; border-top: 1px solid var(--line); }
.menu-note { display: block; padding: 7px 9px; color: var(--muted); font-size: 10px; }

.desktop { position: fixed; inset: var(--bar-height) 0 0; min-height: 0; overflow: hidden; background: linear-gradient(145deg, #244aff 0%, #1335df 45%, #071973 100%); }
.desktop::before { content: ""; position: absolute; inset: 0; opacity: .16; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.23'/%3E%3C/svg%3E"); mix-blend-mode: soft-light; }
.desktop-atmosphere, .grid-lines { position: absolute; inset: 0; pointer-events: none; }
.grid-lines { opacity: .15; background-image: linear-gradient(rgba(255,255,255,.24) 1px, transparent 1px), linear-gradient(90deg,rgba(255,255,255,.24) 1px, transparent 1px); background-size: 48px 48px; mask-image: linear-gradient(to bottom right, black, transparent 75%); }
.orb { position: absolute; display: block; border-radius: 50%; filter: blur(1px); }
.orb-one { width: 42vw; height: 42vw; right: -11vw; top: -20vw; background: radial-gradient(circle at 40% 42%, rgba(103,220,255,.43), transparent 67%); }
.orb-two { width: 34vw; height: 34vw; left: -13vw; bottom: -19vw; background: radial-gradient(circle, rgba(7,12,61,.58), transparent 68%); }
.orb-three { width: 14vw; height: 14vw; right: 20vw; bottom: 9vh; border: 1px solid rgba(255,255,255,.18); box-shadow: inset 0 0 50px rgba(255,255,255,.07); }

.desktop-intro { position: absolute; left: 22px; bottom: calc(var(--dock-height) + 25px); width: 230px; display: grid; gap: 7px; color: white; text-shadow: 0 2px 12px rgba(0,0,0,.24); }
.desktop-intro span { font: 9px ui-monospace, Consolas, monospace; letter-spacing: .16em; opacity: .62; }
.desktop-intro strong { font-size: 20px; letter-spacing: -.025em; }.desktop-intro small { font-size: 10px; opacity: .7; }
.desktop-icons { position: absolute; top: 20px; right: 18px; z-index: 4; display: grid; grid-template-columns: repeat(2, 98px); gap: 12px 8px; }
.desktop-icon { padding: 8px 5px; border: 1px solid transparent; border-radius: 9px; color: white; background: transparent; cursor: grab; touch-action: none; user-select: none; text-shadow: 0 2px 9px rgba(0,0,0,.32); will-change: transform; }
.desktop-icon:hover, .desktop-icon:focus-visible { border-color: rgba(255,255,255,.35); background: rgba(255,255,255,.12); }
.desktop-icon.is-dragging { z-index: 20; cursor: grabbing; border-color: rgba(255,255,255,.68); background: rgba(255,255,255,.2); box-shadow: 0 15px 35px rgba(2,7,48,.25); }
.desktop-icon > strong, .desktop-icon > small { display: block; }.desktop-icon > strong { margin-top: 6px; font-size: 11px; }.desktop-icon > small { margin-top: 2px; font-size: 8px; opacity: .65; }
.icon-art { position: relative; width: 54px; height: 54px; margin: auto; display: grid; place-items: center; color: var(--ink); background: var(--cream); border: 1px solid rgba(12,16,34,.4); border-radius: 12px; box-shadow: inset 0 0 0 2px rgba(255,255,255,.4), 0 7px 18px rgba(4,9,43,.27); text-shadow: none; }
.labs-art { background: #11142a; color: white; }.labs-art::before { content: ""; position: absolute; inset: 8px; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; }.labs-art i { width: 17px; height: 17px; border: 2px solid #53f3ac; border-radius: 50%; box-shadow: 0 0 16px #24e99a; }.labs-art b { position: absolute; right: 5px; top: 5px; padding: 2px 3px; font: 8px ui-monospace; background: var(--blue); border-radius: 3px; }
.studio-art { display: flex; align-items: flex-end; justify-content: center; gap: 4px; }.studio-art i { display: block; width: 7px; height: 30px; border-radius: 1px; background: var(--blue); transform: skew(-18deg); }.studio-art i:nth-child(2) { height: 22px; background: #ffbb38; }.studio-art i:nth-child(3) { height: 15px; background: #25c989; }
.principles-art { background: #fff1b9; font: 800 28px Georgia,serif; }.contact-art { background: #e8edff; }
.games-art { overflow: hidden; background: #15182c; color: white; }.games-art i { position: absolute; inset: 12px 8px 8px; border: 2px solid #84f1c2; border-radius: 9px 9px 14px 14px; transform: perspective(40px) rotateX(-8deg); box-shadow: 0 0 13px rgba(80,240,170,.27); }.games-art b { position: absolute; left: 16px; top: 21px; z-index: 2; color: #84f1c2; font: 700 15px/1 ui-monospace; }.games-art em { position: absolute; z-index: 2; right: 17px; top: 25px; width: 5px; height: 5px; border-radius: 50%; background: #ffbd38; }.games-art em:last-child { right: 11px; top: 20px; background: #ff5f57; }
.icon-art svg { width: 46px; height: 46px; overflow: visible; fill: none; stroke: var(--ink); stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; }.icon-art svg .icon-fill { fill: rgba(255,255,255,.72); }.work-art { overflow: hidden; background: linear-gradient(145deg,#f6f8ff,#cfd9ff); }.work-art svg { width: 45px; }.work-art .icon-accent { fill: var(--blue); stroke: var(--ink); }.work-art b { position: absolute; z-index: 3; right: 4px; bottom: 4px; padding: 2px 4px; border-radius: 3px; background: var(--blue); color: white; font: 700 7px ui-monospace; box-shadow: 0 0 0 1px rgba(255,255,255,.8); }
.contact-art { background: linear-gradient(145deg,#f8f9ff,#d6defd); }.contact-art svg { width: 45px; }.contact-art .dot-blue { fill: var(--blue); stroke: var(--ink); }.contact-art .dot-amber { fill: #ffbd38; stroke: var(--ink); }.contact-art .dot-green { fill: #53e5aa; stroke: var(--ink); }
.recycle-art { background: linear-gradient(145deg,#f4fff9,#c9f1df); }.recycle-art svg { width: 45px; }.recycle-art .recycle-arrow { stroke: #07865a; stroke-width: 3.2; }
.home-art { background: #e8edff; }.home-art i { position: relative; width: 31px; height: 31px; background: var(--blue); clip-path: polygon(50% 0,100% 42%,88% 42%,88% 100%,60% 100%,60% 68%,40% 68%,40% 100%,12% 100%,12% 42%,0 42%); }
.exe-art { overflow: hidden; align-content: center; background: #e7e2d5; border-radius: 5px 5px 10px 5px; font-family: ui-monospace,Consolas,monospace; }.exe-art::before { content: ""; position: absolute; right: -1px; top: -1px; width: 17px; height: 17px; background: linear-gradient(225deg,rgba(255,255,255,.96) 48%,rgba(12,16,34,.28) 50%,transparent 53%); }.exe-art b { position: relative; z-index: 1; font-size: 10px; letter-spacing: -.06em; }.exe-art i { position: absolute; right: 5px; bottom: 5px; padding: 2px 3px; border-radius: 2px; background: var(--ink); color: white; font: 700 6px/1 ui-monospace; }.doom-art { background: #8e1f16; color: #ffd75a; border-color: #1d0805; box-shadow: inset 0 0 0 2px rgba(255,214,87,.18),0 7px 18px rgba(4,9,43,.27); }.doom-art i { background: #e8b72d; color: #281107; }

.app-window { position: absolute; z-index: 10; left: var(--x); top: var(--y); width: var(--w); height: var(--h); min-width: 390px; min-height: 300px; display: none; overflow: hidden; background: var(--paper); border: 1px solid rgba(7,10,24,.84); border-radius: 10px; box-shadow: 0 24px 70px rgba(2,7,48,.38), 0 3px 0 rgba(2,7,48,.25); resize: both; }
.app-window.is-open { display: block; }.app-window.is-active { box-shadow: 0 30px 90px rgba(2,7,48,.5), 0 3px 0 rgba(2,7,48,.3); }
.app-window.is-maximized { inset: 9px 12px calc(var(--dock-height) + 11px) 12px !important; width: auto !important; height: auto !important; resize: none; }
.app-window.is-minimized { display: none; }
.window-bar { height: 34px; display: grid; grid-template-columns: 116px 1fr 116px; align-items: center; color: var(--ink); background: #dedbd3; border-bottom: 1px solid rgba(12,16,34,.35); cursor: grab; user-select: none; }
.window-bar:active { cursor: grabbing; }.window-bar > strong { text-align: center; font-size: 10px; letter-spacing: .025em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.window-meta { padding-inline-end: 10px; text-align: end; color: var(--muted); font: 8px ui-monospace,Consolas,monospace; }
.window-controls { height: 100%; display: flex; align-items: center; gap: 7px; padding-inline-start: 10px; }
.window-controls button { position: relative; width: 13px; height: 13px; padding: 0; border: 1px solid rgba(12,16,34,.55); border-radius: 50%; background: #ff645d; cursor: pointer; }
.window-controls button:nth-child(2) { background: #ffc344; }.window-controls button:nth-child(3) { background: #36c666; }
.window-controls button:hover i::before { content: ""; position: absolute; left: 3px; top: 5px; width: 5px; height: 1px; background: rgba(12,16,34,.72); }
.window-content { height: calc(100% - 34px); overflow: auto; overscroll-behavior: contain; }
.home-content { display: flex; flex-direction: column; overflow: hidden; }
.home-hero { min-height: 0; flex: 1; display: grid; grid-template-columns: 1.1fr .9fr; }
.home-copy { padding: clamp(27px,3.6vw,49px) clamp(25px,3.4vw,47px) 25px; display: flex; flex-direction: column; justify-content: center; }
.eyebrow { display: flex; align-items: center; gap: 9px; font: 9px ui-monospace,Consolas,monospace; letter-spacing: .14em; }.eyebrow i { width: 20px; height: 1px; background: var(--blue); }
.home-copy h1 { margin: 17px 0 14px; font-size: clamp(36px,3.7vw,56px); line-height: .94; letter-spacing: -.064em; font-weight: 750; }.home-copy h1 em { color: var(--blue); font-family: Georgia,serif; font-weight: 500; }
.home-copy p { max-width: 510px; margin: 0; color: #484d5d; font-size: clamp(12px,1.1vw,15px); line-height: 1.58; }
.button-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 21px; }
.primary-action, .secondary-action, .text-action { min-height: 40px; padding: 0 14px; border: 1px solid var(--ink); border-radius: 5px; cursor: pointer; font-size: 11px; font-weight: 700; }.primary-action { display: flex; align-items: center; gap: 22px; background: var(--ink); color: white; }.primary-action b { color: #78f2bf; }.primary-action:hover { background: var(--blue); }.secondary-action { background: transparent; }.secondary-action:hover { background: #ece9df; }.text-action { padding-inline: 7px; border-color: transparent; background: transparent; text-decoration: underline; text-underline-offset: 4px; }.text-action:hover { color: var(--blue); }
.home-visual { position: relative; min-height: 320px; overflow: hidden; background: #deded8; border-left: 1px solid var(--line); background-image: radial-gradient(rgba(12,16,34,.2) 1px, transparent 1px); background-size: 15px 15px; }
.home-visual::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at center, transparent 20%, rgba(222,222,216,.86) 78%); }
.visual-core { position: absolute; z-index: 3; left: 50%; top: 50%; width: 155px; height: 155px; transform: translate(-50%,-50%); display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--paper); border: 1px solid var(--ink); border-radius: 50%; box-shadow: 0 14px 40px rgba(12,16,34,.18); }
.core-brand-logo { width: 118px; height: auto; }.visual-core small { margin-top: 9px; font: 6px ui-monospace; letter-spacing: .07em; color: var(--muted); }
.orbit { position: absolute; left: 50%; top: 50%; border: 1px solid rgba(12,16,34,.25); border-radius: 50%; transform: translate(-50%,-50%); }.orbit-a { width: 255px; height: 255px; }.orbit-b { width: 360px; height: 360px; border-style: dashed; animation: spin 42s linear infinite; }
@keyframes spin { to { transform: translate(-50%,-50%) rotate(1turn); } }
.satellite { position: absolute; z-index: 4; min-width: 48px; height: 26px; border: 1px solid var(--ink); border-radius: 99px; background: var(--paper); box-shadow: 0 5px 15px rgba(12,16,34,.12); font: 8px ui-monospace; cursor: pointer; }.satellite:hover { background: var(--blue); color: white; }.satellite-one { left: 13%; top: 25%; }.satellite-two { right: 8%; top: 42%; }.satellite-three { left: 16%; bottom: 19%; }
.home-strip { min-height: 65px; display: grid; grid-template-columns: repeat(3,1fr); background: var(--ink); color: white; }.home-strip > span, .home-strip > button { min-width: 0; padding: 13px 18px; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; border: 0; border-right: 1px solid rgba(255,255,255,.16); background: transparent; color: white; text-align: start; }.home-strip > button { cursor: pointer; }.home-strip > button:hover { background: var(--blue); }.home-strip small { color: rgba(255,255,255,.48); font: 7px ui-monospace; letter-spacing: .13em; }.home-strip b { max-width: 100%; overflow: hidden; text-overflow: ellipsis; font: 10px ui-monospace; letter-spacing: .05em; white-space: nowrap; }

.window-page-head { padding: 30px 34px 25px; display: grid; grid-template-columns: 1.1fr .9fr; gap: 34px; align-items: end; border-bottom: 1px solid var(--line); }.window-page-head span { color: var(--blue); font: 8px ui-monospace; letter-spacing: .16em; }.window-page-head h2 { margin: 7px 0 0; font-size: clamp(27px,3vw,42px); line-height: 1; letter-spacing: -.045em; }.window-page-head p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.project-list { display: grid; }.project-row { display: grid; grid-template-columns: 38px minmax(180px,1fr) auto 24px; gap: 14px; align-items: center; padding: 16px 23px; border-bottom: 1px solid var(--line); transition: background .18s,color .18s; }.project-row:hover { background: var(--ink); color: white; }.project-index { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; font: 8px ui-monospace; opacity: .6; }.project-row small { font: 7px ui-monospace; letter-spacing: .1em; opacity: .55; }.project-row h3 { margin: 4px 0 2px; font-size: 18px; letter-spacing: -.025em; }.project-row h3 em { margin-inline-start: 5px; color: var(--blue); font-style: normal; }.project-row:hover h3 em { color: #74f0bd; }.project-row p { margin: 0; font-size: 9px; opacity: .63; }.project-row > i { font-style: normal; font-size: 17px; }.project-status { padding: 6px 8px; border: 1px solid #7ccbad; border-radius: 99px; color: #14794f; font: 7px ui-monospace; white-space: nowrap; }.project-row:hover .project-status { color: #74f0bd; }.project-status.amber { border-color: #e7bd62; color: #95650f; }
.window-foot { min-height: 49px; padding: 10px 23px; display: flex; align-items: center; justify-content: space-between; gap: 18px; background: #ece9e1; font-size: 8px; color: var(--muted); }.window-foot a { color: var(--ink); font-weight: 800; }

.work-content { display: flex; flex-direction: column; background: #f5f2e9; }.work-head { background: var(--paper); }.work-head h2 em { color: var(--blue); font-family: Georgia,serif; font-weight: 500; }.work-section { padding: 24px 28px; display: grid; grid-template-columns: 190px 1fr; gap: 24px; border-bottom: 1px solid var(--line); }.founder-work-section { background: #fff6d9; }.work-section-label { display: flex; flex-direction: column; gap: 6px; }.work-section-label span { color: var(--blue); font: 800 8px ui-monospace,Consolas,monospace; letter-spacing: .12em; }.work-section-label small { color: var(--muted); font: 7px ui-monospace,Consolas,monospace; letter-spacing: .08em; }.name-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }.name-grid > span { min-height: 54px; padding: 10px; display: flex; align-items: center; border: 1px solid var(--line); border-radius: 5px; background: var(--paper); font-size: 11px; font-weight: 750; box-shadow: 3px 3px 0 rgba(12,16,34,.06); }.founder-name-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.founder-name-grid > span { background: var(--ink); color: white; }.work-foot { margin-top: auto; }.work-foot > span { max-width: 570px; line-height: 1.45; }.work-foot button { min-height: 32px; padding: 0 10px; border: 1px solid var(--ink); border-radius: 4px; background: transparent; cursor: pointer; font-size: 8px; font-weight: 800; white-space: nowrap; }.work-foot button:hover { background: var(--ink); color: white; }

.services-content { background: #f5f2e9; }
.services-head { padding: 27px 32px 23px; display: grid; grid-template-columns: 1.18fr .82fr; gap: 36px; align-items: end; border-bottom: 1px solid var(--line); background: var(--paper); }
.services-head > div > span { color: var(--blue); font: 8px ui-monospace,Consolas,monospace; letter-spacing: .16em; }
.services-head h2 { max-width: 560px; margin: 7px 0 0; font-size: clamp(29px,3.1vw,43px); line-height: .98; letter-spacing: -.05em; }
.services-head p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.service-tabs { padding: 0 32px; display: grid; grid-template-columns: repeat(3,1fr); background: var(--paper); border-bottom: 1px solid var(--line); }
.service-tabs button { min-height: 49px; padding: 0 12px; display: flex; align-items: center; gap: 9px; border: 0; border-right: 1px solid var(--line); background: transparent; color: var(--muted); cursor: pointer; text-align: start; }
.service-tabs button:first-child { border-left: 1px solid var(--line); }.service-tabs button span { font: 7px ui-monospace,Consolas,monospace; opacity: .55; }.service-tabs button b { font-size: 11px; }
.service-tabs button:hover { background: #eef1ff; color: var(--ink); }.service-tabs button.is-selected { background: var(--blue); color: white; }.service-tabs button.is-selected span { color: #8ff1c8; opacity: 1; }
.service-panel { background: #f5f2e9; }.service-feature { min-height: 190px; padding: 25px 32px; display: grid; grid-template-columns: minmax(0,1fr) 210px; gap: 30px; align-items: center; border-bottom: 1px solid var(--line); }
.service-feature > div:first-child > span { color: var(--blue); font: 8px ui-monospace,Consolas,monospace; letter-spacing: .14em; }.service-feature h3 { max-width: 590px; margin: 8px 0 9px; font-size: clamp(23px,2.4vw,34px); line-height: 1; letter-spacing: -.045em; }.service-feature p { max-width: 600px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.6; }
.service-feature-commerce { background: #edf0ff; }.service-feature-marketing { background: #e5fbf1; }.service-feature-creative { background: #fff3d4; }
.service-illustration { position: relative; width: 190px; height: 126px; justify-self: end; overflow: hidden; border: 1px solid var(--ink); border-radius: 7px; background: var(--paper); box-shadow: 7px 7px 0 rgba(12,16,34,.12); }
.commerce-illustration::before { content: ""; position: absolute; left: 23px; right: 23px; top: 24px; height: 25px; border: 1px solid var(--ink); background: repeating-linear-gradient(90deg,var(--blue) 0 18px,#fff 18px 36px); transform: perspective(40px) rotateX(-13deg); }.commerce-illustration::after { content: ""; position: absolute; left: 30px; right: 30px; bottom: 19px; height: 55px; border: 1px solid var(--ink); background: #eef1ff; }.commerce-illustration i:first-child { position: absolute; z-index: 2; left: 45px; bottom: 19px; width: 34px; height: 39px; border: 1px solid var(--ink); background: #77efbd; }.commerce-illustration i:nth-child(2) { position: absolute; z-index: 2; right: 44px; bottom: 48px; width: 33px; height: 20px; border: 1px solid var(--ink); background: #ffcb4d; }.commerce-illustration b { position: absolute; z-index: 3; left: 50%; top: 54px; transform: translateX(-50%); font: 800 8px ui-monospace; }.commerce-illustration span { position: absolute; z-index: 4; right: 9px; top: 7px; color: var(--blue); font-size: 18px; }
.marketing-illustration { display: flex; align-items: flex-end; justify-content: center; gap: 11px; padding: 30px 22px 21px; background-image: linear-gradient(rgba(12,16,34,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(12,16,34,.09) 1px,transparent 1px); background-size: 18px 18px; }.marketing-illustration i { width: 27px; height: 34px; border: 1px solid var(--ink); background: #77efbd; }.marketing-illustration i:nth-child(2) { height: 58px; background: #ffcb4d; }.marketing-illustration i:nth-child(3) { height: 81px; background: var(--blue); }.marketing-illustration b { position: absolute; right: 10px; top: 9px; padding: 5px 7px; background: var(--ink); color: white; border-radius: 3px; font: 800 12px ui-monospace; }
.creative-illustration { background: var(--ink); color: white; }.creative-illustration::before,.creative-illustration::after { content: ""; position: absolute; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; }.creative-illustration::before { width: 115px; height: 115px; left: -24px; top: 28px; }.creative-illustration::after { width: 95px; height: 95px; right: -18px; top: -31px; }.creative-illustration i { position: absolute; left: 25px; top: 18px; color: #ffcb4d; font-style: normal; font-size: 28px; }.creative-illustration b { position: absolute; z-index: 2; left: 50%; top: 50%; transform: translate(-50%,-50%); color: #77efbd; font: 900 43px/1 ui-monospace; }.creative-illustration span { position: absolute; right: 25px; bottom: 18px; width: 29px; height: 29px; background: var(--blue); clip-path: polygon(50% 0,100% 100%,0 100%); }
.service-groups { display: grid; grid-template-columns: repeat(3,1fr); border-bottom: 1px solid var(--line); background: var(--paper); }.service-groups section { min-width: 0; padding: 21px 24px 23px; border-right: 1px solid var(--line); }.service-groups section:last-child { border: 0; }.service-groups h4 { margin: 0 0 13px; color: var(--blue); font: 8px ui-monospace,Consolas,monospace; letter-spacing: .12em; }.service-groups ul { margin: 0; padding: 0; list-style: none; }.service-groups li { position: relative; min-height: 29px; padding: 7px 0 7px 15px; border-top: 1px solid rgba(12,16,34,.11); color: #414657; font-size: 10px; line-height: 1.35; }.service-groups li::before { content: "+"; position: absolute; left: 0; top: 7px; color: var(--green); font: 800 10px ui-monospace; }
.services-callout { min-height: 62px; padding: 12px 24px; display: flex; align-items: center; justify-content: space-between; gap: 22px; background: var(--ink); color: white; }.services-callout > span { display: grid; gap: 3px; }.services-callout b { font-size: 11px; }.services-callout small { color: rgba(255,255,255,.55); font-size: 9px; }.services-callout button { min-height: 36px; padding: 0 12px; border: 1px solid rgba(255,255,255,.65); border-radius: 4px; background: transparent; color: white; cursor: pointer; font-size: 9px; white-space: nowrap; }.services-callout button:hover { background: white; color: var(--ink); }

.principles-content { padding: 34px; background: #fffdf4; }.text-file-label { color: var(--blue); font: 8px ui-monospace; letter-spacing: .14em; }.principles-content h2 { margin: 9px 0 24px; font-size: 34px; letter-spacing: -.05em; }.principles-content ol { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }.principles-content li { padding: 15px 0; display: grid; grid-template-columns: 38px 1fr; border-bottom: 1px solid var(--line); }.principles-content li > span { color: var(--blue); font: 9px ui-monospace; }.principles-content strong { font-size: 14px; }.principles-content p { margin: 4px 0 0; color: var(--muted); font-size: 10px; line-height: 1.45; }
.about-content { background: #f5f2e9; }
.about-hero { min-height: 230px; padding: 32px 34px 28px; display: grid; grid-template-columns: minmax(0,1fr) 210px; gap: 34px; align-items: center; border-bottom: 1px solid var(--line); background: var(--paper); }
.about-copy > span, .proof-head > span, .about-operating > div > span { color: var(--blue); font: 8px ui-monospace,Consolas,monospace; letter-spacing: .14em; }.about-copy h2 { max-width: 520px; margin: 9px 0 12px; font-size: clamp(31px,3.2vw,43px); line-height: .96; letter-spacing: -.05em; }.about-copy p { max-width: 560px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.65; }
.founder-card { min-height: 154px; padding: 20px 16px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--ink); border-radius: 7px; background: var(--blue); color: white; box-shadow: 7px 7px 0 rgba(12,16,34,.14); }.founder-card > span { width: 55px; height: 55px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.66); border-radius: 50%; color: #8ff1c8; font: 800 20px ui-monospace; }.founder-card > div { display: grid; gap: 4px; }.founder-card b { font: 800 11px ui-monospace; }.founder-card small { color: rgba(255,255,255,.62); font: 6px/1.45 ui-monospace; letter-spacing: .08em; }
.proof-head { min-height: 47px; padding: 10px 25px; display: flex; align-items: center; justify-content: space-between; gap: 20px; background: #e9e6dd; border-bottom: 1px solid var(--line); }.proof-head small { color: var(--muted); font-size: 8px; }
.proof-grid { display: grid; grid-template-columns: repeat(4,1fr); border-bottom: 1px solid var(--line); background: var(--paper); }.proof-grid article { min-width: 0; min-height: 145px; padding: 23px 18px; display: flex; flex-direction: column; border-right: 1px solid var(--line); }.proof-grid article:last-child { border: 0; }.proof-grid strong { color: var(--blue); font-size: clamp(29px,3.2vw,43px); line-height: 1; letter-spacing: -.055em; }.proof-grid span { margin-top: 10px; font: 800 8px/1.35 ui-monospace; letter-spacing: .07em; }.proof-grid small { margin-top: auto; padding-top: 15px; color: var(--muted); font-size: 8px; line-height: 1.4; }
.about-operating { padding: 26px 32px; display: grid; grid-template-columns: .85fr 1.15fr; gap: 40px; border-bottom: 1px solid var(--line); background: #fff6d9; }.about-operating h3 { margin: 8px 0 0; font-size: 24px; line-height: 1; letter-spacing: -.04em; }.about-operating ul { margin: 0; padding: 0; list-style: none; }.about-operating li { position: relative; padding: 9px 0 9px 18px; border-top: 1px solid rgba(12,16,34,.14); color: #454a5b; font-size: 9px; line-height: 1.4; }.about-operating li::before { content: "+"; position: absolute; left: 0; color: var(--green); font-weight: 800; }
.about-foot { min-height: 57px; padding: 10px 24px; display: flex; align-items: center; justify-content: space-between; gap: 24px; background: var(--ink); color: white; }.about-foot small { max-width: 540px; color: rgba(255,255,255,.47); font-size: 7px; line-height: 1.45; }.about-foot button { min-height: 35px; padding: 0 11px; border: 1px solid rgba(255,255,255,.62); border-radius: 4px; background: transparent; color: white; cursor: pointer; font-size: 8px; white-space: nowrap; }.about-foot button:hover { background: white; color: var(--ink); }
.contact-content { padding: clamp(30px,4.5vw,52px); display: flex; flex-direction: column; justify-content: center; background: var(--ink); color: white; }.contact-signal { display: flex; align-items: center; gap: 9px; color: rgba(255,255,255,.55); font: 8px ui-monospace; letter-spacing: .13em; }.contact-content h2 { max-width: 480px; margin: 17px 0 12px; font-size: clamp(29px,3.7vw,44px); line-height: .98; letter-spacing: -.055em; }.contact-content > p { margin: 0; max-width: 460px; color: rgba(255,255,255,.62); font-size: 11px; line-height: 1.6; }.email-link { margin-top: 20px; padding: 11px 13px; display: flex; justify-content: space-between; border: 1px solid rgba(255,255,255,.4); border-radius: 5px; color: #77efbd; font: 12px ui-monospace; }.email-link:hover { background: white; color: var(--ink); }.contact-actions { margin-top: 8px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }.contact-actions a { min-height: 38px; padding: 8px 10px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 1px solid rgba(255,255,255,.22); border-radius: 5px; color: rgba(255,255,255,.76); font-size: 9px; }.contact-actions a:hover { border-color: white; color: white; background: rgba(255,255,255,.08); }.contact-meta { margin-top: 20px; display: flex; gap: 45px; }.contact-meta span { display: grid; gap: 4px; }.contact-meta small { color: rgba(255,255,255,.4); font: 7px ui-monospace; letter-spacing: .12em; }.contact-meta b { font: 9px ui-monospace; }.contact-legal { margin-top: 17px; padding-top: 12px; display: flex; gap: 13px; border-top: 1px solid rgba(255,255,255,.13); color: rgba(255,255,255,.38); font: 7px ui-monospace; letter-spacing: .06em; }.contact-legal a:hover { color: white; text-decoration: underline; }

.folder-content { background: #f5f2e9; }.folder-head { padding: 25px 28px 20px; border-bottom: 1px solid var(--line); background: var(--paper); }.folder-path { color: var(--blue); font: 8px ui-monospace,Consolas,monospace; letter-spacing: .13em; }.folder-head p { max-width: 470px; margin: 9px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }.folder-grid { padding: 25px 28px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }.folder-file, .folder-placeholder { min-height: 170px; padding: 18px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); text-align: center; }.folder-file { cursor: pointer; }.folder-file:hover { border-color: var(--ink); background: #fff6d9; transform: translateY(-2px); }.folder-file .icon-art { width: 66px; height: 66px; margin: 0 0 5px; }.folder-file strong, .folder-placeholder strong { font: 800 11px ui-monospace,Consolas,monospace; }.folder-file small, .folder-placeholder small { color: var(--muted); font: 7px ui-monospace,Consolas,monospace; }.folder-placeholder { border-style: dashed; color: var(--muted); }.folder-placeholder > span { width: 50px; height: 50px; display: grid; place-items: center; border: 1px dashed currentColor; border-radius: 50%; font: 300 30px/1 sans-serif; }

.recycle-content { padding: 26px; display: flex; flex-direction: column; background: #f5f2e9; }.recycle-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }.recycle-head > div > span { color: var(--blue); font: 8px ui-monospace,Consolas,monospace; letter-spacing: .13em; }.recycle-head h2 { margin: 7px 0 0; font-size: 28px; letter-spacing: -.045em; }.recycle-count { padding: 5px 7px; border: 1px solid var(--line); border-radius: 99px; color: var(--muted); font: 7px ui-monospace,Consolas,monospace; white-space: nowrap; }.trash-list { margin-top: 12px; display: grid; }.trash-list > span { min-height: 44px; display: grid; grid-template-columns: 35px 1fr auto; align-items: center; gap: 10px; border-bottom: 1px solid var(--line); }.trash-list i { width: 30px; height: 26px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 3px; background: var(--paper); color: var(--blue); font: 700 7px ui-monospace; }.trash-list b { overflow: hidden; font: 9px ui-monospace,Consolas,monospace; text-overflow: ellipsis; white-space: nowrap; }.trash-list small { color: var(--muted); font: 7px ui-monospace,Consolas,monospace; }.recycle-empty { flex: 1; min-height: 240px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }.recycle-empty > span { color: #0c9a67; font-size: 45px; }.recycle-empty strong { margin-top: 8px; font-size: 17px; }.recycle-empty p { margin: 7px 0 0; color: var(--muted); font-size: 10px; }.recycle-action { min-height: 38px; margin-top: auto; border: 1px solid var(--ink); border-radius: 4px; background: var(--ink); color: white; cursor: pointer; font: 800 8px ui-monospace,Consolas,monospace; letter-spacing: .08em; }.recycle-action:hover { background: var(--blue); border-color: var(--blue); }

.arcade-content { display: flex; flex-direction: column; overflow: hidden; background: #0b0e1c; color: white; }
.arcade-head { min-height: 82px; padding: 15px 20px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; border-bottom: 1px solid rgba(255,255,255,.18); background: #12162b; }.arcade-head > div:first-child > span { color: #68edb7; font: 7px ui-monospace,Consolas,monospace; letter-spacing: .16em; }.arcade-head h2 { margin: 4px 0 0; font-size: 25px; letter-spacing: -.045em; }.arcade-tabs { padding: 3px; display: flex; gap: 3px; border: 1px solid rgba(255,255,255,.22); border-radius: 6px; background: #080b16; }.arcade-tabs button { min-height: 29px; padding: 0 10px; border: 0; border-radius: 3px; background: transparent; color: rgba(255,255,255,.55); cursor: pointer; font: 8px ui-monospace,Consolas,monospace; }.arcade-tabs button:hover { color: white; }.arcade-tabs button.is-selected { background: #3156ff; color: white; }
.game-panel { min-height: 0; flex: 1; display: flex; flex-direction: column; padding: 16px 20px 0; overflow: auto; }.game-copy { display: flex; align-items: end; justify-content: space-between; gap: 25px; margin-bottom: 12px; }.game-copy > div { flex: 0 0 auto; }.game-kicker { color: #ffbd38; font: 7px ui-monospace,Consolas,monospace; letter-spacing: .14em; }.game-copy h3 { margin: 2px 0 0; font: 800 24px/1 ui-monospace,Consolas,monospace; letter-spacing: -.05em; }.game-copy p { max-width: 390px; margin: 0; color: rgba(255,255,255,.55); font-size: 9px; line-height: 1.5; text-align: end; }
.game-frame { position: relative; width: min(100%,760px); margin: 0 auto; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid rgba(255,255,255,.4); border-radius: 5px; background: #05070d; box-shadow: 0 14px 40px rgba(0,0,0,.3); outline: none; }.game-frame:focus-visible { box-shadow: 0 0 0 2px #6af1bd,0 14px 40px rgba(0,0,0,.3); }.game-frame canvas { width: 100%; height: 100%; display: block; image-rendering: pixelated; cursor: crosshair; }
.game-start, .game-result { position: absolute; inset: 0; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 20px; text-align: center; background: radial-gradient(circle at 50% 40%,rgba(40,50,86,.75),rgba(4,6,13,.94)); backdrop-filter: blur(3px); }.game-start.is-hidden { display: none; }.game-start strong, .game-result strong { color: white; font: 800 clamp(16px,2vw,25px)/1 ui-monospace,Consolas,monospace; letter-spacing: .06em; }.game-start small, .game-result span { max-width: 420px; color: rgba(255,255,255,.55); font: 8px/1.4 ui-monospace,Consolas,monospace; letter-spacing: .06em; }.game-start button, .game-result button { min-height: 35px; margin-top: 5px; padding: 0 13px; border: 1px solid white; border-radius: 4px; background: white; color: #0b0e1c; cursor: pointer; font: 700 9px ui-monospace,Consolas,monospace; }.game-start button:hover, .game-result button:hover { background: #6af1bd; }.hazard-sign { width: 41px; height: 41px; display: grid; place-items: center; border: 2px solid #ffbd38; color: #ffbd38; clip-path: polygon(50% 0,100% 100%,0 100%); padding-top: 9px; font: 800 16px ui-monospace; }
.game-hud { width: min(100%,760px); min-height: 45px; margin: 0 auto; display: flex; align-items: center; gap: 0; background: #15192c; border: 1px solid rgba(255,255,255,.22); border-top: 0; }.game-hud > span { min-width: 95px; padding: 8px 12px; display: grid; gap: 2px; border-right: 1px solid rgba(255,255,255,.15); }.game-hud small { color: rgba(255,255,255,.42); font: 6px ui-monospace; letter-spacing: .12em; }.game-hud b { color: #6af1bd; font: 12px ui-monospace; }.game-hud .hud-tip { min-width: 0; margin-inline-start: auto; display: block; border: 0; color: rgba(255,255,255,.42); font: 7px ui-monospace; text-align: end; }
.touch-controls { display: none; }.arcade-foot { min-height: 34px; margin-top: 12px; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: rgba(255,255,255,.33); background: #080a14; border-top: 1px solid rgba(255,255,255,.13); font: 7px ui-monospace; }.arcade-foot b { color: rgba(255,255,255,.5); font-weight: 500; }
.standalone-game-content { height: 100%; }.standalone-game-content .game-panel { padding-top: 19px; }.doom-panel .arcade-foot { margin-inline: -20px; margin-top: auto; }
.doom-frame { width: min(100%,760px); aspect-ratio: 4 / 3; border-color: rgba(255,198,64,.62); background: #000; }.doom-game, .doom-game > div, .doom-game .dosbox-container { width: 100% !important; height: 100% !important; }.doom-game canvas { width: 100% !important; height: 100% !important; object-fit: contain; cursor: default; }.doom-start { position: absolute; inset: 0; z-index: 5; width: 100%; padding: 0; overflow: hidden; border: 0; background: #000; color: white; cursor: pointer; }.doom-start img { width: 100%; height: 100%; display: block; object-fit: cover; image-rendering: pixelated; }.doom-start::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 56%,rgba(0,0,0,.86)); }.doom-start > span { position: absolute; z-index: 2; left: 50%; bottom: 22px; width: max-content; max-width: calc(100% - 28px); padding: 9px 13px; display: grid; gap: 4px; transform: translateX(-50%); border: 1px solid rgba(255,220,99,.8); background: rgba(14,5,3,.88); box-shadow: 0 8px 30px rgba(0,0,0,.55); }.doom-start b { color: #ffd65e; font: 800 10px ui-monospace,Consolas,monospace; letter-spacing: .08em; }.doom-start small { color: rgba(255,255,255,.65); font: 7px ui-monospace,Consolas,monospace; }.doom-loading, .doom-error { position: absolute; inset: 0; z-index: 6; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 20px; text-align: center; background: #070707; color: white; }.doom-loading i { width: 31px; height: 31px; border: 3px solid rgba(255,255,255,.18); border-top-color: #f2c241; border-radius: 50%; animation: doom-spin .8s linear infinite; }.doom-loading strong, .doom-error strong { color: #ffd75a; font: 800 13px ui-monospace,Consolas,monospace; letter-spacing: .07em; }.doom-loading small, .doom-error span { max-width: 420px; color: rgba(255,255,255,.55); font: 8px/1.5 ui-monospace,Consolas,monospace; }.doom-error button { padding: 8px 11px; border: 1px solid #ffd75a; background: transparent; color: #ffd75a; font: 800 8px ui-monospace; cursor: pointer; }.doom-controls { width: min(100%,760px); margin: 0 auto; padding: 8px 10px; display: flex; flex-wrap: wrap; justify-content: center; gap: 7px 14px; border: 1px solid rgba(255,255,255,.22); border-top: 0; background: #151515; color: rgba(255,255,255,.58); font: 7px ui-monospace,Consolas,monospace; }.doom-controls span { display: flex; align-items: center; gap: 5px; }.doom-controls kbd { color: #ffd75a; }.doom-foot a { color: #ffd75a; }.dock-exe { width: 25px; height: 29px; display: grid; place-items: center; border-radius: 2px 2px 5px 2px; background: #8e1f16; color: #ffd75a; font: 900 11px ui-monospace; }
@keyframes doom-spin { to { transform: rotate(1turn); } }
.doom-close-dialog { width: min(470px,calc(100vw - 28px)); padding: 0; border: 1px solid var(--ink); border-radius: 10px; background: var(--paper); color: var(--ink); box-shadow: 0 30px 90px rgba(2,7,48,.55); }.doom-close-dialog::backdrop { background: rgba(4,6,15,.68); backdrop-filter: blur(4px); }.doom-close-dialog form { margin: 0; padding: 22px; display: grid; grid-template-columns: 48px 1fr; gap: 15px; }.doom-dialog-icon { width: 44px; height: 51px; display: grid; place-items: center; border-radius: 3px 3px 8px 3px; background: #8e1f16; color: #ffd75a; font: 900 18px ui-monospace; }.doom-close-dialog h2 { margin: 1px 0 7px; font-size: 22px; letter-spacing: -.04em; }.doom-close-dialog p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }.doom-dialog-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 7px; margin-top: 5px; }.doom-dialog-actions button { min-height: 36px; padding: 0 11px; border: 1px solid var(--ink); border-radius: 4px; background: transparent; cursor: pointer; font-size: 9px; font-weight: 700; }.doom-dialog-actions button:hover { background: #e8edff; }.doom-dialog-actions .danger { background: #8e1f16; border-color: #8e1f16; color: white; }.doom-dialog-actions .danger:hover { background: #b62b1f; }

.dock { position: fixed; z-index: 190; left: 50%; bottom: 12px; height: 62px; padding: 7px; display: flex; gap: 5px; transform: translateX(-50%); background: rgba(244,241,233,.84); border: 1px solid rgba(12,16,34,.45); border-radius: 15px; box-shadow: 0 13px 40px rgba(2,7,48,.35); backdrop-filter: blur(18px); }
.dock button { position: relative; width: 48px; height: 48px; display: grid; place-items: center; padding: 0; border: 1px solid rgba(12,16,34,.27); border-radius: 10px; background: var(--paper); color: var(--ink); cursor: pointer; font-size: 20px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.6); transition: transform .15s; }.dock button:hover { transform: translateY(-6px); }.dock button small { position: absolute; bottom: 58px; display: none; padding: 5px 7px; border-radius: 4px; background: var(--ink); color: white; font: 8px ui-monospace; white-space: nowrap; }.dock button:hover small { display: block; }.dock button.is-running::after { content: ""; position: absolute; bottom: -5px; width: 4px; height: 4px; border-radius: 50%; background: var(--ink); }.dock-logo { width: 26px; height: 19px; color: var(--ink); transform: scale(.9); }

.command-dialog { width: min(540px,calc(100vw - 28px)); padding: 0; border: 1px solid var(--ink); border-radius: 12px; background: var(--paper); color: var(--ink); box-shadow: 0 35px 100px rgba(2,7,48,.55); }.command-dialog::backdrop { background: rgba(5,9,32,.42); backdrop-filter: blur(5px); }.command-dialog form { margin: 0; }.command-dialog label { height: 52px; padding: 0 14px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--line); }.command-dialog input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; font-size: 14px; }.command-results { padding: 7px; display: grid; gap: 3px; }.command-results button { min-height: 54px; padding: 7px 9px; display: grid; grid-template-columns: 37px 1fr auto; gap: 10px; align-items: center; border: 0; border-radius: 7px; background: transparent; text-align: start; cursor: pointer; }.command-results button:hover, .command-results button.is-selected { background: var(--blue); color: white; }.command-icon { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 7px; }.command-results button > span:nth-child(2) { display: grid; gap: 2px; }.command-results b { font-size: 11px; }.command-results small { opacity: .6; font-size: 9px; }.command-dialog footer { height: 32px; padding: 0 12px; display: flex; align-items: center; justify-content: space-between; color: var(--muted); background: #ece9e1; border-top: 1px solid var(--line); font-size: 9px; }
.desktop-toast { position: fixed; z-index: 300; right: 16px; bottom: 18px; padding: 10px 13px; border: 1px solid var(--ink); border-radius: 6px; background: var(--paper); color: var(--ink); box-shadow: 0 12px 35px rgba(2,7,48,.3); font-size: 10px; transform: translateY(80px); opacity: 0; transition: .25s; }.desktop-toast.is-visible { transform: none; opacity: 1; }
.noscript-message { position: fixed; z-index: 10000; inset: 0; display: grid; place-items: center; padding: 28px; background: #070b19; color: white; font: 600 16px/1.5 Inter,"Segoe UI",sans-serif; text-align: center; }

[dir="rtl"] .system-bar { direction: rtl; }
[dir="rtl"] .system-left { direction: rtl; flex-direction: row; }
[dir="rtl"] .system-right { direction: ltr; flex-direction: row; }
[dir="rtl"] .doom-close-dialog { direction: rtl; }
[dir="rtl"] .window-bar { direction: ltr; } [dir="rtl"] .window-content { direction: rtl; }
[dir="rtl"] .home-visual { border-left: 0; border-right: 1px solid var(--line); }
[dir="rtl"] .project-row { direction: rtl; } [dir="rtl"] .project-row > i { transform: scaleX(-1); }
[dir="rtl"] .service-tabs button, [dir="rtl"] .service-groups section { border-right: 0; border-left: 1px solid var(--line); }
[dir="rtl"] .service-tabs button:first-child { border-right: 1px solid var(--line); }
[dir="rtl"] .service-groups section:last-child { border-left: 0; }
[dir="rtl"] .service-groups li { padding-left: 0; padding-right: 15px; }
[dir="rtl"] .service-groups li::before { left: auto; right: 0; }
[dir="rtl"] .proof-grid article { border-right: 0; border-left: 1px solid var(--line); } [dir="rtl"] .proof-grid article:last-child { border-left: 0; }
[dir="rtl"] .about-operating li { padding-left: 0; padding-right: 18px; } [dir="rtl"] .about-operating li::before { left: auto; right: 0; }
[dir="rtl"] .home-copy h1, [dir="rtl"] .window-page-head h2, [dir="rtl"] .services-head h2, [dir="rtl"] .service-feature h3, [dir="rtl"] .about-copy h2, [dir="rtl"] .about-operating h3, [dir="rtl"] .principles-content h2, [dir="rtl"] .contact-content h2, [dir="rtl"] .recycle-head h2 { letter-spacing: -.02em; }

@media (max-width: 760px) {
  :root { --bar-height: 84px; --dock-height: 0px; }
  html, body { max-width: 100%; overflow-x: hidden; overflow-y: auto; }
  .desktop-only, .system-status, .command-trigger kbd, .system-bar time { display: none !important; }
  .system-bar { inset: 10px 10px auto; width: auto; height: 64px; padding: 0 9px; border: 1px solid rgba(255,255,255,.32); border-radius: 8px; box-shadow: 0 12px 30px rgba(2,7,48,.28); }.system-left, .system-right { min-width: 0; }.system-right { gap: 3px; }
  .mobile-contact-cta { height: 38px !important; padding: 0 11px !important; display: flex !important; align-items: center; border-radius: 6px !important; background: #ffbd38 !important; color: var(--ink) !important; box-shadow: 0 3px 0 #a96b00; font-size: 10px; font-weight: 850; white-space: nowrap; }
  .language-toggle, .command-trigger { width: 34px; padding: 0 !important; justify-content: center; border: 0 !important; }
  .desktop { position: relative; inset: auto; width: 100vw; max-width: 100%; margin-top: var(--bar-height); min-height: calc(100svh - var(--bar-height)); overflow: hidden; }
  .desktop-intro { position: relative; left: auto; bottom: auto; width: auto; padding: 25px 20px 14px; }.desktop-intro strong { max-width: 310px; font-size: 27px; }.desktop-intro small { font-size: 9px; }
  .desktop-icons { position: relative; top: auto; right: auto; padding: 8px 8px 55px; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px 2px; }
  .mobile-home-icon { display: block; }
  .desktop-icon { min-height: 112px; padding: 8px 3px; transform: none !important; background: transparent; border-color: transparent; cursor: pointer; touch-action: auto; }
  .desktop-icon:hover, .desktop-icon:focus-visible { background: rgba(255,255,255,.1); }.desktop-icon > strong { margin-top: 7px; font-size: 12px; }.desktop-icon > small { max-width: 100px; margin-inline: auto; font-size: 7px; line-height: 1.25; }.icon-art { width: 60px; height: 60px; }
  .app-window { position: fixed; z-index: 120 !important; inset: 92px 10px 12px !important; width: auto !important; height: auto !important; min-width: 0; min-height: 0; border: 1px solid rgba(7,10,24,.84); border-radius: 10px; resize: none; box-shadow: 0 25px 70px rgba(2,7,48,.6); }
  .app-window.is-maximized { inset: 92px 10px 12px !important; }
  .window-bar { position: sticky; top: 0; z-index: 3; height: 46px; grid-template-columns: 92px 1fr 92px; }.window-bar > strong { grid-column: 2; grid-row: 1; }.window-meta { grid-column: 1; grid-row: 1; padding-inline: 10px 0; text-align: start; font-size: 7px; }.window-controls { grid-column: 3; grid-row: 1; justify-content: flex-end; padding-inline: 0 10px; }
  .window-controls button:nth-child(2), .window-controls button:nth-child(3) { display: none; }
  .window-controls button { width: 25px; height: 25px; border-radius: 7px; }.window-controls button:first-child::after { content: "×"; position: absolute; inset: 0; display: grid; place-items: center; color: rgba(12,16,34,.82); font-size: 21px; font-weight: 700; line-height: 1; }
  .window-content { width: 100%; max-width: 100%; height: calc(100% - 46px); padding-bottom: 0; overflow-x: hidden; }
  .home-content { overflow: auto; }.home-hero { display: block; flex: 0 0 auto; }.home-copy { padding: 32px 23px 26px; }.home-copy h1 { font-size: 43px; }.home-copy p { font-size: 13px; }.home-visual { min-height: 360px; border-left: 0; border-top: 1px solid var(--line); }.home-strip { grid-template-columns: 1fr; }.home-strip > span, .home-strip > button { min-height: 58px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.16); }
  .home-copy { width: 100%; max-width: 100vw; overflow: hidden; }.home-copy p { max-width: 100%; overflow-wrap: anywhere; }.button-row { flex-wrap: wrap; }
  .window-page-head { padding: 26px 21px 20px; grid-template-columns: 1fr; gap: 13px; }.window-page-head h2 { font-size: 33px; }.window-page-head p { font-size: 11px; }
  .project-row { grid-template-columns: 33px 1fr 20px; padding: 17px 16px; gap: 10px; }.project-status { grid-column: 2; justify-self: start; }.project-row > i { grid-column: 3; grid-row: 1 / span 2; }.project-row p { font-size: 10px; line-height: 1.4; }.window-foot { align-items: flex-start; flex-direction: column; }
  .services-head { padding: 25px 21px 20px; grid-template-columns: 1fr; gap: 13px; }.services-head h2 { font-size: 34px; }.services-head p { font-size: 11px; }
  .service-tabs { padding: 0; grid-template-columns: 1fr; }.service-tabs button, .service-tabs button:first-child, [dir="rtl"] .service-tabs button, [dir="rtl"] .service-tabs button:first-child { min-height: 45px; padding: 0 20px; border: 0; border-bottom: 1px solid var(--line); }
  .service-feature { min-height: 0; padding: 24px 21px; grid-template-columns: 1fr; gap: 20px; }.service-feature h3 { font-size: 28px; }.service-feature p { font-size: 11px; }.service-illustration { width: 100%; max-width: 310px; justify-self: start; }
  .service-groups { grid-template-columns: 1fr; }.service-groups section, [dir="rtl"] .service-groups section { padding: 20px 21px; border: 0; border-bottom: 1px solid var(--line); }.service-groups section:last-child { border-bottom: 0; }.service-groups li { font-size: 11px; }
  .services-callout { padding: 17px 21px; align-items: flex-start; flex-direction: column; }.services-callout small { font-size: 10px; line-height: 1.45; }
  .about-hero { padding: 27px 21px 24px; grid-template-columns: 1fr; gap: 22px; }.about-copy h2 { font-size: 35px; }.about-copy p { font-size: 11px; }.founder-card { width: 100%; min-height: 145px; }
  .proof-head { padding: 12px 21px; align-items: flex-start; flex-direction: column; gap: 4px; }.proof-grid { grid-template-columns: repeat(2,1fr); }.proof-grid article { min-height: 138px; }.proof-grid article:nth-child(2) { border-right: 0; }.proof-grid article:nth-child(-n+2) { border-bottom: 1px solid var(--line); } [dir="rtl"] .proof-grid article:nth-child(2) { border-left: 0; }
  .about-operating { padding: 24px 21px; grid-template-columns: 1fr; gap: 20px; }.about-operating h3 { font-size: 27px; }.about-operating li { font-size: 10px; }
  .about-foot { padding: 15px 21px 20px; align-items: flex-start; flex-direction: column; }.about-foot small { font-size: 8px; }
  .work-section { padding: 21px; grid-template-columns: 1fr; gap: 14px; }.name-grid, .founder-name-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.name-grid > span { min-height: 58px; font-size: 10px; }.work-foot { padding: 15px 21px 20px; align-items: flex-start; flex-direction: column; }
  .principles-content { padding: 28px 21px; }.principles-content h2 { font-size: 31px; }.principles-content li { padding: 17px 0; }.principles-content p { font-size: 11px; }
  .contact-content { min-height: 100%; padding: 30px 23px; }.contact-content h2 { font-size: 36px; }.contact-content > p { font-size: 12px; }.contact-actions { grid-template-columns: 1fr; }.contact-actions a { min-height: 42px; font-size: 10px; }.contact-meta { flex-direction: column; gap: 15px; }
  .folder-head { padding: 24px 21px 20px; }.folder-grid { padding: 20px 21px 25px; grid-template-columns: 1fr; }.folder-file, .folder-placeholder { min-height: 155px; }.doom-mobile-note { margin-top: 5px; display: block; padding: 5px 7px; border-radius: 99px; background: #fff1b9; color: #6f4c07; font: 700 7px ui-monospace,Consolas,monospace; }
  .recycle-content { min-height: 100%; padding: 25px 21px 26px; }.recycle-head h2 { font-size: 26px; }.trash-list > span { grid-template-columns: 35px minmax(0,1fr) auto; }.recycle-empty { min-height: 260px; }
  .arcade-content { height: 100%; padding-bottom: 0; overflow: auto; }.game-panel { padding: 14px 12px 0; overflow: visible; }.game-copy { align-items: flex-start; flex-direction: column; gap: 8px; }.game-copy p { max-width: none; font-size: 10px; text-align: start; }.game-frame { width: 100%; }.game-hud { width: 100%; flex-wrap: wrap; }.game-hud > span { min-width: 33.333%; flex: 1; }.game-hud .hud-tip { width: 100%; min-height: 27px; text-align: center; }.touch-controls { margin: 11px auto 3px; display: grid; gap: 7px; justify-content: center; }.touch-controls button { width: 49px; height: 38px; border: 1px solid rgba(255,255,255,.32); border-radius: 5px; background: #181d35; color: white; cursor: pointer; font-size: 17px; touch-action: none; }.touch-controls button:active { background: var(--blue); }.arcade-foot { padding: 9px 12px 18px; align-items: flex-start; flex-direction: column; }.doom-frame { aspect-ratio: 4 / 3; }.doom-controls { justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; }.doom-controls span { white-space: nowrap; }.doom-start > span { bottom: 13px; }
  .dock { display: none !important; }
  .desktop-toast { right: 18px; left: 18px; bottom: 24px; text-align: center; }
  .bar-brand-logo { width: 88px; }
}

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }
