:root{--ink:#f7f8ff;--muted:#9aa5bd;--line:#94a3b829;--panel:#101425bd;--violet:#9f7aea;--cyan:#28d8f5;--mint:#3ee6aa}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--ink);background:radial-gradient(circle at 15% 8%,#6d28d938,#0000 27rem),radial-gradient(circle at 85% 18%,#0891b226,#0000 30rem),#070910;min-height:100vh;margin:0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body:before{z-index:-1;content:"";pointer-events:none;background-image:radial-gradient(#94a3b81c .7px,#0000 .7px);background-size:18px 18px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 75%);mask-image:linear-gradient(#000,#0000 75%)}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}.shell{width:min(1120px,100% - 40px);margin-inline:auto}.nav{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;height:86px;display:flex}.brand,.githubLink{color:var(--ink);text-decoration:none}.brand{letter-spacing:.16em;align-items:center;gap:11px;font:750 12px/1 ui-monospace,SFMono-Regular,Consolas,monospace;display:flex}.brandMark{width:32px;height:32px;color:var(--cyan);background:#9f7aea1f;border:1px solid #9f7aea80;border-radius:9px;place-items:center;display:grid;box-shadow:inset 0 0 20px #9f7aea14}.githubLink{color:#cbd5e1;border:1px solid var(--line);border-radius:9px;padding:9px 13px;font-size:13px;transition:border-color .2s,background .2s}.githubLink:hover{background:#28d8f50f;border-color:#28d8f573}.hero{text-align:center;padding:88px 0 54px}.eyebrow{color:#a9b4cc;letter-spacing:.16em;align-items:center;gap:9px;font:700 10px/1 ui-monospace,SFMono-Regular,Consolas,monospace;display:inline-flex}.eyebrow span{background:var(--mint);width:6px;height:6px;box-shadow:0 0 14px var(--mint);border-radius:50%}h1{letter-spacing:-.058em;margin:24px 0 18px;font-size:clamp(46px,7vw,82px);font-weight:760;line-height:.98}h1:first-line{color:#fff}.heroCopy{width:min(620px,100%);color:var(--muted);margin:0 auto;font-size:17px;line-height:1.7}.generator{text-align:left;border:1px solid var(--line);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#0b0e1abd;border-radius:16px;width:min(800px,100%);margin:42px auto 0;padding:15px;box-shadow:0 24px 70px #00000059}.generator label{color:#7f8ba3;letter-spacing:.14em;text-transform:uppercase;margin:0 0 9px 4px;font:700 9px/1 ui-monospace,SFMono-Regular,Consolas,monospace;display:block}.inputRow{grid-template-columns:1fr 128px 118px;gap:9px;display:grid}.inputRow input,.inputRow select{min-width:0;height:48px;color:var(--ink);background:#0c0f1b;border:1px solid #94a3b833;border-radius:10px;outline:none;padding:0 15px}.inputRow input{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:13px}.inputRow input:focus,.inputRow select:focus{border-color:#28d8f5a6;box-shadow:0 0 0 3px #28d8f514}.inputRow button,.embedRow button{color:#061015;background:linear-gradient(120deg, var(--cyan), var(--mint));cursor:pointer;border:0;border-radius:10px;font-weight:750;transition:transform .2s,filter .2s}.inputRow button:hover,.embedRow button:hover{filter:brightness(1.08);transform:translateY(-1px)}.previewSection{border:1px solid var(--line);background:linear-gradient(145deg,#13172adb,#080a11e6);border-radius:22px;padding:26px;box-shadow:0 35px 100px #0000005c}.previewHeader{color:#77839b;letter-spacing:.13em;justify-content:space-between;align-items:center;margin-bottom:22px;font:700 10px/1 ui-monospace,SFMono-Regular,Consolas,monospace;display:flex}.previewHeader div{color:#aab5cb;align-items:center;gap:8px;display:flex}.liveDot{background:var(--mint);border-radius:50%;width:6px;height:6px;box-shadow:0 0 12px #3ee6aacc}.cardStage{background-color:#05070c;background-image:linear-gradient(#94a3b809 1px,#0000 1px),linear-gradient(90deg,#94a3b809 1px,#0000 1px);background-size:24px 24px;border:1px solid #94a3b81a;border-radius:14px;place-items:center;min-height:310px;padding:15px;display:grid;overflow:auto}.cardStage img{width:min(760px,100%);height:auto;display:block}.embedRow{grid-template-columns:1fr 140px;gap:10px;margin-top:14px;display:grid}.embedRow code{color:#9cebd6;border:1px solid var(--line);text-overflow:ellipsis;white-space:nowrap;background:#04060b99;border-radius:10px;padding:15px;font-size:11px;line-height:1.4;overflow:hidden}.features{grid-template-columns:repeat(3,1fr);gap:18px;padding:80px 0;display:grid}.features article{background:linear-gradient(#94a3b80b,#0000 70%);border-top:1px solid #94a3b838;padding:25px}.features article>span{color:var(--cyan);font:700 10px/1 ui-monospace,SFMono-Regular,Consolas,monospace}.features h2{letter-spacing:-.02em;margin:30px 0 10px;font-size:17px}.features p{color:var(--muted);margin:0;font-size:13px;line-height:1.7}footer{border-top:1px solid var(--line);color:#667188;justify-content:space-between;gap:20px;padding:24px 0 38px;font-size:11px;display:flex}@media (max-width:760px){.shell{width:min(100% - 24px,1120px)}.nav{height:72px}.hero{padding-top:65px}h1{font-size:clamp(42px,13vw,64px)}.inputRow{grid-template-columns:1fr 110px}.inputRow button{grid-column:1/-1;height:46px}.previewSection{padding:14px}.cardStage{justify-content:start;min-height:220px}.cardStage img{width:760px;max-width:none}.embedRow{grid-template-columns:1fr}.embedRow button{height:44px}.features{grid-template-columns:1fr;padding:55px 0}footer{flex-direction:column}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
