@font-face{font-family:Pixel;src:url('assets/studio-pixel.ttf')}*{box-sizing:border-box}html{background:#101329;color:#fff0cb;font-family:Arial,sans-serif;overscroll-behavior:none}body{margin:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);height:100dvh;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;min-height:44px;min-width:44px;border:2px solid #647c9b;background:#312344;color:#fff0cb;cursor:pointer;border-radius:2px;touch-action:manipulation}button:active{transform:translateY(2px);background:#4b477c}button:focus-visible,a:focus-visible{outline:3px solid #fff0cb;outline-offset:2px}button:disabled{opacity:.45;cursor:default}button.primary{background:#3bc7b1;color:#101329;border-color:#a5e7c1;font-weight:700;box-shadow:0 4px #243c57}button.pink{background:#d95d96;color:#101329;border-color:#f4b49a}h1,h2,h3,.pixel{font-family:Pixel,monospace;font-weight:400;line-height:1.4}h1{font-size:clamp(23px,4vw,44px);margin:0}h2{font-size:20px;margin:0 0 12px}h3{font-size:14px;margin:0 0 8px}p{line-height:1.45;margin:8px 0}small{font-size:12px}img,canvas{image-rendering:pixelated}#app{max-width:1180px;margin:auto;height:100%;display:flex;flex-direction:column;background:#181930;border-inline:1px solid #382d58}header{height:58px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:5px 14px;border-bottom:2px solid #4b477c;background:#101329;gap:6px}.wordmark{text-decoration:none;color:#fff0cb;font:15px Pixel;letter-spacing:1px}.wordmark span{display:block;color:#d95d96;font:8px Pixel;margin-top:5px}nav{display:flex;gap:5px}nav button{font:22px monospace;background:#181930;border-color:#382d58}#main{flex:1;min-height:0;position:relative;overflow:hidden}footer{flex:none;min-height:32px;display:flex;justify-content:space-between;align-items:center;padding:4px 14px;gap:6px;color:#a5e7c1;font-size:11px;background:#101329;border-top:1px solid #382d58}.title{height:100%;position:relative;overflow-y:auto;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end;padding:24px;background:#101329}.title:before{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#101329 0%,#10132922 75%),url('assets/shop.png') center 35% / cover;z-index:-2;image-rendering:pixelated}.title:after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 5px,#10132924 5px 6px);z-index:-1}.rain{position:absolute;top:5%;left:0;right:0;height:54%;pointer-events:none;opacity:.4;background:repeating-linear-gradient(115deg,transparent 0 37px,#a5e7c1 38px 40px,transparent 41px 83px);background-size:100px 100px;animation:rain 3s linear infinite;mask-image:linear-gradient(transparent,#000,transparent)}@keyframes rain{to{background-position:0 100px}}.neon{color:#a5e7c1;text-shadow:3px 3px #4b477c;animation:neon 4s steps(2,end) infinite}@keyframes neon{50%{filter:brightness(1.16)}}.titlecard{max-width:570px;background:#101329e8;border:2px solid #4b477c;border-top:4px solid #d95d96;padding:20px;box-shadow:7px 7px #10132999}.eyebrow{color:#f4b49a;font:10px Pixel;margin-bottom:12px;letter-spacing:1px}.titlecard p{color:#ded09e;max-width:470px}.actions{display:flex;gap:10px;margin:14px 0 3px;flex-wrap:wrap}.actions button{padding:10px 18px}.titlefoot{font-size:11px;color:#a5e7c1;margin-top:10px}.status{height:34px;display:flex;align-items:center;justify-content:space-between;gap:8px;background:#312344;padding:4px 12px;font-size:12px;border-bottom:2px solid #4b477c}.status strong{color:#a5e7c1}.play{height:100%;display:flex;flex-direction:column;background:linear-gradient(#101329b8,#101329ed),url('assets/shop.png') center / cover;image-rendering:pixelated}.gamebody{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1.25fr;gap:14px;padding:16px}.member{display:flex;flex-direction:column;min-height:0;gap:12px}.room{position:relative;flex:1;min-height:80px;overflow:hidden;border:3px solid #4b477c;box-shadow:5px 5px #101329;background:url('assets/shop.png') center/cover;image-rendering:pixelated}.room .visitor{position:absolute;height:70%;bottom:0;left:29%;animation:visitor 3s steps(2,end) infinite}.room .sign{position:absolute;left:8px;top:8px;padding:6px;background:#101329d9;color:#a5e7c1;font:9px Pixel}.room .glow{position:absolute;inset:0;background:#d95d9610;animation:neon 4s infinite}@keyframes visitor{50%{transform:translateY(3px)}}.clue{background:#181930;border:2px solid #647c9b;border-left:5px solid #d95d96;padding:12px}.membertop{display:flex;justify-content:space-between;gap:10px;font-size:13px;color:#a5e7c1}.clue p{font-size:16px;margin-bottom:0}.clue .part{font-size:11px;color:#f4b49a;margin-top:6px}.workspace{min-height:0;display:flex;flex-direction:column;background:#101329e8;border:2px solid #4b477c;box-shadow:5px 5px #101329}.workspacehead{padding:10px 12px;border-bottom:2px solid #4b477c;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#a5e7c1}.shelf{flex:1;min-height:0;overflow-y:auto;padding:10px;display:grid;grid-template-columns:1fr 1fr;gap:9px;align-content:start;overscroll-behavior:contain}.film{display:flex;align-items:center;gap:8px;text-align:left;min-height:103px;padding:7px;border-color:#4b477c;box-shadow:0 3px #181930}.film img{width:66px;height:66px;flex:none}.film b{display:block;color:#fff0cb;font-size:14px;line-height:1.2}.film small{display:block;color:#a5e7c1;margin-top:5px;font-size:11px}.feedback{padding:8px 12px;font-size:12px;min-height:34px;background:#243c57;color:#a5e7c1}.bench{flex:1;min-height:0;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px}.bench-title{display:flex;align-items:center;gap:10px;font-size:14px}.bench-title img{width:48px;height:48px}.cassette{height:100px;flex:none;background:#312344;border:4px solid #647c9b;position:relative;box-shadow:4px 4px #101329;display:flex;align-items:center;justify-content:space-around;margin:0 auto;width:min(100%,340px);overflow:hidden}.reel{height:58px;width:58px;border:10px solid #fff0cb;background:repeating-conic-gradient(#4b477c 0deg 35deg,#101329 35deg 60deg);border-radius:50%;position:relative}.reel:after{content:'';position:absolute;inset:10px;background:#101329;border-radius:50%}.cassette.winding .reel{animation:spin .45s linear infinite}@keyframes spin{to{transform:rotate(-360deg)}}.cassette .label{font:9px Pixel;text-align:center;color:#f4b49a;background:#101329;padding:8px}.meters{display:grid;grid-template-columns:1fr 1fr;gap:12px}.meterlabel{font-size:12px;display:flex;justify-content:space-between;margin-bottom:5px}.meter{height:13px;background:#101329;border:2px solid #647c9b}.meter>i{display:block;height:100%;width:0;background:#3bc7b1}.meter.heat>i{background:#d95d96}.pad{touch-action:none;user-select:none;-webkit-user-select:none;min-height:66px;border:2px dashed #647c9b;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#a5e7c1;font-size:13px;background:repeating-linear-gradient(90deg,#181930 0px 22px,#243c57 23px 24px)}.pad small{color:#ded09e;margin-top:4px}.rewindbuttons{display:flex;gap:10px}.rewindbuttons button{flex:1;padding:8px;min-height:48px}.hold{touch-action:none;user-select:none;-webkit-user-select:none}.bench-note{color:#ded09e;font-size:12px}.endview{height:100%;overflow-y:auto;padding:24px;display:flex;align-items:center;justify-content:center;background:linear-gradient(#10132999,#101329),url('assets/shop.png') center/cover}.endcard{max-width:600px;background:#101329ed;border:3px solid #d95d96;padding:24px;text-align:center}.endcard img{height:90px}.badges{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin:14px 0}.badge{border:2px solid #3bc7b1;color:#a5e7c1;padding:8px;font:9px Pixel}.score{color:#f4b49a;font:24px Pixel;margin:16px 0}dialog{background:#181930;color:#fff0cb;border:3px solid #d95d96;padding:0;width:min(540px,calc(100% - 24px));max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px);box-shadow:8px 8px #101329;overscroll-behavior:contain}dialog::backdrop{background:#101329d9}#modalbody{padding:20px;overflow-y:auto;max-height:inherit}.closebar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}.closebar h2{margin:0}.closebar button{flex:none}.film-detail{display:flex;gap:15px;align-items:center;margin:12px 0}.film-detail img{width:112px;height:112px}.tags{color:#a5e7c1;font-size:13px}.wide{width:100%;padding:12px;margin-top:10px}.archive{display:grid;grid-template-columns:1fr 1fr;gap:10px}.record{padding:10px;border:2px solid #4b477c;min-height:108px;display:flex;gap:6px;align-items:center}.record img{width:60px;height:60px}.record b{font-size:12px}.record small{display:block;color:#a5e7c1;margin-top:5px}.locked{opacity:.5}.muted{color:#ded09e}.pausebuttons{display:grid;gap:10px;margin-top:15px}.pausebuttons button{padding:10px}.expanded{position:fixed;inset:0;z-index:10;max-width:none!important;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);height:100dvh!important}body:has(.expanded){padding:0}.sr{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}
@media(max-width:650px){header{height:54px;padding:4px 8px}.wordmark{font-size:11px;letter-spacing:0}.wordmark span{font-size:6px}nav{gap:3px}nav button{min-width:44px;width:44px}footer{padding:4px 8px;font-size:9px;min-height:28px}.title{padding:14px}.titlecard{padding:15px}.titlecard p{font-size:14px}.gamebody{display:flex;flex-direction:column;gap:8px;padding:8px}.member{flex:none;display:block}.room{display:none}.clue{padding:8px 10px}.clue p{font-size:14px;margin-top:5px}.membertop{font-size:11px}.workspace{flex:1;min-height:0}.workspacehead{padding:7px 10px}.film{min-height:89px;padding:5px;gap:4px}.film img{width:48px;height:48px}.film b{font-size:12px}.film small{font-size:10px}.shelf{padding:7px;gap:7px}.bench{padding:10px;gap:9px}.bench-title{font-size:13px}.cassette{height:82px}.reel{width:50px;height:50px;border-width:8px}.bench-note{margin:0}.status{padding:4px 8px;font-size:11px}.feedback{font-size:11px;padding:6px 9px;min-height:29px}h2{font-size:17px}.endview{padding:12px}.endcard{padding:16px}.archive{gap:6px}.record{padding:5px;gap:3px}.record img{width:44px;height:44px}.record b{font-size:11px}}
@media(max-height:460px) and (min-width:480px){header{height:48px;padding:2px 8px}.wordmark{font-size:12px}.wordmark span{font-size:6px}footer{min-height:22px;font-size:9px;padding:2px 8px}.status{height:27px;flex:none}.gamebody{display:grid;grid-template-columns:minmax(180px,.85fr) minmax(240px,1.25fr);padding:6px;gap:8px}.member{display:flex;gap:6px}.room{display:block;min-height:30px}.clue{padding:7px}.clue p{font-size:12px;margin-top:5px}.membertop{font-size:11px}.clue .part{font-size:10px}.workspacehead{padding:5px 8px;min-height:25px}.film{min-height:74px;padding:4px;gap:4px}.film img{width:44px;height:44px}.film b{font-size:11px}.film small{font-size:9px}.shelf{padding:6px;gap:6px}.bench{padding:7px;gap:6px;display:grid;grid-template-columns:1fr 1fr;align-content:start}.bench-title{grid-column:1/-1;font-size:11px}.bench-title img{display:none}.cassette{height:65px;width:100%;grid-row:2}.reel{width:40px;height:40px;border-width:6px}.cassette .label{font-size:6px;padding:3px}.meters{grid-column:2;display:block}.meter{height:10px;margin-bottom:4px}.meterlabel{font-size:10px;margin-bottom:2px}.pad{min-height:47px;grid-column:1/-1;font-size:11px}.pad small{font-size:9px;margin-top:1px}.rewindbuttons{grid-column:1/-1;gap:6px}.rewindbuttons button{min-height:44px;font-size:12px;padding:5px}.bench-note{grid-column:1/-1;font-size:10px;margin:0}.feedback{font-size:10px;min-height:22px;padding:4px 8px}.title{padding:12px;display:block}.titlecard{margin-left:auto;max-width:58%;padding:12px}.titlecard h1{font-size:23px}.titlecard p{font-size:12px}.titlecard .eyebrow{font-size:8px;margin-bottom:6px}.actions{margin:8px 0 0}.actions button{padding:6px 12px}.titlefoot{font-size:9px}.endview{padding:10px}.endcard{padding:12px;max-width:580px}.endcard img{height:48px;float:left}.endcard h1{font-size:23px}.endcard p{font-size:12px}.score{font-size:18px;margin:8px}.badges{margin:8px}.badge{padding:5px;font-size:8px}}
@media(prefers-reduced-motion:reduce){.rain{animation-duration:12s;opacity:.16}.neon,.room .glow{animation-duration:10s}.room .visitor{animation-duration:8s}.cassette.winding .reel{animation-duration:1.3s}}
@media(max-height:700px) and (max-width:479px){.clue p{font-size:12px}.clue{padding:6px 8px}.clue .part{font-size:10px}.bench{display:grid;grid-template-columns:1fr 1fr;align-content:start;padding:6px;gap:5px}.bench-title{grid-column:1/-1;font-size:11px;line-height:1.2}.bench-title img{display:none}.bench-title small{display:none}.cassette{height:57px;width:100%;grid-row:2}.reel{height:34px;width:34px;border-width:6px}.cassette .label{font-size:5px;padding:3px}.meters{grid-column:2;display:block}.meter{height:9px;margin-bottom:4px}.meterlabel{font-size:10px;margin-bottom:2px}.pad{min-height:44px;grid-column:1/-1;font-size:10px}.pad small{font-size:9px}.rewindbuttons{grid-column:1/-1;gap:6px}.rewindbuttons button{min-height:44px;font-size:11px;padding:4px}.bench-note{display:none}.workspacehead{padding:5px 8px;font-size:10px}.feedback{padding:5px 8px;font-size:10px;min-height:25px}.membertop{font-size:10px}.status{font-size:10px}.gamebody{gap:6px;padding:6px}}
@media(max-height:460px) and (min-width:480px){.bench{padding:4px;gap:3px;grid-template-rows:30px 44px 44px}.bench-title,.bench-note{display:none}.cassette{height:30px;grid-row:1}.reel{width:24px;height:24px;border-width:4px}.reel:after{inset:5px}.cassette .label{font-size:4px;padding:2px}.meters{grid-column:2;grid-row:1;display:grid;grid-template-columns:1fr 1fr;gap:5px}.meterlabel{font-size:8px;display:block;margin:0}.meterlabel b{float:right}.meter{height:8px;margin:2px 0}.pad{grid-row:2;min-height:44px;line-height:1.2;font-size:10px}.pad small{font-size:8px}.rewindbuttons{grid-row:3}.feedback{line-height:1.15;min-height:20px;padding:3px 6px}.workspacehead{min-height:22px;padding:4px 6px;font-size:10px}}
@media(max-height:310px) and (min-width:480px){.bench{grid-template-rows:20px 44px 44px;gap:2px;padding:3px}.cassette{display:none}.meters{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.meterlabel{display:flex}.meter{height:7px;margin:1px 0}.clue p{font-size:11px}.clue .part{display:none}.clue{padding:6px}.membertop{font-size:10px}.room{min-height:25px}}
.closebar{position:sticky;top:0;background:#181930;z-index:2;padding-block:4px}
.room .visitor{height:min(70%,240px);max-width:90%;object-fit:contain;left:50%;transform:translateX(-50%)}@keyframes visitor{50%{transform:translate(-50%,3px)}}

dialog{inset:calc(env(safe-area-inset-top) + 12px) calc(env(safe-area-inset-right) + 12px) calc(env(safe-area-inset-bottom) + 12px) calc(env(safe-area-inset-left) + 12px);margin:auto;width:min(540px,calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right) - 24px))}

.mastery-seal{border:1px solid #a5e7c1;background:#243c57;padding:9px;color:#a5e7c1;font:11px/1.6 Pixel,monospace}
.endview{align-items:flex-start}.endcard{margin-block:auto}
@media(orientation:landscape) and (max-height:350px){.titlecard>p:nth-of-type(2),.titlefoot{display:none}.titlecard .actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.titlecard .actions button{font-size:12px;padding:5px 4px;min-width:0}}
@media(orientation:landscape) and (max-height:350px){.pausebuttons{grid-template-columns:repeat(2,minmax(0,1fr))}}

footer{flex-wrap:wrap}#storage-note{flex-basis:100%;font:11px/1.35 system-ui,sans-serif;color:#f6b2c2}#storage-note[hidden]{display:none}

.archive-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0 16px}.archive-tabs button{padding:8px;min-width:0}.archive-tabs button[aria-pressed="true"]{background:#243c57;border-color:#a5e7c1}.mix-book{display:grid;gap:12px;margin:16px 0}.mix-card,.mix-receipt{padding:12px;border:2px solid #4b477c;background:#10132999;text-align:left;min-width:0}.mix-card h3,.mix-receipt h2{font-size:14px;color:#a5e7c1;overflow-wrap:anywhere}.mix-tuple{display:grid;gap:5px;padding:9px 0;border-top:1px solid #647c9b66;min-width:0;overflow-wrap:anywhere}.mix-tuple strong{font-size:11px;color:#f4b49a}.mix-tuple b{font-size:14px;line-height:1.5}.mix-tuple small{font-size:11px;color:#ded09e;line-height:1.45}.mix-tuple>span{color:#ded09e;font-size:14px}.mix-pages{display:grid;grid-template-columns:minmax(0,1fr) minmax(60px,110px) minmax(0,1fr);align-items:center;gap:7px;margin:16px 0}.mix-pages button{font-size:12px;padding:7px 3px;min-width:0}.mix-pages span{text-align:center;font-size:12px;line-height:1.4}.mix-empty{padding:16px;border:1px dashed #647c9b}.mix-receipt{margin:18px 0}.mix-receipt p{font-size:12px}.mix-records{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media(max-width:479px){.mix-records{grid-template-columns:1fr;gap:5px}.mix-card,.mix-receipt{padding:10px}.mix-pages{grid-template-columns:minmax(0,1fr) minmax(60px,90px) minmax(0,1fr)}}
.closebar::before{content:'';position:absolute;inset:-20px -20px 0;z-index:-1;background:#181930;pointer-events:none}
