@font-face{font-family:Kalam;font-weight:400;font-display:swap;src:url(/games/pencilled-in/play/fonts/kalam-400.woff2)format("woff2")}@font-face{font-family:Kalam;font-weight:700;font-display:swap;src:url(/games/pencilled-in/play/fonts/kalam-700.woff2)format("woff2")}@font-face{font-family:Courier Prime;font-weight:400;font-display:swap;src:url(/games/pencilled-in/play/fonts/courier-prime-400.woff2)format("woff2")}@font-face{font-family:Courier Prime;font-weight:700;font-display:swap;src:url(/games/pencilled-in/play/fonts/courier-prime-700.woff2)format("woff2")}@font-face{font-family:Old Standard TT;font-weight:400;font-display:swap;src:url(/games/pencilled-in/play/fonts/old-standard-tt-400.woff2)format("woff2")}@font-face{font-family:Old Standard TT;font-weight:400;font-style:italic;font-display:swap;src:url(/games/pencilled-in/play/fonts/old-standard-tt-400-italic.woff2)format("woff2")}:root{--desk:#1e2228;--paper:#f6f1e4;--paper-2:#ebe4d0;--paper-3:#ddd4bd;--grid:#dfe6ee;--margin:#e2a3a0;--ink:#1d2a4a;--pencil:#4d4d56;--pencil-soft:#5f5f68;--red:#a8322a;--focus:#1d6fd1;--hand:"Kalam", "Comic Sans MS", cursive;--type:"Courier Prime", "Courier New", monospace;--print:"Old Standard TT", Georgia, serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--top:max(env(safe-area-inset-top,0px), var(--safe-area-inset-top,0px));--bottom:max(env(safe-area-inset-bottom,0px), var(--safe-area-inset-bottom,0px))}*{box-sizing:border-box}html,body{background:var(--desk);height:100%;margin:0}body{font-family:var(--hand);color:var(--ink);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;overscroll-behavior:none;touch-action:manipulation}button,a{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:0;padding:0}:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:4px}.sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.book{width:min(100vw,480px);height:100dvh;margin:0 auto;position:relative;overflow:hidden}.under-1,.under-2,.page{top:calc(var(--top) + 10px);bottom:calc(var(--bottom) + 8px);border-radius:3px;position:absolute}.under-2{background:var(--paper-3);left:14px;right:38px;transform:translateY(6px)}.under-1{background:var(--paper-2);left:11px;right:40px;transform:translateY(3px)}.page{background-color:var(--paper);background-image:linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);background-position:-1px -1px;background-size:18px 18px;left:8px;right:44px;overflow:hidden}.book.no-tabs .page{right:8px}.book.no-tabs .under-1{right:5px}.book.no-tabs .under-2{right:2px}.page:before{content:"";background:var(--margin);width:2px;position:absolute;top:0;bottom:0;left:52px}.page-body{-webkit-overflow-scrolling:touch;flex-direction:column;gap:10px;padding:20px 14px 18px 64px;display:flex;position:absolute;inset:0;overflow-y:auto}.page.turn{transform-origin:top;animation:.32s ease-out turn}@keyframes turn{0%{opacity:.4;transform:perspective(900px)rotateX(-14deg)translateY(-18px)}to{opacity:1;transform:none}}.tabs{right:-6px;top:calc(var(--top) + 72px);z-index:2;flex-direction:column;gap:5px;display:flex;position:absolute}.tab{text-align:left;width:50px;height:92px;font-family:var(--type);letter-spacing:1px;text-transform:uppercase;color:#1f1a14;border-radius:0 6px 6px 0;align-items:center;gap:2px;padding:0 0 0 10px;font-size:12px;font-weight:700;display:flex;box-shadow:inset 3px 0 4px #0000001f}.tab:nth-child(5n+1){background:#d9c79c}.tab:nth-child(5n+2){background:#c6d5c0}.tab:nth-child(5n+3){background:#e2c0b4}.tab:nth-child(5n+4){background:#c9cfe0}.tab:nth-child(5n+5){background:#dccfa6}.tab[aria-current=true]{background:var(--paper);box-shadow:none;width:50px;margin-left:-6px;padding-left:12px}.tab .tlabel{writing-mode:vertical-rl;transform:rotate(180deg)}.tab .done{font-family:var(--hand);color:var(--pencil-soft);font-size:14px;font-weight:400;line-height:1;display:block}.small,.case-line{color:var(--pencil-soft);font-size:16px}h1.hand{margin:0;font-size:40px;font-weight:700;line-height:1}h2.hand{margin:6px 0 0;font-size:22px;font-weight:700}.note{color:var(--pencil);font-size:16px;line-height:1.3}.note.red{color:var(--red)}.link{text-underline-offset:3px;align-items:center;min-height:44px;font-size:18px;text-decoration:underline;text-decoration-thickness:1.5px;display:inline-flex}.back{color:var(--pencil-soft);align-self:flex-start;align-items:center;min-height:40px;margin:-8px 0 -6px;font-size:16px;display:inline-flex}.stamp{border:3px double var(--red);min-height:44px;color:var(--red);font-family:var(--type);letter-spacing:1px;justify-content:center;align-items:center;padding:0 14px;font-size:16px;font-weight:700;display:inline-flex;transform:rotate(-2deg)}.stamp.big{min-height:52px;font-size:18px}.stamp[aria-pressed=true]{background:var(--red);color:var(--paper)}.stamp:disabled{opacity:.4}.margin-stamps{z-index:1;flex-direction:column;gap:18px;width:46px;display:flex;position:absolute;top:150px;left:4px}.margin-stamps .stamp{letter-spacing:.5px;border-style:solid;border-width:2px;width:46px;min-height:46px;padding:0;font-size:11px}.margin-stamps .stamp:nth-child(2){transform:rotate(4deg)}.margin-stamps .stamp:nth-child(3){transform:rotate(-5deg)}.plan{aspect-ratio:1;flex-shrink:0;align-self:center;width:100%;max-height:46dvh;position:relative}.plan.tall{aspect-ratio:1/1.3;max-height:56dvh}.plan-sketch{--pencil:#4d4d56;width:100%;height:100%;position:absolute;inset:0}.room{text-align:left;border-radius:4px;flex-direction:column;align-items:stretch;padding:7px 6px 4px 9px;display:flex;position:absolute}.room .rname{color:var(--pencil-soft);font-size:14px;line-height:1.1}.compact .room .rname,.compact .victim-mark{font-size:13px}.room .who .ink{pointer-events:auto;z-index:1;position:relative}.room .who{flex-wrap:wrap;flex:1;place-content:center;gap:3px 2px;display:flex}.room.target{background:#a8322a12}.room.victim .rname{color:var(--red)}.victim-mark{color:var(--red);white-space:nowrap;font-size:15px;font-weight:700}.ink{color:var(--ink);border:2px solid var(--ink);transform:rotate(var(--tilt,-2deg));touch-action:none;border-radius:55% 45% 52% 48%/48% 56% 44% 52%;padding:0 7px;font-size:18px;font-weight:700;line-height:1.45;display:inline-block}.ink:nth-child(2n){border-radius:46% 54% 44% 56%/55% 45%}.ink:nth-child(3n){border-radius:52% 48% 58% 42%/44% 52% 48% 56%}.compact .ink{padding:0 5px;font-size:15px}.ink.sel{border-color:var(--red);color:var(--red);box-shadow:0 0 0 2px #a8322a2e}.ink.bad{-webkit-text-decoration:underline wavy var(--red);text-decoration:underline wavy var(--red);text-underline-offset:3px}.ink.killer{border-color:var(--red);color:var(--red)}.cross{color:var(--pencil-soft);padding:0 2px;font-size:15px;text-decoration:line-through;text-decoration-thickness:2px}.drag-ghost{z-index:50;pointer-events:none;background:var(--paper);position:fixed;transform:translate(-50%,-60%)rotate(-4deg)scale(1.1)}.tray{flex-wrap:wrap;align-items:center;gap:6px 8px;min-height:46px;display:flex}.tray .ink{align-items:center;min-height:40px;display:inline-flex}.tray .rub{color:var(--red);min-height:44px;font-size:17px;text-decoration:underline}.tray.lifting{outline:2px dashed var(--red);outline-offset:4px;cursor:pointer;border-radius:6px}.clips{flex-direction:column;gap:10px;padding:4px 4px 0 0;display:flex}.clip{color:#1f1a14;text-align:left;width:100%;padding:10px 12px;position:relative;box-shadow:0 1px 2px #00000038}.clip .src{font-family:var(--type);letter-spacing:1px;color:#5a4a2c;margin-bottom:3px;font-size:11px;display:block}.clip .who{font-family:var(--type);letter-spacing:1px;color:#5c5346;margin-top:3px;font-size:11px;display:block}.clip.newspaper{font-family:var(--print);clip-path:polygon(0 4%,20% 0,45% 3%,70% 0,100% 2%,99% 96%,74% 100%,50% 97%,22% 100%,1% 97%);background:#ebe5d3;font-size:17px;font-style:italic;line-height:1.35}.clip.telegram{font-family:var(--type);background:#f1dfa6;font-size:16px;line-height:1.4}.clip.telegram .src{border-bottom:1px solid #b89b52;padding-bottom:2px}.clip.card{font-family:var(--print);background:#fffdf7;border:1px solid #d8d0bd;font-size:17px;line-height:1.35}.clip.note{font-family:var(--hand);color:var(--ink);background:#fffdf7 linear-gradient(#bcd0e6 1px,#0000 1px) 0 22px/100% 24px;font-size:19px;line-height:24px}.clip.letter{font-family:var(--print);background:#f3ecdc;border-top:3px solid #b8ab8c;font-size:17px;line-height:1.4}.clip:nth-child(4n+1){transform:rotate(-1.4deg)}.clip:nth-child(4n+2){transform:rotate(1.1deg)}.clip:nth-child(4n+3){transform:rotate(-.7deg)}.clip:nth-child(4n){transform:rotate(1.6deg)}.clip.lit{box-shadow:0 0 0 3px var(--red), 0 1px 2px #00000038}.clip.broken{box-shadow:0 0 0 3px var(--red)}.clue-list{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.clue-row{grid-template-columns:40px 1fr;align-items:center;gap:8px;margin-left:-54px;display:grid;width:calc(100% + 54px)!important}.clue-row .num{text-align:center;color:var(--ink);font-size:18px;font-weight:700}.clue-row.used .num{color:var(--pencil-soft);font-weight:400}.clue-row.used .clip{color:#4d4d56;box-shadow:none;filter:saturate(.6)}.rule{border:2px solid var(--red);color:var(--red);padding:6px 10px;font-size:17px;line-height:1.3;transform:rotate(.6deg)}.rule.pencil{border-color:var(--pencil);color:var(--pencil);transform:rotate(-.5deg)}.rule.routine{border-style:dashed;border-width:1.5px;padding:4px 9px;font-size:16px}.day-list{font-family:var(--print);color:#1f1a14;flex-direction:column;gap:5px;margin:0;padding:0;font-size:16.5px;line-height:1.35;list-style:none;display:flex}.day-list .part{font-family:var(--type);letter-spacing:1px;text-transform:uppercase;color:var(--pencil);margin-right:4px;font-size:12px;font-weight:700}.red{color:var(--red)}.slip-shade{z-index:20;background:#1e222847;position:absolute;inset:0}.slip{z-index:21;background:#fffdf7;flex-direction:column;gap:10px;max-height:80%;padding:16px 16px 14px;display:flex;position:absolute;bottom:10px;left:8px;right:8px;overflow-y:auto;transform:rotate(-.8deg);box-shadow:0 3px 10px #00000059}.slip .head{font-family:var(--type);letter-spacing:1px;color:#5c5346;font-size:12px}.slip p{margin:0;font-size:19px;line-height:1.35}.slip .row{flex-wrap:wrap;align-items:center;gap:10px 14px;display:flex}.slip .suspects{flex-wrap:wrap;gap:12px;display:flex}.slip .suspects .ink{align-items:center;min-height:44px;font-size:21px;display:inline-flex}.title{margin:18px 0 0;font-size:46px;font-weight:700;line-height:1}.subtitle{color:var(--pencil-soft);margin-top:-4px;font-size:19px}.contents{flex-direction:column;margin:14px 0 0;padding:0;list-style:none;display:flex}.contents button,.contents a{text-align:left;align-items:baseline;gap:6px;width:100%;min-height:56px;font-size:22px;text-decoration:none;display:flex}.contents .dots{border-bottom:2px dotted var(--pencil-soft);flex:1;min-width:16px;transform:translateY(-6px)}.contents .pg{color:var(--pencil-soft);white-space:nowrap;font-size:16px}.signature{color:var(--pencil-soft);align-items:center;gap:8px;margin-top:auto;font-size:15px;display:flex}.boxes{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;display:grid}.box{aspect-ratio:1;border:2px solid var(--pencil);border-radius:3px 5px 2px 6px;justify-content:center;align-items:center;min-height:44px;font-size:17px;display:flex;position:relative}.box.solved{border-color:var(--ink)}.box.solved:after{content:"✓";color:var(--red);font-size:22px;font-weight:700;position:absolute;top:-6px;right:1px}.box.going{border-style:dashed}.box:disabled{opacity:.35}.typed{font-family:var(--type);color:#1f1a14;background:#fffdf7;padding:12px 14px;font-size:16px;line-height:1.45;transform:rotate(-.6deg);box-shadow:0 1px 2px #0003}.typed .head{letter-spacing:1px;color:#5c5346;margin-bottom:6px;font-size:12px;display:block}.cast{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 10px;display:grid}.cast>div{flex-direction:column;align-items:flex-start;gap:2px;display:flex}.cast .role{color:var(--pencil-soft);padding-left:4px;font-size:15px;line-height:1.15}.closed-stamp{z-index:2;pointer-events:none;border:4px solid var(--red);color:var(--red);font-family:var(--type);letter-spacing:3px;white-space:nowrap;opacity:.88;background:#f6f1e466;padding:4px 14px;font-size:30px;font-weight:700;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)rotate(-13deg)}.closed-stamp.thump{animation:.35s cubic-bezier(.3,1.6,.6,1) thump}@keyframes thump{0%{opacity:0;transform:translate(-50%,-50%)rotate(-13deg)scale(1.6)}}.confession{font-family:var(--print);color:#1f1a14;background:#fbf8ef;padding:14px 16px;font-size:18px;font-style:italic;line-height:1.45;transform:rotate(-1.2deg);box-shadow:0 2px 4px #00000040}.confession .head{font-family:var(--type);letter-spacing:1px;color:#5c5346;margin-bottom:6px;font-size:12px;font-style:normal;display:block}.check{text-align:left;align-items:center;gap:12px;width:100%;min-height:48px;font-size:20px;display:flex}.check .tick{border:2px solid var(--ink);width:26px;height:26px;color:var(--red);border-radius:3px 5px 2px 4px;flex-shrink:0;justify-content:center;align-items:center;font-size:22px;font-weight:700;display:flex}.check .sub{color:var(--pencil-soft);font-size:15px;line-height:1.2;display:block}.howto p{margin:0;font-size:19px;line-height:1.4}.howto dl{margin:0;font-size:18px;line-height:1.35}.howto dt{font-weight:700}.howto dd{margin:0 0 8px}.book.playing .page{left:4px;right:4px}.book.playing .under-1{left:7px;right:1px}.book.playing .under-2{left:10px;right:-2px}.book.playing .page:before{display:none}.page-body.play{gap:4px;padding:6px 10px 8px;overflow:hidden}.pbar{align-items:center;gap:2px;min-height:48px;display:flex}.ptitle{white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;font-size:19px;font-weight:700;line-height:1.1;overflow:hidden}.tool{min-width:48px;min-height:48px;color:var(--ink);border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:0;padding:2px 4px;display:inline-flex}.tool .ico{font-family:var(--type);font-size:20px;font-weight:700;line-height:1}.tool .tlab{font-family:var(--type);letter-spacing:.5px;color:var(--pencil);font-size:11px}.tool:disabled{opacity:.35}.tool[aria-pressed=true]{background:var(--red);color:var(--paper)}.tool[aria-pressed=true] .tlab{color:var(--paper)}.back-tool{min-width:40px}.days{border-bottom:2px solid var(--ink);gap:3px;display:flex}.day{min-width:0;min-height:40px;font-family:var(--type);letter-spacing:.3px;text-transform:uppercase;color:var(--pencil);background:#4d4d5612;border-radius:8px 8px 0 0;flex:1 1 0;padding:0 2px;font-size:11.5px;font-weight:700}.day[aria-current=true]{background:var(--ink);color:var(--paper)}.day .done{color:inherit}.routine-cap{font-family:var(--print);color:var(--pencil);min-height:20px;font-size:15.5px;font-style:italic;line-height:1.3}.pstatus{color:var(--pencil-soft);min-height:20px;font-size:15px;line-height:1.3}.pstatus .red{color:var(--red)}.plan-wrap{flex:auto;justify-content:center;align-items:center;min-height:170px;display:flex;container-type:size}.play .plan{aspect-ratio:1;width:min(100cqw,100cqh);max-height:none}.play .plan.tall{aspect-ratio:1/1.3;width:min(100cqw,76.9231cqh);max-height:none}.play .room .rname{font-family:var(--type);letter-spacing:.5px;text-transform:uppercase;color:var(--pencil);font-size:11.5px}.play .room.victim .rname{color:var(--red)}.room .shut-why{text-transform:none;font-style:italic}.room.shut{background:repeating-linear-gradient(135deg,#4d4d5612 0 6px,#0000 6px 12px)}.ink.ghost{border-style:dashed;border-color:var(--pencil);color:var(--pencil);background:#f6f1e499;font-weight:400}.ink.ghost.no{opacity:.85;text-decoration:line-through;text-decoration-thickness:2px}.play .tray{gap:4px 6px;min-height:44px}.play .tray .small{font-family:var(--type);text-transform:uppercase;letter-spacing:.5px;font-size:12px}.drawer{border-top:2px solid var(--ink);background:#fffdf7;margin:0 -10px -8px;padding:6px 10px 10px;box-shadow:0 -2px 6px #00000014}.drawer-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.drawer-toggle{min-height:44px;font-family:var(--type);letter-spacing:1px;color:var(--ink);align-items:center;gap:6px;font-size:13px;font-weight:700;display:inline-flex}.drawer-toggle .count{color:var(--pencil);letter-spacing:0;font-weight:400}.drawer-toggle .more{color:var(--red);letter-spacing:0}.stamp.accuse{min-height:44px;padding:0 10px;font-size:13px;transform:rotate(-1.5deg)}.clue-list.mini{gap:2px;margin-top:2px}.crow{text-align:left;border-radius:8px;grid-template-columns:26px 1fr 22px;align-items:start;gap:6px;width:100%;min-height:44px;padding:7px 4px;display:grid}.crow .num{font-family:var(--type);color:var(--pencil);padding-top:2px;font-size:14px;font-weight:700}.crow .ctext{font-family:var(--print);color:#1f1a14;font-size:17px;line-height:1.3}.crow .csrc{font-family:var(--type);letter-spacing:.3px;color:var(--pencil-soft);margin-top:1px;font-size:11px;display:block}.crow .tick{color:var(--red);font-size:18px;font-weight:700}.crow.used .ctext{color:var(--pencil);-webkit-text-decoration:line-through #4d4d5680;text-decoration:line-through #4d4d5680}.crow.lit{box-shadow:inset 3px 0 0 var(--red);background:#a8322a14}.crow.broken{box-shadow:inset 3px 0 0 var(--red)}.crow.broken .csrc b{color:var(--red)}.sheet{z-index:21;border-top:2px solid var(--ink);background:#fffdf7;border-radius:14px 14px 0 0;flex-direction:column;gap:10px;padding:10px 14px 18px;display:flex;position:absolute;inset:14% 0 0;overflow-y:auto;box-shadow:0 -4px 14px #00000040}.sheet-head{justify-content:space-between;align-items:center;display:flex}.sheet-head h2{margin:0}.sheet .clue-list{gap:2px}@media (prefers-reduced-motion:reduce){.page.turn,.closed-stamp.thump{animation:none}}@media (height<=700px){h1.hand{font-size:32px}.plan{max-height:42dvh}}
