:root{color:#171717;background:#f3f2ee;font-family:Noto Sans JP,sans-serif}*{box-sizing:border-box}html{background:#f3f2ee}body{min-width:320px;min-height:100vh;margin:0}button{color:inherit;font:inherit}.app{width:min(100%,1040px);margin:0 auto;padding:0 24px 120px}.hero{text-align:center;place-items:center;min-height:43vh;display:grid}.hero h1{letter-spacing:-.07em;margin:0;font:400 clamp(42px,8vw,92px)/.92 Archivo Black,sans-serif}.studio{width:100%}.poster{background:#fff;width:min(100%,760px);margin:0 auto;padding:14px;position:relative;box-shadow:0 22px 70px #0000001f}.poster canvas{width:100%;height:auto;display:block}.poster-status{color:#55534f;text-align:center;background:#f3f2ee;place-items:center;margin:0;padding:0 32px;font-size:13px;line-height:1.9;display:grid;position:absolute;inset:14px}.console{justify-content:space-between;align-items:end;gap:32px;width:min(100%,760px);margin:28px auto 0;display:flex}fieldset{border:0;min-width:0;margin:0;padding:0}legend{color:#5f5d59;letter-spacing:.08em;margin-bottom:11px;font:400 11px IBM Plex Mono,monospace}.styles{flex-wrap:wrap;gap:6px;display:flex}.styles button{color:#55534f;cursor:pointer;background:0 0;border:1px solid #b3b1ab;min-height:40px;padding:0 13px;font:400 11px IBM Plex Mono,monospace}.styles button.active{color:#f3f2ee;background:#171717;border-color:#171717}.actions{flex:none;gap:6px;display:flex}.actions button{cursor:pointer;background:0 0;border:1px solid #171717;min-height:40px;padding:0 14px;font-size:11px}.actions .generate{color:#f3f2ee;background:#171717}.actions button:disabled{color:#77746e;cursor:not-allowed;border-color:#b3b1ab}.actions .generate:disabled{color:#f3f2ee;background:#b3b1ab}.caption{color:#55534f;border-top:1px solid #b9b7b1;grid-template-columns:1fr 1.5fr;width:min(100%,760px);margin:92px auto 0;padding-top:18px;font-size:11px;line-height:1.8;display:grid}.caption p{margin:0}.caption cite{color:#171717;font-style:normal}.caption a{color:#55534f;text-underline-offset:4px;grid-column:2;width:max-content;margin-top:24px}@media (width<=760px){.app{padding:0 10px 70px}.hero{min-height:33vh}.hero h1{font-size:clamp(38px,14vw,68px)}.poster{padding:7px}.poster-status{inset:7px}.console{margin-top:20px;padding:0 4px;display:block}.actions{margin-top:22px}.actions button{flex:1;padding-inline:8px}.caption{margin-top:64px;padding-inline:4px;display:block}.caption p+p{margin-top:18px}.caption a{margin-top:24px;display:inline-block}}