.mystery-page{--m-ink:#32685a;--m-edge:#d7ceba}.m-top,.m-case-bar,.m-status{display:flex;justify-content:space-between;gap:16px;align-items:center;flex-wrap:wrap}.m-case-bar{margin:0 0 24px;padding-bottom:16px;border-bottom:1px solid var(--m-edge)}.m-top{margin-bottom:22px}.mystery-page button:focus-visible,.mystery-page a:focus-visible{outline:3px solid #32685a;outline-offset:4px}.mystery-page button{min-height:44px}.mystery-page #m-stage:focus{outline:none}.m-welcome,.m-finish{display:flex;align-items:center;gap:28px;padding:26px;background:#edf0e1;border:1px solid var(--m-edge);border-radius:28px;margin-bottom:28px}.m-welcome>.character-art,.m-finish>.character-art{width:180px;height:230px}.m-welcome>div:not(.m-closed-case),.m-finish>div{flex:1}.m-welcome .btn,.m-finish .btn{margin:8px 8px 0 0}.m-case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.m-case-choice{display:flex;flex-direction:column;gap:12px;background:#fffaf0;border:1px solid var(--m-edge);border-radius:22px;padding:24px;text-decoration:none;color:inherit;box-shadow:0 4px 0 #d7ceba26}.m-case-choice:nth-child(3n+2){background:#eee7f2}.m-case-choice .link{margin-top:auto}.m-case-choice h3{color:var(--m-ink)}.m-gallery-art{display:flex;align-items:center;justify-content:space-around;position:relative;min-height:270px;padding:20px;background:radial-gradient(#866a3a16 .8px,transparent 1px),#eae7f3;background-size:5px 5px;text-decoration:none}.m-gallery-art>.character-art{height:230px;width:42%}.m-closed-case{width:140px;height:110px;position:relative;flex:none;border:5px solid #795338;border-radius:17px;background:repeating-linear-gradient(90deg,transparent 0 30px,#65432333 31px 40px,transparent 41px 70px),#bf8b55;box-shadow:4px 6px 0 #63421e22;display:grid;place-items:center}.m-closed-case:before{content:'';position:absolute;width:55px;height:18px;border:6px solid #795338;border-bottom:0;border-radius:12px 12px 0 0;top:-23px;left:36px}.m-closed-case span{font-size:50px;color:#fff8e5;font-weight:bold;transform:rotate(-8deg)}.m-case-file{padding:22px;background:#fff8e8;box-shadow:3px 5px 0 #7f694033;transform:rotate(6deg);color:#32685a;font-weight:bold}.m-case-file b{display:block;font-size:60px;text-align:center}.m-observation{display:grid;grid-template-columns:1.1fr 1fr;gap:25px}.m-scene{position:relative;overflow:hidden;border-radius:26px;background:radial-gradient(#79533812 1px,transparent 1px),linear-gradient(#d8edf2 0 65%,#e4e8cc 65%);background-size:6px 6px,auto;min-height:440px;padding:22px;display:flex;align-items:center;justify-content:center;gap:20px;border:1px solid var(--m-edge)}.m-observer{width:65%;max-width:280px}.m-observation-copy{align-self:center}.m-observation-copy>.btn{margin:8px 5px 0 0}.m-visitor-art{height:150px;display:flex;justify-content:center;align-items:flex-end}.m-visitor-art img{height:100%;width:100%;object-fit:contain}.m-observer .m-visitor-art{height:255px}.m-mischief-prop{width:95px;height:105px;transform:rotate(12deg);align-self:center}.m-mischief-prop .little-picture{width:100%;height:100%;object-fit:contain}.m-action-note{position:absolute;bottom:14px;left:15px;right:15px;padding:10px;background:#fffaf0ed;border-radius:12px;font-size:14px;text-align:center}.m-props{display:flex;justify-content:center;align-items:flex-start;gap:12px;margin:15px 0 6px}.m-prop{display:flex;align-items:center;flex-direction:column;gap:8px;min-width:0}.m-prop small{font-size:12px;white-space:nowrap}.m-bag{display:block;width:44px;height:43px;border-radius:7px 9px 4px 5px;position:relative;box-shadow:2px 3px 0 #5c493233;background-image:repeating-linear-gradient(13deg,#ffffff20 0 1px,transparent 1px 4px);border:2px solid #4b403855}.m-bag:before{content:'';position:absolute;top:-13px;left:10px;width:20px;height:14px;border:4px solid currentColor;border-bottom:0;border-radius:9px 9px 0 0}.m-bag.red{background-color:#cb5953;color:#aa4442}.m-bag.blue{background-color:#4c91b3;color:#3f7797}.m-ticket{width:46px;height:38px;display:block;background-color:#fff5db;border:2px dashed #a48259;transform:rotate(-7deg);box-shadow:2px 3px 0 #5c49321c}.m-ticket.striped{background-image:repeating-linear-gradient(90deg,#7770a2 0 5px,transparent 5px 11px)}.m-ticket.spotted{background-image:radial-gradient(#7770a2 3px,transparent 3.6px);background-size:12px 12px}.m-badge{width:38px;height:38px;background:repeating-linear-gradient(15deg,#fff2 0 1px,transparent 1px 4px),#edbd4b;border:3px solid #b18b35;box-shadow:2px 3px 0 #5c493225;display:block}.m-badge.round{border-radius:50%}.m-badge.square{border-radius:3px;transform:rotate(-3deg)}.m-lineup{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:18px 0 28px}.m-suspect{position:relative;min-width:0;background:#fffaf0;border:1px solid var(--m-edge);padding:16px 10px 8px;border-radius:23px;transition:opacity .35s,filter .35s;box-shadow:0 4px 0 #d7ceba26}.m-number{position:absolute;left:10px;top:10px;background:#eee7f2;border-radius:50%;width:27px;height:27px;text-align:center;font-weight:bold}.m-cleared-label{display:block;text-align:center;font-size:12px;margin-top:8px}.m-cleared{opacity:.4;filter:grayscale(.8)}.m-just-cleared{animation:m-clear .6s ease}.m-running{animation:m-run .5s ease-in forwards}.m-officer{display:flex;gap:18px;align-items:center}.m-officer img{width:92px;height:105px}.m-officer p{margin:5px 0}.m-status{padding:12px 18px;background:#eee7f2;border-radius:15px;margin-top:20px}.m-witness-controls{display:grid;grid-template-columns:1.5fr 1fr;gap:24px}.m-clue-groups{display:flex;gap:12px;flex-wrap:wrap}.m-clue-groups fieldset{border:1px solid var(--m-edge);border-radius:14px;padding:12px;flex:1;min-width:170px}.m-clue-groups legend{font-weight:bold;color:#32685a;padding:0 6px}.m-report-option{display:flex;align-items:center;gap:6px;margin:7px 0;flex-wrap:wrap}.m-report-option>.btn:first-child{flex:1;white-space:nowrap}.m-report-option>.btn:last-child{padding:9px;font-size:12px}.m-notebook,.m-plan{padding:22px;border:1px solid var(--m-edge);background:#fffaf0;border-radius:20px}.m-notebook ol{padding-left:20px}.m-notebook li{margin:8px 0}.m-notebook .btn{margin-top:9px}.m-tutorial{text-align:center;max-width:650px;margin:20px auto;padding:30px;border:1px solid var(--m-edge);border-radius:25px;background:#edf0e1}.m-demo-bags{display:flex;gap:70px;justify-content:center;margin:35px}.m-demo-bags>div{display:grid;justify-items:center}.m-solved-visitor{max-width:320px;margin:auto;text-align:center}.m-solved-visitor .m-visitor-art{height:220px}.m-mission-layout{display:grid;grid-template-columns:340px 1fr;gap:24px}.m-plan h2{font-size:29px}.m-plan ol{padding-left:20px}.m-plan li{margin:12px 0}.m-plan .btn,.m-plan .plain-btn{margin-top:12px}.m-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.m-item{position:relative;background:#fffaf0;border:2px solid var(--m-edge);border-radius:20px;padding:12px;display:flex;align-items:center;flex-direction:column;gap:8px;color:#32685a;font:inherit;cursor:pointer}.m-item .little-picture{width:110px;height:115px;max-width:100%;object-fit:contain}.m-item .little-atlas{display:block}.m-item span:last-of-type{font-weight:bold}.m-item.m-packed{border-color:#32685a;background:#edf0e1;box-shadow:inset 0 0 0 1px #32685a}.m-item b{position:absolute;top:7px;right:10px;background:#32685a;color:white;border-radius:50%;width:26px;height:26px}.m-packed-chip{border:1px solid #32685a;background:#edf0e1;padding:8px 12px;border-radius:20px;margin:4px;color:#32685a}.m-packed-list{margin-top:18px}.m-demo-note{padding:8px 0;font-size:14px}.mystery-page .feedback{margin-top:24px}.mystery-page .feedback>.btn{margin:7px 8px 0 0}.collage-friend-grid{grid-auto-rows:1fr}.collage-friend{display:flex;flex-direction:column;min-width:0}.collage-friend h3{min-height:2.3em;margin:0}.collage-friend p{flex:1}.collage-friend>.btn{margin-top:18px;white-space:normal;text-align:center}.collage-friend-art{flex-shrink:0}
@keyframes m-clear{0%{opacity:1;transform:translateY(0)}100%{opacity:.4;transform:translateY(5px)}}@keyframes m-run{to{transform:translateX(160%) rotate(12deg);opacity:0}}
@media(max-width:900px){.m-case-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.m-mission-layout{grid-template-columns:280px 1fr}.m-items{grid-template-columns:repeat(2,minmax(0,1fr))}.m-witness-controls{grid-template-columns:1fr}.m-lineup{gap:10px}.m-props{gap:6px}.m-bag{width:35px;height:35px}.m-bag:before{left:6px}.m-ticket{width:36px;height:32px}.m-badge{width:32px;height:32px}.m-observation{grid-template-columns:1fr 1fr}.m-scene{min-height:410px}.m-observer .m-props{gap:9px}}
@media(max-width:600px){.m-lineup{grid-template-columns:repeat(2,minmax(0,1fr))}.m-visitor-art{height:145px}.m-props{gap:15px}.m-case-grid{grid-template-columns:1fr}.m-observation,.m-mission-layout{grid-template-columns:1fr}.m-welcome,.m-finish{flex-wrap:wrap;padding:20px;gap:15px}.m-welcome>.character-art,.m-finish>.character-art{width:90px;height:120px}.m-welcome>div:not(.m-closed-case),.m-finish>div{min-width:60%}.m-welcome>.m-closed-case{display:none}.m-scene{min-height:430px}.m-observer .m-props{gap:14px}.m-gallery-art{min-height:230px}.m-gallery-art>.character-art{height:200px}.m-plan{padding:18px}.m-items{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.m-item{padding:9px;font-size:13px}.m-item .little-picture{height:85px}.m-clue-groups{display:grid;grid-template-columns:1fr}.m-report-option{flex-wrap:nowrap}.m-report-option>.btn:first-child{white-space:normal}.m-officer h2{font-size:26px}.m-case-bar{font-size:13px}.collage-friend h3{font-size:clamp(17px,4.7vw,23px)}}
@media(prefers-reduced-motion:reduce){.m-running,.m-just-cleared{animation:none}.m-suspect{transition:none}}

.m-scene:before{content:"";position:absolute;inset:0;background-image:var(--scene);background-size:cover;background-position:center;opacity:.32}.m-scene>div,.m-action-note{position:relative;z-index:1}.m-scene .m-action-note{position:absolute}.mystery-page .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
