:root{--ink:#242625;--muted:#6c706c;--panel:#fffffce0;--panel-strong:#fffffcf7;--line:#2426251f;--blue:#2f817b;--blue-deep:#1f625e;--cyan:#9ad7cf;--red:#c75b51;--yellow:#c89c3d;--leaf:#5f8f59;--peach:#d98f6d;--blackout:#080b0d;--shadow:0 16px 44px #2426251a;--radius-lg:8px;--radius-md:8px;--radius-sm:6px}*{box-sizing:border-box}html{min-height:100%}body{min-height:100%;color:var(--ink);background:linear-gradient(135deg,#f7f8f4 0%,#eef5f1 46%,#f7f3ed 100%);margin:0;font-family:Bahnschrift,Segoe UI,sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-frame{min-height:100vh;position:relative;overflow-x:hidden}.app-frame:before{content:"";pointer-events:none;background-image:linear-gradient(#2f817b0e 1px,#0000 1px),linear-gradient(90deg,#2f817b0e 1px,#0000 1px);background-size:48px 48px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#000000bf,#0000 85%);mask-image:linear-gradient(#000000bf,#0000 85%)}.page{width:min(1480px,100% - 32px);margin:0 auto;padding:24px 0 56px;position:relative}.app-header{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius-lg);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);justify-content:space-between;align-items:center;gap:18px;margin-bottom:22px;padding:14px 18px;display:flex}.brand{letter-spacing:.04em;align-items:center;gap:12px;font-weight:800;display:flex}.brand-mark{border-radius:var(--radius-sm);background:linear-gradient(135deg, var(--blue) 0%, var(--cyan) 48%, var(--yellow) 49%, var(--red) 100%);width:42px;height:42px;box-shadow:0 10px 24px #2f817b3d}.nav{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.nav a,.button{border:1px solid var(--line);border-radius:var(--radius-sm);min-height:38px;color:var(--ink);background:#ffffffb3;justify-content:center;align-items:center;padding:0 16px;font-weight:700;display:inline-flex}.button.primary,.nav a.primary{border-color:var(--blue);background:linear-gradient(135deg, var(--blue), var(--blue-deep));color:#fff;box-shadow:0 10px 22px #2f817b3d}.button,.nav a,.preset-chip{transition:transform .16s,background .16s,border-color .16s}.button:active,.nav a:active,.preset-chip:active{transform:translateY(1px)}.hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:22px;display:grid}.home-workbench{grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr);align-items:stretch;gap:18px;display:grid}.creator-home-panel{min-height:410px}.creator-home-panel h1{max-width:760px}.ai-entry-card{align-content:start;gap:14px;display:grid}.ai-entry-card h2{margin-bottom:0}.home-lanes{grid-template-columns:minmax(0,1.15fr) minmax(260px,.68fr) minmax(260px,.67fr);align-items:start;gap:16px;margin-top:18px;display:grid}.home-section-label{margin-bottom:10px}.material-shelf,.preset-shelf{gap:12px;display:grid}.home-material-grid{gap:10px;display:grid}.home-material-card{border:1px solid var(--line);border-radius:var(--radius-md);background:#fffffcc2;gap:8px;padding:10px;display:grid}.home-material-card strong{font-size:14px}.home-material-card span{color:var(--muted);font-size:12px;line-height:1.45}.panel{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius-lg);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.hero-panel{min-height:470px;padding:34px;position:relative;overflow:hidden}.hero-panel:after{content:"";background:#ffffff47;border:1px solid #3ca2713d;width:52%;height:120px;position:absolute;bottom:28px;right:-12%;transform:rotate(-8deg)}.eyebrow{border-radius:var(--radius-sm);color:var(--blue-deep);letter-spacing:.04em;background:#fffffcb8;border:1px solid #1677ff38;align-items:center;gap:8px;padding:7px 11px;font-size:13px;font-weight:800;display:inline-flex}h1,h2,h3,p{margin-top:0}h1{letter-spacing:0;max-width:850px;margin:18px 0 14px;font-size:64px;line-height:.95}h2{letter-spacing:0;font-size:34px}h3{font-size:20px}.lead{max-width:740px;color:var(--muted);font-size:18px;line-height:1.7}.actions{flex-wrap:wrap;gap:12px;margin-top:26px;display:flex}.stat-grid{grid-template-columns:repeat(3,1fr);gap:12px;margin-top:34px;display:grid}.stat{border:1px solid var(--line);border-radius:var(--radius-md);background:#ffffffbd;padding:14px}.stat strong{margin-bottom:4px;font-size:24px;display:block}.stat span{color:var(--muted);font-size:13px}.stack{gap:16px;display:grid}.project-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;display:grid}.project-card{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--panel-strong);min-height:230px;box-shadow:var(--shadow);padding:18px}.project-thumb{border-radius:var(--radius-md);border:1px solid #17203329;height:118px;margin-bottom:16px;position:relative;overflow:hidden}.project-thumb:before{content:"";clip-path:polygon(45% 0,58% 0,72% 35%,62% 96%,38% 96%,28% 35%);background:linear-gradient(90deg,#0000 0 18%,#ef3340f2 18% 28%,#0000 28%),linear-gradient(#fff 0 0);position:absolute;inset:18px 22%;box-shadow:0 0 32px #1677ff52}.badge-row{flex-wrap:wrap;gap:8px;display:flex}.badge{border-radius:var(--radius-sm);border:1px solid var(--line);min-height:28px;color:var(--muted);background:#ffffffb8;align-items:center;padding:0 10px;font-size:12px;font-weight:800;display:inline-flex}.editor-command-bar{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--panel-strong);box-shadow:var(--shadow);justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:14px;padding:16px;display:flex}.editor-title-block{grid-template-columns:auto minmax(0,1fr);align-items:end;gap:14px;display:grid}.editor-title-block h1{margin:0 0 4px;font-size:30px;line-height:1.1}.editor-title-block p{color:var(--muted);margin:0;font-size:14px}.editor-actions{margin-top:0}.editor-grid{grid-template-columns:310px minmax(0,1fr) 300px;align-items:start;gap:16px;display:grid}.workbench-rail{gap:10px;display:grid}.section-label{color:var(--ink);justify-content:space-between;align-items:center;gap:10px;font-size:13px;font-weight:800;display:flex}.section-label small,.section-label-text{color:var(--muted);font-size:12px;font-weight:800}.editor-main{gap:14px;display:grid}.editor-panel{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--panel-strong);padding:16px;box-shadow:0 12px 32px #24262514}.canvas-toolbar{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--panel);justify-content:space-between;align-items:center;gap:12px;padding:12px;display:flex}.canvas-toolbar strong{margin-top:4px;font-size:16px;display:block}.segmented-control{border:1px solid var(--line);border-radius:var(--radius-sm);background:#fffffcc2;grid-auto-flow:column;gap:4px;padding:4px;display:inline-grid}.segmented-control button{min-height:32px;color:var(--muted);background:0 0;border:0;border-radius:4px;padding:0 11px;font-weight:800}.segmented-control button[aria-pressed=true]{background:var(--ink);color:#fff}.preview-card h3{margin-bottom:12px}.preview-stage{aspect-ratio:16/9;border-radius:var(--radius-md);background:radial-gradient(circle at 50% 52%, #2fd3ff3d, transparent 18%), linear-gradient(90deg, #1677ff29 1px, transparent 1px), linear-gradient(#1677ff29 1px, transparent 1px), var(--blackout);background-size:auto,72px 72px,72px 72px,auto;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff14}.mecha-silhouette{background:linear-gradient(90deg, transparent 0 20%, var(--red) 20% 30%, transparent 30%), linear-gradient(180deg, #fff 0 18%, #dbeafe 18% 42%, #fff 42% 100%);clip-path:polygon(36% 0,64% 0,76% 16%,68% 35%,88% 58%,70% 72%,64% 100%,36% 100%,30% 72%,12% 58%,32% 35%,24% 16%);filter:drop-shadow(0 0 26px #2fd3ff9e);width:14%;height:66%;position:absolute;top:18%;left:43%}.hud-ring{border:2px solid #2fd3ffc7;border-radius:50%;position:absolute;inset:24% 33%;box-shadow:0 0 34px #2fd3ff6b}.scan-line{background:linear-gradient(90deg, transparent, var(--cyan), transparent);height:3px;box-shadow:0 0 24px var(--cyan);position:absolute;top:47%;left:28%;right:28%}.beam{background:linear-gradient(90deg, var(--cyan), #2fd3ff00);width:34%;height:8px;box-shadow:0 0 28px var(--cyan);position:absolute;top:43%;left:58%}.hologram-shell{aspect-ratio:16/9;border-radius:var(--radius-md);background:linear-gradient(140deg,#05080ff2,#0d47c5ad),#05080f;place-items:center;display:grid;overflow:hidden}.hologram-plane{aspect-ratio:16/9;clip-path:polygon(8% 9%,100% 0,91% 89%,0 100%);background:#2fd3ff1a;border:1px solid #2fd3ff6b;width:78%;box-shadow:0 0 40px #2fd3ff52}.timeline{gap:8px;display:grid}.timeline-row{color:var(--muted);grid-template-columns:minmax(130px,.36fr) minmax(0,1fr);align-items:center;gap:10px;font-size:12px;font-weight:700;display:grid}.timeline-row[data-selected=true] .timeline-track{background:#9ad7cf2e;border-color:#2f817b61}.timeline-layer-button{border:1px solid var(--line);border-radius:var(--radius-sm);min-height:46px;color:var(--ink);text-align:left;background:#fffffcbd;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:5px 8px;padding:8px;display:grid}.timeline-layer-button[aria-pressed=true]{background:#9ad7cf3d;border-color:#2f817b6b}.timeline-layer-title{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.timeline-layer-time{color:var(--muted);grid-column:1/-1;font-size:11px}.timeline-track{border:1px solid var(--line);border-radius:var(--radius-sm);background:#1677ff14;height:28px;position:relative;overflow:hidden}.timeline-clip{border-radius:var(--radius-sm);background:linear-gradient(90deg, var(--blue), var(--cyan));position:absolute;top:3px;bottom:3px}.timeline-clip[data-selected=true]{background:linear-gradient(90deg, var(--yellow), var(--blue));box-shadow:0 0 0 1px #ffffff6b,0 8px 18px #2f817b38}.timeline-controls{border-radius:var(--radius-md);background:#fffffcc7;border:1px solid #2f817b38;gap:10px;padding:10px;display:grid}.timeline-input-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.timeline-hint{margin:0}.form-grid{gap:12px;display:grid}.field{gap:6px;display:grid}.field label{color:var(--muted);font-size:12px;font-weight:800}.field input{border:1px solid var(--line);border-radius:var(--radius-sm);background:#ffffffc7;min-height:42px;padding:0 12px}.field select{border:1px solid var(--line);border-radius:var(--radius-sm);min-height:42px;color:var(--ink);background:#ffffffc7;padding:0 12px}.panel-heading{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px;display:flex}.preset-chips{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.preset-chip{border:1px solid var(--line);border-radius:var(--radius-sm);min-height:36px;color:var(--muted);background:#fffffcbd;font-weight:800}.preset-chip[aria-pressed=true]{color:var(--blue-deep);background:#9ad7cf52;border-color:#2f817b5c}.panel-heading h2,.panel-heading h3{margin:8px 0 0}.creator-feed{position:relative;overflow:hidden}.creator-feed:after{content:"";border:1px solid #3ca2714d;width:116px;height:28px;position:absolute;inset:auto 18px 16px auto;transform:rotate(-6deg)}.material-grid{gap:10px;display:grid}.material-library-panel{gap:12px;display:grid}.material-library-controls{gap:10px;display:grid}.material-filter-tabs{width:100%}.material-search-field{gap:6px}.material-card{border:1px solid var(--line);background:#ffffffc7;border-radius:8px;gap:8px;padding:10px;display:grid}.material-card strong{font-size:14px}.material-card span{color:var(--muted);font-size:12px;line-height:1.45}.material-preview{background:linear-gradient(110deg,#2fd3ff1a,#3ca2713d),#05080f;border:1px solid #1720331f;border-radius:8px;height:78px;position:relative;overflow:hidden}.material-preview-button{cursor:pointer;width:100%;padding:0;transition:transform .16s,border-color .16s}.material-preview-button:active{transform:translateY(1px)}.material-preview-button:focus-visible{outline:2px solid var(--blue);outline-offset:2px}.material-meta-row,.tag-row{flex-wrap:wrap;gap:6px;display:flex}.tag{border-radius:var(--radius-sm);min-height:24px;color:var(--blue-deep);background:#2f817b14;align-items:center;padding:0 8px;font-size:11px;font-weight:800;display:inline-flex}.empty-material-state{gap:12px;display:grid}.material-actions{grid-template-columns:1fr;gap:8px;display:grid}.material-actions .button{width:100%}.material-preview-dialog{border-radius:var(--radius-md);background:#fffffcf0;border:1px solid #2f817b38;gap:12px;padding:12px;display:grid}.material-preview-dialog-header{justify-content:space-between;align-items:flex-start;gap:10px;display:flex}.material-preview-dialog-header h3{margin-bottom:0}.material-preview-large{border-radius:var(--radius-md);background:linear-gradient(110deg,#2fd3ff1f,#3ca27138),#05080f;border:1px solid #1720331f;min-height:150px;position:relative;overflow:hidden}.material-prompt{border:1px solid var(--line);border-radius:var(--radius-sm);color:var(--muted);background:#2f817b0f;margin:0;padding:10px;font-size:12px;line-height:1.5}.preset-card-grid{gap:8px;display:grid}.preset-card{border:1px solid var(--line);border-radius:var(--radius-md);background:linear-gradient(135deg,#9ad7cf2e,#d98f6d1f),#fffffcc7;gap:6px;padding:10px;display:grid}.preset-card span{color:var(--muted);font-size:12px;line-height:1.45}.material-preview:before{content:"";opacity:.72;background-image:linear-gradient(90deg,#0000,#2fd3ffbf,#0000),radial-gradient(circle,#ffffffdb 0 1px,#0000 2px);background-size:auto,18px 18px;position:absolute;inset:12px 18px}.atmosphere-layer{z-index:0;background:linear-gradient(120deg,#2fd3ff29,#3ca27133,#f3a66e24),radial-gradient(circle at 30% 40%,#2fd3ff38,#0000 28%),#05080f;animation:6s linear infinite atmosphere-drift;position:absolute;inset:0}.pixi-atmosphere-canvas{pointer-events:none;mix-blend-mode:screen;opacity:.86;width:100%;height:100%;position:absolute;inset:0}.media-background{object-fit:cover;opacity:.72;width:100%;height:100%;position:absolute;inset:0}.image-background{background-position:50%;background-size:cover}.atmosphere-layer:before{content:"";opacity:.62;background-image:radial-gradient(circle,#ffffffb8 0 1px,#0000 2px),linear-gradient(90deg,#0000,#2fd3ff8a,#0000);background-size:28px 28px,auto;animation:2.8s ease-in-out infinite alternate atmosphere-pulse;position:absolute;inset:12%}.atmosphere-layer[data-style=hangar-lights]{background:repeating-linear-gradient(90deg,#ffffff0f 0 2px,#0000 2px 82px),linear-gradient(#2fd3ff2e,#05080ffa),#05080f}.atmosphere-layer[data-style=soft-hud]{background-color:#05080f;background-image:linear-gradient(90deg,#2fd3ff1f 1px,#0000 1px),linear-gradient(#2fd3ff1f 1px,#0000 1px),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:64px 64px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box}.preview-stage>:not(.atmosphere-layer){z-index:1}.status-pill{border-radius:var(--radius-sm);border:1px solid var(--line);min-height:28px;color:var(--muted);align-items:center;padding:0 10px;font-size:12px;font-weight:800;display:inline-flex}.status-running{color:var(--blue-deep);border-color:#1677ff3d}.status-completed{color:var(--leaf);border-color:#3ca2714d}.status-failed{color:var(--red);border-color:#ef334052}.result-card{color:var(--leaf);background:#f0fcf4cc;border:1px solid #3ca27142;border-radius:8px;justify-content:space-between;align-items:center;gap:10px;margin-top:12px;padding:10px;font-size:13px;font-weight:800;display:flex}@keyframes atmosphere-drift{0%{background-position:0 0}to{background-position:140px 0}}@keyframes atmosphere-pulse{0%{opacity:.36;transform:translateY(-4px)}to{opacity:.78;transform:translateY(4px)}}@media (max-width:1120px){.hero-grid,.editor-grid,.home-workbench,.home-lanes{grid-template-columns:1fr}.editor-grid{gap:12px}}@media (max-width:700px){.page{width:min(100% - 20px,1480px);padding-top:10px}.app-header{flex-direction:column;align-items:flex-start}h1{font-size:38px}h2{font-size:26px}.hero-panel{padding:22px}.stat-grid,.timeline-row{grid-template-columns:1fr}.editor-command-bar,.canvas-toolbar,.editor-title-block{grid-template-columns:1fr;align-items:stretch}.editor-command-bar,.canvas-toolbar{flex-direction:column}.segmented-control,.preset-chips{grid-template-columns:1fr;grid-auto-flow:row;width:100%}}