:root{color-scheme:light;--paper: #f6efe2;--ink: #1a1a1a;--mute: #5c564f;--teal: #44c0c4;--lime: #d4f06a;--coral: #ff7d74;--peach: #f4c49a;--card: #fff8ee;--line: #1a1a1a;font-family:Zen Maru Gothic,Hiragino Maru Gothic ProN,Yu Gothic,system-ui,sans-serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%;color:var(--ink);background-color:var(--paper)}body{min-height:100svh;overflow-x:hidden}#app{min-height:100svh;position:relative;isolation:isolate}.app{width:min(28rem,100%);margin:0 auto;padding:1.15rem 1rem 2.6rem;display:flex;flex-direction:column;gap:1rem;position:relative;z-index:1}.sky{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}.blob{position:absolute;border-radius:999px;pointer-events:none;opacity:.6;filter:blur(6px)}.blob-lime{width:17rem;height:17rem;background:color-mix(in srgb,var(--lime) 55%,white);top:-6rem;left:-5rem}.blob-teal{width:14rem;height:14rem;background:color-mix(in srgb,var(--teal) 45%,white);top:18%;right:-6rem}.blob-coral{width:15rem;height:15rem;background:color-mix(in srgb,var(--coral) 45%,white);bottom:-6rem;right:-5rem}@media(max-width:40rem){.blob{opacity:.42;filter:blur(10px)}.blob-lime{width:20rem;height:20rem;top:-8rem;left:-7rem}.blob-teal{width:17rem;height:17rem;right:-8rem}.blob-coral{width:18rem;height:18rem;bottom:-8rem;right:-7rem}}.hero,.stage-wrap,.panel,.share-wrap,.notes{position:relative;z-index:1}.hero{text-align:center}.hero h1{margin:.15rem 0 .45rem;font-family:Zen Maru Gothic,Hiragino Maru Gothic ProN,Yu Gothic,system-ui,sans-serif;font-size:1.58rem;font-weight:400;letter-spacing:.04em;line-height:1.45}.eyebrow{margin:0;color:var(--ink);font-size:.74rem;letter-spacing:.14em}.lede,.notes p,.status,.slot-meter{margin:0;color:var(--mute);line-height:1.75;font-size:.88rem}.lede{text-wrap:pretty}.made-count{margin:.55rem 0 0;color:var(--mute);font-size:.86rem;letter-spacing:.04em;font-variant-numeric:tabular-nums}.loop-wrap{display:flex;justify-content:center;position:relative;z-index:1}.loop-link{display:block;width:min(100%,26rem);border-radius:1.5rem;cursor:pointer;transition:transform .16s ease}.loop-link:hover{transform:translateY(-2px)}.loop-link:focus-visible{outline:3px solid var(--teal);outline-offset:4px}.loop-link picture{display:block}.loop{display:block;width:100%;height:auto;aspect-ratio:16 / 9;object-fit:cover;border-radius:1.5rem;background:var(--card);border:3.5px solid var(--ink);box-shadow:7px 8px 0 var(--ink)}.preview-dialog:not([open]){display:none}.preview-dialog{width:min(28rem,calc(100vw - 1.25rem));max-height:calc(100svh - 1.25rem);margin:auto;padding:0;border:3px solid var(--ink);border-radius:1.4rem;background:var(--card);box-shadow:6px 7px 0 var(--ink);overflow:hidden}.preview-dialog:has(.stage[data-aspect=landscape]){width:min(32rem,calc(100vw - 1.25rem))}.preview-dialog[open]{display:flex;flex-direction:column;height:min(max-content,calc(100svh - 1.25rem))}.preview-dialog::backdrop{background:#1a1a1a7a}.preview-sheet{display:flex;flex-direction:column;gap:.65rem;width:100%;min-height:0;flex:1 1 auto;padding:.85rem .9rem 1rem}.preview-head{display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex:0 0 auto}.preview-head h2{margin:0;font-size:1.05rem;font-weight:700;letter-spacing:.04em}.preview-options{display:grid;grid-template-columns:1fr 1fr;gap:.45rem .6rem;flex:0 0 auto}.preview-field{gap:.28rem}.preview-field legend{font-size:.66rem}.preview-toggle{gap:.35rem}.preview-toggle label{min-height:2rem;padding:.15rem .3rem;font-size:.78rem;font-weight:700}.preview-close{display:inline-flex;align-items:center;justify-content:center;width:2.4rem;height:2.4rem;border:3px solid var(--ink);border-radius:999px;background:var(--lime);color:var(--ink);font:inherit;font-size:1.2rem;font-weight:700;line-height:1;cursor:pointer;flex:0 0 auto;transition:transform .16s ease}.preview-close:hover{transform:translateY(-2px)}.preview-actions{display:grid;grid-template-columns:1fr 1fr;gap:.55rem;flex:0 0 auto;position:relative;z-index:2;padding-top:.15rem}.preview-actions .btn{position:relative;z-index:3;text-align:center;line-height:1.25}.stage-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;flex:1 1 auto;min-height:0;width:100%;overflow:hidden}.stage{display:block;position:relative;width:min(100%,16rem,calc((100svh - 20rem) * 608 / 1080));max-height:calc(100svh - 20rem);aspect-ratio:608 / 1080;height:auto;flex:0 0 auto;padding:0;appearance:none;-webkit-appearance:none;cursor:pointer;border-radius:1.5rem;overflow:hidden;background:var(--teal);border:3.5px solid var(--ink);box-shadow:7px 8px 0 var(--ink)}.stage-play-hint{display:none;position:absolute;inset:0;z-index:1;pointer-events:none;background:#1a1a1a47}.stage[aria-pressed=false] .stage-play-hint{display:block}.stage-play-hint:after{content:"";position:absolute;left:50%;top:50%;width:0;height:0;border-style:solid;border-width:1.15rem 0 1.15rem 1.85rem;border-color:transparent transparent transparent #fff;transform:translate(-35%,-50%);filter:drop-shadow(0 2px 8px rgba(0,0,0,.45))}.stage:focus-visible{outline:3px solid var(--teal);outline-offset:4px}.stage[data-aspect=landscape]{width:min(100%,22rem);max-height:calc(100svh - 20rem);aspect-ratio:16 / 9}.stage-canvas{display:block;width:100%;height:100%;pointer-events:auto}.slot-meter,.preview-state{font-variant-numeric:tabular-nums;flex:0 0 auto}.preview-state{margin:0;text-align:center;font-size:.8rem;letter-spacing:.06em;color:var(--mute)}.panel{display:flex;flex-direction:column;gap:.8rem;padding:1rem .95rem 1.05rem;background:var(--card);border:3px solid var(--ink);border-radius:1.4rem;box-shadow:5px 6px 0 var(--lime)}.aspect-field{margin:0;padding:0;border:0;display:flex;flex-direction:column;gap:.45rem}.aspect-field[hidden]{display:none}.aspect-field legend{padding:0;font-size:.74rem;letter-spacing:.1em;color:var(--mute)}.aspect-toggle{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.aspect-toggle label{display:flex;align-items:center;justify-content:center;min-height:2.85rem;padding:.35rem .45rem;border:3px solid var(--ink);border-radius:999px;background:var(--card);cursor:pointer;text-align:center;font-weight:700;transition:transform .16s ease,background .16s ease}.aspect-toggle label:hover{transform:translateY(-2px)}.aspect-toggle input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.aspect-toggle label:has(input:checked){background:var(--peach);box-shadow:3px 4px 0 var(--ink)}.aspect-toggle label:has(input:disabled){opacity:.38;cursor:not-allowed;transform:none}.aspect-toggle span{line-height:1.25}.file-btn,.btn{display:inline-flex;align-items:center;justify-content:center;min-height:2.95rem;padding:.7rem 1rem;border-radius:999px;border:3px solid var(--ink);font:inherit;cursor:pointer;transition:transform .16s ease}.file-btn:hover,.btn:hover:not(:disabled){transform:translateY(-2px)}.file-btn{background:var(--teal);color:var(--ink);font-weight:700}.file-btn input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.actions{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}.btn{background:var(--lime);color:var(--ink);font-weight:700}.btn.ghost{background:var(--card);color:var(--ink)}.share-wrap{display:flex;flex-direction:column;gap:.55rem}.btn.share,.btn.share-app{width:100%;gap:.45rem;font-size:.92rem}.btn.share{background:var(--ink);color:var(--paper)}.btn.share-app{background:var(--card);color:var(--ink)}.btn.share svg,.btn.share-app svg{width:1.05em;height:1.05em;flex:0 0 auto}.btn.share svg{fill:currentColor}.btn:disabled,.file-btn:has(input:disabled){opacity:.38;cursor:not-allowed;transform:none}.thumbs{display:flex;gap:.5rem;overflow-x:auto;padding-bottom:.1rem}.thumbs img{width:3.2rem;height:3.2rem;object-fit:cover;border-radius:999px;border:3px solid var(--ink);flex:0 0 auto;background:var(--peach)}.status[data-kind=busy]{color:#2a7f82}.status[data-kind=error]{color:#c44b45}.notes{display:flex;flex-direction:column;gap:.7rem;text-wrap:pretty}.links{display:flex;flex-direction:column;gap:.5rem}.links-title{margin:0;color:var(--mute);font-size:.74rem;letter-spacing:.1em}.link-banners{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:0;padding:0;list-style:none}.link-banner{--accent: var(--teal);display:flex;align-items:center;justify-content:center;gap:.4rem;min-height:2.85rem;padding:.4rem .6rem;color:var(--ink);font-size:.86rem;font-weight:700;text-decoration:none;background:color-mix(in srgb,var(--accent) 22%,var(--card));border:3px solid var(--ink);border-radius:999px;box-shadow:3px 4px 0 var(--ink);transition:transform .16s ease}.link-banner:hover{transform:translateY(-2px)}.link-banner:focus-visible{outline:3px solid var(--teal);outline-offset:3px}.link-banner[data-service=x]{--accent: var(--teal)}.link-banner[data-service=youtube]{--accent: var(--coral)}.link-banner[data-service=spotify]{--accent: var(--lime)}.link-banner[data-service=apple-music]{--accent: var(--peach)}.link-icon{width:1.2rem;height:1.2rem;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}.offscreen-video{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}