:root{font-family:Sora,Avenir Next,Segoe UI,sans-serif;line-height:1.4;font-weight:400;text-rendering:optimizeLegibility;font-synthesis:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0}:root{color:#0f172a;background:#f6f8fc}*{box-sizing:border-box}button{cursor:pointer;border-radius:10px;border:1px solid #94a3b8;background:#f8fafc;color:#0f172a;padding:.5rem .7rem;font-size:.85rem;font-weight:600;font-family:inherit}button:hover:not(:disabled){background:#e2e8f0}button:disabled{cursor:not-allowed;opacity:.55}h1,h2,h3,p{margin:0}.app-root{min-height:100vh;background:#f6f8fc;color:#0f172a}.top-nav{position:sticky;top:0;z-index:40;height:72px;border-bottom:1px solid rgba(15,23,42,.12);background:#fff;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;padding:0 1rem}.brand-block{display:inline-flex;align-items:center;gap:.6rem;border:0;background:transparent;padding:0;font-size:1.75rem;font-weight:800;letter-spacing:-.03em}.brand-logo{width:2rem;height:2rem;display:inline-grid;place-items:center;border-radius:.55rem;background:linear-gradient(145deg,#fb7185,#ef4444);color:#fff;font-size:1.15rem;font-weight:800}.top-nav-links{display:flex;align-items:center;gap:.4rem}.top-nav-links button{border:0;background:transparent;padding:.45rem .6rem;color:#1e293b}.top-nav-links button:hover{background:#eef2ff}.top-nav-actions{display:flex;align-items:center;gap:.5rem}.nav-primary{border-color:#0f172a;background:#0f172a;color:#fff;padding-inline:1rem}.nav-primary:hover:not(:disabled){background:#0b1220}.inline-action{background:#fff;border:1px solid #cbd5e1}.page-shell{padding:1.25rem}.templates-page{display:grid;gap:1rem}.templates-hero{border-radius:16px;border:1px solid rgba(148,163,184,.28);background:linear-gradient(145deg,#c0d6ff59,#ffe2eb5c);padding:1rem;display:grid;gap:.8rem}.hero-actions-row{display:flex;justify-content:space-between;align-items:center;gap:.6rem}.hero-toggle-group{display:inline-flex;gap:.5rem}.hero-toggle{background:#fff;border:1px solid #d5deea}.hero-toggle-active{background:#0f172a;border-color:#0f172a;color:#fff}.ghost-button{background:#fff}.hero-device-list{display:flex;flex-wrap:wrap;gap:.45rem}.device-chip{border:1px solid #cbd5e1;background:#fff}.device-chip-active{border-color:#0f172a;background:#0f172a;color:#fff}.hero-selected-template{display:grid;grid-template-columns:minmax(220px,280px) 1fr;gap:.9rem;align-items:stretch}.template-preview-tile{border-radius:14px;border:1px solid rgba(255,255,255,.28);width:100%;max-width:270px;aspect-ratio:2 / 3;overflow:hidden;background:#0f172a}.template-scene{width:100%;height:100%}.template-scene-svg{width:100%;height:100%;display:block}.template-preview-meta{border-radius:14px;border:1px solid rgba(148,163,184,.27);background:#ffffffdb;padding:.9rem;display:grid;gap:.55rem}.template-preview-meta h2{font-size:1.15rem;letter-spacing:-.02em}.template-preview-meta p{color:#475569;line-height:1.35;font-size:.9rem}.templates-toolbar{display:flex;justify-content:space-between;align-items:center;gap:.8rem}.templates-toolbar h2{text-transform:uppercase;letter-spacing:.04em;color:#0f172a;font-size:1.35rem}.template-search{width:min(420px,100%);border:1px solid #cbd5e1;border-radius:12px;padding:.58rem .72rem;font-family:inherit;font-size:.9rem}.template-categories{display:flex;flex-wrap:wrap;gap:.5rem}.category-chip{background:#fff;border:1px solid #d8e1ed}.category-chip-active{background:#0f172a;border-color:#0f172a;color:#fff}.template-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(520px,1fr));gap:.85rem}.template-card{border:1px solid rgba(148,163,184,.24);background:#fff;border-radius:14px;padding:.72rem;display:grid;gap:.65rem}.template-visual{border:1px solid rgba(148,163,184,.5);border-radius:12px;padding:0;aspect-ratio:16 / 6;overflow:hidden;background:#0f172a;transition:border-color .12s ease,box-shadow .12s ease}.template-visual:hover{border-color:#38bdf8}.template-visual-active{border-color:#0284c7;box-shadow:0 0 0 2px #0ea5e933}.template-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.26rem;width:100%;height:100%;padding:.28rem;background:#ffffff0f}.template-strip-panel{border-radius:9px;overflow:hidden;border:1px solid rgba(255,255,255,.24);background:#0f172a}.template-card-footer{display:grid;grid-template-columns:1fr auto;gap:.6rem;align-items:center}.template-card-footer strong{display:block}.template-card-footer small{color:#475569;font-size:.76rem;line-height:1.3}.saved-page,.pricing-page,.profile-page{border:1px solid rgba(148,163,184,.22);border-radius:16px;background:#fff;padding:1rem;display:grid;gap:1rem}.saved-header{display:flex;justify-content:space-between;align-items:center;gap:.8rem}.saved-header-left{display:grid;gap:.3rem}.saved-header-left h1,.pricing-header h1,.profile-page h1{font-size:2rem;letter-spacing:-.04em}.saved-header-left p,.pricing-header p{color:#64748b}.saved-empty{border:1px dashed #cbd5e1;border-radius:12px;padding:1rem;display:grid;gap:.7rem;justify-items:start}.saved-table-shell{overflow-x:auto}.saved-table{width:100%;border-collapse:collapse;min-width:740px}.saved-table th,.saved-table td{text-align:left;padding:.7rem .55rem;border-bottom:1px solid #e2e8f0}.saved-table th{color:#475569;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em}.saved-actions{display:flex;gap:.4rem}.pricing-header{display:grid;gap:.35rem;text-align:center}.pricing-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}.pricing-card{border:1px solid #cbd5e1;border-radius:14px;padding:1rem;display:grid;gap:.7rem}.pricing-card h2{font-size:1.4rem}.pricing-price{font-size:2.3rem;font-weight:800;letter-spacing:-.05em}.pricing-price span{font-size:1rem;font-weight:600;margin-left:.2rem;color:#475569}.pricing-card ul{margin:0;padding-left:1rem;display:grid;gap:.35rem;color:#1e293b}.pricing-card-pro{border-color:#2563eb;background:linear-gradient(170deg,#dbeafe73,#fffffff5)}.profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.profile-plan-card{border:1px solid #d9e2ed;background:#f8fafc;border-radius:14px;padding:1rem;display:grid;gap:.65rem}.app-shell{min-height:calc(100vh - 130px);display:grid;grid-template-columns:380px 1fr;background:radial-gradient(circle at 10% 0%,rgba(56,189,248,.2),transparent 26%),radial-gradient(circle at 85% 100%,rgba(14,116,144,.16),transparent 34%),#eef2f8;border-radius:16px;overflow:hidden;border:1px solid rgba(148,163,184,.2)}.control-panel{border-right:1px solid rgba(15,23,42,.14);background:#ffffffe0;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.9rem}.control-section{background:#fff;border-radius:14px;border:1px solid rgba(148,163,184,.3);padding:.8rem;display:flex;flex-direction:column;gap:.6rem;box-shadow:0 1px 1px #0f172a0a}.control-section h1{font-size:1.25rem;letter-spacing:-.02em}.control-section h2{font-size:.95rem;letter-spacing:.02em;text-transform:uppercase;color:#334155}.subtitle{color:#475569;font-size:.85rem}.field{display:flex;flex-direction:column;gap:.25rem}.field>span{font-size:.77rem;color:#334155;font-weight:600}.field input,.field select,.field textarea,.inline-action{border:1px solid #cbd5e1;border-radius:10px;background:#fff;padding:.48rem .58rem;font-family:inherit;font-size:.85rem;color:#0f172a}.field textarea{resize:vertical;min-height:70px}.inline-buttons{display:flex;gap:.45rem;flex-wrap:wrap}.chip-active{border-color:#0f172a;background:#0f172a;color:#fff}.layer-action-row button{flex:1 1 auto}.danger-button{border-color:#ef4444;color:#991b1b}.small-note{font-size:.75rem;color:#475569;line-height:1.3}.design-list{display:grid;gap:.4rem}.design-item{text-align:left;padding:.5rem .56rem;display:flex;flex-direction:column;gap:.2rem;background:#f8fafc}.design-item small{color:#64748b}.design-item-active{border-color:#0ea5e9;background:#ecfeff}.layer-editor{display:grid;gap:.4rem}.asset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem}.icon-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.45rem}.icon-item{display:flex;flex-direction:column;gap:.32rem;align-items:center;justify-content:center;border:1px solid #cbd5e1;background:#f8fafc;min-height:88px;padding:.35rem;overflow:hidden}.icon-item svg{width:28px;height:28px}.icon-item span{font-size:.67rem;line-height:1.2;color:#334155;text-align:center}.sticker-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem}.sticker-item{display:flex;flex-direction:column;gap:.32rem;align-items:center;justify-content:center;border:1px solid #cbd5e1;background:#f8fafc;min-height:110px;padding:.4rem;overflow:hidden}.sticker-item img{max-width:100%;max-height:78px;object-fit:contain}.sticker-item span{font-size:.67rem;line-height:1.2;color:#334155;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;text-align:center}.asset-item{display:flex;flex-direction:column;gap:.32rem;align-items:center;justify-content:center;border:1px solid #cbd5e1;background:#f8fafc;min-height:86px;padding:.4rem;overflow:hidden}.asset-item img{max-width:100%;max-height:48px;object-fit:contain}.asset-item span{font-size:.68rem;line-height:1.2;color:#334155;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}.canvas-area{min-height:calc(100vh - 140px);padding:1rem;display:flex;justify-content:center;align-items:flex-start}.editor-canvas-shell{width:100%;display:flex;justify-content:center}.canvas-drop-zone{border:2px solid rgba(15,23,42,.14);border-radius:18px;background:linear-gradient(145deg,#f8fafc,#f1f5f9);padding:.9rem;display:flex;flex-direction:column;align-items:center;gap:.5rem;width:fit-content;max-width:calc(100vw - 420px);transition:border-color .12s ease,background-color .12s ease}.drop-zone-active{border-color:#0284c7;background:#e0f2fe}.editor-stage{border-radius:12px;overflow:hidden;border:1px solid rgba(15,23,42,.2);background:#0f172a}.canvas-hint{font-size:.75rem;color:#334155;text-align:center}.hidden-input{display:none}.empty-state{border:1px dashed #94a3b8;border-radius:18px;padding:2rem;font-size:1rem;color:#334155}@media(max-width:1200px){.top-nav{grid-template-columns:1fr;height:auto;padding-block:.75rem}.top-nav-links{flex-wrap:wrap}.hero-selected-template{grid-template-columns:1fr}.template-preview-tile{max-width:240px}.pricing-grid,.profile-grid{grid-template-columns:1fr}}@media(max-width:1100px){.app-shell{grid-template-columns:1fr}.control-panel{border-right:0;border-bottom:1px solid rgba(15,23,42,.14);max-height:48vh}.canvas-area{min-height:52vh;align-items:center}.canvas-drop-zone{max-width:95vw}}@media(max-width:760px){.page-shell{padding:.7rem}.saved-header,.hero-actions-row{flex-direction:column;align-items:flex-start}.hero-toggle-group{flex-wrap:wrap}.template-grid{grid-template-columns:1fr}.template-visual{aspect-ratio:4 / 3}.template-strip{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr}}