:root{color-scheme:dark;--bg:#090a0d;--panel:#111318;--panel2:#15171c;--line:#262932;--text:#f2f0eb;--muted:#92949c;--subtle:#676a74;--gold:#e8bd5e;--gold2:#f6d581;--mint:#98c7b7;--radius:20px;font-family:'DM Sans',system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html{min-width:320px;scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(ellipse 58% 32% at 83% -2%,rgba(112,91,47,.11),transparent 72%),var(--bg);color:var(--text)}button,input{font:inherit}button{color:inherit}.app-shell{max-width:1440px;margin:0 auto;padding:0 54px}.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.065)}.brand{display:flex;align-items:center;gap:12px;color:var(--text);font-family:Manrope,sans-serif;font-size:16px;font-weight:800;letter-spacing:-.045em;text-decoration:none}.brand-mark{display:flex;align-items:center;gap:3px;width:22px;height:22px;justify-content:center}.brand-mark i{display:block;width:2px;border-radius:4px;background:var(--gold);box-shadow:0 0 10px rgba(232,189,94,.55)}.brand-mark i:nth-child(1){height:11px;opacity:.65}.brand-mark i:nth-child(2){height:19px}.brand-mark i:nth-child(3){height:14px;opacity:.8}.topbar-right{display:flex;align-items:center;gap:16px}.privacy-pill,.ratio-badge{display:inline-flex;align-items:center;gap:8px;color:#a4a5ab;font-size:11px;letter-spacing:.035em;border:1px solid #272a31;border-radius:99px;padding:8px 12px}.privacy-dot,.live-dot{width:6px;height:6px;border-radius:50%;background:var(--mint);box-shadow:0 0 9px rgba(152,199,183,.6)}.install-button{border:1px solid rgba(232,189,94,.42);border-radius:99px;background:rgba(232,189,94,.08);padding:9px 14px;color:var(--gold2);font-size:12px;cursor:pointer}.workspace{display:grid;grid-template-columns:minmax(420px,1fr) minmax(390px,480px);gap:clamp(48px,8vw,126px);align-items:start;padding:47px 0 55px}.editor-column{padding-top:11px;max-width:640px}.eyebrow,.section-kicker{font-size:9px;font-weight:700;letter-spacing:.16em;color:#a9a49a}.eyebrow{margin:0 0 18px}.intro h1{font-family:Manrope,sans-serif;font-size:clamp(34px,4.2vw,52px);line-height:1.12;letter-spacing:-.06em;margin:0;color:#f5f2ec}.intro h1 em{font-weight:500;color:var(--gold2);font-style:normal}.intro-copy{max-width:455px;color:#a1a2a7;font-size:14px;line-height:1.7;margin:17px 0 31px}.card{background:linear-gradient(145deg,rgba(22,24,29,.96),rgba(16,17,21,.96));border:1px solid #272a31;border-radius:var(--radius);padding:20px 21px;box-shadow:0 16px 60px rgba(0,0,0,.12)}.people-card{margin-bottom:14px}.card-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.section-kicker{color:#8d8e94;font-size:8px}.card h2,.preview-header h2{font-family:Manrope,sans-serif;letter-spacing:-.035em;font-size:17px;font-weight:650;margin:6px 0 0;color:#f1efeb}.add-person{width:34px;height:34px;border-radius:11px;border:1px solid rgba(232,189,94,.35);background:rgba(232,189,94,.07);color:var(--gold2);font-size:21px;line-height:1;cursor:pointer;transition:background .2s,transform .2s}.add-person:hover,.add-person-wide:hover{background:rgba(232,189,94,.14);transform:translateY(-1px)}.card-hint{font-size:11px;color:#8c8d93;margin:9px 0 13px;line-height:1.5}.people-list{display:grid;gap:8px}.person-row{display:grid;grid-template-columns:minmax(100px,1.15fr) 72px 72px 30px;align-items:center;gap:8px;padding:9px 9px 9px 11px;border-radius:12px;background:rgba(255,255,255,.026);border:1px solid rgba(255,255,255,.035)}.person-label-wrap{display:flex;align-items:center;gap:9px;min-width:0}.person-swatch{width:7px;height:7px;flex:0 0 auto;border-radius:50%;box-shadow:0 0 9px currentColor}.person-name{background:transparent;color:#e7e5df;border:0;outline:0;min-width:0;width:100%;font-size:12px;padding:3px 0}.person-name:focus{border-bottom:1px solid rgba(232,189,94,.6)}.mini-field{min-width:0;position:relative}.mini-field span{display:block;color:#70727b;font-size:8px;letter-spacing:.04em;margin:0 0 2px 2px}.mini-field input{width:100%;height:25px;border:1px solid #2b2e36;background:#14161b;border-radius:7px;color:#d5d3ce;font-size:10px;padding:3px 7px;outline:none}.mini-field input:focus,.field input:focus,.outro-field input:focus{border-color:rgba(232,189,94,.57);box-shadow:0 0 0 2px rgba(232,189,94,.07)}.delete-person{width:28px;height:28px;border:0;background:transparent;color:#70727a;border-radius:8px;font-size:17px;cursor:pointer}.delete-person:hover{color:#f2968f;background:rgba(242,150,143,.08)}.add-person-wide{width:100%;margin-top:10px;border:1px dashed #373a43;background:transparent;color:#b9b7b1;border-radius:10px;padding:9px 12px;font-size:11px;cursor:pointer;transition:.2s}.add-person-wide span{color:var(--gold2);font-size:16px;vertical-align:-1px;margin-right:5px}.compact-heading{margin-bottom:17px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.field,.outro-field{display:flex;flex-direction:column;gap:6px;color:#93949a;font-size:10px}.field-wide{grid-column:1/-1}.field input,.outro-field input{width:100%;height:37px;border:1px solid #2b2e36;background:#14161b;border-radius:9px;color:#e6e3dc;font-size:12px;padding:0 10px;outline:none;transition:border .2s,box-shadow .2s}.number-wrap{position:relative}.number-wrap input{padding-right:56px}.number-wrap small{position:absolute;right:10px;top:11px;color:#777981;font-size:10px;pointer-events:none}.outro-field{margin-top:12px}.privacy-note{display:flex;align-items:flex-start;gap:9px;color:#8eaaa2;border-top:1px solid #282b31;margin-top:16px;padding-top:14px;font-size:10px;line-height:1.5}.privacy-note span:first-child{font-size:13px;color:var(--mint);line-height:1}.prototype-note{display:flex;align-items:center;gap:9px;color:#74767e;font-size:10px;margin:16px 0 0}.note-star{font-size:13px;color:var(--gold)}.preview-column{width:100%;max-width:460px;margin:0 auto}.preview-header{display:flex;align-items:end;justify-content:space-between;margin:0 0 15px}.preview-header h2{font-size:18px}.ratio-badge{font-size:9px;padding:6px 9px;color:#aeadab}.stage-wrap{width:100%;display:flex;justify-content:center}.stage{position:relative;overflow:hidden;width:min(100%,390px);aspect-ratio:9/16;border:1px solid rgba(255,255,255,.12);border-radius:24px;background:radial-gradient(ellipse at 53% 73%,rgba(118,92,45,.09),transparent 43%),#050608;box-shadow:0 22px 80px rgba(0,0,0,.42),0 0 45px rgba(224,184,86,.045);isolation:isolate}.stage-grain{position:absolute;inset:0;z-index:0;opacity:.54;background-image:radial-gradient(1px 1px at 15% 18%,#a99d7c 50%,transparent 100%),radial-gradient(1px 1px at 82% 23%,#fff 50%,transparent 100%),radial-gradient(1.3px 1.3px at 26% 42%,#c9b982 50%,transparent 100%),radial-gradient(1px 1px at 75% 58%,#fff 50%,transparent 100%),radial-gradient(1px 1px at 9% 73%,#fff 50%,transparent 100%),radial-gradient(1px 1px at 89% 83%,#b9a878 50%,transparent 100%),radial-gradient(1.5px 1.5px at 41% 32%,#fff 50%,transparent 100%),radial-gradient(1px 1px at 58% 91%,#fff 50%,transparent 100%);background-size:260px 310px;animation:starDrift 38s linear infinite}.stage-header{position:absolute;z-index:4;top:6.1%;left:8%;right:8%;text-align:center;pointer-events:none}.stage-title{font-family:Manrope,sans-serif;font-size:clamp(16px,5vw,21px);font-weight:650;letter-spacing:-.045em;color:#f4f0e6;text-shadow:0 2px 18px rgba(0,0,0,.8)}.stage-age{margin-top:8px;font-size:8px;letter-spacing:.2em;color:#aeb0b4}.stage-age strong{font-family:Manrope,sans-serif;font-size:17px;letter-spacing:-.04em;color:var(--gold2);font-weight:600;margin-left:4px}.stage svg{position:absolute;inset:0;width:100%;height:100%;z-index:2}.axis-line{stroke:rgba(255,255,255,.11);stroke-width:.7}.axis-tick{stroke:rgba(255,255,255,.2);stroke-width:.65}.axis-label{fill:rgba(226,225,221,.5);font:7px 'DM Sans',sans-serif;letter-spacing:.05em}.life-line{fill:none;stroke-linecap:round;filter:none;transition:stroke-dasharray .12s linear}.life-node{filter:url(#nodeGlow);animation:pulse 2.6s ease-in-out infinite alternate}.life-label{font:8px 'DM Sans',sans-serif;font-weight:500;letter-spacing:.01em;paint-order:stroke;stroke:#050608;stroke-width:3px;stroke-linejoin:round}.main-label{font-size:9px;font-weight:600;letter-spacing:.04em}.ended-node{opacity:.58}.stage-footer{position:absolute;z-index:4;bottom:4.8%;left:8%;right:8%;display:flex;justify-content:space-between;color:rgba(226,225,221,.48);font-size:7px;letter-spacing:.2em}.stage-vignette{position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.24),transparent 25%,transparent 73%,rgba(0,0,0,.35))}.stage-outro{position:absolute;z-index:5;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:15%;background:rgba(2,3,4,.84);opacity:0;visibility:hidden;transition:opacity 1.1s ease,visibility 1.1s;backdrop-filter:blur(2px)}.stage-outro.visible{opacity:1;visibility:visible}.stage-outro>span{color:var(--gold2);font-size:8px;letter-spacing:.18em;text-transform:uppercase}.stage-outro p{font-family:Manrope,sans-serif;color:#f6f2e8;font-size:clamp(18px,5vw,23px);line-height:1.42;letter-spacing:-.035em;margin:15px 0 0;max-width:270px}.playback-controls{width:min(100%,390px);margin:15px auto 0}.control-row{display:flex;align-items:center;gap:9px}.play-button{height:39px;padding:0 16px;display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(232,189,94,.45);border-radius:11px;background:linear-gradient(135deg,rgba(232,189,94,.17),rgba(232,189,94,.07));color:#f4d78f;font-size:11px;font-weight:600;cursor:pointer;transition:.2s}.play-button:hover{background:rgba(232,189,94,.2);transform:translateY(-1px)}.play-icon{font-size:9px}.reset-button{height:37px;padding:0 12px;border:1px solid #2a2d34;border-radius:10px;background:#111318;color:#9d9da2;font-size:10px;cursor:pointer}.reset-button:hover{color:#eee}.preview-age-label{margin-left:auto;color:#888a90;font-size:10px}.preview-age-label strong{font-size:17px;color:#f0eee9;font-family:Manrope,sans-serif;margin-left:4px}.scrubber-label{display:flex;justify-content:space-between;color:#777981;font-size:9px;margin:14px 1px 4px}.scrubber{appearance:none;width:100%;height:15px;background:transparent;cursor:pointer}.scrubber::-webkit-slider-runnable-track{height:3px;background:linear-gradient(90deg,var(--gold) var(--progress,42%),#30323a var(--progress,42%));border-radius:9px}.scrubber::-moz-range-track{height:3px;background:#30323a;border-radius:9px}.scrubber::-moz-range-progress{height:3px;background:var(--gold);border-radius:9px}.scrubber::-webkit-slider-thumb{appearance:none;margin-top:-5px;width:13px;height:13px;border-radius:50%;background:var(--gold2);border:2px solid #171512;box-shadow:0 0 12px rgba(232,189,94,.45)}.scrubber::-moz-range-thumb{width:10px;height:10px;border-radius:50%;background:var(--gold2);border:2px solid #171512;box-shadow:0 0 12px rgba(232,189,94,.45)}.preview-footnote{display:flex;align-items:center;gap:8px;margin-top:6px;color:#74767e;font-size:9px}.footer{display:flex;justify-content:space-between;gap:20px;border-top:1px solid rgba(255,255,255,.06);padding:18px 0 25px;color:#696b73;font-size:9px;letter-spacing:.02em}.footer-separator{color:#ae8c48;margin:0 4px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes pulse{from{opacity:.76;transform:scale(.8)}to{opacity:1;transform:scale(1.12)}}@keyframes starDrift{from{background-position:0 0}to{background-position:0 310px}}@media(min-width:1250px){.workspace{grid-template-columns:minmax(480px,1fr) minmax(390px,460px);gap:clamp(75px,9vw,145px)}}@media(max-width:900px){.app-shell{padding:0 30px}.workspace{grid-template-columns:minmax(350px,1fr) minmax(320px,390px);gap:34px}.stage{border-radius:20px}.editor-column{padding-top:2px}.card{padding:17px}}@media(max-width:720px){.app-shell{padding:0 18px}.topbar{height:66px}.workspace{display:flex;flex-direction:column;gap:35px;padding:34px 0 35px}.editor-column{max-width:none;width:100%}.intro h1{font-size:39px}.intro-copy{font-size:13px;margin-bottom:24px}.preview-column{max-width:440px;width:100%;order:-1}.preview-header{margin-bottom:11px}.stage{width:min(100%,360px);border-radius:21px}.playback-controls{width:min(100%,360px)}.footer{font-size:8px;line-height:1.5}.footer span:last-child{text-align:right;max-width:45%}.card{padding:17px}.topbar-right{gap:7px}.privacy-pill{font-size:9px;padding:7px 9px}.install-button{font-size:10px;padding:8px 10px}}@media(max-width:390px){.app-shell{padding:0 13px}.person-row{grid-template-columns:minmax(75px,1fr) 58px 58px 26px;gap:6px;padding:8px}.person-name{font-size:11px}.mini-field input{font-size:9px}.card h2{font-size:16px}.stage{border-radius:18px}.footer{flex-direction:column;gap:4px}.footer span:last-child{text-align:left;max-width:none}}

/* Permanent, non-editable publisher credit in the app chrome and the 9:16 frame. */
.publisher-bar{position:sticky;top:0;z-index:10;display:flex;justify-content:center;align-items:center;min-height:32px;padding:7px 14px;background:rgba(14,16,20,.94);backdrop-filter:blur(10px);border-bottom:1px solid rgba(232,189,94,.22);color:#d4c79f;text-align:center;font-size:10px;line-height:1.35;letter-spacing:.025em}
.stage-publisher{position:absolute;z-index:7;left:5%;right:5%;bottom:1.4%;color:rgba(232,225,204,.84);font-size:6px;line-height:1.2;letter-spacing:.015em;text-align:center;white-space:nowrap;text-shadow:0 1px 5px #000;pointer-events:none}
@media(max-width:390px){.publisher-bar{font-size:9px;padding:7px 10px;min-height:34px}.stage-publisher{font-size:5.4px;letter-spacing:0}}

/* Keep the fixed credit legible at phone preview size. */
.stage-publisher{font-size:7.5px}
@media(max-width:390px){.stage-publisher{font-size:6.8px}}

.clear-data-btn{margin-top:12px;padding:8px 12px;border:1px solid rgba(242,150,143,.28);border-radius:9px;background:rgba(242,150,143,.045);color:#d9a6a1;font-size:10px;cursor:pointer;transition:background .2s,border-color .2s}
.clear-data-btn:hover{background:rgba(242,150,143,.11);border-color:rgba(242,150,143,.5)}
.clear-data-btn:focus-visible{outline:2px solid #e8bd5e;outline-offset:2px}

.speed-field{margin-top:13px}.speed-field select{width:100%;height:37px;border:1px solid #2b2e36;background:#14161b;border-radius:9px;color:#e6e3dc;font-size:12px;padding:0 10px}.speed-field select:focus-visible,.export-button:focus-visible,.export-cancel:focus-visible{outline:2px solid var(--gold2);outline-offset:3px}.export-controls{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.export-button,.export-cancel{min-height:39px;border:1px solid rgba(152,199,183,.42);border-radius:10px;background:rgba(152,199,183,.08);color:#c8e3d9;padding:8px 12px;font-size:10px;font-weight:600;cursor:pointer}.export-button:hover:not(:disabled),.export-cancel:hover{background:rgba(152,199,183,.16)}.export-button:disabled{opacity:.7;cursor:wait}.export-button span{display:block;color:#91b9aa;font-size:9px;font-weight:400;margin-top:2px}.export-cancel{border-color:#5b3331;background:rgba(242,150,143,.06);color:#e4aaa3}.export-status{flex-basis:100%;margin:0;color:#858991;font-size:9px;line-height:1.5}.export-button[aria-busy="true"]{cursor:progress}
@media(max-width:390px){.export-controls{gap:6px}.export-button{flex:1}.export-cancel{flex:0 0 auto}}