.reading-page{max-width:1240px;margin:20px auto;padding:0 16px;color:#54435e;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:#fff5e4;line-height:1.9}.parent-note h2{font-size:23px}
#host{--ink:#54435e;--coral:#785686;--paper:#fffaf0;position:relative;isolation:isolate;container-type:size;container-name:game;height:740px;max-width:1200px;margin:auto;overflow:hidden;background:#d7edf4 url('./assets/background.webp') center/cover;border:2px solid #b3a4ad;border-radius:19px;color:var(--ink);font-family:'Zen Maru Gothic',sans-serif}#host *{box-sizing:border-box}#host [hidden]{display:none!important}#host button{font:800 16px/1.25 'Zen Maru Gothic',sans-serif;min-width:0;min-height:42px;border:1.5px solid #5a86a4;border-radius:13px;background:var(--paper);color:var(--ink);padding:10px 15px;cursor:pointer;touch-action:manipulation}#host button:disabled{opacity:.45;cursor:default}#host button:focus-visible,#host input:focus-visible{outline:4px solid #ba781b;outline-offset:3px}#host button:hover:enabled{box-shadow:0 3px 0 #54435e30}#host button.primary{background:var(--coral);border-color:var(--coral);color:white;box-shadow:0 3px 0 #56365f}#host input{accent-color:var(--ink)}#host .tent-top{height:60px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 18px;background:#fffaf0ed;border-bottom:1px dashed #8eafb9}#host .tent-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:6px}#base{height:calc(100% - 60px)}
#cover{height:100%;display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:45px;padding:42px 60px}.keyart{width:100%;height:100%;min-width:0;min-height:0;object-fit:contain;filter:drop-shadow(0 9px 6px #31526724)}.invitation{display:flex;flex-direction:column;gap:22px;align-items:flex-start;padding:32px;background:#fffaf0ed;border-radius:9px;box-shadow:0 7px 0 #3152671c;transform:rotate(-1deg)}.invitation h2{font-size:clamp(38px,5cqw,65px);line-height:1.25;margin:0;color:var(--ink)}.invitation em{font-style:normal;color:var(--coral)}.invitation p{font-size:16px;line-height:1.8;margin:0}.invitation small{font-size:12px}#host #start{font-size:23px;min-height:54px;width:100%}#ready-note{font-size:10px}
#play{height:100%;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);grid-template-rows:52px minmax(0,1fr) 46px;gap:24px 36px;padding:25px 35px 35px}#tally{grid-column:1/-1;display:flex;gap:15px;align-items:center}#tally>div{display:flex;align-items:center;justify-content:center;gap:14px;min-width:155px;background:#fff8e9e8;border-radius:9px;padding:8px 19px;box-shadow:0 3px 0 #507e9520;font-size:14px}#tally b{font-size:29px;color:var(--coral)}#tally>div:nth-child(2) b{color:#426c9c}#tally>div:nth-child(3) b{color:#56724a}#scene-frame{grid-column:1;grid-row:2;margin:0;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center}#scene{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 5px 0 #507e9540);border-radius:8px}.dialogue{grid-column:2;grid-row:2;display:flex;flex-direction:column;justify-content:center;gap:20px;min-width:0;min-height:0}#question{font-size:23px;line-height:1.65;padding:20px 22px;margin:0;border:2px solid #dbad99;background:var(--paper);border-radius:25px 25px 25px 3px}#answers{display:grid;grid-template-columns:1fr 1fr;gap:13px}#host #answers button{position:relative;min-height:75px;padding:14px 8px;font-size:19px;border:3px solid var(--edge);background:#fff9ed;line-height:1.45;opacity:1}#answers button span{font-size:11px;display:block;opacity:.7;position:absolute;left:8px;top:5px}#host #answers button.correct{border-color:#47793c;background:#edf4d6;box-shadow:inset 0 0 0 1px #47793c}#answers button.correct::after{content:'○';position:absolute;top:2px;right:7px;font-size:17px}#host #answers button.wrong{border-color:#bd6344;background:#fae4d9}#answers button.wrong::after{content:'みなおそう';position:absolute;top:2px;right:5px;font-size:9px}#feedback{min-height:58px;line-height:1.6;font-size:14px;padding:10px 14px;margin:0;text-align:center;background:#fffaf0d9;border-radius:10px}.play-actions{grid-row:3;grid-column:1/-1;display:flex;align-items:center;justify-content:flex-end;gap:14px}.play-actions small{font-size:11px;margin-right:auto;margin-left:9px}.play-actions button{min-width:155px}
#result{height:100%;display:grid;grid-template-rows:auto 65px minmax(0,1fr) 28px 47px;gap:20px;padding:25px 40px 40px;background:#fff9e6d6}#result header{text-align:center}#result header small{font-size:12px;color:#657875}#result h2{font-size:37px;line-height:1.4;margin:5px 0 0}#result-stats{display:flex;justify-content:center;gap:22px}#result-stats>div{display:flex;align-items:center;gap:16px;padding:10px 22px;background:#e1edf1;border-radius:11px}#result-stats>div:nth-child(2){background:#fae3d6}#result-stats>div:nth-child(3){background:#f6ecc7}#result-stats span{font-size:13px}#result-stats b{font-size:29px}#stamps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;align-items:center;min-height:0}.stamp{min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:8px;padding:7px 7px 10px;background:#fffdf1;border:2px dashed #b5bdb1;max-height:100%;height:210px;box-shadow:0 4px 0 #49688720}.stamp img{width:100%;height:100%;min-height:0;object-fit:contain}.stamp strong{text-align:center;font-size:13px;line-height:1.5;overflow-wrap:anywhere}.stamp.unseen{opacity:.4;filter:grayscale(.5)}#reflection-note{text-align:center;font-size:13px;margin:0;align-self:center}.result-actions{display:flex;justify-content:center;gap:16px}#host .result-actions button{font-size:15px;min-width:170px}
#modal{position:absolute;inset:0;z-index:50;background:#1d3d58b8;display:grid;place-items:center;padding:16px}#modal>section{max-height:100%;overflow:auto;width:min(640px,100%);background:#fffaf0;border:3px solid #a8c4c8;border-radius:20px;padding:25px;box-shadow:0 10px 20px #122c3450}#modal header{display:flex;align-items:center;justify-content:space-between;gap:10px}#modal h2{font-size:24px;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){.reading-page{padding:0 8px}#host{height:750px}.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 .tent-top{height:80px;display:grid;justify-content:stretch;gap:7px;padding:7px 8px;text-align:center}#host .tent-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:20px;padding:20px 28px}.keyart{grid-row:1;max-width:360px;justify-self:center}.invitation{padding:18px 20px;gap:12px;align-items:center;text-align:center;width:100%;transform:none}.invitation h2{font-size:35px}.invitation h2 br{display:none}.invitation>small:first-child{font-size:10px}.invitation p{font-size:12px}.invitation p br{display:none}#host #start{font-size:20px;min-height:46px}#ready-note{font-size:9px}
#play{grid-template-columns:minmax(0,1fr);grid-template-rows:39px minmax(0,1fr) auto 42px;gap:13px;padding:16px 14px 20px}#tally{gap:8px;grid-row:1}#tally>div{min-width:0;flex:1;padding:6px 7px;gap:9px;font-size:10px}#tally b{font-size:23px}#scene-frame{grid-row:2;grid-column:1}#scene{max-width:100%;border-radius:5px}.dialogue{grid-row:3;grid-column:1;gap:10px}#question{font-size:17px;line-height:1.65;padding:11px 13px;border-radius:18px 18px 18px 3px;min-height:72px;display:flex;align-items:center}#answers{gap:9px}#host #answers button{min-height:60px;padding:12px 6px 8px;font-size:16px;border-width:2px;border-radius:11px}#answers button span{font-size:9px;left:5px;top:3px}#feedback{font-size:11px;min-height:53px;padding:8px 10px}.play-actions{grid-row:4;grid-column:1;justify-content:space-between;gap:14px}.play-actions small{display:none}#host .play-actions button{min-width:0;width:45%;font-size:12px;min-height:39px;padding:7px}
#result{grid-template-rows:57px 52px minmax(0,1fr) 28px 83px;gap:13px;padding:17px 18px 22px}#result header small{font-size:10px}#result h2{font-size:25px;margin-top:4px}#result-stats{gap:8px}#result-stats>div{flex:1;flex-direction:column;justify-content:center;gap:1px;padding:5px 4px;border-radius:8px}#result-stats span{font-size:9px;white-space:nowrap}#result-stats b{font-size:23px}#stamps{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:9px}.stamp{height:100%;padding:5px;gap:5px;border-width:1px}.stamp strong{font-size:11px}.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}#host .result-actions button{min-width:0;min-height:36px;padding:7px 4px;font-size:12px}#result-menu{grid-column:1/-1}#reflection-note{font-size:10px}#modal>section{padding:18px}#modal h2{font-size:21px}#dialog-content{font-size:13px}}
@container game (max-height:520px) and (min-width:621px){#host .tent-top{height:38px;padding:4px 10px}#host .tent-top strong{font-size:13px}#host nav button{min-height:28px;font-size:10px;padding:4px 8px}#base{height:calc(100% - 38px)}#cover{padding:20px 65px;gap:35px}.invitation{padding:16px 20px;gap:10px}.invitation h2{font-size:34px}.invitation h2 br{display:none}.invitation p{font-size:11px}.invitation p br{display:none}.invitation small{font-size:9px}#host #start{font-size:18px;min-height:39px}#play{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-rows:31px minmax(0,1fr) 31px;gap:10px 25px;padding:10px 28px 15px}#tally{gap:11px}#tally>div{min-width:125px;gap:10px;padding:4px 13px;font-size:10px}#tally b{font-size:22px}.dialogue{gap:9px}#question{font-size:16px;line-height:1.6;padding:9px 13px;border-radius:18px 18px 18px 3px}#answers{gap:8px}#host #answers button{min-height:46px;padding:11px 5px 7px;font-size:14px;border-width:2px;border-radius:10px}#answers button span{font-size:8px;left:5px;top:3px}#feedback{font-size:10px;min-height:36px;padding:6px 8px}.play-actions{gap:12px}.play-actions small{font-size:9px}#host .play-actions button{min-width:130px;font-size:11px;min-height:30px;padding:5px 10px}#result{grid-template-rows:45px 43px minmax(0,1fr) 18px 32px;gap:9px;padding:10px 25px 16px}#result header small{font-size:8px}#result h2{font-size:25px;margin-top:0}#result-stats{gap:18px}#result-stats>div{gap:12px;padding:5px 17px;border-radius:8px}#result-stats span{font-size:10px}#result-stats b{font-size:23px}#stamps{gap:9px}.stamp{padding:5px;gap:3px;height:100%;border-width:1px}.stamp strong{font-size:10px}#reflection-note{font-size:10px}#host .result-actions button{min-width:140px;min-height:30px;font-size:11px;padding:5px 10px}#modal>section{padding:16px 22px}#modal h2{font-size:21px}#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:17px 23px}.invitation{padding:16px 15px}.invitation h2{font-size:30px}#play{padding:13px 10px 16px;gap:10px}#tally>div{font-size:9px;gap:5px;padding:6px 5px}#tally b{font-size:21px}#question{font-size:16px;padding:9px 11px}#host #answers button{font-size:15px}#result{padding:15px 12px 18px;gap:10px}#result h2{font-size:23px}#result-stats span{font-size:8px}}
@container game (max-width:620px) and (max-height:610px){#cover{padding:12px 25px;gap:10px}.invitation{padding:12px 15px;gap:8px}.invitation h2{font-size:26px}.invitation p{font-size:10px}#host #start{font-size:17px;min-height:36px}#play{grid-template-rows:32px minmax(0,1fr) auto 34px;padding:9px 10px 12px;gap:8px}.dialogue{gap:6px}#question{font-size:14px;line-height:1.5;padding:8px 10px;min-height:50px}#host #answers button{min-height:45px;font-size:13px;padding:10px 4px 5px}#feedback{font-size:9px;min-height:39px;padding:6px 8px}#host .play-actions button{min-height:32px;font-size:10px}#result{grid-template-rows:48px 45px minmax(0,1fr) 22px 75px;gap:8px;padding:10px 12px}#result h2{font-size:22px}.stamp strong{font-size:10px}#result-stats b{font-size:20px}}
@media(prefers-reduced-motion:reduce){#host *{transition:none!important;animation:none!important}}

#host{height:800px;--ink:#54435e;--paper:#fffaf0;--coral:#785686}#host button{border-color:#aa95ad;border-radius:8px}#host button:focus-visible,#host [tabindex]:focus-visible{outline:3px solid #90602e;outline-offset:-3px}.invitation{transform:none;border:2px dashed #b7a5b3;background:#fffaf0f0;border-radius:80px 8px 80px 8px;padding:35px}.invitation h2 br{display:none}.invitation h2{font-size:clamp(34px,4.8cqw,58px)}.invitation p br{display:initial}.keyart{border-radius:48% 48% 8px 8px}
@container game (max-height:520px) and (min-width:621px){#result header small{display:block;font-size:8px;line-height:10px}#result #result-title{font-size:22px;line-height:1.15;margin:2px 0 0}}
#play{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-rows:50px minmax(0,1fr) 42px;gap:20px;padding:23px 30px 25px}#levelbar{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px}#levels{display:flex;gap:6px}#host #levels button{font-size:13px;min-height:38px;padding:8px 12px}#levels button[aria-pressed=true]{background:#785686;color:white}#tally{display:flex;gap:14px;white-space:nowrap;background:#fffaf0e8;border-radius:8px;padding:5px 12px}#tally span{font-size:11px}#tally b{font-size:23px;margin-left:4px;color:#785686}
#reading,#dialogue{min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-color:#b7a3bc #f8f2e8;scrollbar-width:thin;background:#fffaf0f5;border:1px solid #d9c4b1;border-radius:18px;padding:22px;grid-row:2}#reading{grid-column:1}#reading>header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:15px}#story-title{font-size:23px;line-height:1.5;margin:0}#host #read{font-size:11px;min-height:34px;padding:6px 8px;flex-shrink:0}#scene{width:100%;height:190px;object-fit:contain;filter:none;margin-bottom:14px}#story-text{font-size:22px;line-height:1.95;margin:0;white-space:pre-wrap;overflow-wrap:anywhere}#speech-status{font-size:11px;display:block;margin-top:10px;line-height:1.5}#dialogue{grid-column:2;padding:23px;display:block}#question{font-size:22px;line-height:1.65;margin:0 0 18px;padding:0;border:0;background:none;border-radius:0;min-height:0}#answers{display:flex;flex-direction:column;gap:12px}#host #answers button{min-height:66px;text-align:left;padding:12px 25px 12px 36px;font-size:19px;line-height:1.5;border:1.5px solid #c0adc8;border-radius:24px 8px 24px 8px;background:#e9e1ed;opacity:1}#host #answers button:nth-child(2){background:#f4dfd0;border-color:#d6b59e}#host #answers button:nth-child(3){background:#e4ead5;border-color:#b7bf9d}#answers button span{left:14px;top:50%;transform:translateY(-50%);font-size:12px}#host #answers button.correct{background:#e0ebc9;border:2px solid #66823d}#host #answers button.wrong{background:#f6ded5;border:2px solid #ab654b}#feedback{font-size:14px;line-height:1.7;margin:18px 0 0;padding:12px 14px;background:#f3e8d3;min-height:64px;text-align:left;border-radius:10px}#key{font-size:12px;line-height:1.6;margin:13px 0 0;padding-left:12px;border-left:3px solid #9d86a7}.play-actions{grid-row:3}.play-actions button{min-width:150px}
#result{grid-template-rows:auto 60px minmax(0,1fr) 24px 43px;padding:22px 40px 25px;gap:16px;background:#fffaf0bd}#result h2{font-size:33px}#journal{min-height:0;overflow:auto;overscroll-behavior:contain;background:#fffaf0f5;border:2px solid #c6b5c9;border-radius:15px;padding:5px 20px;scrollbar-color:#b7a3bc #f8f2e8;scrollbar-width:thin}#journal>article{display:grid;grid-template-columns:125px minmax(0,1fr);gap:20px;padding:18px 0;border-bottom:1px dashed #b9a4b7}#journal img{width:100%;max-height:140px;object-fit:contain;border-radius:10px}#journal h3{font-size:18px;margin:0 0 7px}#journal p{font-size:15px;line-height:1.8;margin:0;overflow-wrap:anywhere}#journal .reason{font-size:13px;margin-top:10px;color:#5e7349}.result-actions{gap:12px}
@media(max-width:700px){#host{height:930px}}
@media(max-height:520px) and (min-width:621px){#host{height:390px}}
@container game (max-width:620px){.invitation{border-radius:40px 8px 40px 8px;padding:20px;gap:12px}.invitation h2{font-size:32px}.invitation p{font-size:12px}.keyart{max-width:340px}#play{grid-template-columns:minmax(0,1fr);grid-template-rows:62px minmax(150px,.8fr) minmax(218px,1.2fr) 36px;padding:12px;gap:10px}#levelbar{grid-column:1;display:grid;gap:5px;justify-content:stretch}#levels{justify-content:center}#host #levels button{font-size:11px;min-height:31px;flex:1;padding:5px}#tally{padding:2px 8px;gap:20px;justify-content:center}#tally span{font-size:9px}#tally b{font-size:17px}#reading{grid-row:2;grid-column:1;padding:12px 14px;border-radius:13px}#reading>header{margin-bottom:10px;gap:5px}#story-title{font-size:16px}#host #read{font-size:9px;min-height:30px;padding:4px 6px}#scene{width:110px;height:83px;float:left;margin:0 12px 6px 0;border-radius:8px}#story-text{font-size:17px;line-height:1.8}#speech-status{clear:both;font-size:10px}#dialogue{grid-row:3;grid-column:1;padding:13px 14px;border-radius:13px}#question{font-size:16px;line-height:1.55;margin-bottom:10px}#answers{gap:7px}#host #answers button{font-size:14px;min-height:42px;padding:9px 18px 9px 27px;border-radius:17px 6px 17px 6px}#answers button span{left:10px;font-size:10px}#feedback{font-size:11px;min-height:0;margin-top:10px;padding:9px 10px}#key{font-size:10px;margin-top:8px}.play-actions{grid-row:4;grid-column:1}#host .play-actions button{font-size:11px;min-height:34px;padding:6px}#result{grid-template-rows:57px 48px minmax(0,1fr) 22px 78px;padding:16px 14px;gap:10px}#result h2{font-size:25px}#journal{padding:3px 12px}#journal>article{grid-template-columns:65px minmax(0,1fr);gap:10px;padding:14px 0}#journal h3{font-size:14px}#journal p{font-size:12px;line-height:1.75}#journal .reason{font-size:11px}.result-actions{gap:8px}#host .result-actions button{font-size:11px;min-height:34px}#reflection-note{font-size:10px}}
@container game (max-width:620px) and (max-height:670px){#cover{padding:12px 24px;gap:12px}.invitation{padding:14px;gap:8px}.invitation h2{font-size:27px}#host #start{font-size:17px;min-height:38px}#play{grid-template-rows:58px minmax(125px,.7fr) minmax(208px,1.3fr) 32px;padding:9px;gap:7px}#reading,#dialogue{padding:10px}#story-text{font-size:16px}#story-title{font-size:14px}#scene{width:90px;height:68px;margin-right:10px}#host #answers button{min-height:38px;font-size:13px;padding:7px 18px 7px 25px}#question{font-size:14px}#result h2{font-size:22px}}
@container game (max-height:520px) and (min-width:621px){#play{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-rows:32px minmax(0,1fr) 29px;padding:10px 24px;gap:9px 16px}#host #levels button{font-size:10px;min-height:28px;padding:5px 10px}#tally{gap:12px;padding:2px 9px}#tally span{font-size:9px}#tally b{font-size:18px}#reading,#dialogue{padding:12px;border-radius:11px}#reading>header{margin-bottom:9px}#story-title{font-size:16px}#host #read{font-size:9px;min-height:26px}#scene{width:105px;height:79px;float:left;margin:0 10px 5px 0}#story-text{font-size:15px;line-height:1.8}#speech-status{clear:both;font-size:9px;margin-top:6px}#question{font-size:15px;line-height:1.5;margin-bottom:9px}#answers{gap:6px}#host #answers button{font-size:12px;min-height:34px;padding:6px 22px 6px 26px;border-radius:15px 5px 15px 5px}#answers button span{left:10px;font-size:9px}#feedback{font-size:10px;margin-top:9px;padding:7px 9px;min-height:0}#key{font-size:9px;margin-top:7px}.play-actions{grid-row:3}#host .play-actions button{min-height:28px;font-size:10px}#result{grid-template-rows:40px 38px minmax(0,1fr) 18px 31px;gap:7px;padding:9px 25px 12px}#result h2{font-size:24px}#journal{padding:2px 16px}#journal>article{grid-template-columns:75px minmax(0,1fr);gap:14px;padding:10px 0}#journal h3{font-size:14px}#journal p{font-size:12px}#journal .reason{font-size:11px}#host .result-actions button{min-height:29px;font-size:11px}}