:root{--ink:#07100d;--panel:#0d1814;--panel-2:#12221b;--line:#274135;--mint:#8dffb5;--lime:#c9ff62;--cream:#f2f0df;--muted:#9db0a5;--danger:#ff8f7b;--shadow:rgba(0,0,0,.55)}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{min-height:100%;margin:0}
body{background:var(--ink);color:var(--cream);font-family:"Trebuchet MS",Verdana,sans-serif}
button{font:inherit}
.landing-page{display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 20%,rgba(141,255,181,.12),transparent 30%),linear-gradient(135deg,#07100d,#0b1712 60%,#050a08)}
.landing-card{width:min(560px,100%);padding:52px;border:1px solid var(--line);background:linear-gradient(145deg,rgba(18,34,27,.95),rgba(8,17,14,.98));box-shadow:0 40px 100px var(--shadow);border-radius:4px}
.landing-card h1,.sync-card h1{margin:8px 0 14px;font:500 clamp(34px,6vw,60px)/.98 Georgia,serif;letter-spacing:-.045em}
.landing-card p{color:var(--muted);line-height:1.7}.landing-card code{display:inline-block;margin-top:12px;padding:11px 15px;border:1px solid var(--line);color:var(--mint);background:#07100d}
.brand-mark{display:grid;width:38px;height:38px;place-items:center;border:1px solid var(--mint);background:var(--mint);color:var(--ink);font:800 20px/1 Georgia,serif;box-shadow:5px 5px 0 rgba(201,255,98,.2)}
.eyebrow{margin:0;color:var(--lime);font:700 11px/1.2 ui-monospace,"Cascadia Mono",monospace;letter-spacing:.16em;text-transform:uppercase}.eyebrow.success{color:var(--mint)}.eyebrow.danger{color:var(--danger)}
.editor-page{overflow:hidden}
.fake-editor{position:fixed;inset:0;display:grid;grid-template:70px 1fr/230px 1fr;background:linear-gradient(135deg,#0b1511,#101d18)}
.fake-topbar{grid-column:1/-1;display:flex;align-items:center;gap:18px;padding:0 24px;border-bottom:1px solid #24372f;background:#0a120f}.fake-title{width:150px;height:12px;background:#30463c}.fake-pill{width:90px;height:28px;margin-left:auto;border:1px solid #30463c;border-radius:20px}
.fake-sidebar{display:flex;flex-direction:column;gap:20px;padding:34px 25px;border-right:1px solid #24372f}.fake-sidebar span{width:75%;height:9px;background:#24382f}.fake-sidebar span:nth-child(2){width:92%;height:38px;border:1px solid #3b584b;background:#16271f}.fake-sidebar span:nth-child(4){width:55%}
.fake-workspace{display:grid;grid-template:70px 1fr/1fr 250px}.fake-toolbar{grid-column:1/-1;display:flex;align-items:center;gap:12px;padding:0 30px;border-bottom:1px solid #24372f}.fake-toolbar i{width:34px;height:34px;border:1px solid #334d41}.fake-canvas{display:grid;grid-template-columns:repeat(5,56px);grid-auto-rows:56px;align-content:center;justify-content:center;gap:7px;background-image:linear-gradient(rgba(141,255,181,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(141,255,181,.025) 1px,transparent 1px);background-size:24px 24px}.fake-canvas span{border:1px solid #385044;background:#172820;box-shadow:inset 0 0 0 4px #0d1814}.fake-canvas span:nth-child(3n){background:#213a2e}.fake-inspector{display:flex;flex-direction:column;gap:16px;padding:30px;border-left:1px solid #24372f}.fake-inspector i{height:42px;border:1px solid #314b3e;background:#14231d}.fake-inspector i:first-child{height:110px}
.sync-layer{position:fixed;inset:0;display:grid;place-items:center;padding:24px;background:rgba(3,9,7,.58);backdrop-filter:blur(13px) saturate(.7)}
.sync-card{position:relative;width:min(610px,100%);min-height:410px;padding:56px;overflow:hidden;border:1px solid rgba(141,255,181,.45);border-radius:5px;background:linear-gradient(145deg,rgba(16,31,25,.98),rgba(7,15,12,.99));box-shadow:0 50px 140px rgba(0,0,0,.7),0 0 80px rgba(141,255,181,.08)}
.sync-card:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,transparent,var(--mint),var(--lime),transparent)}
.sync-orbit{position:absolute;top:-80px;right:-80px;width:220px;height:220px;border:1px solid rgba(141,255,181,.15);border-radius:50%;animation:orbit 12s linear infinite}.sync-orbit span{position:absolute;left:28px;top:22px;width:8px;height:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 18px var(--mint)}
.sync-copy{margin:24px 0 10px;color:var(--muted);line-height:1.6}
.command-box{display:grid;grid-template-columns:1fr auto;gap:0;border:1px solid #345243;background:#050c09}.command-box code{overflow:auto;padding:18px;color:var(--mint);font:700 14px/1.4 ui-monospace,"Cascadia Mono",monospace;white-space:nowrap}.command-box button{border:0;border-left:1px solid #345243;padding:0 19px;background:#172a21;color:var(--cream);cursor:pointer}.command-box button:hover:not(:disabled){background:var(--mint);color:var(--ink)}.command-box button:disabled{cursor:not-allowed;opacity:.5}
.waiting-row{display:flex;align-items:center;gap:10px;margin-top:24px;color:var(--cream);font-size:14px}.waiting-row i{width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 14px var(--lime);animation:pulse 1.4s ease-in-out infinite}.sync-card small{display:block;margin-top:9px;color:#74877d;font:11px ui-monospace,"Cascadia Mono",monospace}
.identity-line{display:flex;align-items:center;gap:13px;margin:28px 0;padding:18px;border:1px solid #315042;background:#10221a}.identity-line>span{display:grid;width:34px;height:34px;place-items:center;background:var(--mint);color:var(--ink);border-radius:50%}.identity-line p{margin:0;color:var(--muted)}.identity-line strong{display:block;margin-top:2px;color:var(--cream);font-size:18px}
.connection-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 18px}.connection-grid div{padding:15px;border:1px solid var(--line);background:#09130f}.connection-grid dt{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.1em}.connection-grid dd{margin:7px 0 0;color:var(--mint);font-weight:700}
.primary-action{width:100%;padding:15px;border:1px solid var(--mint);background:var(--mint);color:var(--ink);font-weight:800;cursor:pointer}.primary-action:hover{background:var(--lime)}.primary-action:disabled{cursor:wait;opacity:.6}
.message-result{margin-top:12px;padding:15px;border-left:2px solid var(--lime);background:#08110d}.message-result span{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.1em}.message-result strong{display:block;margin-top:7px;font:600 13px/1.5 ui-monospace,"Cascadia Mono",monospace}
@keyframes pulse{50%{opacity:.3;transform:scale(.75)}}@keyframes orbit{to{transform:rotate(360deg)}}
@media(max-width:700px){.fake-editor{grid-template:60px 1fr/70px 1fr}.fake-sidebar{padding:24px 14px}.fake-sidebar span{width:100%}.fake-workspace{grid-template-columns:1fr}.fake-inspector{display:none}.fake-canvas{grid-template-columns:repeat(4,44px);grid-auto-rows:44px}.sync-card{padding:38px 25px}.command-box{grid-template-columns:1fr}.command-box button{min-height:44px;border-top:1px solid #345243;border-left:0}.connection-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}