.journal-page{max-width:1240px;margin:20px auto;padding:0 16px;color:#563e2e;font-family:'Zen Maru Gothic',sans-serif}.page-heading{padding:8px 4px 18px}.page-heading h1{font-size:34px;margin:0 0 6px}.page-heading p{margin:0}.parent-note{max-width:920px;margin:32px auto;padding:24px;background:#f5eedc;line-height:1.9}.parent-note h2{font-size:23px}
#host{--ink:#563e2e;--paper:#fffbef;--teal:#386d70;position:relative;isolation:isolate;container-type:size;container-name:game;height:790px;max-width:1200px;margin:auto;overflow:hidden;background:#f9f0df url('./assets/background.webp') center/cover;border:3px solid #bb9d76;border-radius:10px;color:var(--ink);font-family:'Zen Maru Gothic',sans-serif}#host *{box-sizing:border-box}#host [hidden]{display:none!important}#host button{font:800 15px/1.4 'Zen Maru Gothic',sans-serif;min-width:0;min-height:42px;border:2px solid #a68f6e;border-radius:8px;background:var(--paper);color:var(--ink);padding:9px 14px;cursor:pointer;touch-action:manipulation}#host button:disabled{opacity:.48;cursor:default}#host button:focus-visible,#host input:focus-visible,#task-list:focus-visible,#collection:focus-visible{outline:3px solid #b8572e;outline-offset:2px}#host button:hover:enabled{box-shadow:0 3px 0 #563e2e20}#host button.primary{background:var(--teal);border-color:#275459;color:#fffbee;box-shadow:0 4px 0 #234447}#host input{accent-color:var(--teal);font:inherit}#host .journal-top{height:56px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 18px;background:#fffbedee;border-bottom:2px dashed #bba07b}#host .journal-top strong{font-size:18px;white-space:nowrap}#host nav{display:flex;gap:7px}#host nav button{font-size:12px;min-height:32px;padding:6px 10px;border-width:1px;border-radius:4px}#base{height:calc(100% - 56px)}
#cover{height:100%;display:grid;grid-template-columns:1fr 1.13fr;align-items:center;gap:35px;padding:35px 45px}.keyart{width:100%;height:100%;min-width:0;min-height:0;object-fit:contain;border-radius:10px}.welcome{display:flex;flex-direction:column;gap:24px;padding:25px 15px}.welcome h2{font-size:clamp(35px,4.6cqw,58px);line-height:1.45;margin:0;background:#f2bd96;padding:20px 15px;border:3px dashed #cf9169;border-radius:28px 5px 28px 5px;box-shadow:0 7px 0 #d0b39740;transform:rotate(-2deg)}.welcome em{font-style:normal}.welcome p{font-size:16px;line-height:1.8;margin:0}.welcome small{font-size:12px}#host #start{font-size:21px;min-height:58px;border:3px dashed #a6c1b6;border-radius:30px}#ready-note{font-size:10px;text-align:center}
#play{height:100%;display:grid;grid-template-columns:84px minmax(0,.88fr) minmax(0,1.2fr);grid-template-rows:48px minmax(0,1fr) 77px 47px;gap:20px 22px;padding:24px 27px 25px;background:linear-gradient(90deg,#fffcf01a,#f5e8ca66 48%,#bcaa7c30 50%,#fffcef66 52%)}#daybar{grid-column:1/-1;grid-row:1;display:flex;justify-content:space-between;align-items:center;gap:15px}#days{display:flex;gap:13px}#host #days button{min-height:44px;padding:8px 20px;background:#fff9ec}#host #days button[aria-pressed=true]{background:#f1c09c;border-color:#bc7d51}#daybar p{font-size:12px;margin:0;white-space:nowrap}#daybar b{font-size:20px;color:var(--teal);margin-left:7px}#times{grid-column:1;grid-row:2;display:flex;flex-direction:column;gap:16px;justify-content:center}#host #times button{height:97px;background:#f3d7ad;border:3px dashed #c09463;border-radius:7px 7px 22px 22px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:8px;font-size:18px}#host #times button:nth-child(2){background:#d2dfca;border-color:#7a9b84}#host #times button:nth-child(3){background:#cad6de;border-color:#7491a0}#times span{font-size:28px;line-height:1}#host #times button[aria-pressed=true]{outline:3px solid #c87344;outline-offset:4px;box-shadow:0 5px 0 #74563a28}#scene{grid-column:2;grid-row:2;margin:0;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) 39px;gap:12px;align-items:center}#scene-image{width:100%;height:100%;min-height:0;object-fit:contain;border-radius:7px}#scene-caption{font-size:13px;text-align:center;line-height:1.7}#check-panel{grid-column:3;grid-row:2/4;min-width:0;min-height:0;background:#fffbef;border:2px solid #c0a98a;border-radius:8px;box-shadow:6px 6px 0 #88694628;display:flex;flex-direction:column;padding:14px 16px}#check-panel>header{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-bottom:10px;border-bottom:2px dashed #c8b395;flex-shrink:0}#list-title{font-size:20px;margin:0;line-height:1.5}#list-count{font-size:11px;white-space:nowrap;color:#3e7664}#task-list{list-style:none;margin:0;padding:6px 1px;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;min-height:0;flex:1}#task-list li{display:flex;align-items:center;gap:7px;padding:5px 3px;border-bottom:1px dashed #d1c4a8;min-width:0}#host .task-check{min-height:54px;flex:1;border:0;background:transparent;border-radius:3px;display:flex;align-items:center;gap:14px;text-align:left;padding:7px 5px;font-size:17px;min-width:0;font-weight:700}#host .task-check:disabled{opacity:1;color:#77654e}.task-text{overflow-wrap:anywhere;word-break:normal;min-width:0;line-height:1.75}.check-mark{width:28px;height:28px;flex-shrink:0;border:2px solid #ad9472;background:#fffaf0;border-radius:5px;display:grid;place-items:center;color:transparent;font-size:21px;line-height:1}#host .task-check[aria-checked=true]{color:#57715c}.task-check[aria-checked=true] .check-mark{color:#fff7e8;background:#6d9178;border-color:#6d9178}.task-tools{display:flex;gap:3px}#host .task-tools button{min-height:32px;min-width:28px;padding:3px;font-size:13px;border-width:1px;border-radius:4px}#host .drag-handle{touch-action:none;min-width:25px;min-height:40px;padding:2px;font-size:19px;cursor:grab;border:0;background:transparent}#task-list li.drag-target{background:#f5d6b2}#task-list li.drag-source{opacity:.6}.empty{font-size:15px;line-height:1.8;padding:25px 12px;text-align:center}#add-form{padding-top:10px;border-top:1px solid #bdac8d;flex-shrink:0}#add-form label{font-size:11px}#add-form>div{display:flex;gap:7px;margin-top:5px}#add-input{min-width:0;width:100%;height:42px;border:1px solid #ac9b81;background:#fffdfa;border-radius:5px;padding:7px;font-size:14px!important}#host #add-button{min-height:42px;flex-shrink:0;padding:7px 11px;font-size:13px}#add-note{font-size:10px;line-height:1.5;margin:6px 0 0;min-height:15px}#status-line{grid-column:1/3;grid-row:3;align-self:center;text-align:center;display:flex;flex-direction:column;gap:8px;padding:0 5px}#celebration{font-size:17px;line-height:1.6;margin:0;color:#386e62;font-weight:800}#save-state{font-size:10px;line-height:1.6;margin:0;color:#76624a}#actions{grid-column:1/-1;grid-row:4;display:flex;justify-content:center;align-items:stretch;gap:18px}#host #actions button{flex:1;padding:8px 10px;font-size:14px}#host #edit[aria-pressed=true]{background:#edc199}
#result{height:100%;display:grid;grid-template-rows:90px minmax(0,1fr) 47px;gap:20px;padding:23px 30px 27px;background:#fffcf068}#result>header{display:flex;align-items:center;justify-content:center;gap:24px}#result header>img{width:82px;height:82px;object-fit:contain;mix-blend-mode:multiply}#result h2{font-size:33px;line-height:1.4;margin:3px 0}#result-title span{white-space:nowrap}#review-day{font-size:11px}#review-total{font-size:13px;margin:0}#collection{overflow:auto;min-height:0;overscroll-behavior:contain;scrollbar-gutter:stable;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:#fffbef;border:2px solid #bda989;box-shadow:6px 6px 0 #81674e28}#collection article{padding:17px 16px;border-right:1px dashed #bfae91;min-width:0}#collection h3{font-size:19px;margin:0 0 12px;display:flex;justify-content:space-between;align-items:center}#collection h3 span{font-size:13px;color:var(--teal)}#collection img{width:100%;aspect-ratio:1.7;object-fit:cover;border-radius:4px;margin-bottom:10px}#collection ul{list-style:none;padding:0;margin:0}#collection li{display:flex;gap:9px;padding:8px 0;border-bottom:1px dashed #d0c1a5;font-size:13px;line-height:1.7;overflow-wrap:anywhere}#collection li>span{flex-shrink:0;color:#406d55;font-size:17px}#collection li>p{margin:0;min-width:0}.result-actions{display:flex;justify-content:center;gap:20px}#host .result-actions button{min-width:190px}
#modal{position:absolute;inset:0;z-index:50;background:#463e36bd;display:grid;place-items:center;padding:16px}#modal>section{max-height:100%;overflow:auto;width:min(640px,100%);background:#fffdf0;border:4px double #a08a69;border-radius:12px;padding:25px;box-shadow:0 10px 20px #342a2250}#modal header{display:flex;align-items:center;justify-content:space-between;gap:10px}#modal h2{font-size:23px;margin:0}#dialog-content{font-size:15px;line-height:1.9}#dialog-content>button{display:block;width:100%;margin-top:12px}#dialog-content label{display:flex;align-items:center;gap:12px;margin:17px 0}#dialog-content input[type=checkbox]{width:25px;height:25px}#dialog-content label:has(input[type=range]){display:block}#dialog-content input[type=range]{display:block;width:100%;height:34px}#storage-note{font-size:12px}#host:fullscreen,#host.faux-fullscreen{width:100vw;height:100dvh;max-width:none;margin:0;border:0;border-radius:0}#host.faux-fullscreen{position:fixed;inset:0;z-index:99999}
@media(max-width:700px){.journal-page{padding:0 8px}#host{height:850px}.parent-note{padding:16px;margin:24px 0}.page-heading h1{font-size:28px}}@media(max-height:520px) and (min-width:621px){#host{height:390px}}
@container game (max-width:620px){#host .journal-top{height:80px;display:grid;justify-content:stretch;gap:7px;padding:7px 8px;text-align:center}#host .journal-top strong{font-size:15px}#host nav{gap:5px}#host nav button{flex:1;white-space:nowrap;font-size:11px;padding:7px 3px;min-height:33px}#base{height:calc(100% - 80px)}#cover{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;gap:12px;padding:18px 27px}.keyart{grid-row:1;max-width:340px;justify-self:center}.welcome{grid-row:2;padding:0;gap:13px;text-align:center}.welcome h2{font-size:28px;padding:14px 8px;border-width:2px}.welcome h2 br{display:none}.welcome em{white-space:nowrap}.welcome p{font-size:12px;line-height:1.7}.welcome small{font-size:9px}#host #start{font-size:17px;min-height:46px}
#play{grid-template-columns:1fr;grid-template-rows:69px 55px minmax(0,1fr) 54px 42px;gap:12px;padding:13px 14px 18px}#daybar{grid-row:1;display:flex;flex-direction:column;gap:4px;justify-content:start}#days{gap:9px;width:100%}#host #days button{flex:1;font-size:13px;min-height:39px;padding:7px 4px}#daybar p{font-size:10px}#daybar b{font-size:15px}#times{grid-row:2;grid-column:1;flex-direction:row;gap:14px;padding:0 4px}#host #times button{height:100%;flex:1;flex-direction:row;border-width:2px;border-radius:5px 5px 12px 12px;font-size:15px;gap:7px;padding:6px}#times span{font-size:20px}#host #times button[aria-pressed=true]{outline-width:2px;outline-offset:3px}#scene{display:none}#check-panel{grid-row:3;grid-column:1;padding:11px 10px}#check-panel>header{padding-bottom:7px;gap:6px}#list-title{font-size:17px}#list-count{font-size:10px}#host .task-check{font-size:16px;gap:10px;min-height:49px;padding:6px 4px}.check-mark{width:25px;height:25px;font-size:19px}#task-list li{padding:4px 1px;gap:3px}#host .task-tools button{min-width:26px;min-height:31px;font-size:12px}#host .drag-handle{min-width:19px;font-size:17px;padding:1px}.task-tools{gap:2px}#task-list[data-edit=true] .task-check{font-size:13px;gap:5px}#task-list[data-edit=true] .check-mark{display:none}#add-form{padding-top:6px}#add-input{height:36px;font-size:13px!important}#host #add-button{min-height:36px;padding:5px 8px;font-size:12px}#add-note{font-size:9px;margin-top:4px}#status-line{grid-row:4;grid-column:1;gap:5px;padding:0}#celebration{font-size:13px}#save-state{font-size:9px}#actions{grid-row:5;gap:8px}#host #actions button{font-size:10px;padding:5px 3px;min-height:38px}#result{grid-template-rows:91px minmax(0,1fr) 43px;gap:13px;padding:15px 16px 19px}#result>header{gap:13px}#result header>img{width:62px;height:62px}#result h2{font-size:24px}#result-title span{display:block}#review-day{font-size:9px}#review-total{font-size:10px}#collection{grid-template-columns:1fr}#collection article{padding:16px 13px;border-bottom:2px dashed #bfae91;border-right:0}#collection h3{font-size:19px;margin-bottom:10px}#collection img{aspect-ratio:2;max-height:170px}#collection li{font-size:14px;padding:8px 0}.result-actions{gap:10px}#host .result-actions button{min-width:0;flex:1;font-size:12px;padding:7px 4px}#modal>section{padding:18px}#modal h2{font-size:20px}#dialog-content{font-size:13px}}
@container game (max-height:520px) and (min-width:621px){#host .journal-top{height:38px;padding:4px 10px}#host .journal-top strong{font-size:13px}#host nav button{min-height:28px;font-size:10px;padding:4px 8px}#base{height:calc(100% - 38px)}#cover{padding:17px 65px;gap:30px}.welcome{padding:0;gap:10px}.welcome h2{font-size:27px;padding:10px;border-width:2px}.welcome h2 br{display:none}.welcome em{white-space:nowrap}.welcome p{font-size:11px}.welcome small{font-size:8px}#host #start{font-size:16px;min-height:36px}#play{grid-template-columns:54px minmax(0,.8fr) minmax(0,1.4fr);grid-template-rows:32px minmax(0,1fr) 35px 29px;gap:9px 14px;padding:10px 20px 12px}#days{gap:9px}#host #days button{min-height:30px;font-size:11px;padding:5px 14px}#daybar p{font-size:10px}#daybar b{font-size:17px}#times{gap:10px}#host #times button{height:57px;font-size:12px;border-width:2px;padding:5px;gap:3px;border-radius:5px 5px 13px 13px}#times span{font-size:19px}#host #times button[aria-pressed=true]{outline-width:2px;outline-offset:3px}#scene{grid-template-rows:minmax(0,1fr) 21px;gap:6px}#scene-caption{font-size:9px}#check-panel{padding:8px 10px}#check-panel>header{padding-bottom:5px}#list-title{font-size:15px}#list-count{font-size:9px}#task-list{padding:3px 1px}#task-list li{padding:2px;gap:4px}#host .task-check{min-height:36px;font-size:13px;gap:8px;padding:4px}.check-mark{width:21px;height:21px;font-size:16px}#host .task-tools button{min-height:26px;min-width:24px;font-size:11px;padding:2px}#host .drag-handle{min-width:19px;min-height:29px;font-size:16px}#status-line{gap:2px}#celebration{font-size:11px}#save-state{font-size:8px}#actions{gap:12px}#host #actions button{min-height:28px;font-size:11px;padding:4px 8px}#add-form{padding-top:5px}#add-form label{font-size:9px}#add-form>div{margin-top:3px}#add-input{height:30px;font-size:11px!important}#host #add-button{min-height:30px;font-size:11px;padding:4px 8px}#add-note{font-size:8px;margin:3px 0 0;min-height:12px}#result{grid-template-rows:53px minmax(0,1fr) 31px;gap:9px;padding:10px 22px 13px}#result>header{gap:15px}#result header>img{width:50px;height:50px}#result h2{font-size:22px;margin:0}#review-day{font-size:8px}#review-total{font-size:9px}#collection article{padding:10px}#collection h3{font-size:15px;margin-bottom:6px}#collection h3 span{font-size:10px}#collection img{aspect-ratio:2.2;margin-bottom:4px}#collection li{font-size:11px;padding:5px 0;gap:6px}#collection li>span{font-size:14px}#host .result-actions button{min-height:30px;font-size:11px;min-width:160px;padding:5px 10px}#modal>section{padding:16px 22px}#modal h2{font-size:20px}#dialog-content{font-size:13px;line-height:1.65}#dialog-content p{margin:10px 0}#dialog-content label{margin:9px 0}}
@container game (max-width:350px){#cover{padding:15px 19px;gap:11px}.welcome{gap:10px}.welcome h2{font-size:24px;padding:11px 6px}.welcome p{font-size:11px}#host #start{font-size:16px;min-height:42px}#play{padding:11px 10px 13px;gap:10px;grid-template-rows:63px 48px minmax(0,1fr) 53px 40px}#host #days button{font-size:11px;min-height:35px}#times{gap:11px}#host #times button{font-size:13px}#times span{font-size:18px}#list-title{font-size:15px}#list-count{font-size:9px}#host .task-check{font-size:14px;min-height:46px;gap:8px}#check-panel{padding:9px 7px}#host #actions button{font-size:9px}#task-list[data-edit=true] .task-check{font-size:11px}#host .task-tools button{min-width:23px;font-size:11px}#host .drag-handle{min-width:16px;font-size:15px}#result{padding:12px 12px 15px;grid-template-rows:83px minmax(0,1fr) 39px}#result h2{font-size:21px}#result header>img{width:53px;height:53px}#collection li{font-size:13px}}
@media(prefers-reduced-motion:reduce){#host *{transition:none!important;animation:none!important}}
#times img{width:36px;height:36px;object-fit:cover;border-radius:50%}@container game (max-width:620px){#times img{width:29px;height:29px}}@container game (max-height:520px) and (min-width:621px){#times img{width:23px;height:23px}}