:root{font-family:"Yu Gothic UI","Meiryo",sans-serif;color:#233b39;background:#f4f6f2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}header{display:flex;align-items:center;gap:16px;padding:24px 5%;background:#fff;border-bottom:1px solid #dce4df}header p{font-size:12px;margin:0;color:#617571}h1{font-size:21px;margin:3px 0}.mark{background:#226b59;color:white;border-radius:14px;font-size:32px;width:50px;height:50px;text-align:center}.badge{margin-left:auto;background:#edf3ef;border-radius:30px;padding:9px 16px;font-size:12px}main{max-width:920px;margin:auto;padding:36px 24px}.intro{margin-bottom:30px}h2{font-size:28px;margin:8px 0 12px}.eyebrow{font-size:12px;font-weight:bold;letter-spacing:2px;color:#337961}.intro>p:last-child,.hint,footer{color:#60746d;font-size:14px;line-height:1.8}section{background:#fff;border:1px solid #dde5df;border-radius:18px;padding:26px;margin:18px 0}h3{font-size:17px;margin:0 0 22px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:22px}label,legend{font-size:14px;font-weight:600}label{display:flex;flex-direction:column;gap:10px}input,select,button{font:inherit}select,input[type=number]{width:100%;height:48px;border:1px solid #b5c6bd;border-radius:8px;background:#fbfcfa;padding:10px;color:#233b39}input:focus,select:focus,button:focus-visible{outline:3px solid #e2b44b;outline-offset:3px}fieldset{margin:0;padding:0;border:0;min-width:0}legend{margin-bottom:10px}.range{display:flex;align-items:center;gap:12px}.conditions{margin-top:24px}.check{display:flex;flex-direction:row;align-items:center;margin-top:22px;gap:10px}.check input{width:22px;height:22px;accent-color:#226b59}.hint{margin:12px 0}.actions{text-align:right}button{border:0;background:#226b59;color:#fff;border-radius:10px;padding:18px 24px;font-weight:bold;cursor:pointer}button:hover{background:#185644}button span{margin-left:25px}#questions{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding-left:30px}#questions li{padding:12px;background:#f4f6f2;border-radius:8px;font-size:20px}#error{color:#923b2a;line-height:1.8}footer{text-align:center;margin:30px 0}[hidden]{display:none!important}@media(max-width:600px){header{padding:18px;gap:10px}h1{font-size:17px}.badge{display:none}main{padding:24px 14px}h2{font-size:23px}section{padding:20px}.fields{grid-template-columns:1fr}#questions{grid-template-columns:1fr}.actions button{width:100%}}
:root{--green:#226b59}.quiet{background:#edf3ef;color:#233b39}.quiet:hover{background:#dce9e0}#homeLink{margin-left:auto;padding:12px}.hero{padding:64px 32px;text-align:center;background:#e6eee4;border-radius:24px;margin:18px 0 28px}.hero h2{font-size:44px;line-height:1.6;letter-spacing:.06em}.hero>p{line-height:1.8}.hero button{min-width:240px;font-size:22px;margin:20px 0 8px}.teacher-card{display:flex;align-items:center;justify-content:space-between;width:100%;background:#fff;border:1px solid #cbd9d0;color:#233b39;text-align:left;padding:25px}.teacher-card span{font-size:14px;font-weight:normal}.teacher-card:hover{background:#edf3ef}.actions{display:flex;gap:12px;justify-content:flex-end;flex-wrap:wrap}.lesson-meta{display:flex;justify-content:space-between;color:#51675d}#progress{display:flex;justify-content:center;gap:8px;padding:0;list-style:none;margin:28px 0}#progress li{width:44px;height:44px;border:2px solid #c9d5cc;border-radius:50%;display:grid;place-items:center;background:#fff;font-size:18px}#progress .current{border:3px solid #226b59;background:#e0eee5;font-weight:bold}#progress .done{background:#e5ede7}.calculation{display:flex;justify-content:center;align-items:center;gap:20px;margin:40px 0 0;font-size:clamp(32px,6vw,64px);font-weight:bold}#answer{min-width:130px;min-height:90px;padding:10px;border:3px solid #568875;border-radius:12px;text-align:center;background:#fff}#feedback{text-align:center;min-height:56px;font-size:27px;margin:14px 0;color:#226b59}#keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:420px;margin:14px 0 0 auto}#keypad[data-side=left]{margin-left:0;margin-right:auto}#keypad button{min-height:72px;font-size:26px;background:#fff;color:#233b39;border:1px solid #aebfb4;box-shadow:0 3px 0 #d5dfd7}#keypad button:hover{background:#e6eee4}#keypad button:nth-child(12){background:#226b59;color:#fff}#retryOptions{text-align:center}#retryOptions button{margin:0 6px;padding:12px}@media(max-width:600px){.hero{padding:36px 18px}.hero h2{font-size:32px}.teacher-card{display:block}.teacher-card span{display:block;margin:10px 0 0}.calculation{gap:10px}#answer{min-width:95px;min-height:72px}#progress{gap:4px}#progress li{width:30px;height:30px;font-size:14px}#keypad{max-width:360px}#keypad button{min-height:60px}.actions button{width:auto}}
/* 10問を見通せる計算カード */
#progress{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:6px;overflow-x:auto;padding:4px 2px 10px;justify-content:normal}
#progress li{width:auto;height:auto;min-width:0;min-height:112px;border-radius:10px;display:flex;flex-direction:column;gap:9px;padding:8px 3px;border:2px solid #c9d5cc}
#progress .current{border:3px solid #226b59;padding:7px 2px;box-shadow:0 3px 0 #226b59}
.problem-number{font-size:12px;color:#60746d;line-height:1}.problem-expression{font-size:clamp(12px,1.5vw,17px);white-space:nowrap;font-weight:600;line-height:1.5}.problem-answer{display:block;width:80%;min-height:32px;border:1px solid #bdcec2;border-radius:5px;background:#fff;text-align:center;font-size:20px;line-height:30px;font-weight:600}.current .problem-number{color:#226b59;font-weight:bold}.done .problem-answer{background:#eff6ef}
@media(max-width:700px){#progress{grid-template-columns:repeat(10,76px);gap:6px}#progress li{min-height:106px}.problem-expression{font-size:16px}}
#progress li{min-height:100px;gap:7px}.problem-status{display:block;height:30px;line-height:30px;font-size:30px;font-weight:500}.problem-status.correct{color:#c33131}.problem-status.passed{color:#2467b3}
#support{margin:18px auto;max-width:700px}.support-hint{text-align:center;color:#51675d;font-size:15px;margin:8px 0 16px}#quantities{display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap}.quantity{display:flex;flex-direction:column;gap:6px;padding:12px;background:#fff;border:1px solid #d0ddd4;border-radius:12px}.quantity-label{font-size:18px;text-align:center;font-weight:bold;margin-bottom:2px}.dot-row{display:grid;grid-template-columns:repeat(5,38px);gap:5px}.count-dot{display:grid;place-items:center;width:38px;height:38px;padding:0;min-width:0;border-radius:50%;background:#fff;border:2px solid #537c6a;color:#fff;touch-action:manipulation}.count-dot:hover{background:#e7eee6}.count-dot.counted{background:#226b59;border-color:#226b59}.count-dot.counted::after{content:'✓';font-size:22px}.count-dot:focus-visible{outline:3px solid #e2b44b;outline-offset:2px}.quantity-symbol{font-size:28px}.quantity-zero{color:#60746d;padding:6px}.quantity-summary{width:100%;text-align:center;margin:0;color:#51675d}#support:not([hidden])~#feedback{margin:8px 0;min-height:38px}@media(max-width:600px){#quantities{gap:10px}.dot-row{grid-template-columns:repeat(5,34px);gap:4px}.count-dot{width:34px;height:34px}.quantity{padding:10px}}
/* 入力する場所をひとまとまりにする */
#keypad{background:#e2ebf2;border:1px solid #bacddc;border-radius:20px;padding:18px;box-shadow:0 4px 0 #cedce6;max-width:456px}
#keypad button{border-color:#b4c4d0;box-shadow:0 3px 0 #c3d2dd}
#keypad button:nth-child(10){background:#fff1df;border-color:#d9bf9e;color:#674a2c}
#keypad button:nth-child(10):hover{background:#f9e2c4}
#keypad button:nth-child(12){background:#226b59;border-color:#226b59;color:#fff}
@media(max-width:600px){#keypad{padding:14px;max-width:388px;border-radius:16px}}
#openRecords{margin-top:12px}.register-row{display:flex;gap:16px;align-items:end;margin-top:24px}.register-row label{flex:1}input[type=text]{width:100%;padding:12px;border:1px solid #b5c6bd;border-radius:8px;background:#fbfcfa}#recordTable{width:100%;border-collapse:collapse}#recordTable th,#recordTable td{text-align:left;padding:14px;border-bottom:1px solid #dde5df}#recordTable th{background:#edf3ef}#recordTable button{padding:10px 16px}.record-table-wrap{overflow-x:auto}#clearLearnerRecords{margin-top:20px}#deleteRecordConfirm{background:#fff1df;border-radius:10px;padding:18px;margin-top:18px}#deleteRecordConfirm button{margin-right:10px}#storageMessage,#learnerMessage{line-height:1.8}@media(max-width:600px){.register-row{align-items:stretch;flex-direction:column}}
#openPrint{margin-top:12px}.print-controls{margin-bottom:24px}.print-controls button{margin:8px 8px 8px 0}#printError{color:#923b2a}#paper{width:210mm;min-height:297mm;padding:20mm 12mm 15mm;background:#fff;color:#000;box-shadow:0 4px 20px #0002;margin:24px auto;box-sizing:border-box;font-family:"Meiryo",sans-serif}.paper-meta{display:grid;grid-template-columns:1fr 1fr;gap:6mm 5mm;font-size:12pt;margin-bottom:10mm}.calculation-table{border-collapse:collapse;width:186mm;table-layout:fixed}.calculation-table th,.calculation-table td{border:0.4mm solid #222;padding:0;text-align:center;height:var(--cell-height);font-size:20pt;font-weight:normal}.calculation-table th{background:#f4f4f4}.paper-bottom{display:flex;justify-content:space-between;align-items:start;margin-top:5mm;font-size:11pt}.paper-qr{width:24mm;height:24mm;margin-left:auto}.paper-qr svg{display:block;width:100%;height:100%}#printView{overflow-x:auto}@page{size:A4 portrait;margin:20mm 12mm 15mm}@media print{html,body{background:#fff!important;margin:0!important;padding:0!important}header,footer,main>div:not(#printView),.print-controls{display:none!important}main{max-width:none;margin:0;padding:0}#printView{display:block!important;overflow:visible}#paper{display:block!important;margin:0;padding:0;width:186mm;min-height:0;box-shadow:none;break-inside:avoid}.calculation-table th{background:#f4f4f4!important;print-color-adjust:exact}.paper-meta,.calculation-table,.paper-bottom{break-inside:avoid}}
#paper.support-pages{width:auto;min-height:0;padding:0;background:transparent;box-shadow:none}.support-paper{width:210mm;height:297mm;box-sizing:border-box;padding:20mm 12mm 15mm;margin:24px auto;background:#fff;color:#000;box-shadow:0 4px 20px #0002}.support-paper .paper-meta{font-size:11pt;gap:4mm 5mm;margin-bottom:6mm}.support-paper-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(5,38mm);gap:2mm 4mm}.support-paper-card{border:0.3mm solid #555;padding:2.5mm;min-width:0;overflow:visible;box-sizing:border-box}.support-paper-card.unused{border-color:transparent}.support-paper-equation{display:flex;align-items:center;gap:2mm;font-size:15pt;white-space:nowrap;margin-bottom:2mm}.paper-answer-blank{display:inline-block;min-width:15mm;height:9mm;border:0.3mm solid #333;margin-left:auto}.paper-quantities{display:flex;align-items:center;gap:2mm;flex-wrap:wrap;font-size:12pt;max-width:100%}.paper-quantity{display:flex;flex-direction:column;gap:0.7mm;padding:1mm;border:0.2mm solid #aaa;min-height:4mm}.paper-dot-row{display:grid;grid-template-columns:repeat(5,3mm);gap:0.8mm}.paper-dot{width:3mm;height:3mm;border:0.25mm solid #000;border-radius:50%;display:block;box-sizing:border-box}.support-paper .paper-bottom{margin-top:3mm}.support-paper .paper-qr{width:24mm;height:24mm}@media print{#paper.support-pages{width:186mm;break-inside:auto}.support-paper{width:186mm;height:261mm;padding:0;margin:0;box-shadow:none;break-after:page;break-inside:avoid}.support-paper:last-child{break-after:auto}.support-paper-card{break-inside:avoid}}
.paper-dot-row{grid-template-columns:repeat(5,4mm);gap:1mm}.paper-dot{width:4mm;height:4mm}.paper-quantity{gap:0.8mm}
#openGrading{margin-top:12px}.photo-picker{margin:20px 0}#gradingVideo,#gradingCanvas{display:block;max-width:100%;height:auto;margin:20px auto}#gradingCanvas{cursor:crosshair;touch-action:manipulation}#gradingVideo{max-height:450px}.grading-row{display:grid;grid-template-columns:1fr 140px 1fr 1fr;align-items:center;gap:14px;padding:18px;background:#fff;border:1px solid #cad9cf;border-radius:12px;margin:12px 0}.grading-row canvas{width:140px;height:auto;border:1px solid #ccc}.grading-row .check{margin:0}.grading-status{grid-column:3/5}.grading-reference{position:absolute;left:-20000px;top:0;visibility:hidden;width:210mm;min-height:297mm;padding:20mm 12mm 15mm;background:#fff;color:#000;box-sizing:border-box;font-family:"Meiryo",sans-serif}.grading-reference.support-pages{padding:0;width:210mm}.grading-reference .support-paper{margin:0;box-shadow:none}#gradingResult{font-size:24px;font-weight:bold}#recognizePrint:disabled{opacity:.5}@media(max-width:600px){.grading-row{grid-template-columns:1fr 1fr}.grading-status{grid-column:auto}}
/* 学習画面：タブレットとノートPCの表示領域に合わせる */
@media screen{
body[data-view=lesson] header{padding:12px 24px}body[data-view=lesson] .mark{width:44px;height:44px;font-size:28px}body[data-view=lesson] main{padding:16px 24px 24px}body[data-view=lesson] #progress{margin:12px 0 16px}body[data-view=lesson] .calculation{margin-top:12px}body[data-view=lesson] #feedback{margin:8px 0;min-height:40px}body[data-view=lesson] #keypad{margin-top:10px}body[data-view=lesson] #keypad button{min-height:60px;padding:12px}body[data-view=lesson] #support{margin:12px auto}body[data-view=lesson] .support-hint{margin:8px 0}
}
@media screen and (min-width:900px) and (max-height:850px){
body[data-view=lesson] main{max-width:1120px;padding:10px 24px 20px}
#lesson{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:24px;align-items:start}
#lesson .lesson-meta{grid-column:1/3;grid-row:1}#lesson #progress{grid-column:1/3;grid-row:2;margin:10px 0 12px}#lesson #progress li{min-height:84px;padding-top:5px;padding-bottom:5px;gap:4px}
#lesson .calculation{grid-column:1/3;grid-row:3;margin:4px 0 14px;font-size:48px}#lesson #answer{min-height:70px;min-width:110px;padding:5px 12px}
#lesson #support{grid-column:1;grid-row:4;margin:0;width:100%;max-width:none}#lesson #feedback{grid-column:1;grid-row:5;margin:8px 0;min-height:36px}#lesson #retryOptions{grid-column:1;grid-row:6}
#lesson #keypad{grid-column:2;grid-row:4/7;width:100%;margin:0;max-width:456px;justify-self:end;padding:14px;gap:10px}#lesson #keypad button{min-height:56px;padding:10px;font-size:25px}
#lesson[data-side=left] #keypad{grid-column:1;justify-self:start}#lesson[data-side=left] #support,#lesson[data-side=left] #feedback,#lesson[data-side=left] #retryOptions{grid-column:2}
#lesson #quantities{gap:8px}#lesson .quantity{padding:8px;gap:4px}#lesson .quantity-label{font-size:16px}#lesson .dot-row{grid-template-columns:repeat(5,36px);gap:4px}#lesson .count-dot{width:36px;height:36px}#lesson .quantity-symbol{font-size:20px}
}
@media screen and (max-width:899px){#progress{grid-template-columns:repeat(10,minmax(70px,1fr))}.grading-row{grid-template-columns:1fr 120px 1fr}.grading-row canvas{width:120px}.grading-row .check{grid-column:3}.grading-status{grid-column:2/4}}
@media screen and (max-width:600px){body[data-view=lesson] main{padding:12px 14px 20px}.grading-row{grid-template-columns:1fr 1fr}.grading-row .check,.grading-status{grid-column:auto}.calculation{min-width:0}#equation{overflow-wrap:anywhere}#keypad{width:100%}}
@media screen and (min-width:601px) and (max-width:899px) and (max-height:1000px){
body[data-view=lesson] main{padding:10px 24px 16px}#lesson #progress{margin:8px 0 10px}#lesson #progress li{min-height:84px;gap:4px}#lesson .calculation{font-size:48px;margin:8px 0}#lesson #answer{min-height:70px;min-width:110px;padding:5px 12px}#lesson #support{margin:8px auto}#lesson #keypad{padding:14px;gap:10px}#lesson #keypad button{min-height:56px;padding:10px}#lesson .quantity{padding:8px;gap:4px}#lesson .dot-row{grid-template-columns:repeat(5,36px);gap:4px}#lesson .count-dot{width:36px;height:36px}
}
@media screen and (min-width:601px) and (max-width:899px) and (max-height:1000px){#lesson #keypad{gap:8px}#lesson #keypad button{min-height:52px}}
/* 子どもの入口と学習画面：あたたかい色と、分かりやすい形 */
@media screen{
body[data-view=home],body[data-view=lesson],body[data-view=result]{background:#fffaf0;color:#253a4a;font-family:"UD Digi Kyokasho N-R","BIZ UDPGothic","Yu Gothic UI","Meiryo",sans-serif}
body[data-view=home] header,body[data-view=lesson] header,body[data-view=result] header{background:#fffefb;border-bottom:2px solid #eee6d4}
body[data-view=home] .mark,body[data-view=lesson] .mark,body[data-view=result] .mark{background:#367b9d;border-radius:16px 16px 8px 16px;box-shadow:3px 3px 0 #dbeaf0}
#home .hero{position:relative;overflow:hidden;background:#fff0bd;border:2px solid #f2d783;border-radius:32px;padding:30px 28px 34px;margin-top:6px;box-shadow:0 7px 0 #f0e1ad}
#home .hero h2{font-size:42px;line-height:1.5;margin:12px 0;color:#284952;letter-spacing:.04em}#home .hero>p{color:#52625c}#home .hero .eyebrow{font-size:13px;letter-spacing:.08em;margin-top:16px}
.math-friends{display:flex;justify-content:center;align-items:center;gap:10px}.math-friends span{display:grid;place-items:center;width:46px;height:46px;border-radius:15px;background:#fffdf6;color:#367b9d;font-size:28px;font-weight:bold;box-shadow:0 3px 0 #e2cd92}.math-friends span:nth-child(1){background:#dcefe9;transform:rotate(-8deg)}.math-friends span:nth-child(3){background:#ffe0cd;transform:rotate(6deg);color:#925d42}.math-friends span:nth-child(5){background:#dfeaf8;transform:rotate(-5deg)}.math-friends span:nth-child(even){background:transparent;box-shadow:none;width:25px;color:#60715d}
#home #start{background:#337fa0;border:2px solid #276786;border-radius:22px;box-shadow:0 5px 0 #245e7a;font-size:24px;padding:18px 28px;margin-top:16px;min-height:72px}#home #start:hover{background:#286f90}#home #start:active{transform:translateY(3px);box-shadow:0 2px 0 #245e7a}#homeSummary{font-size:14px;margin-top:22px}
.teacher-area{margin-top:34px}.teacher-label{font-size:14px;font-weight:bold;color:#60716b;margin:0 0 12px}.teacher-menu{display:grid;grid-template-columns:1fr 1fr;gap:12px}.teacher-menu .teacher-card{display:block;border-radius:16px;padding:18px 20px;margin:0!important;min-width:0;font-size:17px;border-color:#d7ddd4}.teacher-menu .teacher-card span{display:block;margin:8px 0 0;font-size:12px;line-height:1.7;color:#65766d}.teacher-area #learnerSummary{font-size:12px}
body[data-view=lesson] #progress li{background:#fffefd;border-color:#d7dedc;border-radius:15px}body[data-view=lesson] #progress li:nth-child(3n+2){background:#f1f7fb}body[data-view=lesson] #progress li:nth-child(3n){background:#fff4e8}body[data-view=lesson] #progress li.current{background:#fff0b7;border-color:#337c69;box-shadow:0 4px 0 #337c69}body[data-view=lesson] #progress li.done{background:#edf4ed}
body[data-view=lesson] #answer{border-color:#d5ab48;border-radius:19px;background:#fffefa;box-shadow:0 4px 0 #eee0b9}body[data-view=lesson] .quantity{border-radius:18px;border:2px solid #dce5d9;background:#fffefa}body[data-view=lesson] .quantity-label{color:#445b51}body[data-view=lesson] #keypad{background:#dcecf7;border:2px solid #b9d4e6;border-radius:24px;box-shadow:0 5px 0 #c1d8e7}body[data-view=lesson] #keypad button{border-radius:15px;font-weight:bold;color:#29465a}body[data-view=lesson] #keypad button:nth-child(10){color:#785326}body[data-view=lesson] #keypad button:nth-child(12){color:white;background:#337c69;border-color:#337c69}body[data-view=lesson] #keypad button:active{transform:translateY(2px);box-shadow:none}body[data-view=lesson] #modeLabel{padding:4px 12px;border-radius:20px;background:#e9efe1;font-size:13px}body[data-view=lesson] #timer{align-self:center;font-variant-numeric:tabular-nums}
#result.hero{background:#fff0bd;border:2px solid #eed386;border-radius:32px}#resultTitle{color:#315b52}#resultHome{border-radius:18px;background:#337fa0;box-shadow:0 4px 0 #245e7a}
}
@media screen and (max-width:600px){#home .hero{padding:24px 16px 28px;border-radius:24px}#home .hero h2{font-size:30px}#home #start{font-size:20px;min-width:0;width:100%;padding:16px}.teacher-menu{grid-template-columns:1fr}.math-friends{gap:7px}.math-friends span{width:40px;height:40px;font-size:25px}.teacher-menu .teacher-card{padding:16px}}
@media screen and (min-width:900px) and (max-height:850px){body[data-view=lesson] #modeLabel{padding:2px 10px}body[data-view=lesson] .quantity{padding:7px}}
@media screen{body[data-view=home],body[data-view=lesson],body[data-view=result]{min-height:100svh}}
/* 「せいかつじかん」と同じ仲間が迎える計算の教室 */
.lesson-guide{display:none}
@media screen{
body[data-view=home]{background:#583f26 url('assets/classroom.png') center center/cover fixed no-repeat}
body[data-view=home] header{background:rgba(255,250,231,.94);border-bottom:2px solid #bb9558;box-shadow:0 3px 12px #241b1630}
body[data-view=home] main{max-width:1040px;padding-top:30px}
#home .hero{display:grid;grid-template-columns:minmax(0,1fr) 290px;align-items:center;gap:10px;padding:18px 24px;background:rgba(21,65,48,.94);border:7px solid #b88b4e;border-radius:24px;box-shadow:0 8px 0 #5e3e27,0 12px 26px #20140f45;overflow:visible}
.welcome-copy{min-width:0;padding:14px 0 16px}#home .hero h2{color:#fff7db;font-size:38px}#home .hero .eyebrow,#home .hero .welcome-copy>p{color:#f9f0d2}#home .hero .eyebrow{font-size:12px;margin:15px 0 6px}#home .hero h2{margin:10px 0}#home .hero .welcome-copy>p:not(.eyebrow){font-size:14px;line-height:1.8}
#home #start{background:#ffdc77;color:#3f4534;border-color:#e8bd50;box-shadow:0 5px 0 #b4872e;font-size:22px;min-height:66px;margin-top:12px;padding:16px 24px}#home #start:hover{background:#ffe99d}#home #start:active{box-shadow:0 2px 0 #b4872e}#homeSummary{margin:20px 0 0}
.welcome-friends{position:relative;align-self:stretch;display:flex;align-items:end;justify-content:center;min-height:350px;padding:66px 0 26px}.welcome-speech{position:absolute;top:8px;left:30px;z-index:2;background:#fff9e7;color:#4f5b45;font-size:18px;font-weight:bold;line-height:1.6;padding:12px 24px;border-radius:24px 24px 24px 4px;box-shadow:0 4px 0 #142f2730;transform:rotate(-3deg);margin:0}.welcome-portraits{display:flex;gap:12px;align-items:end;width:100%}.welcome-portraits img{width:126px;height:224px;object-fit:cover;object-position:center top;border:5px solid #f2dfb7;background:#fff9ea;border-radius:65px 65px 20px 20px;box-shadow:0 5px 0 #10342750}.welcome-portraits img:first-child{transform:rotate(-4deg)}.welcome-portraits img:last-child{transform:rotate(4deg)}.welcome-okojo{position:absolute;right:-4px;bottom:0;width:66px;height:138px;object-fit:contain;filter:drop-shadow(0 3px 2px #1c2a2e30)}
#home .teacher-area{background:rgba(255,250,235,.96);border:2px solid #e3cca2;border-radius:20px;padding:18px;margin-top:26px;box-shadow:0 4px 16px #291b1c30}.teacher-label{color:#625238}#home .teacher-menu .teacher-card{background:#fffdf7;border-color:#ddd2bc}#home .teacher-menu .teacher-card:hover{background:#fff1c9}#home .teacher-area #learnerSummary{color:#625c4e;margin-bottom:0}body[data-view=home] footer{color:#fff5dd;background:rgba(36,39,28,.8);border-radius:12px;padding:10px;margin-bottom:0;font-size:12px}
body[data-view=lesson] .lesson-guide,body[data-view=result] .lesson-guide{display:block;width:30px;height:44px;object-fit:contain;margin-left:auto}body[data-view=result] #homeLink{margin-left:10px}
}
@media screen and (max-width:800px){#home .hero{grid-template-columns:minmax(0,1fr) 210px;padding:16px;border-width:5px}#home .hero h2{font-size:30px}.welcome-friends{min-height:320px;padding-bottom:20px}.welcome-portraits{gap:8px}.welcome-portraits img{width:92px;height:190px;border-width:4px}.welcome-speech{left:2px;font-size:16px;padding:10px 18px;top:24px}.welcome-okojo{width:55px;height:110px}#home #start{font-size:19px;min-width:0;padding:15px 18px}.math-friends{gap:6px}.math-friends span{width:38px;height:38px;font-size:24px}}
@media screen and (max-width:600px){body[data-view=home] main{padding:20px 14px}#home .hero{display:flex;flex-direction:column;gap:0;padding:12px 16px 20px}.welcome-copy{width:100%;padding-bottom:4px}.welcome-friends{min-height:180px;height:180px;width:260px;align-self:center;padding:0;align-items:end}.welcome-portraits{justify-content:center;gap:12px}.welcome-portraits img{width:76px;height:150px;border-width:3px}.welcome-speech{top:0;left:0;font-size:13px;padding:8px 12px;transform:rotate(-4deg)}.welcome-okojo{width:48px;height:100px;right:0}#home .teacher-area{padding:14px}#home .hero .welcome-copy>p:not(.eyebrow){font-size:13px}}
@media screen{body[data-view=lesson] #homeLink{margin-left:12px;min-height:44px;padding:10px 14px}#leaveLesson{max-width:min(92vw,480px);padding:28px;border:2px solid #c6d8ce;border-radius:20px;color:#253a4a;background:#fffdf5;box-shadow:0 14px 50px #0003}#leaveLesson::backdrop{background:#20312b80}#leaveTitle{font-size:23px;line-height:1.5}#leaveDescription{font-size:17px;line-height:1.8}.leave-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.leave-actions button{min-height:48px;padding:14px 18px}body[data-view=lesson] header>div{min-width:0}@media(max-width:450px){body[data-view=lesson] header{gap:8px;padding:10px 12px}body[data-view=lesson] header h1{font-size:14px}body[data-view=lesson] header p{font-size:10px}body[data-view=lesson] .lesson-guide{display:none}body[data-view=lesson] #homeLink{margin-left:auto;font-size:12px;padding:8px}}
}
/* 子ども用の入口と先生の管理画面を分離 */
@media screen{
body[data-view=home]{background:#fffaf0}body[data-view=home] header{background:transparent;border:0;box-shadow:none;justify-content:flex-end;padding:16px 24px;min-height:72px}body[data-view=home] header>.mark,body[data-view=home] header>div{display:none}#teacherEntry{font-size:14px;min-height:44px;background:#f1f1e9;color:#54645c;border:1px solid #d3dbd2;padding:10px 16px}#teacherBack{margin-left:auto;margin-right:12px;padding:10px 14px;min-height:44px}body[data-view=home] main{max-width:920px;padding:16px 24px 32px}.child-start{min-height:calc(100svh - 130px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}#childName{font-size:26px;font-weight:bold;margin:0;color:#344e45;overflow-wrap:anywhere;max-width:100%}.child-okojo{width:54px;height:100px;object-fit:contain}#home #start{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;width:min(100%,520px);min-height:230px;margin:0;padding:28px;background:#236e96;color:white;border:3px solid #195777;border-radius:26px;box-shadow:0 6px 0 #194c67;font-size:48px;font-weight:bold}#home #start>span{margin:0}.start-icon{font-size:54px;line-height:1}#home #start:hover{background:#195f85}#home #start:active{transform:translateY(3px);box-shadow:0 3px 0 #194c67}#startError:empty{display:none}#teacherMenuView .teacher-menu{margin-top:24px}body[data-view=home] footer{display:none}#teacherMenuView #learnerSummary{margin-top:24px}@media(max-width:600px){#home #start{min-height:210px;font-size:40px}.child-start{min-height:calc(100svh - 120px)}#teacherBack{font-size:12px;padding:8px;margin-right:6px}body:not([data-view=home]) header{flex-wrap:wrap}}
}
/* 入口の目的と温かみを戻し、操作の主役はひとつにする */
@media screen{
body[data-view=home]{background:#fbf6e9}body[data-view=home] header{justify-content:flex-start;background:#fffdf7;border-bottom:2px solid #e8ddc2;padding:16px 28px}body[data-view=home] header>.mark{display:block;background:#357e92;box-shadow:3px 3px 0 #dcebea}body[data-view=home] header>div{display:block}body[data-view=home] header>div>p{display:none}body[data-view=home] header h1{font-size:23px;line-height:1.5;margin:0}#teacherEntry{margin-left:auto}
body[data-view=home] main{padding:28px 24px;max-width:960px}.child-start{min-height:min(700px,calc(100svh - 160px));background:#fffdf6;border:2px solid #e9dcbb;border-radius:32px;box-shadow:0 7px 0 #eee2c6;gap:24px;padding:32px 28px;position:relative}#childName{font-size:22px;margin:0}.home-welcome{display:flex;justify-content:center;align-items:center;gap:28px;position:relative;width:100%;max-width:560px;min-height:230px}.child-okojo{width:110px;height:215px;object-fit:contain;filter:drop-shadow(0 5px 1px #e5ddc9)}.number-note{display:flex;flex-direction:column;justify-content:center;align-items:center;width:160px;height:120px;font-size:34px;line-height:1.5;font-weight:bold;color:#f7f5de;background:#315e4d;border:7px solid #c5a36b;border-radius:12px;transform:rotate(-6deg);box-shadow:0 4px 0 #e4d6b9}.home-invitation{align-self:flex-start;position:relative;margin:18px 0 0;background:#ffedb2;color:#455245;font-size:24px;font-weight:bold;padding:16px 22px;border-radius:24px 24px 24px 4px;line-height:1.6;white-space:nowrap}.home-invitation::after{content:'';position:absolute;left:0;bottom:-11px;width:20px;height:20px;background:#ffedb2;clip-path:polygon(0 0,100% 0,0 100%)}
#home #start{flex-direction:row;gap:18px;width:min(100%,650px);min-height:116px;padding:22px 26px;font-size:30px;border-radius:24px;background:#26748a;border-color:#1b5c70;box-shadow:0 6px 0 #194f60}#home #start:hover{background:#1c667c}#home #start .start-icon{display:grid;place-items:center;background:#fff5d8;color:#296d7e;border-radius:12px;width:52px;height:52px;font-size:40px;line-height:1;flex-shrink:0}#home #start .start-arrow{font-size:24px;margin-left:auto}#home #start>span:nth-child(2){flex:1}#startError{max-width:650px;line-height:1.8;color:#923b2a}
}
@media screen and (max-width:700px){body[data-view=home] header{padding:14px 16px;gap:12px}body[data-view=home] header h1{font-size:19px}body[data-view=home] header .mark{width:40px;height:40px;font-size:26px}body[data-view=home] main{padding:22px 16px}.child-start{padding:26px 18px;border-radius:26px}.home-welcome{gap:16px}.number-note{width:125px;height:108px;font-size:28px}.child-okojo{width:85px;height:185px}.home-invitation{font-size:20px;padding:14px 16px}#home #start{font-size:24px;padding:20px 18px;gap:12px;min-height:105px}}
@media screen and (max-width:450px){body[data-view=home] header{gap:8px}body[data-view=home] header h1{font-size:15px}#teacherEntry{font-size:12px;padding:8px 10px}.child-start{padding:22px 14px;gap:22px}.home-welcome{gap:10px;min-height:195px}.number-note{width:98px;height:92px;font-size:22px;border-width:5px}.child-okojo{width:64px;height:160px}.home-invitation{font-size:16px;padding:12px;margin-top:12px}#home #start{font-size:19px;gap:10px;padding:18px 12px;min-height:100px}#home #start .start-icon{width:38px;height:42px;font-size:30px}#home #start .start-arrow{font-size:16px}}
@media screen and (max-height:700px) and (min-width:701px){body[data-view=home] main{padding-top:18px}.child-start{min-height:0;gap:16px;padding:22px}.home-welcome{min-height:185px}.child-okojo{height:175px}.home-invitation{margin-top:8px}#home #start{min-height:100px}}
/* かぞえて とこう！けいさんチャレンジ：タイトル→数える仲間→スタート */
@media screen{
body[data-view=home]{background:#fffcf3}body[data-view=home]::before{content:'';position:absolute;left:0;right:0;top:0;height:18px;background:#19afbf;pointer-events:none}body[data-view=home] header{background:transparent;border:0;box-shadow:none;padding:30px 24px 8px;min-height:74px;justify-content:flex-end}body[data-view=home] header>.mark,body[data-view=home] header>div{display:none}body[data-view=home] main{max-width:740px;padding:8px 24px 36px}.child-start{min-height:0;border:0;border-radius:0;background:transparent;box-shadow:none;padding:14px 20px 28px;gap:0;max-width:620px;margin:0 auto;text-align:center}.child-brand{position:relative;z-index:1}.challenge-invitation{font-size:clamp(20px,3vw,27px);font-weight:800;letter-spacing:.1em;color:#3a736e;margin:0 0 12px}.challenge-title{display:flex;flex-direction:column;align-items:center;gap:1px;margin:0;font-family:"UD Digi Kyokasho N-B","BIZ UDPGothic","Meiryo",sans-serif;font-size:clamp(38px,6.4vw,57px);line-height:1.25;letter-spacing:.05em;font-weight:900}.challenge-title span{display:block;color:#267b9b;text-shadow:2px 3px 0 #dcebe9}.challenge-title span:last-child{color:#be7526;text-shadow:2px 3px 0 #ffedbd}.counting-scene{position:relative;display:flex;align-items:center;justify-content:center;width:100%;margin:10px 0 8px;min-height:0}.counting-mascot{display:block;width:min(100%,460px);height:auto;max-height:300px;object-fit:contain}.counting-scene::before,.counting-scene::after{content:'＋';font-weight:bold;font-size:26px;color:#c2e5e4;position:absolute;top:30%;left:5%;pointer-events:none}.counting-scene::after{content:'＝';left:auto;right:5%;top:60%;color:#eed9ac;transform:rotate(-12deg)}#childName{font-size:18px;color:#596c61;margin:16px 0 0}#home #start{width:min(100%,470px);min-height:82px;padding:20px 28px;border-radius:24px;flex-direction:row;gap:20px;font-size:27px;background:#16788e;border:3px solid #14667a;box-shadow:0 5px 0 #125468}#home #start>span:first-child{flex:1;margin:0}#home #start .start-arrow{font-size:23px;flex:0;margin:0}#home #start:hover{background:#0e6d83}#teacherEntry{background:#fffdf6;color:#61736c;border-color:#dce4d9;font-size:13px;min-height:42px;padding:9px 14px}#startError{font-size:15px;margin-top:20px}
}
@media screen and (max-height:800px) and (min-width:601px){body[data-view=home] header{padding-top:26px}.child-start{padding-top:0}.challenge-invitation{font-size:22px;margin-bottom:8px}.challenge-title{font-size:46px}.counting-mascot{max-height:245px;width:370px}.counting-scene{margin:4px 0}#home #start{min-height:74px;font-size:25px;padding:17px 24px}}
@media screen and (max-width:600px){body[data-view=home] main{padding:10px 16px 28px}.child-start{padding:14px 6px 22px}.challenge-invitation{font-size:20px;margin-bottom:10px}.challenge-title{font-size:clamp(32px,8.7vw,46px)}.counting-mascot{max-height:270px;width:100%}.counting-scene{margin:12px 0 8px}#home #start{min-height:78px;padding:18px;font-size:23px;gap:10px}#home #start .start-arrow{font-size:18px}.counting-scene::before{left:0}.counting-scene::after{right:0}}
@media screen{#home #start>span:first-child{flex:1 1 auto;white-space:nowrap}#home #start>span.start-arrow:last-child{flex:0 0 auto;margin:0;font-size:22px}.counting-scene::before,.counting-scene::after{content:none}}@media screen and (max-width:450px){#home #start>span.start-arrow:last-child{font-size:16px}}
.screen-reader-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media screen{.child-brand{width:100%;display:flex;justify-content:center}.challenge-logo{display:block;width:min(100%,450px);height:auto;max-height:280px;object-fit:contain}.counting-scene{margin:0 0 10px}.counting-mascot{max-height:270px;width:min(100%,420px)}.child-start{padding-top:0}}
@media screen and (max-height:800px) and (min-width:601px){.challenge-logo{max-height:225px;width:365px}.counting-mascot{max-height:220px;width:340px}.counting-scene{margin:0 0 8px}}
@media screen and (max-width:600px){.challenge-logo{width:min(100%,350px);max-height:225px}.counting-mascot{max-height:240px}.child-start{padding-top:0}.counting-scene{margin:0 0 10px}}
@media screen{#teacherEntry{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;padding:10px 14px;border:1px solid #c9d6cd;background:#fffdf6;color:#3c564d;min-height:52px}#teacherEntry>span{margin:0}.teacher-entry-name{font-size:12px;font-weight:600}.teacher-entry-action{font-size:14px;font-weight:700}.teacher-menu-lead{font-size:16px;line-height:1.8;color:#52685f;max-width:680px}#teacherMenuView h2{margin-top:8px}@media(max-width:450px){#teacherEntry{padding:8px 10px;gap:3px}.teacher-entry-name{font-size:10px}.teacher-entry-action{font-size:12px}}}
@media screen{.teacher-workspaces{display:grid;gap:24px;margin-top:26px}.teacher-workspace{margin:0;padding:26px;border:2px solid #c9dcd8;border-radius:20px;background:#f3f9f6}.teacher-workspace.print-workspace{border-color:#e1d2af;background:#fff9ed}.workspace-heading{display:flex;gap:16px;align-items:center}.workspace-heading h3{font-size:22px;margin:0 0 6px}.workspace-heading p{font-size:14px;line-height:1.7;color:#52685f;margin:0}.workspace-icon{display:grid;place-items:center;width:48px;height:48px;background:#d5e9e5;color:#2c655a;border-radius:12px;font-size:30px;flex-shrink:0}.print-workspace .workspace-icon{background:#f3e4bf;color:#80622a}.workspace-summary{font-size:14px;color:#52685f;margin:18px 0 0}#teacherMenuView .teacher-workspace .teacher-menu{margin-top:20px}.teacher-workspace .hint{margin:18px 0 0}.teacher-workspace .teacher-card{min-height:100px;text-align:left;background:#fff}.teacher-workspace .teacher-card span{font-size:13px}@media(max-width:600px){.teacher-workspace{padding:20px 16px}.workspace-heading{gap:12px}.workspace-heading h3{font-size:19px}.workspace-heading p{font-size:13px}.workspace-icon{width:40px;height:40px;font-size:26px}}}

@media screen{.print-app-nav{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:30px}body[data-app="print"] header{border-top:8px solid #d9b768}body[data-app="print"] .print-controls>p:first-child{display:none}body[data-app="print"] footer a{color:#226b59}}

@media print{.print-app-nav{display:none!important}}

.paper-link{display:flex;flex-direction:column;align-items:center;gap:1mm;color:#000;text-decoration:none;font-size:8pt;width:36mm;margin-left:5mm}.paper-link svg{display:block;width:30mm;height:30mm}.paper-bottom{justify-content:flex-end}.imported-notice{text-align:center;font-weight:bold;color:#226b59}.answer-cell{color:#bd3232!important}.answer-actions{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0}@media print{.answer-actions{display:none!important}}

#answerQrVideo{display:block;width:100%;max-width:720px;max-height:65vh;background:#172c29;border-radius:16px;margin:20px 0;object-fit:contain}

@media screen{.child-mode-buttons{display:grid;grid-template-columns:1fr 1fr;gap:16px;width:100%;max-width:560px;margin:0 auto}.child-mode-buttons button,#home .child-mode-buttons #start{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;width:100%;min-width:0;min-height:100px;margin:0;padding:16px 10px;border-radius:22px;font-size:25px;box-shadow:0 5px 0 #125468}.child-mode-buttons #startChallenge{background:#d96a32;border:3px solid #bf5725;box-shadow:0 5px 0 #a24a20}.child-mode-buttons button span{margin:0!important;white-space:nowrap}.child-mode-buttons small{font-size:13px;font-weight:normal}.child-record-button{display:block;margin:22px auto 0;min-width:180px;background:#fff2c8;color:#674f27;border:2px solid #d7bb72;border-radius:18px;font-size:23px}.child-record-button:hover{background:#f6e5ac}#childRecordsView{max-width:660px;margin:auto}#childRecordStats{padding:24px;background:#fff2c8;border-radius:20px;font-size:27px;font-weight:bold;text-align:center}#childRecordList{list-style:none;padding:0}#childRecordList li{display:flex;justify-content:space-between;gap:16px;padding:20px;margin:12px 0;background:#fff;border-radius:16px;font-size:21px}#childRecordList strong{color:#16788e}#childRecordName{font-size:23px}#childRecordMessage{line-height:1.8}@media(max-width:450px){.child-mode-buttons{gap:10px}.child-mode-buttons button,#home .child-mode-buttons #start{font-size:20px}.child-mode-buttons small{font-size:11px}.counting-mascot{max-height:190px}}}

.app-icon{object-fit:contain;padding:0;background:transparent;border-radius:12px}body[data-view=home] header>.app-icon{display:none}.about-page{max-width:860px;margin:0 auto;padding:40px 24px;line-height:1.9}.about-page h1{font-size:32px}.about-page .about-icon{width:100px;height:100px}.about-page .open-app{display:inline-block;padding:14px 24px;border-radius:14px;background:#16788e;color:white;text-decoration:none;font-weight:bold}.about-page h2{margin-top:36px;font-size:24px}.about-page a{color:#16788e}.about-page .open-app{color:white}
