@font-face{font-family:Comic;src:url('../assets/fonts/barlow-condensed-800.ttf');font-weight:800;font-display:swap}@font-face{font-family:Comic;src:url('../assets/fonts/barlow-condensed-600.ttf');font-weight:500;font-display:swap}@font-face{font-family:Marker;src:url('../assets/fonts/permanent-marker.ttf');font-display:swap}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#142029;color:#f1e7d1;font-family:Comic,'Trebuchet MS',sans-serif}body{background-image:radial-gradient(#b7a88716 .6px,transparent .8px);background-size:5px 5px}button,a{-webkit-tap-highlight-color:transparent}button{font:800 17px Comic,sans-serif;border:2px solid #151d23;background:#f8d75d;color:#141d23;cursor:pointer;min-height:42px;padding:9px 18px;box-shadow:3px 3px 0 #141d23;transition:background .15s,transform .15s}button:hover{background:#fff1a7;transform:translateY(-1px)}button:focus-visible,a:focus-visible{outline:3px solid #fff2a5;outline-offset:4px}a{color:inherit;text-decoration:none}#app{width:min(1560px,100%);margin:auto;padding:0 24px}header{height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#ecdfc5;font-size:20px;letter-spacing:.6px}header>a{font-size:23px;font-weight:800;line-height:.85}header>a span{display:block;font-size:10px;letter-spacing:4px;margin-top:5px}header>div{font-weight:800}header>div b{color:#e87447;border-left:1px solid #827a68;padding-left:14px;margin-left:14px}header button{background:transparent;color:#eedec0;border-color:#665c4a;font-size:13px;box-shadow:none;min-height:32px;padding:5px 12px}.paper{position:relative;background:#f3e7ce;border:8px solid #e8d9bb;box-shadow:0 15px 60px #0006;overflow:hidden;isolation:isolate}canvas{width:100%;display:block;aspect-ratio:1440/860;touch-action:none}footer{display:flex;justify-content:space-between;gap:16px;font-size:12px;color:#bdb6a6;letter-spacing:.6px;padding:14px 0 20px}footer i{color:#655f52;font-style:normal;margin:0 9px}.loading{position:absolute;inset:0;background:#17232b;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.loading b{font:28px Marker,sans-serif;color:#f8d75d}.loading span{font-size:15px;color:#c8bba3}#cover,#ending{position:absolute;inset:0;z-index:4;padding:9% 7%;background:linear-gradient(90deg,#071820ed,#0a192a90 55%,transparent 85%);display:flex;align-items:flex-start;flex-direction:column;justify-content:center}.eyebrow{font-size:13px;letter-spacing:3px;color:#f3ce61;font-weight:800}h1{font:clamp(50px,6.5vw,106px)/.96 Marker,sans-serif;letter-spacing:-4px;margin:22px 0;color:#fff0cf;text-shadow:5px 5px 0 #111e28}h1 em{font-style:normal;color:#f2c94f}#cover p,#ending p{font-size:24px;line-height:1.35;margin:0 0 25px;max-width:440px}#cover button,#ending button{font-size:20px;min-width:250px;max-width:100%;margin-bottom:13px}#cover button span{margin-left:60px}#cover small{font-size:13px;letter-spacing:1px;color:#d4c6a8;margin-top:16px}#continue,#ending-page{background:#ebdfc9;font-size:14px!important}#ending>b{font:19px Marker;color:#f2c94f;letter-spacing:2px;margin:0 0 26px}.topbar{position:absolute;top:16px;left:19px;right:19px;display:flex;align-items:center;gap:12px;z-index:3;pointer-events:none}.topbar>div:first-child{display:flex;align-items:center;background:#f5d45a;color:#101b23;box-shadow:3px 3px 0 #142029;transform:rotate(-1deg);font-size:22px;border:3px solid #142029;padding:5px 15px;gap:12px}.topbar #panel-id{font:22px Marker}.topbar .health{display:flex;gap:4px;margin-left:auto;background:#f7ebd1;padding:6px;border:3px solid #142029;box-shadow:2px 2px 0 #142029}.heart{display:block;width:25px;height:11px;background:#dc5b3d;transform:skew(-9deg);border:1px solid #142029}.heart.empty{background:#8a8279}.topbar button{pointer-events:auto;font-size:13px;min-height:36px;padding:7px 12px}.topbar #pause{font-size:19px;min-width:40px}#objective{position:absolute;bottom:15px;left:22px;right:22px;display:flex;align-items:flex-start;flex-direction:column;gap:5px;pointer-events:none;z-index:3}#objective b{background:#f5df94;color:#15232b;padding:7px 12px;border:2px solid #15232b;box-shadow:3px 3px 0 #15232b;font-size:19px;max-width:100%}#objective span{font-size:14px;background:#15232bee;color:#ffeac1;padding:5px 11px}#toast{position:absolute;top:92px;left:50%;transform:translateX(-50%) rotate(-1deg);background:#fff3d8;color:#19252b;border:3px solid #19252b;padding:10px 20px;box-shadow:4px 4px 0 #19252b;z-index:3;max-width:78%;text-align:center;font-size:19px;font-weight:800;pointer-events:none}#page-caption{position:absolute;bottom:20px;left:0;right:0;text-align:center;color:#17232a;z-index:3;background:#f4e7cfee;padding:10px;display:flex;flex-direction:column;gap:4px}#page-caption b{font:18px Marker}#page-caption span{font-size:15px}#modal{position:absolute;inset:0;background:#07131cd6;z-index:10;display:flex;align-items:center;justify-content:center;padding:20px;overflow:auto}#modal>div{background:#efe2c6;color:#14212b;border:4px solid #14212b;box-shadow:9px 9px 0 #0a151c;padding:25px 30px;max-width:600px;width:100%}#modal .eyebrow{color:#a95029;font-size:11px}h2{font:40px Marker;margin:8px 0}#modal p{font-size:17px;margin:8px 0 15px}.keys{display:grid;grid-template-columns:1fr 1fr;gap:8px 20px;font-size:13px;border-top:1px solid #b1a58c;padding-top:12px;margin-bottom:20px}.keys span{display:flex;flex-direction:column;gap:2px}.keys b{font-size:14px}#modal button{margin:5px 4px 0 0;font-size:13px;min-height:36px}#resume{display:block;font-size:17px!important;width:100%;margin:0 0 8px!important}.touch{display:none;justify-content:space-between;gap:20px;padding:12px 0}.touch>div{display:flex;gap:6px}.touch button{min-height:47px;font-size:15px;min-width:43px;padding:7px;touch-action:none;user-select:none}.touch>div:nth-child(2) button{font-size:12px}#lab{display:flex;align-items:center;justify-content:center;gap:12px;background:#9a442e;padding:8px;font-size:14px}#lab select{font:inherit;background:#f7deb0;padding:5px} [hidden]{display:none!important}@media(max-width:900px){#app{padding:0 10px}header{height:52px;font-size:16px}header>a{font-size:18px}header>div b{margin-left:8px;padding-left:8px}header button{font-size:11px;padding:4px 6px}.paper{border-width:4px}.topbar{top:9px;left:9px;right:9px;gap:6px}.topbar>div:first-child{font-size:15px;padding:4px 8px;gap:6px}.topbar #panel-id{font-size:17px}.heart{width:16px;height:9px}.topbar button{font-size:10px;padding:4px 7px;min-height:30px}.topbar #pause{min-width:30px;font-size:16px}.topbar .health{gap:2px;padding:5px}#objective{bottom:9px;left:11px;right:11px;gap:3px}#objective b{font-size:14px;padding:5px 8px}#objective span{font-size:11px;padding:3px 7px}#toast{top:60px;font-size:14px;padding:7px 12px}#cover p,#ending p{font-size:17px;margin-bottom:15px}#cover,#ending{padding:7%}h1{font-size:58px;margin:13px 0;letter-spacing:-2px}#cover button,#ending button{font-size:15px;min-width:180px;min-height:35px;padding:6px 12px;margin-bottom:8px}#cover small{font-size:10px;margin-top:7px}.eyebrow{font-size:10px;letter-spacing:2px}.touch{display:flex}footer{padding:10px 0;font-size:10px}#modal>div{padding:15px 20px;max-width:540px}h2{font-size:28px}.keys{gap:5px;font-size:11px;margin-bottom:10px}.keys b{font-size:12px}#modal p{font-size:13px}#ending>b{font-size:14px;margin-bottom:15px}}@media(max-width:600px){header>div{font-size:12px}header>div b{display:block;border:0;padding:0;margin:2px 0 0;font-size:10px}header{height:50px}header button{font-size:10px}canvas{aspect-ratio:1.15}#cover .eyebrow{font-size:9px}h1{font-size:51px;margin:16px 0}#cover p,#ending p{font-size:16px}#cover button,#ending button{font-size:15px}#cover small{font-size:10px}.topbar #page{font-size:0;width:30px;padding:3px}.topbar #page span{font-size:17px}.topbar>div:first-child{font-size:13px;max-width:58%}.topbar #panel-id{font-size:15px}.heart{width:12px;height:8px}.topbar .health{padding:4px}#objective b{font-size:14px}#objective span{font-size:10px;max-width:100%}#toast{font-size:13px;top:58px;width:85%;max-width:85%;padding:5px 8px}.touch{gap:5px;padding:11px 0}.touch>div{gap:4px}.touch button{font-size:17px;min-width:34px;padding:5px;min-height:46px}.touch>div:nth-child(2) button{font-size:10px;min-width:37px}footer>span:nth-child(2){display:none}.keys{grid-template-columns:1fr 1fr}.paper:has(#modal:not([hidden])){min-height:440px}#page-caption b{font-size:13px}#page-caption span{font-size:11px}#ending>b{font-size:12px}}