
:root{color-scheme:dark;--bg:#181818;--panel:#1f1f1f;--line:#303030;--muted:#858585;--blue:#007acc;--ink:#e3e3e3;--green:#b5e89b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:13px 'Segoe UI',Arial,sans-serif}button,a{font:inherit}button{color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #56b8ff;outline-offset:3px}button{border:0;background:none}a{color:inherit;text-decoration:none}.app{height:100dvh;display:grid;grid-template-rows:36px minmax(0,1fr) 25px;overflow:hidden}.titlebar{display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid var(--line);background:#181818;font-size:12px}.brand{display:flex;align-items:center;gap:12px}.brand b{font-size:17px;color:#45aaff}.topmenu{color:#999;word-spacing:14px;margin-left:15px}.title-center{color:#8c8c8c}.top-actions{display:flex;gap:9px;align-items:center}.top-actions button{padding:4px 7px;border-radius:4px}.top-actions button:hover{background:#333}.sound.on{color:#a8e5a1}.workspace{min-height:0;display:grid;grid-template-columns:46px 210px minmax(260px,.77fr) minmax(360px,1.23fr)}.activity{background:#181818;border-right:1px solid var(--line);display:flex;align-items:center;flex-direction:column;gap:23px;padding-top:16px;color:#858585}.activity span{font-size:24px}.activity .active{color:#eee;border-left:2px solid #4bb3ff;width:100%;text-align:center}.activity .bottom{margin-top:auto;margin-bottom:14px}.explorer{background:#181818;border-right:1px solid var(--line);overflow:auto}.explorer-title{padding:14px 18px 20px;font-size:11px;letter-spacing:1px;display:flex;justify-content:space-between;color:#bbb}.folder-title{padding:0 10px 12px;font-size:11px;font-weight:700}.tree-folder{padding:8px 16px;color:#b7b7b7;display:block}.file{display:flex;align-items:center;gap:8px;width:100%;padding:8px 12px 8px 30px;text-align:left;color:#a9a9a9;white-space:nowrap}.file.indent{padding-left:44px}.file:hover{background:#242424}.file.selected{background:#04395e;color:#fff;box-shadow:inset 2px 0 #55b4f8}.icon-html{color:#e7865f}.icon-ts{color:#65b7e9}.icon-md{color:#9bbaff}.explorer-note{margin:30px 15px;padding:13px;border:1px solid #343434;border-radius:5px;color:#8d8d8d;line-height:1.6;font-size:11px}.editor{background:#1f1f1f;min-width:0;display:grid;grid-template-rows:35px 30px minmax(0,1fr) 120px;border-right:1px solid #3e3e3e}.tabbar{background:#181818;display:flex;align-items:stretch;border-bottom:1px solid var(--line);min-width:0}.tab{padding:10px 13px;background:#1f1f1f;font-size:12px;border-top:1px solid #3d9fe9;display:flex;gap:9px;align-items:center;white-space:nowrap}.tab .x{color:#999;margin-left:12px}.tab-ghost{padding:10px 12px;color:#666;font-size:11px}.breadcrumb{color:#8d8d8d;font-size:11px;padding:9px 15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.code-area{position:relative;overflow:auto;padding:18px 12px 20px 0;font:12px/1.95 Consolas,'Courier New',monospace;scrollbar-width:thin}.code-row{display:flex;min-height:23px;white-space:pre}.line-no{width:43px;flex-shrink:0;text-align:right;padding-right:15px;user-select:none;color:#636363}.code-text{color:#9cdcfe}.code-row.comment .code-text{color:#6a9955}.code-row.tag .code-text{color:#d7ba7d}.code-row.head .code-text{color:#c586c0}.caret{display:inline-block;border-right:2px solid #dcdcdc;height:15px;vertical-align:middle;animation:blink 1s steps(1) infinite}.editor-ambient{position:absolute;bottom:18px;right:18px;color:#ffffff04;font-size:110px;font-weight:bold;pointer-events:none}.terminal{border-top:1px solid var(--line);padding:12px 18px;font:11px/1.8 Consolas,monospace;overflow:hidden;color:#929292}.terminal-tabs{font:10px 'Segoe UI',sans-serif;letter-spacing:.7px;display:flex;gap:20px;margin-bottom:11px}.terminal-tabs b{color:#ddd;border-bottom:1px solid #ddd;padding-bottom:5px}.terminal .ok{color:#8bb4ff}.terminal .host{color:#59b3dd}.preview-shell{display:grid;grid-template-rows:35px 38px minmax(0,1fr);min-width:0;min-height:0;background:#f6f5f1}.preview-tab{background:#181818;color:#b7b7b7;padding:10px 15px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;font-size:11px}.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#8fd29a;box-shadow:0 0 8px #78cc8a66;margin-right:6px}.browserbar{background:#242424;border-bottom:1px solid #343434;display:flex;align-items:center;gap:13px;padding:7px 14px;color:#aaa;font-size:11px}.address{background:#191919;border-radius:5px;padding:6px 12px;flex:1;color:#aaa}.preview{overflow-y:auto;scroll-behavior:smooth;color:#15223e;scrollbar-width:thin;scrollbar-color:#a6b0b0 #edece8;container-type:inline-size;background:#f7f9ff}.site-nav{display:flex;justify-content:space-between;align-items:center;padding:23px 7%;border-bottom:1px solid #18272a18;background:#f7f9ff}.wordmark{font-weight:800;font-size:22px;letter-spacing:-1px}.wordmark span{color:#2563eb}.nav-small{font-size:10px;display:flex;gap:15px;align-items:center}.nav-small a:last-child{border:1px solid #1a302c;padding:9px 11px;border-radius:2px}.section{padding:64px 8%;position:relative;overflow:hidden}.eyebrow{font:10px Consolas,monospace;letter-spacing:1.6px;text-transform:uppercase;color:#2854c5;display:block;margin-bottom:23px}.hero{min-height:600px;background:#f7f9ff}.hero h1{font-size:clamp(42px,4.5vw,80px);font-weight:550;letter-spacing:-3px;line-height:1.04;margin:0 0 25px;max-width:620px}.hero h1 em{font-family:Georgia,serif;font-weight:normal;color:#2563eb}.intro{color:#5c6c89;font-size:14px;line-height:1.8;max-width:385px;margin-bottom:29px}.cta{display:inline-flex;align-items:center;gap:25px;background:#2563eb;color:#f3f7f0;padding:15px 18px;font-size:12px;border-radius:3px}.cta:hover{background:#1d4ed8}.hero-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:62px;gap:20px}.hero-bottom p{font:10px/1.8 Consolas,monospace;color:#76837b}.orbit{width:150px;height:100px;position:relative;flex-shrink:0}.orbit:before,.orbit:after{content:'';position:absolute;inset:10px 0;border:1px solid #78a18a;border-radius:50%;transform:rotate(-30deg)}.orbit:after{transform:rotate(30deg)}.orbit i{position:absolute;left:64px;top:40px;background:#163c31;width:22px;height:22px;border-radius:50%;box-shadow:0 0 0 10px #dce7d9}.orbit b{position:absolute;left:19px;top:22px;width:8px;height:8px;border-radius:50%;background:#9bbd7d;animation:pulse 3s ease-in-out infinite}.section h2{font-size:35px;letter-spacing:-1.3px;font-weight:550;line-height:1.14;margin:0 0 30px}.services{background:#e9effc}.service-list{border-top:1px solid #c4d1eb}.service-row{display:grid;grid-template-columns:27px 1fr 20px;gap:14px;border-bottom:1px solid #c4d1eb;padding:24px 0}.num{font:10px Consolas,monospace;color:#6980a8}.service-row h3{margin:0 0 9px;font-size:17px;font-weight:550;letter-spacing:-.3px}.service-row p{font-size:12px;color:#536987;margin:0;line-height:1.7}.arrow{font-size:18px;color:#2854c5}.work{background:#101f40;color:#eef4ff}.work .eyebrow{color:#9bbaff}.work-intro{display:flex;justify-content:space-between;align-items:end;gap:20px}.work-intro p{font-size:11px;color:#a3b7da;max-width:180px;line-height:1.7;margin-bottom:31px}.projects{display:grid;grid-template-columns:1fr 1fr;gap:18px}.project{min-width:0}.project-art{height:190px;display:flex;justify-content:center;align-items:center;position:relative;border:1px solid #ffffff15;overflow:hidden;background:#dbe8ff;color:#244686}.send .project-art{background:#d1e1f2;color:#204b9a}.project-art strong{font:italic 52px Georgia,serif;letter-spacing:-3px;z-index:1}.send .project-art strong{font:700 40px 'Segoe UI',sans-serif;letter-spacing:-2px}.art-ring{position:absolute;width:210px;height:210px;border:1px solid currentColor;border-radius:50%;opacity:.16;transform:translate(40px,30px)}.art-ring:after{content:'';position:absolute;inset:20px;border:1px solid;border-radius:50%}.project-art small{position:absolute;bottom:11px;left:12px;font:8px Consolas,monospace;letter-spacing:1px;opacity:.65}.project-label{display:flex;align-items:center;justify-content:space-between;padding-top:16px}.project-label h3{margin:0;font-size:17px;font-weight:500}.project p{font:10px/1.7 Consolas,monospace;color:#9db4dc}.engagement{background:#f7f9ff}.engagement>p{font-size:13px;color:#5c6c89;line-height:1.8;max-width:410px}.terms{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0 35px}.terms span{border:1px solid #c3d0e8;border-radius:20px;padding:9px 13px;font-size:10px}.steps{display:grid;grid-template-columns:1fr 1fr;gap:20px 24px}.step{border-top:1px solid #cad5eb;padding-top:17px}.step small{font:10px Consolas,monospace;color:#5576ad}.step h3{font-size:14px;font-weight:600;margin:10px 0 8px}.step p{font-size:11px;color:#627493;line-height:1.7;margin:0}.contact{background:#dce8ff}.contact h2{font-size:46px;max-width:400px;margin-bottom:20px}.contact>p{font-size:13px;line-height:1.7;color:#455d8a;max-width:350px}.contact .cta{margin-top:18px}.contact .demo-note{font:10px/1.7 Consolas,monospace;margin-top:18px;max-width:400px}.site-footer{padding:25px 8%;background:#101f40;color:#b6c8ec;font-size:10px;display:flex;justify-content:space-between;gap:20px}.statusbar{background:#007acc;color:#e9f5ff;display:flex;justify-content:space-between;align-items:center;padding:0 11px;font:10px Consolas,monospace}.status-left,.status-right{display:flex;gap:18px;align-items:center}.progress{width:50px;height:3px;background:#ffffff45}.progress i{display:block;background:white;width:0;height:3px}.mobile-switch{display:none}.reveal{transition:opacity .55s,transform .55s}.reveal.enter{animation:reveal .65s both}.preview-hint{font:10px Consolas,monospace;color:#708ab6}.toast{position:fixed;bottom:42px;right:20px;max-width:320px;background:#282828;color:#ddd;border:1px solid #555;border-radius:5px;padding:16px;z-index:10;display:none;font-size:12px;line-height:1.6}.toast.show{display:block}@keyframes blink{50%{opacity:0}}@keyframes pulse{50%{transform:scale(1.35)}}@keyframes reveal{from{opacity:.5;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@container(max-width:480px){.hero h1{font-size:50px;letter-spacing:-2px}.nav-small a:not(:last-child){display:none}.section{padding:48px 7%}.hero{min-height:560px}.work-intro{display:block}.work-intro p{max-width:none;margin-top:-12px}.projects{grid-template-columns:1fr}.project-art{height:210px}.contact h2{font-size:40px}.hero-bottom{margin-top:45px}.orbit{width:115px}.steps{gap:20px 16px}.site-footer{flex-direction:column}}
@media(min-width:1500px){.hero h1{font-size:80px}.section{padding-top:80px;padding-bottom:80px}.hero{min-height:680px}}
@media(max-width:1100px){.workspace{grid-template-columns:42px 165px minmax(220px,.7fr) minmax(340px,1.3fr)}.topmenu{display:none}.file{padding-left:22px;font-size:12px}.file.indent{padding-left:30px}.tab-ghost{display:none}.title-center{font-size:10px}.editor{grid-template-rows:35px 30px minmax(0,1fr) 110px}}
@media(max-width:820px){.workspace{grid-template-columns:145px minmax(0,1fr)}.activity,.editor{display:none}.workspace.code-view .editor{display:grid}.workspace.code-view .preview-shell{display:none}.mobile-switch{display:block!important;border:1px solid #555!important}.title-center{display:none}.brand b{font-size:15px}.status-right span:nth-child(n+2){display:none}.explorer-title{padding-left:12px}.explorer-note{margin:24px 9px;padding:9px;font-size:10px}.file{padding:9px 8px 9px 17px;font-size:11px}.file.indent{padding-left:24px}}
@media(max-width:480px){.workspace{grid-template-columns:115px minmax(0,1fr)}.explorer-title{font-size:9px;padding-left:9px}.folder-title{font-size:9px;padding-left:7px}.tree-folder{padding-left:8px;font-size:11px}.file{font-size:10px;gap:5px;padding-left:10px}.file.indent{padding-left:15px}.top-actions{gap:0}.top-actions button{font-size:10px;padding:4px 5px}.brand{gap:5px}.brand span{font-size:10px}.preview-tab{font-size:9px;padding:10px}.browserbar{padding:7px;gap:7px}.address{font-size:9px;padding:6px}.nav-small{display:none}.wordmark{font-size:20px}.hero h1{font-size:38px;letter-spacing:-1.6px}.hero .intro{font-size:12px}.hero-bottom{display:block}.orbit{margin:25px auto 0}.section h2{font-size:29px}.contact h2{font-size:32px}.steps{grid-template-columns:1fr}.terms span{font-size:9px}.status-left{gap:8px}.status-left span:last-child{display:none}.status-right{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.project-links{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0 8px}.project-links a{border:1px solid #6e91cb;padding:10px 12px;font-size:11px;border-radius:3px;color:#e4edff}.project-links a:hover{background:#1c386b}
/* CRM logo #2563EB / framework accent #2854C5. */
.orbit{width:180px;height:130px;flex-shrink:0}.orbit:before,.orbit:after{display:none}.planet-system{width:100%;height:100%;overflow:visible}.static-satellite{display:none}.project.send .project-art{background:#cfdef8}.project .project-art{background:#dbe8ff}.brand b{color:#77a5ff}.statusbar{background:#2854c5}.cta{box-shadow:0 5px 18px #2563eb15}.mobile-nav-button{display:none}
@media(max-width:820px){
 .app{grid-template-rows:minmax(0,1fr);background:#f7f9ff}
 .titlebar{position:absolute;inset:0 0 auto;height:0;display:block;border:0;padding:0;background:none;z-index:50}
 .titlebar .brand,.titlebar .mobile-switch{display:none!important}
 .top-actions{position:absolute;top:19px;right:6%;gap:5px;color:#2854c5}
 .top-actions button{font-size:11px;padding:7px 8px;border-radius:5px;background:#e9effc}
 .top-actions button:hover{background:#dce8ff}.top-actions .sound.on{color:#1d4ed8}
 .mobile-nav-button{display:block;font-size:16px!important;line-height:15px}
 .workspace{grid-row:1;display:block;height:100%;min-width:0}
 .activity,.editor,.statusbar,.explorer,.preview-tab,.browserbar{display:none!important}
 .preview-shell{display:block;height:100%;min-width:0}
 .preview{height:100%;width:100%;scrollbar-width:thin}
 .site-nav{min-height:78px;padding:22px 7%;padding-right:165px}
 .nav-small{display:none}.wordmark{font-size:23px}
 .section{padding:58px 8%}.hero{min-height:calc(100dvh - 78px)}
 .hero h1{font-size:clamp(48px,10vw,76px);letter-spacing:-2px}
 .hero .intro{font-size:14px;max-width:440px}.hero-bottom{display:flex;align-items:center;margin-top:42px}
 .orbit{width:140px;height:115px;margin:0}.hero-bottom p{font-size:10px}
 .section h2{font-size:clamp(33px,7vw,46px)}.contact h2{font-size:45px}
 .workspace.menu-open .explorer{display:block!important;position:fixed;z-index:45;right:6%;top:65px;width:235px;max-height:calc(100dvh - 95px);border:1px solid #3b4a67;border-radius:9px;box-shadow:0 16px 50px #101f4040}
 .workspace.menu-open .explorer-title{font-size:11px;padding:15px}.workspace.menu-open .folder-title{font-size:11px}.workspace.menu-open .file{font-size:13px;padding:12px 20px}.workspace.menu-open .file.indent{padding-left:36px}.workspace.menu-open .tree-folder{font-size:12px;padding-left:15px}.workspace.menu-open .explorer-note{display:none}
}
@media(max-width:380px){.top-actions{right:5%}.top-actions button{padding:6px;font-size:10px}.hero h1{font-size:47px}.hero-bottom{gap:8px}.orbit{width:105px}.hero-bottom p{font-size:9px}.section{padding:45px 7%}}
@media(prefers-reduced-motion:reduce){.satellite-motion{display:none}.static-satellite{display:block}}
