*{box-sizing:border-box}body{margin:0;background:#f0f5f8;color:#17344c;font:15px/1.55 Arial,'Noto Sans',sans-serif;-webkit-tap-highlight-color:transparent}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button{cursor:pointer;border:0}button:disabled{opacity:.45;cursor:default}a{color:#0879b3}button:focus-visible,a:focus-visible,input:focus,select:focus,textarea:focus{outline:3px solid #75d4ff;outline-offset:2px}h1,h2,h3,p{margin:0 0 12px}h1{font-size:28px;line-height:1.2;letter-spacing:-.8px}h2{font-size:20px;line-height:1.35}h3{font-size:17px}small,.muted{color:#5b7285;font-size:13px}.shell{max-width:1100px;margin:auto}.top{position:sticky;top:0;background:#fff;border-bottom:1px solid #dce8ee;z-index:10;padding:12px 20px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;color:#123b5b;text-decoration:none}.brand img{width:45px;height:45px;object-fit:contain}.brand strong{display:block;letter-spacing:1.6px;font-size:14px}.brand small{font-size:10px;letter-spacing:1px}.avatar{width:38px;height:38px;border-radius:50%;background:#dff1fb;color:#0879b3;display:flex;align-items:center;justify-content:center;font-weight:bold;object-fit:cover}.main{padding:22px 20px 110px;max-width:840px;margin:auto}.eyebrow{font-size:11px;letter-spacing:1.8px;font-weight:bold;text-transform:uppercase;color:#1585ba;margin-bottom:8px}.hero{border-radius:24px;padding:26px;background:#dff3fc;background:linear-gradient(120deg,#dff4ff,#ebf7fb 70%);position:relative;overflow:hidden;border:1px solid #b9e3f7;margin-bottom:22px}.hero h1{max-width:470px}.hero p{max-width:460px;color:#3f657c}.hero .symbol{position:absolute;right:20px;top:15px;font-size:110px;color:#1b9eda;opacity:.10;line-height:1}.tag{display:inline-block;border-radius:7px;background:#e7f6fc;color:#087db5;padding:4px 8px;font-size:11px;font-weight:bold;letter-spacing:.5px}.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.between{justify-content:space-between}.grow{flex:1}.btn{display:inline-block;text-decoration:none;background:#148fc8;color:#fff;border-radius:12px;padding:12px 17px;font-weight:bold;min-height:46px;text-align:center}.btn:hover{background:#087ab0}.btn.secondary{background:#e8f4fa;color:#176087}.btn.white{background:#fff;color:#166b95}.btn.danger{background:#fff0ef;color:#aa3f3f}.btn.small{padding:8px 12px;min-height:36px;font-size:13px}.iconbtn{background:#edf6fb;color:#1e6994;border-radius:10px;min-width:42px;height:42px;font-size:19px}.levels{display:flex;gap:8px;flex-wrap:wrap;margin:15px 0 20px}.level{flex:1;border:1px solid #d1e3ec;border-radius:12px;background:#fff;padding:11px 8px;color:#5b7285;min-width:48px;font-weight:bold}.level.active{background:#127fb5;border-color:#127fb5;color:white}.grid{display:flex;flex-wrap:wrap;gap:12px}.tile{flex:1 1 calc(50% - 12px);background:#fff;border:1px solid #dce8ee;border-radius:18px;padding:18px;text-align:left;min-width:140px;color:#17344c;position:relative}.tile:hover{border-color:#92cce5}.tile .ico{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#e8f6fd;color:#158dca;border-radius:12px;font-size:22px;margin-bottom:14px}.tile strong{display:block;font-size:16px}.tile small{display:block;margin-top:4px}.card{background:#fff;border:1px solid #dce8ee;border-radius:18px;padding:20px;margin-bottom:14px}.card h3{margin-bottom:8px}.stats{display:flex;gap:10px;margin:18px 0}.stat{flex:1;background:#fff;border:1px solid #dce8ee;border-radius:14px;padding:12px}.stat b{font-size:23px;display:block;line-height:1.3}.stat small{font-size:11px}.nav{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid #dce8ee;z-index:20;display:flex;justify-content:center;padding:8px 6px max(8px,env(safe-area-inset-bottom))}.nav button{flex:1;max-width:140px;background:transparent;color:#6b8091;font-size:10px;padding:5px 2px}.nav button b{display:block;font-size:21px;font-weight:normal;line-height:1.2;margin-bottom:4px}.nav button.active{color:#087fb9;font-weight:bold}.watermark{text-align:center;color:#708796;font-size:11px;letter-spacing:.6px;margin-top:26px}.heading{display:flex;gap:10px;align-items:center;margin-bottom:20px}.heading h1{font-size:24px;margin:0}.field{margin-bottom:14px}.field label{display:block;font-size:13px;font-weight:bold;margin-bottom:6px}input,select,textarea{width:100%;border:1px solid #cadce7;border-radius:10px;background:#fff;color:#17344c;padding:12px;min-height:46px}textarea{min-height:180px;resize:vertical}input[type=checkbox]{width:20px;min-height:20px;vertical-align:middle;margin-right:8px}input[type=range]{padding:0}.search{margin-bottom:14px}.tabs{display:flex;gap:8px;overflow:auto;margin-bottom:16px}.tabs button{white-space:nowrap;padding:8px 14px;border-radius:9px;color:#567082;background:#e7eff4}.tabs button.active{background:#176c97;color:white}.jp{font-family:'Noto Sans CJK JP','Noto Sans JP',sans-serif;line-height:2.2;word-break:break-word}.jp.big{font-size:31px;line-height:2.1}.kanji{font-size:84px;line-height:1.4;font-weight:500}ruby{ruby-align:center}rt{font-size:.48em;color:#59859d}.no-furi rt{visibility:hidden}.flash{min-height:285px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px 15px}.flash .meaning{font-size:21px;margin:12px 0}.line{border-top:1px solid #e4edf2;padding-top:14px;margin-top:14px}.progress{height:6px;background:#e4eef4;border-radius:5px;overflow:hidden;margin:15px 0}.progress span{display:block;height:100%;background:#21a8d8}.option{width:100%;display:block;text-align:left;border:1px solid #d1e2eb;border-radius:12px;background:#fff;color:#17344c;padding:14px;margin:9px 0;min-height:51px}.option.chosen{border-color:#008bc5;background:#e1f4fc}.option.right{border-color:#38a777;background:#eaf9f1}.option.wrong{border-color:#cc7272;background:#fff0f0}.option .letter{display:inline-block;color:#1885b6;margin-right:12px;font-weight:bold}.notice{background:#eff8fc;border-left:3px solid #30a6d8;border-radius:8px;padding:12px 14px;font-size:13px;margin:14px 0}.notice.warn{background:#fff8e8;border-color:#dda73d;color:#75602a}.notice.good{background:#e8f7ef;border-color:#35986f;color:#246b50}.pill{border-radius:20px;padding:5px 9px;font-size:11px;background:#edf5f9;color:#4f7188}.timer{font-variant-numeric:tabular-nums;font-weight:bold;color:#13698f}.score{font-size:64px;line-height:1.2;color:#0c8ec4;font-weight:bold}.book{border-left:5px solid #1796ce}.book .spine{font-size:26px}.empty{padding:30px 10px;text-align:center;color:#627e90}.quote{background:#f3f9fc;border-radius:12px;padding:16px}.subnav{display:flex;gap:7px;margin-bottom:18px;flex-wrap:wrap}.subnav button{padding:8px 12px;background:#e6f1f8;color:#38627e;border-radius:8px}.subnav button.active{background:#1679a9;color:white}.modalbg{position:fixed;inset:0;background:rgba(13,42,63,.5);z-index:100;display:flex;align-items:center;justify-content:center;padding:18px;overflow:auto}.modalbox{width:100%;max-width:480px;max-height:90vh;overflow:auto;background:#fff;border-radius:22px;padding:24px}.modalbox h2{margin-bottom:14px}#toast{position:fixed;left:50%;bottom:88px;transform:translateX(-50%);max-width:90%;background:#133f59;color:white;padding:12px 18px;border-radius:12px;z-index:150;display:none;text-align:center;font-size:13px}.dot{width:8px;height:8px;border-radius:50%;background:#27ae85;display:inline-block;margin-right:5px}.audio{background:#e9f7fd;border:1px dashed #89cce6;border-radius:15px;padding:20px;text-align:center;margin:14px 0}.speaker{display:flex;gap:12px;align-items:flex-start;margin:12px 0}.bubble{flex:1;border-radius:12px;background:#eef6fb;padding:12px 16px}.rowlist{display:flex;gap:12px;align-items:center;border-bottom:1px solid #e5eef4;padding:14px 0}.rowlist:last-child{border-bottom:0}.rowlist .body{flex:1}.num{font-size:12px;color:#64889d;width:25px}.cert{border:5px double #1596d2;padding:32px;text-align:center;background:white;color:#17344c}.cert img{width:100px}.cert h1{font-size:28px;letter-spacing:2px}.cert .name{font-size:24px;border-bottom:1px solid #badbea;padding:16px 0;margin:14px 0}.cert .score{font-size:52px}iframe.media{width:100%;aspect-ratio:16/9;min-height:220px;border:0;border-radius:12px}.footerlinks{font-size:12px;display:flex;gap:15px;justify-content:center;margin-top:16px}details summary{cursor:pointer;font-weight:bold}.actions{display:flex;gap:8px;margin:14px 0}.actions .btn{flex:1}.birthday{background:#e5f6ff;border:1px solid #9ed9f2;border-radius:16px;padding:18px;margin-bottom:18px}.avatargrid{display:flex;gap:8px;flex-wrap:wrap}.avatargrid button{font-size:26px;border-radius:12px;padding:10px;background:#e9f6fc}.camera-status{font-size:11px;color:#487088}.badge-admin{background:#143f60;color:white}.sectiongap{margin-top:26px}.hide{display:none}.bar{display:flex;align-items:center;gap:10px}.bar span{min-width:75px;font-size:12px}.bar .progress{flex:1}.smallprint{font-size:11px;color:#607a8b}.passage{white-space:pre-wrap;font-size:18px;line-height:2.2}.offline{background:#fff5de;color:#816529;padding:8px 14px;font-size:12px;text-align:center}.cert-verify{font-size:11px;word-break:break-all}.error{color:#ad3737;font-size:13px;margin:10px 0}.modalbox code{word-break:break-all;background:#eaf4fa;padding:8px;display:block}body.large{font-size:18px}.large .muted,.large small{font-size:15px}@media(min-width:700px){.main{padding-top:30px}.hero{padding:34px}.hero h1{font-size:36px}.tile{flex-basis:calc(25% - 12px);min-width:140px}.grid.two .tile{flex-basis:calc(50% - 12px)}.stats .stat{padding:18px}.nav{max-width:840px;left:50%;transform:translateX(-50%);border-radius:20px 20px 0 0;box-shadow:0 -4px 25px rgba(25,72,102,.04)}}@media(max-width:350px){.main{padding:15px 12px 100px}.top{padding:10px 12px}.hero{padding:20px}.tile{min-width:120px;padding:14px}.btn{padding:11px 12px;font-size:13px}.stats{gap:5px}.stat{padding:10px 8px}.brand small{font-size:9px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}@media print{body{background:white}.top,.nav,.watermark,.no-print,#toast{display:none!important}.main{padding:0;margin:0;max-width:none}.cert{page-break-inside:avoid}.cert img{width:80px}@page{size:A4 landscape;margin:15mm}}

@media(max-width:480px){.top{padding:10px 12px}.brand{min-width:0;gap:8px}.brand img{width:34px;height:34px;flex-shrink:0}.brand strong{font-size:12px;letter-spacing:1.2px}.brand small{font-size:8px;letter-spacing:.4px}.hero{padding:22px}.hero h1{font-size:27px}.stat small{font-size:10px}}

.exam-clock{position:sticky;top:0;z-index:8;background:#eff7fb;padding:12px 0;border-bottom:1px solid #d5e6ef}.timer{font-variant-numeric:tabular-nums}.btn[download]{display:inline-block;text-decoration:none}
.basic-banner{border-left:5px solid #1596d2;background:#edf8ff}.basic-hero h1{font-size:clamp(26px,6vw,36px)}.basic-step{display:flex;align-items:center;gap:14px;width:100%;padding:17px;margin:9px 0;border:1px solid #d9e9f2;border-radius:16px;background:#fff;color:#16394b;text-align:left;font:inherit;cursor:pointer}.basic-step>span:nth-child(2){flex:1;min-width:0}.basic-step small{display:block;color:#526e7c;line-height:1.5;margin-top:5px}.basic-step.selected{border-color:#168fc5;background:#edf8ff}.basic-num{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;border-radius:12px;background:#e2f2fc;color:#087aaa;font-weight:800}.kana-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:16px 0}.kana-grid button{border:1px solid #d5e8f4;border-radius:12px;background:#fff;color:#16394b;padding:12px 4px;cursor:pointer}.kana-grid b{display:block;font-size:28px}.kana-grid small{display:block;color:#506a78;margin-top:5px}.stroke-image{width:100%;height:auto;border:1px solid #dbe8ef;border-radius:12px}.basic-task-list{margin:16px 0}.basic-step:focus-visible,.kana-grid button:focus-visible{outline:3px solid #1596d2;outline-offset:3px}
/* Program 1.3: compact, low-memory panels */
.program-track{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}.program-track>div{background:#e8f5fc;border:1px solid #a9d9ee;border-radius:14px;padding:14px 9px}.program-track b,.program-track small{display:block;margin-top:8px}.checkpoint{display:grid;grid-template-columns:72px 1fr;gap:12px;border-bottom:1px solid #dfebf1;padding:16px 0}.checkpoint-time{font-weight:700;color:#0873a5}.jp-text{white-space:normal;line-height:1.8;overflow-wrap:anywhere}.word-list article{border-bottom:1px solid #d5e7ef;padding:14px 0}.word-list .jp{display:block;font-size:28px}.answer{display:block;width:100%;text-align:left;background:#f5faff;border:1px solid #b8ddeb;padding:16px;border-radius:12px;margin:9px 0;font:inherit;color:inherit}.answer.selected{border:2px solid #138ac0;background:#d9f1ff}.check{display:flex;gap:10px;align-items:flex-start;margin:18px 0;line-height:1.5}.check input{width:22px;height:22px;flex-shrink:0}details.card summary,details>summary{cursor:pointer;font-weight:700;padding:10px 0}.program-track small{font-size:11px}#p-timer{font-variant-numeric:tabular-nums;font-size:25px}.modalbox hr{border:0;border-top:1px solid #cce0e8;margin:24px 0}

/* TC 1: one cached original photograph for every learning introduction. */
.tc1-banner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin:0 0 22px;border:1px solid #d7e6ed;border-radius:16px;overflow:hidden;background:#edf7fb;color:#10354b;text-align:left}
.tc1-banner img{display:block;width:100%;height:230px;object-fit:cover;object-position:56% 51%}
.tc1-banner figcaption{display:flex;flex-direction:column;justify-content:center;padding:24px;gap:10px}
.tc1-banner figcaption span{font-size:10px;font-weight:700;letter-spacing:1.8px;color:#087eae}
.tc1-banner figcaption strong{font-size:24px;line-height:1.25}
.tc1-banner figcaption small{font-size:13px;line-height:1.6;color:#526d7a}
@media(max-width:600px){.tc1-banner{grid-template-columns:1fr}.tc1-banner img{height:200px;object-position:56% 50%}.tc1-banner figcaption{padding:18px 20px;gap:7px}.tc1-banner figcaption strong{font-size:21px}}

/* Daily KPI alarms */
.alarm-countdown{display:block;font-size:clamp(2.5rem,10vw,4.2rem);font-variant-numeric:tabular-nums;letter-spacing:.04em;margin:16px 0}.alarm-hero .smallprint{color:inherit;opacity:.94}.alarm-banner{position:fixed;z-index:120;bottom:80px;left:50%;transform:translateX(-50%);width:min(92vw,600px);max-height:75vh;overflow:auto;background:#fff;color:#123551;border:3px solid #1596d2;border-radius:20px;padding:22px;box-shadow:0 12px 70px #092b4b66}.alarm-banner h2{margin:12px 0;font-size:1.4rem}.alarm-banner .tag{background:#dff3ff;color:#075985}.alarm-banner .actions{display:flex;flex-wrap:wrap;gap:8px}.alarm-banner small{display:block;margin-top:12px}#alarm-live:empty{display:none}@media(max-width:480px){.alarm-banner{bottom:75px;padding:16px}.alarm-banner .btn{flex:1;min-width:120px}}

.top>.btn{font-size:12px;padding:9px 11px;white-space:normal}.top{flex-wrap:wrap;gap:10px}@media(max-width:520px){.top>.btn{order:3;width:100%;text-align:center}}
