:root{--bg-0:#060a18;--bg-1:#0a1130;--surface:#0b102acc;--surface-2:#0f1638a6;--line:#818cf847;--line-soft:#94a3b833;--text:#e6ecff;--muted:#b3bfd9;--brand-grad:linear-gradient(90deg, #ec4899 0%, #8b5cf6 45%, #22d3ee 100%);--shadow-glow:0 0 45px #8b5cf661}*{box-sizing:border-box}.animora-shell{min-height:100vh;color:var(--text);background:radial-gradient(1200px 680px at -5% 0%, #ec489938, transparent 68%), radial-gradient(900px 620px at 102% 12%, #22d3ee33, transparent 62%), linear-gradient(160deg, var(--bg-0), var(--bg-1));padding:24px;position:relative;overflow:hidden}.ambient{filter:blur(40px);pointer-events:none;border-radius:999px;position:absolute}.ambient-one{background:#22d3ee29;width:220px;height:220px;top:6%;right:14%}.ambient-two{background:#ec489926;width:290px;height:290px;bottom:9%;left:-70px}.animora-board{z-index:1;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px;max-width:1480px;margin:0 auto;display:grid;position:relative}.panel{border:1px solid var(--line);background:var(--surface);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:18px;padding:18px;box-shadow:inset 0 0 0 1px #0f162c70}.panel h2{margin:0 0 10px;font-family:Space Grotesk,Segoe UI,sans-serif;font-size:1.1rem;font-weight:600}.panel p,.panel li,.panel span,.panel button{font-family:Plus Jakarta Sans,Segoe UI,sans-serif}.hero-panel{grid-column:span 6;grid-template-columns:1.2fr .8fr;align-items:center;gap:12px;min-height:320px;display:grid}.brand-lockup{align-items:center;gap:14px;display:flex}.brand-lockup h1{letter-spacing:-.03em;margin:0;font-family:Space Grotesk,Segoe UI,sans-serif;font-size:clamp(2.2rem,4vw,4.4rem);line-height:1}.hero-tagline{background:var(--brand-grad);color:#0000;-webkit-background-clip:text;background-clip:text;margin-top:8px;margin-bottom:0;font-size:1.45rem;font-weight:600}.hero-copy{max-width:58ch;color:var(--muted);margin-top:18px}.hero-pill-row{flex-wrap:wrap;gap:10px;margin-top:20px;display:flex}.hero-pill-row span{border:1px solid var(--line-soft);background:var(--surface-2);border-radius:999px;padding:8px 12px;font-size:.94rem}.hero-avatar{place-items:center;display:grid}.logo-mark{width:90px;height:90px;position:relative;transform:rotate(-4deg)}.logo-mark.small{width:60px;height:60px}.logo-image{object-fit:contain;filter:drop-shadow(0 0 20px #8b5cf673);display:block}.logo-image-main{width:90px;height:90px}.logo-image-small{width:60px;height:60px}.logo-layer{background:linear-gradient(#131c4c, #131c4c) padding-box, var(--brand-grad) border-box;border:2px solid #0000;border-radius:22px;position:absolute;inset:0}.layer-a{clip-path:polygon(50% 0%,88% 86%,74% 86%,50% 30%,26% 86%,12% 86%)}.layer-b{clip-path:polygon(10% 88%,50% 28%,62% 45%,35% 88%);opacity:.8}.layer-c{clip-path:polygon(90% 88%,50% 28%,38% 45%,65% 88%);opacity:.6}.logo-panel{grid-column:span 3}.logo-panel>p{color:var(--muted);margin:0 0 14px;font-size:.92rem}.logo-panel-grid{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.mini-logo{border:1px solid var(--line-soft);background:#060a1ca6;border-radius:14px;place-items:center;min-height:94px;display:grid}.mini-logo.circle{border-radius:999px}.palette-panel{grid-column:span 3}.gradient-strip{background:var(--brand-grad);border-radius:12px;height:48px;margin-bottom:14px}.swatches{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:12px;display:grid}.swatch>div{border:1px solid #ffffff2e;border-radius:8px;min-height:34px}.swatch span{text-align:center;color:var(--muted);margin-top:6px;font-size:.66rem;display:block}.mini-title{color:var(--muted);margin:0 0 10px;font-size:.8rem}.emotion-dot-row{flex-wrap:wrap;gap:10px;display:flex}.emotion-dot{border:1px solid var(--line-soft);color:var(--text);cursor:pointer;background:#0b102ae6;border-radius:999px;align-items:center;gap:6px;padding:4px 10px 4px 4px;font-size:.74rem;display:inline-flex}.emotion-dot span{border-radius:999px;width:16px;height:16px}.typography-panel{grid-column:span 3}.font-line{border-top:1px solid var(--line-soft);margin-top:10px;padding-top:10px}.font-line p{color:var(--muted);margin:0 0 3px;font-size:.83rem}.font-line h3,.font-line h4,.font-line code{margin:0;font-weight:600}.font-line h3{font-family:Space Grotesk,Segoe UI,sans-serif}.font-line h4{font-family:Plus Jakarta Sans,Segoe UI,sans-serif}.font-line code{font-family:JetBrains Mono,Consolas,monospace;font-size:1rem}.character-panel{grid-column:span 5}.character-lineup{flex-wrap:wrap;justify-content:space-between;align-items:end;gap:8px;display:flex}.lineup-item{text-align:center}.chip{border:1px solid var(--line-soft);color:var(--muted);text-transform:capitalize;cursor:pointer;background:#0c122ecc;border-radius:999px;margin-top:8px;padding:4px 10px;font-size:.75rem}.chip.active{color:#fff;box-shadow:var(--shadow-glow);border-color:#22d3eeb3}.feature-chip-row{flex-wrap:wrap;gap:8px;margin-top:14px;display:flex}.feature-chip-row span{border:1px solid var(--line-soft);background:#090e24d9;border-radius:8px;padding:6px 10px;font-size:.8rem}.feature-chip-row.slim span{font-size:.76rem}.motion-panel{grid-column:span 4}.motion-row{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.motion-step{border:1px solid var(--line-soft);text-align:center;background:#080c20cc;border-radius:12px;padding:10px 6px}.motion-step p{text-transform:capitalize;color:var(--muted);margin:8px 0 0;font-size:.78rem}.personality-panel,.tone-panel,.tagline-panel{grid-column:span 2}.personality-panel ul,.tagline-panel ul{color:var(--muted);margin:0;padding-left:18px}.personality-panel li,.tagline-panel li{margin-bottom:7px}.tone-panel p{color:var(--muted);margin:0;line-height:1.55}.tone-note{margin-top:12px;font-size:.88rem}.tone-note span{color:#f0abfc;font-weight:600}.apps-panel{grid-column:span 6}.app-grid{grid-template-columns:1fr 1fr 1.5fr;gap:10px;display:grid}.mini-app{border:1px solid var(--line-soft);background:#090e22d6;border-radius:12px;padding:12px}.mini-app p{color:var(--muted);margin:0 0 8px;font-size:.83rem}.mini-app h3{margin:0;font-family:Space Grotesk,Segoe UI,sans-serif}.mini-app>span{border:1px solid var(--line-soft);border-radius:8px;margin-top:8px;padding:6px 8px;font-family:JetBrains Mono,Consolas,monospace;font-size:.8rem;display:inline-block}.code-card pre{margin:0;overflow:auto}.code-card code{color:#a5b4fc;font-family:JetBrains Mono,Consolas,monospace;font-size:.76rem;line-height:1.6}.cta-row{flex-wrap:wrap;gap:10px;margin-top:12px;display:flex}.animora-footer{z-index:1;border-top:1px solid var(--line-soft);justify-content:space-between;align-items:center;max-width:1480px;margin:14px auto 0;padding:12px 4px 2px;display:flex;position:relative}.animora-footer p{margin:0;font-family:Space Grotesk,Segoe UI,sans-serif;font-weight:600}.animora-footer span{color:var(--muted);font-size:.84rem}.hero-avatar a{color:inherit;text-decoration:none;display:inline-block}@media (width<=1180px){.hero-panel,.logo-panel,.palette-panel,.typography-panel,.character-panel,.motion-panel,.personality-panel,.tone-panel,.tagline-panel,.apps-panel{grid-column:span 12}.app-grid{grid-template-columns:1fr}}@media (width<=760px){.animora-shell{padding:14px}.hero-panel{grid-template-columns:1fr}.motion-row{grid-template-columns:repeat(2,1fr)}.animora-footer{flex-direction:column;align-items:flex-start;gap:6px}}.building-page{color:#f1f5f9;background:linear-gradient(135deg,#0f172a 0%,#1e293b 50%,#0f172a 100%);min-height:100vh;padding:40px 20px;position:relative;overflow:hidden}.building-ambient{pointer-events:none;z-index:0;position:fixed}.ambient-one{filter:blur(60px);background:radial-gradient(circle,#8b5cf626 0%,#0000 70%);border-radius:50%;width:500px;height:500px;top:-200px;left:-200px}.ambient-two{filter:blur(60px);background:radial-gradient(circle,#00d9ff1a 0%,#0000 70%);border-radius:50%;width:400px;height:400px;bottom:-150px;right:-100px}.building-header{z-index:10;max-width:1400px;margin:0 auto 40px;position:relative}.back-link{color:#cbd5e1;margin-bottom:24px;font-weight:500;text-decoration:none;transition:all .3s;display:inline-block}.back-link:hover{color:#00d9ff;transform:translate(-4px)}.building-header h1{background:linear-gradient(90deg,#ff1493 0%,#8b5cf6 50%,#00d9ff 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:12px;font-size:2.5rem;font-weight:700}.building-header p{color:#94a3b8;font-size:1.1rem}.controls-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10;background:#0f172a99;border:1px solid #64748b33;border-radius:16px;max-width:1400px;margin:0 auto 40px;padding:32px;position:relative}.control-group{margin-bottom:32px}.control-group:last-child{margin-bottom:0}.control-group label{text-transform:uppercase;letter-spacing:.1em;color:#cbd5e1;margin-bottom:16px;font-size:.9rem;font-weight:600;display:block}.emotion-grid,.action-grid{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:12px;display:grid}.emotion-btn,.action-btn{color:#cbd5e1;cursor:pointer;text-transform:capitalize;background:#1e293bb3;border:2px solid #64748b4d;border-radius:8px;padding:10px 16px;font-size:.9rem;font-weight:500;transition:all .3s}.emotion-btn:hover,.action-btn:hover{color:#f1f5f9;background:#8b5cf61a;border-color:#8b5cf6}.emotion-btn.active,.action-btn.active{color:#fff;background:linear-gradient(135deg,#8b5cf6 0%,#00d9ff 100%);border-color:#00d9ff;box-shadow:0 0 20px #00d9ff66}.characters-grid{z-index:10;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;max-width:1400px;margin:0 auto 40px;display:grid;position:relative}.character-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1e293bb3;border:1px solid #64748b33;border-radius:16px;flex-direction:column;padding:24px;transition:all .3s;display:flex}.character-card:hover{background:#1e293be6;border-color:#00d9ff80;box-shadow:0 0 30px #00d9ff33}.card-header{border-bottom:1px solid #64748b33;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:16px;display:flex}.card-title{color:#f1f5f9;margin:0;font-size:1.2rem;font-weight:700}.card-icons{gap:12px;display:flex}.icon-btn{color:#8b5cf6;cursor:pointer;background:#8b5cf61a;border:1px solid #8b5cf64d;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;transition:all .3s;display:flex}.icon-btn:hover{background:#8b5cf633;border-color:#8b5cf6;transform:translateY(-2px)}.icon-btn.preview-btn{color:#00d9ff;background:#00d9ff1a;border-color:#00d9ff4d}.icon-btn.preview-btn:hover{background:#00d9ff33;border-color:#00d9ff}.icon-btn.code-btn{color:#ff1493;background:#ff14931a;border-color:#ff14934d}.icon-btn.code-btn:hover{background:#ff149333;border-color:#ff1493}.icon-btn.copy-btn{color:#22d3aa;background:#22d3aa1a;border-color:#22d3aa4d}.icon-btn.copy-btn:hover{background:#22d3aa33;border-color:#22d3aa}.icon-btn.copy-btn.copied{background:#22d3aa4d;border-color:#22d3aa}.card-preview{background:#0003;border-radius:12px;justify-content:center;align-items:center;min-height:200px;margin-bottom:20px;padding:20px;display:flex}.card-expanded{background:#0000004d;border-radius:8px;margin-bottom:20px;padding:16px;overflow:hidden}.code-block{background:#0f172a;border-radius:8px;padding:16px;overflow-x:auto}.code-block pre{margin:0;font-family:Fira Code,monospace;font-size:.85rem;line-height:1.5}.code-block code{color:#cbd5e1}.card-info{border-top:1px solid #64748b33;flex-direction:column;gap:8px;padding-top:16px;display:flex}.emotion-label,.action-label{color:#94a3b8;margin:0;font-size:.85rem}.emotion-label strong,.action-label strong{color:#cbd5e1}.building-info{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10;background:#1e293b99;border:1px solid #64748b33;border-radius:16px;max-width:1400px;margin:40px auto 0;padding:32px;position:relative}.building-info h2{color:#f1f5f9;margin:0 0 20px;font-size:1.5rem}.building-info ul{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin:0;padding:0;list-style:none;display:grid}.building-info li{color:#cbd5e1;border-bottom:1px solid #64748b1a;padding:12px 0;font-size:.95rem;line-height:1.6}.building-info li:last-child{border-bottom:none}.building-info strong{color:#00d9ff}@media (width<=768px){.building-header h1{font-size:1.8rem}.controls-section{padding:20px}.emotion-grid,.action-grid{grid-template-columns:repeat(auto-fit,minmax(80px,1fr))}.characters-grid,.building-info ul{grid-template-columns:1fr}}
