@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap";:root{--bg:#0d0e0d;--surface:#171917;--surface2:#202320;--line:#30342f;--muted:#8c938c;--text:#f2f3ed;--lime:#d8f36a;--red:#ff8168}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Manrope,-apple-system,BlinkMacSystemFont,sans-serif}button,input{font:inherit}button{cursor:pointer}.topbar{height:76px;padding:0 5vw;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-size:18px;font-weight:800;letter-spacing:-.04em}.brand-mark{width:25px;height:25px;border-radius:7px 11px;background:var(--lime);display:grid;place-items:center;color:#111;font-size:13px;transform:rotate(-9deg)}.top-note,.eyebrow,.section-head,.card-meta,.pill,.stage-foot,.back,.note{font:500 11px DM Mono,monospace;letter-spacing:.07em;text-transform:uppercase}.top-note,.muted,.section-head span,.card-meta,.stage-foot,.note{color:var(--muted)}.home{min-height:calc(100vh - 76px)}.hero{padding:92px 5vw 65px;max-width:1200px}.eyebrow{color:var(--lime);margin:0 0 22px}.hero h1,.editor h1{font-size:clamp(50px,8vw,105px);line-height:.92;letter-spacing:-.09em;max-width:850px;margin:0 0 28px}.hero h1 i{color:var(--lime);font-style:normal}.hero-copy{max-width:440px;color:var(--muted);line-height:1.65;font-size:15px;margin:0}.section{padding:0 5vw 90px}.section-head{display:flex;align-items:end;justify-content:space-between;border-top:1px solid var(--line);padding:18px 0;margin-bottom:22px}.section-head h2{font:600 18px Manrope,sans-serif;letter-spacing:-.04em;margin:0;color:var(--text)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.template-card{min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:transform .2s,border-color .2s;cursor:pointer}.template-card:hover{transform:translateY(-4px);border-color:#616d5a}.home-preview{aspect-ratio:16/10;background:#090a09;position:relative;overflow:hidden}.runtime-frame{position:relative;width:100%;aspect-ratio:1464/822;background:#111;overflow:hidden}.runtime-frame iframe{border:0;width:100%;height:100%;display:block}.home-preview .runtime-frame{height:100%}.preview-badge{position:absolute;top:12px;left:12px;color:#fff;background:#000a;padding:7px 9px;border-radius:4px;font:500 10px DM Mono,monospace;letter-spacing:.05em}.card-body{padding:17px 18px 18px}.card-title{display:flex;justify-content:space-between;align-items:start;gap:10px;margin-bottom:9px}.card h3{margin:0;font-size:16px;letter-spacing:-.04em}.pill{color:var(--lime);border:1px solid #536332;padding:4px 7px;border-radius:999px;font-size:10px}.card-body p{color:var(--muted);font-size:12px;line-height:1.5;margin:0 0 18px}.card-meta{display:flex;justify-content:space-between;font-size:10px}.card-meta b{color:var(--lime);font-size:15px;margin-left:4px}.detail{padding:48px 5vw 80px}.back{background:transparent;color:var(--muted);border:0;padding:0;display:inline-flex;gap:8px;margin-bottom:34px}.detail-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:48px;max-width:1280px}.stage{background:#090a09;border:1px solid var(--line);border-radius:16px;overflow:hidden}.stage .runtime-frame{aspect-ratio:1464/822}.stage-foot{padding:12px 16px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:10px}.scrubber{width:100%;margin:15px 0;accent-color:var(--lime)}.runtime-controls{position:absolute;left:14px;bottom:14px;display:flex;gap:6px}.runtime-controls button{width:32px;height:30px;background:#0d0e0dcc;color:var(--text);border:1px solid #ffffff36;border-radius:6px}.editor h1{font-size:clamp(39px,5vw,66px);margin-bottom:18px}.detail-intro{color:var(--muted);line-height:1.65;font-size:14px;margin-bottom:30px}.control-panel{border-top:1px solid var(--line)}.control-group h2{font-size:13px;font-weight:600;margin:20px 0 2px;color:var(--lime)}.control{display:block;padding:13px 0;border-bottom:1px solid var(--line);font-size:12px}.control>span{display:block;margin-bottom:8px}.control input[type=text]{width:100%;background:var(--surface);border:1px solid var(--line);color:var(--text);border-radius:7px;padding:10px 11px;outline:none}.control input[type=text]:focus{border-color:var(--lime)}.color-row{display:flex;gap:8px}.color-row input[type=color]{width:44px;height:39px;padding:2px;border:1px solid var(--line);background:var(--surface);border-radius:7px}.color-row input[type=text]{flex:1}.actions{display:flex;gap:10px;margin-top:25px}.secondary,.primary{border-radius:7px;padding:12px 14px;font-weight:700}.secondary{flex:1;background:transparent;color:var(--text);border:1px solid var(--line)}.primary{flex:2;background:var(--lime);color:#151714;border:0}.primary:disabled{opacity:.55;cursor:wait}.status{font-size:12px;line-height:1.5;margin:17px 0 0}.status a,.status.success{color:var(--lime)}.status.error{color:var(--red)}.note{font-size:10px;line-height:1.5;margin-top:18px;text-transform:none;letter-spacing:0}.note a{color:var(--lime)}@media (max-width:760px){.top-note{display:none}.hero{padding-top:60px}.grid,.detail-layout{grid-template-columns:1fr}.detail-layout{gap:28px}}.progress-track{height:4px;background:var(--surface2);border-radius:4px;overflow:hidden;margin-top:16px}.progress-track span{display:block;height:100%;background:var(--lime);transition:width .35s ease}.image-control{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.upload-button{display:inline-flex;align-items:center;justify-content:center;padding:10px 12px;border:1px solid var(--line);border-radius:7px;color:var(--text);background:var(--surface2);cursor:pointer}.upload-button input{display:none}.logo-thumb{width:42px;height:42px;object-fit:contain;border-radius:7px;background:#fff;padding:5px}.clear-image{border:0;background:transparent;color:var(--muted);font-size:11px;padding:5px}.clear-image:hover{color:var(--text)}.export-method{display:flex;flex-direction:column;gap:9px;margin-top:22px;padding:13px 0;border-top:1px solid var(--line);color:var(--muted);font-size:11px;line-height:1.4}.export-method label{display:flex;align-items:center;gap:7px;cursor:pointer}.export-method input{accent-color:var(--lime)}
