:root{--page: #f6f8fb;--paper: #ffffff;--paper-soft: #f9fbfc;--ink: #17201f;--muted: #66726f;--subtle: #8b9692;--line: #dfe7e5;--line-strong: #c8d4d1;--green: #0f766e;--green-2: #1aa38f;--coral: #e46f52;--blue: #dcebf5;--blue-2: #edf6fb;--yellow: #f7d889;--shadow: 0 24px 70px rgba(21, 44, 44, .14)}*{box-sizing:border-box}html,body,#root{min-height:100%;overflow-x:hidden}body{margin:0;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Helvetica Neue,Arial,ui-sans-serif,system-ui,sans-serif;letter-spacing:0;background:radial-gradient(circle at 8% 0%,rgba(26,163,143,.12),transparent 28%),radial-gradient(circle at 90% 8%,rgba(228,111,82,.12),transparent 26%),var(--page)}button,input,select{font:inherit}button{color:inherit}h1,h2,h3,p{margin:0}.eyebrow{color:var(--green);font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.home-page{width:100%;max-width:100vw;min-height:100vh;overflow-x:clip;background:linear-gradient(180deg,#f7faf9,#fff 44%,#eef6fb);color:var(--ink)}.home-nav{position:fixed;inset:0 0 auto;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:16px clamp(18px,4vw,56px);border-bottom:1px solid rgba(223,231,229,.72);background:#f6f8fbc7;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.home-brand,.home-nav nav,.home-actions{display:flex;align-items:center}.home-brand{gap:10px;padding:0;border:0;background:transparent;color:var(--ink);cursor:pointer;font-size:15px;font-weight:900}.mark{display:grid;width:38px;height:38px;place-items:center;border-radius:10px;background:var(--ink);color:#fff;font-family:Georgia,serif;font-weight:900}.home-brand img{display:block;width:clamp(190px,18vw,260px);height:auto}.mark img{display:block;width:100%;height:100%}.home-nav nav{gap:22px}.home-nav nav a,.home-nav nav button{color:var(--muted);font-size:13px;font-weight:800;text-decoration:none}.home-nav nav button{height:38px;padding:0 16px;border:1px solid var(--line);border-radius:999px;background:var(--paper);cursor:pointer;box-shadow:0 8px 22px #152c2c14}.home-hero{position:relative;display:grid;grid-template-columns:minmax(0,560px) minmax(0,760px);justify-content:center;gap:clamp(42px,5vw,92px);align-items:center;min-height:92vh;overflow:hidden;width:100%;max-width:100vw;padding:clamp(116px,17vh,176px) clamp(22px,4vw,72px) 96px;background:linear-gradient(90deg,#f7faf9,#f7faf9eb 44%,#f7faf961),radial-gradient(circle at 78% 20%,rgba(15,118,110,.16),transparent 26%),radial-gradient(circle at 84% 78%,rgba(228,111,82,.15),transparent 34%),#f7faf9}.hero-scene{position:relative;z-index:1;grid-column:2;grid-row:1;width:min(760px,100%);min-height:610px;justify-self:center;pointer-events:auto}.hero-generated,.hero-template-card,.hero-photo-card,.hero-note{position:absolute;display:grid;place-items:center;border:1px solid rgba(23,32,31,.1);border-radius:0;background:#ffffff94;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.hero-generated{overflow:hidden;padding:16px}.hero-template-card{overflow:hidden;padding:14px;cursor:pointer;transition:z-index 0s,transform .22s ease,box-shadow .22s ease,opacity .22s ease;will-change:transform}.hero-template-card canvas{display:block;width:100%;height:100%;border-radius:0;object-fit:contain;box-shadow:0 22px 52px #152c2c2e}.hero-photo-card{overflow:hidden;padding:14px}.hero-photo-card img{display:block;width:100%;height:100%;min-height:0;border-radius:0;object-fit:cover;box-shadow:0 22px 52px #152c2c2e}.hero-photo-caption{position:absolute;left:26px;right:26px;bottom:26px;display:grid;gap:4px;padding:12px 14px;border:1px solid rgba(255,255,255,.24);border-radius:0;background:#12181785;color:#fffaf0;text-align:left;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.hero-photo-caption span{font-size:10px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.hero-photo-caption strong{font-size:18px;line-height:1.05}.hero-generated canvas{display:block;border-radius:0;box-shadow:0 22px 52px #152c2c2e}.hero-photo-card-main{z-index:2;left:8%;top:38px;width:360px;height:445px;transform:rotate(-2.5deg)}.hero-template-card-main{z-index:2;left:6%;top:36px;width:360px;aspect-ratio:3 / 4;--hero-card-transform: rotate(-2.4deg);--hero-card-hover-transform: translate(16px, -18px) rotate(-1deg) scale(1.035);transform:var(--hero-card-transform)}.hero-photo-card-main img{object-position:center 58%}.hero-photo-card-side{z-index:1;right:4%;top:112px;width:258px;height:406px;transform:rotate(2.8deg)}.hero-template-card-side{z-index:1;right:4%;top:112px;width:250px;aspect-ratio:9 / 16;--hero-card-transform: rotate(2.8deg);--hero-card-hover-transform: translate(-22px, -18px) rotate(1.2deg) scale(1.035);transform:var(--hero-card-transform)}.hero-photo-card-side img{object-position:center center}.hero-generated-grid{z-index:4;right:16%;bottom:44px;width:285px;height:auto;aspect-ratio:1 / 1;transform:rotate(-1.2deg)}.hero-template-card-front{z-index:4;right:27%;bottom:42px;width:300px;aspect-ratio:1 / 1;--hero-card-transform: rotate(-1.2deg);--hero-card-hover-transform: translate(-18px, -12px) rotate(-.2deg) scale(1.04);transform:var(--hero-card-transform)}@media(hover:hover)and (pointer:fine){.hero-scene:has(.hero-template-card:hover) .hero-template-card{opacity:.76}.hero-template-card:hover{z-index:8;opacity:1!important;transform:var(--hero-card-hover-transform);box-shadow:0 34px 82px #152c2c42}}.hero-generated .poster-preview,.hero-generated .grid-preview{width:100%;height:100%;object-fit:contain}.hero-note{z-index:5;left:0;bottom:142px;justify-items:start;width:176px;padding:15px;transform:rotate(-2deg);opacity:.92}.hero-note span{color:var(--coral);font-size:11px;font-weight:950;text-transform:uppercase}.hero-note strong{margin-top:4px;font-size:20px;line-height:.95}.hero-note small{margin-top:10px;color:var(--muted);font-size:11px;line-height:1.45}.hero-palette{position:absolute;z-index:6;top:58px;right:8%;display:flex;gap:8px;transform:rotate(2deg)}.hero-palette i{width:30px;height:30px;border-radius:8px;box-shadow:inset 0 0 0 1px #ffffff59}.home-hero-copy{position:relative;z-index:2;grid-column:1;grid-row:1;min-width:0;max-width:560px}.home-hero-copy h1{margin-top:12px;max-width:8.2em;font-size:clamp(54px,6.7vw,92px);font-weight:950;line-height:.88}.home-hero-copy>p:not(.eyebrow){max-width:31em;margin-top:24px;color:var(--muted);font-size:clamp(16px,1.6vw,20px);line-height:1.72}.home-actions{gap:16px;margin-top:34px;flex-wrap:wrap}.home-actions button,.home-final button,.primary-button,.download-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 22px;border:0;border-radius:999px;background:var(--coral);color:#fff;cursor:pointer;font-weight:900;box-shadow:0 16px 34px #e46f523d}.primary-button.share-button{background:#214f63;box-shadow:0 16px 34px #214f632e}.home-actions a{color:var(--green);font-size:14px;font-weight:900;text-decoration:none}.home-hero-copy small{display:block;margin-top:18px;color:var(--subtle);font-size:12px;font-weight:750}.home-section{padding:78px clamp(22px,7vw,96px);background:var(--paper)}.home-section-head{max-width:840px}.home-section-head h2,.home-final h2{margin-top:10px;font-size:clamp(34px,5vw,68px);line-height:1}.template-showcase .home-section-head h2{max-width:10.5em;font-size:clamp(40px,5vw,72px)}.home-section-head>p:not(.eyebrow){margin-top:18px;color:var(--muted);font-size:15px;line-height:1.7}.showcase-layout{display:grid;gap:clamp(34px,5vw,64px)}.showcase-metrics{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}.showcase-metrics span{padding:8px 11px;border:1px solid var(--line);border-radius:999px;background:var(--paper-soft);color:var(--green);font-size:12px;font-weight:900}.template-showcase-grid{display:grid;grid-template-columns:repeat(var(--showcase-columns, 3),minmax(0,1fr));gap:20px;align-items:start}.template-showcase-column{display:grid;gap:20px;align-content:start}.template-showcase-grid article{position:relative;width:100%;padding:14px;border:1px solid var(--line);border-radius:0;background:#f9fbfcdb;box-shadow:0 18px 56px #152c2c14}.mini-preview-button{display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in;text-align:inherit}.mini-preview-button:focus-visible{outline:3px solid rgba(15,118,110,.3);outline-offset:4px;border-radius:0}.template-showcase-grid article{transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}.template-showcase-grid article:has(.mini-preview-button:hover){border-color:#0f766e47;box-shadow:0 22px 62px #152c2c1f;transform:translateY(-2px)}.template-index{position:absolute;top:14px;right:14px;z-index:2;display:grid;width:32px;height:32px;place-items:center;border-radius:999px;background:#ffffffd1;color:var(--coral);font-size:11px;font-weight:950;box-shadow:0 8px 20px #152c2c1a}.mini-preview{position:relative;display:grid;place-items:center;overflow:hidden;aspect-ratio:var(--preview-aspect, 4 / 5);width:100%;margin-bottom:16px;border-radius:0;background:#edf6fb}.mini-preview img{display:block;width:100%;height:100%;object-fit:cover}.mini-preview canvas{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;border-radius:0;box-shadow:0 12px 28px #152c2c21}.mini-preview canvas.grid-preview{width:100%;height:100%}.template-showcase-grid h3,.home-features h3{margin-bottom:8px;font-size:18px}.template-showcase-grid p,.home-features p{color:var(--muted);font-size:14px;line-height:1.55}.home-features{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}.home-features article{padding:52px clamp(22px,4vw,54px);background:var(--blue-2)}.home-features span{color:var(--coral);font-size:12px;font-weight:950}.home-final{display:grid;gap:28px;justify-items:center;padding:86px 22px;background:var(--paper);text-align:center}.app-shell{display:grid;grid-template-columns:392px minmax(0,1fr);min-height:100vh;overflow-x:hidden;background:var(--page)}.left-panel{height:100vh;overflow-y:auto;padding:0 18px 26px;border-right:1px solid var(--line);background:var(--paper)}.brand-row{position:sticky;top:0;z-index:8;display:flex;align-items:center;margin:0 -18px 16px;padding:16px 18px 14px;border-bottom:1px solid rgba(21,44,44,.08);background:#fffdf7f0;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.microcopy,.status-bar,.field span,.range-field span,.sample-row button{color:var(--muted)}.studio-brand-button{display:inline-flex;align-items:center;width:220px;max-width:100%;padding:0;border:0;background:transparent;cursor:pointer}.studio-brand-button img{display:block;width:100%;height:auto}.drop-zone{display:grid;grid-template-columns:20px 1fr;gap:4px 10px;align-items:center;min-height:84px;margin-bottom:12px;padding:16px;border:1px dashed var(--line-strong);border-radius:16px;background:var(--blue-2);cursor:pointer;transition:border-color .16s ease,transform .16s ease,background .16s ease}.drop-zone:hover{border-color:var(--green);background:#eefaf7;transform:translateY(-1px)}.drop-zone svg,.group-label svg,.toggle-row svg{color:var(--green)}.drop-zone span{font-size:14px;font-weight:800}.drop-zone small{grid-column:2;color:var(--muted);font-size:12px}.sample-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}.sample-row button,.template-showcase-grid article,.photo-tray,.field input,.toggle-row,.segmented,.ghost-button,.workflow-panel,.workflow-tabs,.template-tabs button,.choice-grid button{box-shadow:0 1px #152c2c08}.sample-row button{display:flex;min-width:0;min-height:40px;align-items:center;justify-content:flex-start;gap:8px;overflow:hidden;padding:3px 9px 3px 3px;border:1px solid var(--line);border-radius:999px;background:var(--paper);cursor:pointer;font-size:12px;font-weight:750}.sample-row img{width:32px;height:32px;flex:0 0 auto;border-radius:999px;object-fit:cover;box-shadow:inset 0 0 0 1px #0000001a}.photo-tray{margin-bottom:18px;padding:10px;border:1px solid var(--line);border-radius:16px;background:var(--paper-soft)}.tray-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;font-size:12px}.tray-head span{color:var(--muted);font-weight:800}.photo-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.photo-strip button{position:relative;overflow:hidden;aspect-ratio:1;padding:0;border:2px solid transparent;border-radius:14px;background:var(--blue);cursor:pointer}.photo-strip button.active{border-color:var(--green)}.photo-strip img{display:block;width:100%;height:100%;object-fit:cover}.photo-strip button>span{position:absolute;right:5px;bottom:5px;display:grid;width:20px;height:20px;place-items:center;border-radius:999px;background:#17201fd1;color:#fff;font-size:11px;font-weight:900}.workflow-panel{overflow:hidden;border:1px solid var(--line);border-radius:18px;background:var(--paper)}.workflow-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;padding:5px;background:var(--paper-soft);border-bottom:1px solid var(--line)}.workflow-tabs button{display:grid;min-width:0;height:56px;place-items:center;gap:4px;border:0;border-radius:13px;background:transparent;color:var(--muted);cursor:pointer;font-size:11px;font-weight:900}.workflow-tabs svg{color:currentColor}.workflow-tabs button.active{background:var(--ink);color:#fff}.tab-panel{padding:16px}.group-label{display:flex;align-items:center;gap:9px;margin-bottom:12px;color:var(--ink);font-size:12px;font-weight:900;text-transform:uppercase}.field-label{margin:14px 0 8px;color:var(--muted);font-size:11px;font-weight:900;text-transform:uppercase}.field{display:block;margin-bottom:10px}.field span,.range-field>span{display:flex;justify-content:space-between;margin-bottom:6px;font-size:11px;font-weight:800}.field input{width:100%;height:40px;border:1px solid var(--line);border-radius:12px;background:var(--paper-soft);color:var(--ink);outline:none;padding:0 12px}.field input:focus{border-color:var(--green);box-shadow:0 0 0 4px #0f766e1f}.template-tabs,.choice-grid{display:grid;gap:8px}.template-tabs{grid-template-columns:1fr 1fr}.template-tabs button,.choice-grid button{min-width:0;border:1px solid var(--line);border-radius:13px;background:var(--paper-soft);color:var(--ink);cursor:pointer;text-align:left;transition:border-color .16s ease,background .16s ease,transform .16s ease}.template-tabs button{min-height:72px;padding:11px}.template-tabs button:hover,.choice-grid button:hover{border-color:#0f766e6b;transform:translateY(-1px)}.template-tabs button.active,.choice-grid button.active{border-color:#0f766eb8;background:#eefaf7;box-shadow:inset 0 0 0 1px #0f766e33}.template-tabs strong,.template-tabs small,.choice-grid strong,.choice-grid small{display:block}.template-tabs strong{font-size:13px;line-height:1.16}.template-tabs small,.choice-grid small{margin-top:5px;color:var(--muted);font-size:11px;line-height:1.25}.size-grid{grid-template-columns:repeat(2,1fr)}.size-grid button{min-height:58px;padding:10px}.size-grid strong{font-size:12px}.export-entitlement{display:flex;align-items:center;gap:9px;min-height:42px;margin-top:12px;padding:10px 12px;border:1px solid rgba(228,111,82,.22);border-radius:14px;background:#fff7f3;color:var(--coral);font-size:12px;font-weight:900;line-height:1.35}.export-entitlement.pro{border-color:#0f766e4d;background:#eefaf7;color:var(--green)}.stage-panel{display:grid;grid-template-rows:auto minmax(0,1fr) auto;min-width:0;background:linear-gradient(rgba(21,44,44,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(21,44,44,.035) 1px,transparent 1px),linear-gradient(135deg,var(--blue-2),#ffffff 44%,#fff7f3);background-size:40px 40px,40px 40px,auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 28px;border-bottom:1px solid rgba(21,44,44,.09);background:#ffffff6b;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.topbar h2{margin-top:4px;font-size:26px;line-height:1.05}.topbar-actions{display:flex;align-items:center;gap:8px}.account-pill{display:inline-flex;align-items:center;justify-content:center;height:38px;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--muted);font-size:12px;font-weight:800}.account-pill{gap:7px;padding:0 13px;cursor:pointer;white-space:nowrap}.account-pill.pro{border-color:#e46f5247;background:#fff5f0;color:var(--coral)}.canvas-zone{position:relative;display:grid;min-height:0;place-items:center;padding:28px}.canvas-frame{display:grid;width:min(760px,62vw,calc((100vh - 220px) * var(--preview-ratio)));max-width:760px;max-height:calc(100vh - 220px);overflow:hidden;place-items:center;border:1px solid rgba(21,44,44,.08);border-radius:0;box-shadow:var(--shadow)}.canvas-frame canvas{display:block;width:100%;height:100%;background:var(--paper);cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}.canvas-frame canvas:active{cursor:grabbing}.processing-overlay{position:absolute;inset:28px;z-index:3;display:grid;max-width:360px;place-items:center;align-self:center;justify-self:center;gap:8px;padding:22px;border:1px solid rgba(223,231,229,.86);border-radius:20px;background:#ffffffc7;color:var(--ink);text-align:center;box-shadow:0 24px 70px #152c2c24;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.processing-overlay strong{font-size:14px;font-weight:900}.processing-overlay small{max-width:28em;color:var(--muted);font-size:12px;line-height:1.45}.loader-ring{width:34px;height:34px;border:3px solid rgba(15,118,110,.18);border-top-color:var(--green);border-radius:999px;animation:spin .78s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.status-bar{display:flex;justify-content:space-between;gap:12px;padding:13px 28px;border-top:1px solid rgba(21,44,44,.09);background:#ffffff6b;font-size:12px}.palette-picker-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;margin-top:12px}.palette-pick{aspect-ratio:1;min-width:0;border:2px solid rgba(255,255,255,.78);border-radius:14px;box-shadow:inset 0 0 0 1px #0b16151f,0 8px 18px #0f232314;cursor:pointer}.palette-pick:hover{transform:translateY(-1px);box-shadow:inset 0 0 0 1px #0b161529,0 12px 24px #0f23231f}.custom-color-field{display:grid;grid-template-columns:1fr 74px;align-items:center;gap:12px;min-height:50px;margin-top:12px;padding:8px 10px 8px 14px;border:1px solid var(--line);border-radius:16px;background:var(--paper-soft);color:var(--muted);font-size:12px;font-weight:900}.custom-color-field input{width:74px;height:34px;padding:2px;border:1px solid rgba(17,31,30,.12);border-radius:12px;background:#fff;cursor:pointer}.range-field{display:block;margin-top:12px}.range-field strong{color:var(--ink);font-size:11px}input[type=range]{width:100%;accent-color:var(--green)}.ghost-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;height:38px;margin-top:12px;border:1px solid var(--line);border-radius:999px;background:var(--paper-soft);color:var(--ink);cursor:pointer;font-size:13px;font-weight:850}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:42px;margin-top:8px;padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:var(--paper-soft);cursor:pointer}.toggle-row span{display:flex;align-items:center;gap:8px;color:var(--ink);font-size:12px;font-weight:800;text-align:left}.toggle-row i{min-width:38px;padding:4px 8px;border-radius:999px;background:#e8efed;color:var(--muted);font-size:11px;font-style:normal;font-weight:900;text-align:center}.toggle-row.on{border-color:#0f766e59;background:#eefaf7}.toggle-row.on i{background:var(--green);color:#fff}.font-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:384px;margin-top:8px;padding-right:2px;overflow-y:auto}.font-grid button{position:relative;display:grid;gap:4px;min-height:90px;padding:10px;border:1px solid var(--line);border-radius:14px;background:var(--paper-soft);color:var(--ink);cursor:pointer;text-align:left}.font-grid button strong{font-family:var(--font-preview);font-size:26px;line-height:.95}.font-grid button span{display:grid;gap:4px;font-size:12px;font-weight:850}.font-grid button em{width:fit-content;padding:2px 6px;border-radius:999px;background:#0f766e17;color:var(--green);font-size:9px;font-style:normal;font-weight:900;letter-spacing:.04em;text-transform:uppercase}.font-grid button small{color:var(--muted);font-size:10px;line-height:1.25}.font-grid button.active{border-color:#0f766e73;background:#eefaf7;box-shadow:inset 0 0 0 1px #0f766e14}.font-grid button.recommended:not(.active){border-color:#0f766e38}.segmented{display:grid;grid-template-columns:repeat(3,1fr);overflow:hidden;border:1px solid var(--line);border-radius:999px;background:var(--paper-soft)}.segmented button{height:36px;border:0;border-right:1px solid var(--line);background:transparent;color:var(--muted);cursor:pointer;font-size:12px;font-weight:900}.segmented button:last-child{border-right:0}.segmented button.active{background:var(--green);color:#fff}.color-targets{grid-template-columns:repeat(2,1fr)}.auto-grid-summary{display:flex;align-items:center;gap:9px;min-height:42px;margin-top:10px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--paper-soft);color:var(--muted);font-size:12px;font-weight:800;line-height:1.35}.auto-grid-summary svg{flex:0 0 auto;color:var(--green)}.download-button{width:100%;margin-top:12px}.download-button.warm{border:1px solid rgba(15,118,110,.28);background:var(--green);box-shadow:0 16px 34px #0f766e2e}.download-button.share{background:#214f63;box-shadow:0 16px 34px #214f6329}.template-use-button{width:auto;min-width:190px;margin-top:22px;padding:0 20px}.download-button:disabled{cursor:not-allowed;opacity:.5}.microcopy{margin-top:10px;font-size:11px;line-height:1.5}.product-footer{display:grid;gap:7px;margin-top:18px;padding:16px 0 4px;border-top:1px solid var(--line);color:var(--muted);font-size:11px;line-height:1.45}.product-footer strong{color:var(--ink);font-size:12px}.product-footer div{display:flex;gap:10px;margin-top:2px}.product-footer button{padding:0;border:0;background:transparent;color:var(--green);cursor:pointer;font-size:11px;font-weight:900}.modal-backdrop{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:22px;background:#0c12126b;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.template-preview-backdrop{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:24px;background:#0c121275;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.template-preview-modal{position:relative;display:grid;grid-template-columns:minmax(280px,.74fr) minmax(240px,.26fr);gap:24px;align-items:center;width:min(1040px,100%);max-height:min(860px,92vh);padding:28px;overflow:auto;border:1px solid var(--line);border-radius:26px;background:var(--paper);box-shadow:var(--shadow)}.template-preview-large{display:grid;min-height:0;place-items:center;overflow:hidden;border-radius:20px;background:var(--paper-soft)}.template-preview-large canvas{display:block;width:auto;height:auto;max-width:100%;max-height:78vh;object-fit:contain;border-radius:16px;box-shadow:0 18px 48px #152c2c29}.template-preview-large.poster canvas{width:auto;height:auto}.template-preview-large.grid canvas{width:auto;height:auto}.template-preview-copy h2{margin-top:8px;font-size:clamp(28px,4vw,46px);line-height:.98}.template-preview-copy p:not(.eyebrow){margin-top:14px;color:var(--muted);font-size:15px;line-height:1.65}.info-modal{position:relative;width:min(620px,100%);padding:30px;border:1px solid var(--line);border-radius:24px;background:var(--paper);box-shadow:var(--shadow)}.pro-modal{position:relative;width:min(560px,100%);padding:30px;border:1px solid rgba(228,111,82,.18);border-radius:26px;background:radial-gradient(circle at 84% 10%,rgba(228,111,82,.14),transparent 34%),var(--paper);box-shadow:var(--shadow)}.pro-modal h2{max-width:10em;margin-top:8px;font-size:clamp(30px,5vw,46px);line-height:.98}.pro-modal p:not(.eyebrow){margin-top:14px;color:var(--muted);font-size:14px;line-height:1.65}.pro-benefits{display:grid;gap:8px;margin-top:18px}.pro-benefits span{display:inline-flex;align-items:center;gap:9px;min-height:36px;padding:9px 11px;border:1px solid var(--line);border-radius:13px;background:#f9fbfcd1;color:var(--ink);font-size:12px;font-weight:900}.pro-benefits svg{color:var(--coral)}.email-field{display:grid;gap:8px;margin-top:18px;color:var(--muted);font-size:11px;font-weight:900;text-transform:uppercase}.email-field div{display:flex;align-items:center;gap:10px;height:46px;padding:0 12px;border:1px solid var(--line);border-radius:14px;background:var(--paper-soft);color:var(--muted)}.email-field input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:var(--ink);font-size:14px;font-weight:800}.pro-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:6px}.pro-actions .download-button{min-height:46px;height:auto;padding-top:10px;padding-bottom:10px;line-height:1.08}.pro-message{padding:10px 12px;border:1px solid rgba(18,39,38,.1);border-radius:14px;background:#ffffffb8;color:var(--ink)!important;font-size:12px!important;font-weight:800}.pro-celebration{position:fixed;inset:0;z-index:90;display:grid;place-items:center;pointer-events:none;overflow:hidden}.pro-celebration strong{padding:13px 18px;border:1px solid rgba(18,39,38,.12);border-radius:999px;background:#ffffffdb;color:var(--ink);font-size:13px;font-weight:900;box-shadow:var(--shadow-soft);animation:celebration-label 1.8s ease both}.pro-celebration span{position:absolute;left:50%;top:50%;width:9px;height:15px;border-radius:2px;background:hsl(calc(var(--i) * 31deg),74%,58%);transform:translate(-50%,-50%) rotate(calc(var(--i) * 21deg));animation:celebration-burst 1.8s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--i) * 12ms)}@keyframes celebration-burst{0%{opacity:0;transform:translate(-50%,-50%) scale(.4) rotate(calc(var(--i) * 21deg))}12%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) rotate(calc(var(--i) * 61deg)) scale(.9)}}@keyframes celebration-label{0%{opacity:0;transform:translateY(10px) scale(.94)}20%,72%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-8px) scale(.98)}}.info-modal h2{max-width:12em;margin:8px 0 18px;font-size:30px;line-height:1.05}.info-modal p:not(.eyebrow){margin-top:14px;color:var(--muted);font-size:14px;line-height:1.65}.modal-close{position:absolute;top:14px;right:14px;width:34px;height:34px;border:1px solid var(--line);border-radius:999px;background:var(--paper-soft);color:var(--ink);cursor:pointer;font-size:22px;line-height:1}@media(max-width:1180px){.app-shell{grid-template-columns:340px minmax(0,1fr)}.home-hero{grid-template-columns:minmax(0,500px) minmax(0,640px);gap:40px}.hero-scene{width:min(640px,100%);min-height:560px}.hero-photo-card-main{left:4%;width:300px;height:390px}.hero-template-card-main{left:4%;width:300px}.hero-photo-card-side{right:2%;width:220px;height:374px}.hero-template-card-side{right:2%;width:220px}.hero-generated-grid{right:12%;bottom:64px;width:250px;height:auto}.hero-template-card-front{right:25%;bottom:62px;width:250px}.hero-note{bottom:150px}.hero-palette{right:5%}}@media(max-width:1040px){.home-hero{display:flex;min-height:auto;flex-direction:column;gap:34px}.hero-scene{display:block;order:1;width:min(620px,100%);min-height:520px}.home-hero-copy{order:2;width:min(620px,100%);max-width:none}.template-showcase-grid{grid-template-columns:repeat(var(--showcase-columns, 2),minmax(0,1fr))}}@media(max-width:820px){.home-nav nav a{display:none}.home-nav{padding:12px 16px}.home-nav nav{gap:10px}.home-nav nav button{height:36px;padding:0 13px}.home-hero{min-height:auto;gap:28px;padding:88px 18px 56px}.hero-scene{display:flex;width:min(100vw,100%);min-height:0;gap:14px;justify-self:stretch;margin-inline:-18px;padding:10px 18px 20px;overflow-x:auto;overflow-y:hidden;scroll-padding-inline:18px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.hero-scene::-webkit-scrollbar{display:none}.hero-photo-card,.hero-template-card{position:relative;inset:auto;flex:0 0 min(74vw,315px);padding:10px;border-radius:0;scroll-snap-align:center;transform:none}.hero-photo-card img,.hero-template-card canvas{border-radius:0}.hero-photo-card-main{left:18%;top:0;width:62%;height:285px;transform:rotate(0)}.hero-template-card-main{width:auto;aspect-ratio:3 / 4}.hero-photo-card-side{right:0;top:74px;width:43%;height:238px;transform:rotate(2deg)}.hero-template-card-side{width:auto;aspect-ratio:9 / 16;flex-basis:min(58vw,245px)}.hero-generated-grid{right:10%;bottom:34px;width:48%;height:auto;padding:10px}.hero-template-card-front{width:auto;aspect-ratio:1 / 1;flex-basis:min(72vw,305px);padding:10px}.hero-note{display:none}.hero-note strong{font-size:18px}.hero-note small{font-size:10px}.hero-palette,.hero-photo-caption{display:none}.home-hero-copy h1{max-width:7.6em;font-size:clamp(42px,13.8vw,62px)}.home-hero-copy>p:not(.eyebrow){max-width:26em}.template-showcase-grid,.home-features{grid-template-columns:1fr}.app-shell{display:flex;flex-direction:column}.left-panel,.stage-panel{height:auto;overflow:visible;border-right:0;border-left:0}.brand-row{position:static;margin:0 0 14px;padding:0;border-bottom:0;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}.studio-brand-button{width:190px}.stage-panel{order:-1;min-height:70vh}.topbar{align-items:flex-start;flex-direction:column}.topbar-actions{width:100%;display:grid;grid-template-columns:.8fr 1.1fr 1.1fr;gap:8px}.account-pill,.primary-button{width:100%;padding:0 12px}.canvas-zone{padding:16px}.canvas-frame{width:min(92vw,calc(64vh * var(--preview-ratio)));max-height:70vh}.template-preview-modal{grid-template-columns:1fr;gap:18px;width:min(520px,100%);padding:18px;border-radius:20px}.template-preview-large canvas,.template-preview-large.poster canvas,.template-preview-large.grid canvas{width:auto;height:auto;max-width:100%;max-height:62vh}}@media(max-width:520px){.home-nav{padding:14px 16px}.home-nav nav button{padding:0 12px}.home-brand{font-size:0}.home-hero{padding-inline:16px}.hero-scene{min-height:360px}.hero-photo-card-main{left:8%;width:68%;height:250px}.hero-template-card-main{left:7%;width:68%}.hero-photo-card-side{top:72px;width:42%;height:205px}.hero-template-card-side{top:72px;width:42%}.hero-generated-grid{bottom:34px;width:52%;height:auto}.hero-template-card-front{bottom:34px;width:56%;right:16%}.hero-note{bottom:82px;width:132px}.hero-palette{top:20px}.home-actions{display:grid;grid-template-columns:1fr;align-items:stretch}.home-actions button{width:100%}.home-actions a{display:inline-flex;justify-content:center;padding:10px 0}.left-panel{padding:16px}.studio-brand-button{width:190px}.status-bar{flex-direction:column}.primary-button{flex:1}.pro-modal{padding:26px 22px 24px}.pro-actions{grid-template-columns:1fr}}
