:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:#171716;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#111112;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,textarea{font:inherit}button{cursor:pointer}.app-shell{background:#151515;grid-template-columns:minmax(0,1fr) 390px;min-height:100vh;display:grid}.scene-stage{min-height:100vh;position:relative;overflow:hidden}.scene-image{background:#151515;justify-content:center;align-items:center;width:100%;height:100%;min-height:420px;padding:0;display:flex;position:relative;overflow:hidden}.scene-image canvas{z-index:1;aspect-ratio:1672/941;width:min(100%,177.683vh);height:auto;max-height:100%;display:block;position:relative}.scene-image .scene-backdrop{z-index:0;object-fit:cover;filter:blur(24px)saturate(1.08);opacity:.82;width:100%;height:100%;max-height:none;position:absolute;inset:0;transform:scale(1.08)}.scene-image.compact{aspect-ratio:1672/941;background:#2e342f;border:1px solid #14141229;min-height:0}.scene-image.compact canvas{width:100%;max-height:none}.stage-overlay{z-index:2;color:#fff8e7;pointer-events:none;background:linear-gradient(#00000073,#0000 30%),linear-gradient(#0000 72%,#00000061);justify-content:space-between;align-items:flex-start;padding:clamp(18px,4vw,48px);display:flex;position:absolute;inset:0}.eyebrow{letter-spacing:0;text-transform:uppercase;margin:0 0 8px;font-size:.76rem;font-weight:800;line-height:1}h1,h2{letter-spacing:0;margin:0}h1{font-size:clamp(2.2rem,6vw,6.8rem);line-height:.9}.timestamp{color:#fff8e7;text-shadow:0 1px 8px #0006;align-items:center;gap:7px;margin:0;font-weight:700;display:flex}.stage-actions{pointer-events:auto;max-width:calc(100% - 36px);position:absolute;bottom:clamp(18px,4vw,48px);left:50%;transform:translate(-50%)}.stage-menu-button{display:none}.stage-action-row{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#17171652;border:1px solid #fff8e752;border-radius:999px;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;padding:6px;display:flex;box-shadow:0 10px 28px #00000038}.stage-action-button,.stage-menu-button{color:#fff8e7;white-space:nowrap;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#1717169e;border:2px solid #fff8e7d1;border-radius:999px;justify-content:center;align-items:center;gap:8px;min-height:44px;padding:0 16px;font-weight:900;transition:background .16s,border-color .16s,transform .16s;box-shadow:0 1px 10px #0000003d}.stage-action-button{display:inline-flex}.stage-action-button:hover,.stage-action-button:focus-visible,.stage-menu-button:hover,.stage-menu-button:focus-visible{background:#171716d6;border-color:#fff8e7;transform:translateY(-1px)}.stage-action-button:focus-visible,.stage-menu-button:focus-visible{outline-offset:3px;outline:3px solid #ffcb42}.modal-backdrop{z-index:10;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#111112b8;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.share-modal{color:#171716;background:#f6f0df;border:4px solid #171716;border-radius:14px;width:min(100%,520px);padding:28px;position:relative;box-shadow:8px 8px #0000006b}.share-modal h2{margin-bottom:14px;font-size:clamp(1.8rem,6vw,2.8rem);line-height:.95}.share-modal p{line-height:1.5}.modal-close-button{color:#171716;background:#fff9e8;border:2px solid #171716;border-radius:999px;justify-content:center;align-items:center;width:36px;height:36px;display:inline-flex;position:absolute;top:14px;right:14px}.share-link-label{margin:20px 0 8px;font-weight:900;display:block}.share-link-row{grid-template-columns:minmax(0,1fr) auto;gap:8px;display:grid}.share-link-row input{color:#171716;min-width:0;font:inherit;background:#fffdf3;border:3px solid #171716;border-radius:8px;padding:11px 12px;font-weight:800}.copy-link-button{color:#171716;background:#ffcb42;border:2px solid #171716;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:0 14px;font-weight:900;display:inline-flex;box-shadow:3px 3px #171716}.share-note-hint{color:#57534b;margin:16px 0 0;font-size:.92rem;font-weight:700}.share-status{margin:14px 0 0;font-weight:900}.composer-panel{background:#f6f0df;border-left:4px solid #171716;align-items:stretch;min-height:100vh;display:flex}.composer{flex-direction:column;gap:18px;width:100%;padding:28px;display:flex}.composer-header h2{font-size:1.7rem;line-height:1}.scene-picker{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.scene-choice{color:#171716;background:#fff9e8;border:2px solid #171716;border-radius:8px;flex-direction:column;justify-content:center;gap:4px;min-height:60px;display:flex;box-shadow:3px 3px #171716}.scene-choice span{font-weight:900}.scene-choice small{font-size:.72rem}.scene-choice.active{background:#ffcb42;transform:translate(2px,2px);box-shadow:1px 1px #171716}.preview-wrap{border:3px solid #171716;border-radius:8px;overflow:hidden;box-shadow:5px 5px #171716}.note-label{font-weight:900}textarea{resize:vertical;color:#171716;background:#fffdf3;border:3px solid #171716;border-radius:8px;outline:none;width:100%;min-height:132px;padding:14px;line-height:1.4}textarea:focus{box-shadow:0 0 0 4px #ffcb42}.composer-meta{color:#57534b;justify-content:space-between;align-items:center;margin-top:-8px;font-size:.92rem;font-weight:800;display:flex}.over-limit{color:#b91c1c}.ghost-button,.submit-button{border:2px solid #171716;border-radius:8px;justify-content:center;align-items:center;gap:8px;font-weight:900;display:inline-flex}.ghost-button{color:#171716;background:0 0;padding:8px 11px}.submit-button{color:#fff;background:#2f9a62;min-height:52px;box-shadow:4px 4px #171716}.submit-button:disabled{opacity:.72;cursor:wait}.status-message{color:#171716;min-height:20px;margin:0;font-weight:800}.composer-credit{color:#77736a;text-align:center;margin:auto 0 0;font-size:.72rem;line-height:1.35}.composer-credit a{color:inherit;text-decoration:none}.composer-credit a:hover,.composer-credit a:focus-visible{color:#171716}.spin{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=900px){.app-shell{grid-template-columns:1fr}.scene-stage{min-height:56vh}.composer-panel{border-top:4px solid #171716;border-left:0;min-height:auto}}@media (width<=560px) and (orientation:portrait){.stage-overlay{flex-direction:column;padding:18px}.timestamp{align-self:flex-end;font-size:.8rem}.stage-actions{align-self:center;width:min(100%,220px);max-width:100%;margin-top:auto;position:relative;bottom:auto;left:auto;right:auto;transform:none}.stage-menu-button{width:100%;min-height:38px;padding:0 12px;font-size:.85rem;display:inline-flex}.stage-action-row{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#171716d1;border:2px solid #fff8e7d1;border-radius:10px;flex-direction:column;align-items:stretch;width:min(220px,100vw - 36px);padding:8px;display:none;position:absolute;bottom:calc(100% + 8px);right:0;box-shadow:0 1px 14px #00000052}.stage-actions.open .stage-action-row{display:flex}.stage-action-button{background:#fff8e71f;border-width:1px;width:100%;min-height:38px;padding:0 10px;font-size:.82rem}.composer{padding:18px}.share-modal{padding:24px 18px}.share-link-row{grid-template-columns:1fr}.copy-link-button{min-height:44px}.scene-picker{grid-template-columns:1fr}}