@import url('./house-tokens.css');
@font-face{font-family:Selecta;src:url('./assets/fonts/Selecta-Regular.otf')}@font-face{font-family:Selecta;src:url('./assets/fonts/Selecta-Medium.otf');font-weight:500}@font-face{font-family:Kalice;src:url('./assets/fonts/Kalice-Regular.woff2')}
*{box-sizing:border-box}body{margin:0;color:#171717;background:#f6f6f6;font:14px/1.35 Selecta,Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit;color:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer;touch-action:manipulation}button:disabled{cursor:wait;opacity:.5}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #246bfe;outline-offset:4px}svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}button{border:0;background:transparent}h1,h2,p{margin:0}h1{font:29px/1 Kalice,Georgia,serif;letter-spacing:-1px}h2{font:28px Kalice,Georgia,serif}.header{height:95px;max-width:1440px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:0 46px}.identity{display:flex;align-items:center;gap:18px}.identity .mark{width:33px;height:23px;stroke:none}.header-actions{display:flex;gap:12px}.dark{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:44px;padding:0 23px;color:white;background:var(--hs-dark-face);box-shadow:var(--hs-dark-shadow);border-radius:100px;text-decoration:none}.dark:active{background:var(--hs-dark-pressed)}.soft{background:linear-gradient(#fff,#f3f3f3);box-shadow:inset 0 1px 0 #fff,0 0 0 1px #0000000a,0 2px 3px #00000009,0 4px 12px #00000005;border-radius:100px}.icon-button{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-size:24px}.soft:active{background:#ececec}.workspace{max-width:1348px;margin:0 auto;padding:0 24px 34px;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;align-items:start}.preview-area{min-width:0;display:flex;flex-direction:column;align-items:center;padding-top:4px}.preview-top{display:flex;width:100%;justify-content:space-between;align-items:center;max-width:680px;margin-bottom:18px;gap:14px}.preview-top>span{font-size:12px;color:#777;font-variant-numeric:tabular-nums;white-space:nowrap}.segmented{display:flex;gap:3px;padding:3px;background:#eaeaea;border-radius:100px;box-shadow:inset 0 1px 3px #0000000c,0 1px 0 #fff}.segmented button{min-width:48px;padding:7px 12px;border-radius:100px;font-size:12px;color:#737373}.segmented button[aria-pressed=true]{color:#171717;background:linear-gradient(#fff,#f7f7f7);box-shadow:0 1px 3px #0002,inset 0 1px 0 white}.stage{width:100%;height:min(64vh,680px);min-height:370px;display:flex;align-items:center;justify-content:center}.canvas-shell{position:relative;width:auto;height:100%;max-width:100%;aspect-ratio:1;overflow:hidden;border-radius:17px;background:#e9e9e9;box-shadow:0 0 0 1px #00000008,0 2px 3px #00000006,0 12px 28px #0000000b,0 40px 65px -36px #0000002c}canvas{display:block;width:100%;height:100%;object-fit:contain}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#eee;color:#737373}#loading[hidden]{display:none}.glass{background:linear-gradient(-75deg,#ffffff70,#ffffffdd,#ffffff80);border:1px solid #fff;box-shadow:inset 0 1px 2px #fff,inset 0 -1px 1px #00000012,0 3px 5px #00000006,0 8px 23px #00000006;backdrop-filter:blur(12px)}.transport{display:flex;align-items:center;gap:9px;width:min(100%,456px);margin-top:24px;border-radius:100px;padding:3px 8px}.transport .icon-button{width:36px;height:36px}.transport output{font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap;color:#737373;min-width:70px}.credit{width:min(100%,680px);display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:17px;color:#737373;font-size:12px;min-height:17px}#artist-credit:before{content:'·';padding-right:8px}.controls{background:#fafafa;border:1px solid white;border-radius:24px;padding:5px 23px 8px;box-shadow:0 0 0 1px #00000004,0 8px 30px #00000003}fieldset{border:0;padding:0;margin:0;min-width:0}.control-group{padding:20px 0;border-bottom:1px solid #e8e8e8}.control-group:last-child{border:0}label{display:block;font-size:12px;margin-bottom:9px;color:#595959}.text-controls>label{margin-bottom:10px}textarea,input:not([type=range]),select{display:block;width:100%;min-width:0;background:#efefef;border:1px solid #00000004;border-radius:10px;box-shadow:inset 0 1px 2px #00000006,0 1px 0 white;padding:10px 11px}textarea{resize:vertical;min-height:75px;max-height:160px;font-size:18px;line-height:1.25;letter-spacing:-.3px}select{height:37px;font-size:12px;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23737373' stroke-width='1.5'%3E%3Cpath d='m8 10 4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 9px center;padding-right:29px}#role-preset{margin-top:8px;background-color:transparent;border-color:#e6e6e6;box-shadow:none;color:#666}.two-up{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:17px}.two-up input:not([type=range]){height:37px;font-size:12px}.inline-control{display:flex;align-items:center;justify-content:space-between;margin-top:13px;gap:14px}.inline-control label{margin:0}.inline-control select{width:132px}.section-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.section-row label{margin:0}.section-row+select{margin-top:12px}.text-button{font-size:12px;color:#595959;padding:6px 0}.art-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-height:180px;overflow-y:auto;padding:4px;margin:12px -4px 0;scrollbar-width:thin;scrollbar-color:#c9c9c9 transparent;overscroll-behavior:contain}.art-tile{display:block;position:relative;aspect-ratio:1;border-radius:11px;overflow:hidden;padding:0;background:#eee;flex-shrink:0}.art-tile img{width:100%;height:100%;display:block;object-fit:cover;pointer-events:none}.art-tile[aria-pressed=true]{outline:2px solid #246bfe;outline-offset:2px}.art-tile[aria-pressed=true]:after{content:'✓';position:absolute;right:4px;bottom:4px;display:grid;place-items:center;width:17px;height:17px;color:#fff;background:#246bfe;border:1px solid #ffffff80;border-radius:50%;font:10px Arial}#art-count{color:#999;margin-left:4px}input[type=range]{width:100%;min-width:0;accent-color:#246bfe;height:22px;margin:0;cursor:pointer}#timeline{accent-color:#737373}#volume-value{float:right;font-size:10px;color:#888}dialog{background:#f6f6f6;color:#171717;padding:24px;border:1px solid white;border-radius:25px;width:min(380px,calc(100% - 32px));box-shadow:0 20px 80px #0003}dialog::backdrop{background:#0004;backdrop-filter:blur(5px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.dialog-top .icon-button{margin-right:-10px;color:#737373}.export-options{display:grid;gap:10px}.export-options button{display:flex;align-items:center;justify-content:space-between;min-height:54px;border-radius:13px;padding:0 17px;text-align:left}.export-options button span:last-child{color:#888;font-size:12px}#export-progress{margin-top:22px;font-size:12px}progress{width:100%;height:5px;accent-color:#246bfe;display:block;margin:10px 0 16px}#download-again{width:100%;margin-top:18px}#download-again[hidden]{display:none}#status{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);padding:12px 20px;border:1px solid #e3e3e3;border-radius:100px;background:#fff;box-shadow:0 4px 20px #0001;max-width:calc(100% - 24px);z-index:10;font-size:13px}#status:empty{display:none}body[data-input=keyboard] *{transition:none!important}@media(hover:hover) and (pointer:fine){.dark:hover{background:var(--hs-dark-hover);box-shadow:var(--hs-dark-hover-shadow)}.soft:hover{background:#fff}.text-button:hover{color:#171717}.transport .icon-button:hover{background:#00000005;border-radius:50%}.art-tile:hover{opacity:.85}}@media(prefers-reduced-transparency:reduce){.glass{background:#fafafa;backdrop-filter:none}dialog::backdrop{backdrop-filter:none}}@media(forced-colors:active){button,input,select,textarea{border:1px solid ButtonText}.art-tile[aria-pressed=true]{outline-color:Highlight}}@media(max-width:1050px){.workspace{gap:26px;grid-template-columns:minmax(0,1fr) 278px}.header{padding:0 26px}.controls{padding-inline:19px}.stage{height:55vh;min-height:300px}}@media(max-width:760px){.header{height:80px;padding:0 20px}.workspace{display:flex;flex-direction:column;padding:0 18px max(22px,env(safe-area-inset-bottom));gap:26px}.preview-area{width:100%}.preview-top{margin-bottom:16px}.stage{height:auto;min-height:0;max-height:none}.canvas-shell{width:100%;height:auto;max-height:65svh;max-width:100%}.transport{margin-top:20px}.controls{width:100%;padding-inline:20px}.control-group{padding-block:19px}#editor-fields{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.text-controls{grid-row:span 2}.sound-controls{border:0}.art-grid{max-height:180px}textarea,input:not([type=range]),select{font-size:16px}#role-preset{font-size:16px}.two-up input:not([type=range]){font-size:16px}.inline-control select{width:140px}.segmented button{min-width:43px;padding-inline:8px}.art-tile{min-width:44px}.text-button{min-height:30px}.credit{margin-top:13px}.header-actions{gap:10px}.header .dark{padding-inline:18px}}@media(max-width:520px){#editor-fields{display:block}.preview-top>span{font-size:10px}.stage{padding:0 8px}.canvas-shell{border-radius:12px}.art-grid{grid-template-columns:repeat(4,1fr);max-height:187px}.control-group{border-bottom:1px solid #e8e8e8}.header h1{font-size:27px}.header .mark{width:29px}.identity{gap:13px}.transport{gap:4px}.transport output{font-size:10px;min-width:65px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

[hidden]{display:none!important}