/* ProoProo 日语 2.5 — warm study-corner design. Functional data and routes remain live. */
:root{--bg:#faf5ec;--paper:#fffdf9;--ink:#3e2c28;--muted:#73675d;--line:#eadfd0;--green:#43785b;--pale:#edf3e9;--gold:#fba87f;--red:#ae5147;color:var(--ink);background:var(--bg)}
body{background:radial-gradient(ellipse at 70% -10%,#fff5df 0,transparent 37%),var(--bg)}
:focus-visible{outline:3px solid #866d3f;outline-offset:3px}
.sidebar{background:linear-gradient(180deg,#fffbf5,#f5e8d5);border-right:1px solid #e8d6c1;color:var(--ink)}
.sidebar .brand{color:#472b22;font-weight:800;letter-spacing:-.04em;font-size:26px}
.brand .brand-subject{font-weight:600;letter-spacing:.03em}
.sidebar .brand small{color:#716052;font-weight:500}
.sidebar .nav button{color:#655447;font-size:14px}
.sidebar .nav button.active{background:#dde9d3;color:#305d44;box-shadow:inset 3px 0 #619c6d}
.sidebar .nav button:hover{background:#efe6d8;color:#503d32}
.sidebar .nav button .icon{stroke-width:1.8}
.side-note{background:#fff9ed;border:1px solid #eee0cc;color:#765e49;line-height:1.75;box-shadow:0 8px 25px #8b5c2a0a}
.side-note strong{color:#54432d}
.side-note .icon{color:#69a070}
.shell{max-width:1540px}
.topbar{border-bottom-color:#e7dcca;color:#857264}
.avatar{background:#e6eedf;color:#396a48}
.page-heading h1{color:#432821;font-size:30px;font-weight:740;letter-spacing:-.02em}
.page-heading .kicker,.kicker{color:#a0623d}
.page-heading .sub{font-size:14px;color:#78665a}
.panel{background:#fffdf9;border-color:#f0e7db;box-shadow:0 9px 35px #915f2910;border-radius:18px}
.section-title h2{color:#4c2e25}
.section-title h2:before{background:#569363}
.btn{background:#397954;color:#fff;border-radius:11px}
.btn:hover{background:#276340}
.btn.light{color:#306345;background:#e7f0e3}
.btn.light:hover{background:#d9ead6}
.btn.ghost{color:#5e4636;background:#fffaf4;border-color:#e8d8c5}
.textbtn{color:#326a47}
.footer{color:#8b7765}
.notice{color:#847366}
.fine{color:#796d62}
.badge{background:#f7efe5;color:#705f4f}
.dashboard-hero{min-height:318px;grid-template-columns:minmax(0,.82fr) minmax(0,1fr);gap:20px;padding:30px 32px;background:linear-gradient(90deg,#fff5e6ec 0%,#fff7eae6 45%,#fff3e3b5 70%,#fff1db30 100%),url('/study-corner.png') right center/cover no-repeat;border:1px solid #edd5bc;color:#402820;box-shadow:0 12px 28px #9d69401a;isolation:isolate}
.dashboard-hero:before,.dashboard-hero:after{display:none}
.study-cat{position:absolute;width:155px;height:auto;right:3px;bottom:0;pointer-events:none;z-index:1;filter:drop-shadow(0 8px 7px #95642d24)}
.countdown{position:relative;z-index:2;border-right:1px solid #d8b89999;padding-right:20px}
.countdown>p{color:#655344;font-size:14px;font-weight:600}
.countdown h2{color:#4b3025}
.days strong{font-weight:850;font-size:87px;color:#513126;background:none;letter-spacing:-.06em}
.days>span{font-weight:700;color:#694b36}
.countdown-link{color:#604b3c;font-weight:600}
.countdown-link:hover{color:#2b6542}
.phase-path>span{color:#816e60}
.phase-path>span:before{background:#d9bda2}
.phase-path i{background:#fff8e9;border-color:#b9ac9b}
.phase-path .current{color:#387f50}
.phase-path .current i{background:#62a769;border-color:#43864f;box-shadow:0 0 0 4px #78a97630}
.phase-note{color:#887263}
.today-action{position:relative;z-index:2;background:#fffcf2e8;border:1px solid #fff9e2;box-shadow:0 10px 28px #a4794123;border-radius:17px;padding:20px 22px;width:calc(100% - 105px);justify-self:start;margin-left:10px}
.today-action .kicker{color:#a66d4a}
.today-action h2{color:#4a2d23;font-size:22px}
.today-action em{color:#d86c50;font-size:30px}
.today-tags{gap:8px}
.today-tags>span{background:#fff;border-color:#e8d5c4;color:#715c4f;padding:8px 10px;font-size:11px}
.today-action>p:not(.kicker){color:#806e62;font-size:12px}
.hero-cta{width:100%;background:#ed8263;color:#fff;box-shadow:0 6px 18px #d7714e26;font-size:15px}
.hero-cta:hover{background:#d66e51}
.hero-bottom{color:#715e51;align-items:center;line-height:1.5}
.hero-bottom b{color:#3f8251}
.hero-bottom .countdown-link{color:#436b50}
.training-panel .sub{color:#8d7668}
.training-table thead{background:#f9f3eb;color:#725f50}
.training-table th,.training-table td{border-bottom-color:#f1e8de}
.training-table thead th{color:#756557}
.training-table tbody th{color:#402e28}
.training-table tbody tr:not(.pending-module):hover{background:#fef9f2}
.module-icon{color:#4a9a6f}
.module-1 .module-icon{color:#d08266}
.module-2 .module-icon{color:#917ab4}
.module-0 .completion progress::-webkit-progress-value{background:linear-gradient(90deg,#77b282,#a4cd95)}
.module-1 .completion progress::-webkit-progress-value{background:linear-gradient(90deg,#ed977f,#f7b49d)}
.module-2 .completion progress::-webkit-progress-value{background:linear-gradient(90deg,#b59add,#d1b9ec)}
.module-0 .completion progress::-moz-progress-bar{background:#83ba89}
.module-1 .completion progress::-moz-progress-bar{background:#ed977f}
.module-2 .completion progress::-moz-progress-bar{background:#b59add}
.completion{color:#69584d}
.completion progress{background:#edeae7}
.completion progress::-webkit-progress-bar{background:#edeae7}
.week-add{color:#3a854c}
.upcoming-details{font-size:12px;color:#85776a}
.upcoming-details summary{cursor:pointer;list-style:none;min-height:39px;display:flex;align-items:center;gap:11px;padding:2px 8px;font-weight:550}
.upcoming-details summary::-webkit-details-marker{display:none}
.upcoming-details summary:before{content:'⌄';color:#8b9b78;font-size:18px;border-radius:50%;border:1px solid #e5ddce;width:24px;height:24px;display:grid;place-items:center;line-height:14px}
.upcoming-details[open] summary:before{transform:rotate(180deg)}
.upcoming-details summary span{margin-left:auto;border:1px solid #e6ded2;border-radius:40px;color:#8b7d70;font-size:10px;padding:4px 10px}
.upcoming-details p{margin:0;padding:10px 40px 16px;line-height:1.65;color:#786c60;white-space:normal}
.growth-layout{grid-template-columns:1.15fr 1fr}
.growth-card .sub{color:#857466}
.growth-week strong,.growth-delta{color:#438159}
.growth-week progress{background:#e8ede4;accent-color:#71b481}
.growth-week progress::-webkit-progress-bar{background:#e8ede4}
.growth-week progress::-webkit-progress-value{background:#84bc8b}
.growth-week progress::-moz-progress-bar{background:#84bc8b}
.growth-week span,.growth-week small{color:#746758}
.growth-week{padding:8px;border-radius:9px;background:#fffaf3}
.recommendation-wrap{display:flex;flex-direction:column;align-items:flex-start}
.growth-layout .coach-card{width:100%;background:linear-gradient(145deg,#fffdf8,#f7f1e6);border-color:#efe1d0;min-height:176px}
.coach-card .coach-symbol{background:#fae6ca;color:#a4663d}
.coach-card h2{color:#513b2b}
.coach-card p,.coach-card details{color:#766451}
.recommendation-action{min-width:170px;margin:12px 0 0}
.auth-wrap{background:radial-gradient(circle at 6% 15%,#ffe9cd,transparent 42%),url('/study-corner.png') right bottom/auto 65% no-repeat}
.auth-card{border-color:#eadccc;box-shadow:0 20px 60px #6e473325}
.auth-wrap .brand{color:#4b2d22}
.auth-copy h1{color:#4b2d22}
.auth-copy h1 em{color:#ae7147}
.auth-feature{color:#69584b}
.auth-feature .icon{color:#558c60}
.auth-tabs .active{color:#447d52;border-bottom-color:#518b5b}
.field{color:#665547}
.field input,.field select,.field textarea{border-color:#e6d9c9;background:#fffdf9}
.field input:focus,.field select:focus{outline-color:#87a979}
.subject,.question-card,.qaside,.result-item,.review-row{background:#fffdf9;border-color:#ecdfcf}
.subject .glyph{color:#457954;background:#e7f0e1}
.subject:nth-child(2) .glyph{color:#ad6c53;background:#fae8dc}
.subject:nth-child(3) .glyph{color:#8b70a0;background:#efe6f5}
.passage{background:#fbf6ee}
.option{border-color:#e8dccd;color:#3c3028}
.option.selected{background:#eaf2e6;border-color:#6b9774}
.option.selected .letter{background:#4b8157;border-color:#4b8157}
.option.correct{background:#edf5e7;border-color:#85af84}
.option.wrong{background:#fcf0e9;border-color:#d6a099}
.score-hero{background:#f8eee0}
.score-big,.feedback h3{color:#448355}
.review-tabs button.active{background:#eaf2e3;border-color:#91b388}
.session-plan{background:#f7eee1;color:#6f604f}
.review-row{background:#fffcf7}
.reading-toolbar button.active{background:#e5efdb;color:#315c3c}
#toast{background:#48372b}
dialog{border-color:#e5d6c5;background:#fffdf8}
dialog::backdrop{background:#38251b66}
.mobile-nav{background:#fffcf9f4;border-color:#e9ddcf}
.mobile-nav button{color:#76675a}
.mobile-nav button.active{color:#438456}
@media(max-width:1100px){.dashboard-hero{grid-template-columns:.85fr 1fr;padding:24px}.days strong{font-size:73px}.study-cat{width:110px;right:0}.today-action{width:calc(100% - 65px);margin-left:0;padding:17px}.today-action h2{font-size:20px}.today-tags>span{font-size:10px}.growth-layout{grid-template-columns:1fr 1fr}.growth-layout .recommendation-wrap{display:flex}}
@media(max-width:800px){.dashboard-hero{grid-template-columns:1fr 1fr;background-position:right center}.countdown{padding-right:10px}.study-cat{width:98px;right:-1px}.today-action{width:calc(100% - 45px);padding:15px}.today-tags>span{padding:7px}.growth-layout{grid-template-columns:1fr 1fr}.mobile-brand{color:#4e3328}.topbar .profile{color:#654c3a}.page-heading h1{font-size:26px}}
@media(max-width:640px){.dashboard-hero{grid-template-columns:1fr;gap:15px;padding:20px;background:linear-gradient(90deg,#fff5e8e8,#fff3e4b0),url('/study-corner.png') right center/cover no-repeat}.countdown{border:0;border-bottom:1px solid #c9ab8f88;padding:0 0 16px}.study-cat{width:88px;right:4px;top:11px;bottom:auto}.days strong{font-size:72px}.countdown h2{font-size:28px;margin:10px 90px 10px 0}.phase-path{max-width:310px}.phase-note{font-size:9px}.today-action{width:100%;margin:0;background:#fffcf5ee;box-shadow:none;padding:18px}.today-action h2{font-size:21px}.hero-bottom{flex-wrap:wrap}.training-table tbody tr:not(.pending-module) td:last-child .textbtn{min-width:42px}.growth-layout{grid-template-columns:1fr}.growth-layout .coach-card{min-height:0}.recommendation-action{width:100%;justify-content:center}}
@media(max-width:420px){.page-heading h1{font-size:22px}.page-heading .sub{font-size:12px}.dashboard-hero{padding:18px}.days strong{font-size:68px}.study-cat{width:82px}.training-panel .section-title h2{font-size:17px}.upcoming-details summary{font-size:11px;padding:0 3px}.upcoming-details p{padding:10px 18px 14px}.growth-week{padding:5px}.growth-week strong{font-size:19px}.growth-weeks{gap:5px}.mobile-nav button{padding:4px 7px}.hero-cta{font-size:14px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{body{background:#fff}.dashboard-hero{background:#fff}.study-cat{display:none}}
/* A compact card layout keeps the real data table legible on narrow phones. */
@media(max-width:520px){
 .training-panel .table-scroll{overflow:visible}
 .training-table,.training-table tbody{display:block;width:100%;min-width:0;white-space:normal}
 .training-table thead{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
 .training-table tbody tr:not(.pending-module){display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 8px;padding:14px 8px;border-bottom:1px solid #eee5d9}
 .training-table tbody tr:not(.pending-module)>th,.training-table tbody tr:not(.pending-module)>td{display:block;width:auto;border:0;padding:0}
 .training-table tbody tr:not(.pending-module)>th{font-size:16px;grid-column:1}
 .training-table tbody tr:not(.pending-module)>td:nth-child(2){grid-column:2;text-align:right;font-size:14px;font-weight:600}
 .training-table tbody tr:not(.pending-module)>td:nth-child(2) .muted{display:inline;font-size:12px;font-weight:400}
 .training-table tbody tr:not(.pending-module)>td:nth-child(3){grid-column:1/3}
 .training-table tbody tr:not(.pending-module)>td:nth-child(4){grid-column:1;font-size:12px}
 .training-table tbody tr:not(.pending-module)>td:nth-child(4):before{content:'本周新增  ';font-weight:400;color:#806e60}
 .training-table tbody tr:not(.pending-module)>td:last-child{grid-column:2;text-align:right}
 .training-table tbody tr:not(.pending-module)>td:last-child .textbtn{font-size:12px;padding:7px 8px;border-radius:9px;background:#e9f3e5}
 .training-table tbody tr:not(.pending-module)>td:last-child .icon{display:inline-block;width:16px}
 .training-table .completion{flex-direction:row;align-items:center;gap:10px}
 .training-table .completion progress{height:9px;min-width:0;max-width:none;flex:1}
 .training-table .completion>span{font-size:12px;min-width:34px;text-align:right}
 .training-table .module-icon{display:inline-flex;margin-right:7px}
 .training-table .pending-module{display:block}
 .training-table .pending-module>td{display:block;width:100%;border:0;padding:10px 4px}
 .upcoming-details summary{font-size:12px}
}

.growth-week strong{font-size:clamp(14px,1.6vw,23px)}
.skip:focus:not(:focus-visible){top:-70px}

/* Review corner: clear sequence, calm warmth, and visible self assessment. */
.review-intro{display:flex;align-items:center;gap:24px;padding:20px 26px;margin:14px 0 16px;background:linear-gradient(115deg,#fff7e9,#f7f0e6 58%,#edf4e9);border:1px solid #eee0cb;border-radius:22px;box-shadow:0 10px 30px #7754360b}
.review-intro img{width:90px;height:90px;object-fit:contain;flex:none;filter:drop-shadow(0 8px 7px #6b4b2b20)}
.review-intro h2{font-size:clamp(19px,2.2vw,27px);line-height:1.35;margin:5px 0 7px;color:#443930}
.review-intro p:last-child{margin:0;color:#776756;font-size:14px}
.review-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:0 0 19px}
.review-steps span{padding:12px 8px;text-align:center;border-radius:12px;background:#fffaf3;border:1px solid #eee3d3;font-size:13px;font-weight:700;color:#765942}
.review-feedback{margin-top:20px;border-radius:17px;padding:24px;background:#fffaf2}
.review-feedback .kicker{color:#9a7146;font-size:12px;margin:0 0 8px}
.review-feedback .explain{background:#fff;border:1px solid #eadfcd;border-radius:12px;padding:16px;margin:14px 0}
.review-feedback .explain strong{display:block;color:#55705c;font-size:13px;margin-bottom:6px}
.review-feedback .explain p{margin:0;line-height:1.8}
.reflection{border-top:1px solid #eaddcb;margin-top:20px;padding-top:17px}
.reflection>strong{font-size:16px;color:#443930}
.reflection>p{font-size:13px;color:#7f7062;margin:6px 0 13px}
.cause-options{display:flex;flex-wrap:wrap;gap:9px}
.cause-options button{background:#fff;border:1px solid #dccab4;color:#645445;padding:10px 13px;border-radius:22px;font-size:13px;font-weight:650}
.cause-options button:hover,.cause-options button.active{background:#dcebd8;border-color:#75a47c;color:#285937}
.review-next{border-top:1px solid #eaddcb;margin-top:20px;padding-top:17px;display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;font-size:14px;font-weight:700;color:#526d55}
.review-next small{display:block;margin-top:5px;font-size:12px;font-weight:400;color:#807468}
.review-next .btn{white-space:normal}
@media(max-width:620px){.review-intro{gap:12px;padding:16px}.review-intro img{width:62px;height:62px}.review-intro p:last-child{font-size:12px}.review-steps{grid-template-columns:repeat(2,1fr);gap:7px}.review-steps span{font-size:11px;padding:10px 5px}.review-feedback{padding:17px}.review-next .btn{width:100%;justify-content:center}}