@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+JP:wght@400;500;600;700&display=swap";:root{--accent:#4b61d8;--deep:#344bc4;--accent-soft:#edf0fb;--ink:#24282b;--muted:#70767e;--faint:#959b9d;--line:#dedfdc;--soft:#f2f4fb;--soft-2:#d8daf2;--track:#eaece5;--warn:#ad5852;--warn-soft:#f7ebe8;--paper:#f6f4ef;--white:#fffefa;--header-height:88px;--nav-height:0px}*{box-sizing:border-box}html,body{margin:0}body{background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;font-family:DM Sans,Noto Sans JP,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400}html:lang(zh-Hans) body{font-family:DM Sans,PingFang SC,Microsoft YaHei,Noto Sans JP,sans-serif}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;padding:0}button:disabled{cursor:not-allowed}button:focus-visible{outline-offset:4px;outline:3px solid #7081ed}ul,ol{margin:0;padding:0;list-style:none}p{margin:0}[lang=ja]{font-family:DM Sans,Noto Sans JP,sans-serif}.shell{min-height:100svh}.top{height:var(--header-height);border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:28px;padding:0 56px;display:flex}.brand{color:var(--ink);letter-spacing:-.065em;align-items:center;gap:9px;font-size:28px;font-weight:700;display:flex}.brand-mark{width:32px;height:32px;color:var(--accent);display:inline-flex}.brand-mark svg{stroke:currentColor;stroke-width:1.8px;width:100%;height:100%}.dev-pill{color:#8b805c;white-space:nowrap;background:#efe7d9;border-radius:20px;padding:5px 10px;font-size:11px}.nav{z-index:10;inset:var(--header-height) auto 0 0;border-right:1px solid var(--line);background:var(--paper);flex-direction:column;gap:12px;width:96px;padding:24px 12px;display:flex;position:fixed}.nav-item{color:#757e84;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:7px;min-height:68px;padding:10px 8px;font-size:11px;line-height:1.4;transition:color .2s,background .2s;display:flex}.nav-item svg{flex:none;width:21px;height:21px}@media (hover:hover){.nav-item:hover{color:var(--accent);background:#eceeea}}.nav-item[aria-current=page]{color:var(--accent);background:#e8ebf6}.content{max-width:864px;margin:0 auto;padding:46px 28px 30px 124px}@media (width<=980px){:root{--header-height:76px;--nav-height:calc(76px + env(safe-area-inset-bottom))}.top{padding:0 32px}.nav{width:auto;height:var(--nav-height);padding:7px 17px calc(7px + env(safe-area-inset-bottom));border-right:0;border-top:1px solid var(--line);grid-template-columns:repeat(3,1fr);gap:8px;display:grid;inset:auto 0 0}.nav-item{border-radius:12px;gap:5px;height:61px;min-height:0;padding:6px 12px}.nav-item[aria-current=page]{background:0 0}.content{max-width:768px;padding:46px 28px calc(var(--nav-height) + 30px)}}@media (width<=640px){.content{padding:30px 21px calc(var(--nav-height) + 16px)}}@media (width<=540px){:root{--header-height:72px}.top{gap:16px;padding:0 21px}.brand{gap:6px;font-size:25px}.brand-mark{width:28px;height:28px}}.h2{color:#78827a;margin:0;font-size:11px;font-weight:400}.sec{margin:28px 0 8px}.btn{background:var(--accent);color:#fff;border-radius:13px;justify-content:center;align-items:center;min-height:50px;padding:0 24px;font-size:14px;font-weight:500;transition:background .2s;display:inline-flex}.btn:hover{background:var(--deep)}.btn.ghost{background:var(--white);color:var(--muted);box-shadow:inset 0 0 0 1px var(--line)}.btn.ghost:hover{background:#f4f5f2}.btn.warn{background:var(--warn)}.btn.sm{border-radius:10px;min-height:44px;padding:10px 17px;font-size:12px}.icon-btn{color:#737d86;border-radius:50%;place-items:center;width:44px;height:44px;transition:background .2s,color .2s;display:inline-grid}.icon-btn svg{width:20px;height:20px}.icon-btn:hover{color:var(--ink);background:#eaece6}.icon-btn.ring{box-shadow:inset 0 0 0 1px var(--line);color:var(--deep);background:var(--white)}.icon-btn-space{width:44px}.cat-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}@media (width<=640px){.cat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}}.cat{text-align:left;background:var(--white);border:1px solid var(--line);color:#434b53;border-radius:13px;justify-content:space-between;align-items:center;gap:8px;width:100%;min-height:54px;padding:14px 16px;transition:border-color .18s,background .18s;display:flex}.cat:not(:disabled):hover{border-color:#a8b1d9}.cat:not(:disabled):active{background:var(--accent-soft);border-color:var(--accent)}.cat:disabled{background:0 0}.cat-name{font-size:14px;font-weight:500}.cat:disabled .cat-name{color:var(--faint)}.cat-soon{color:#8b939b;font-size:10px}.review-card{border:1px solid var(--line);width:100%;color:var(--ink);text-align:left;background:#fffefb;border-radius:14px;align-items:center;gap:12px;margin-bottom:16px;padding:16px 18px;font-size:14px;transition:background .2s;display:flex}.review-card:hover{background:#f7f7f1}.review-card>span:first-child{flex:1}.review-num{color:#ad5852;font-size:20px;font-weight:600}.review-num small{color:var(--muted);margin-left:2px;font-size:12px;font-weight:400}.review-card svg{color:#9aa19c;width:16px;height:16px}.stats{grid-template-columns:1fr 1fr;gap:12px;display:grid}.stat{background:var(--white);border:1px solid #e0e2e9;border-radius:16px;flex-direction:column;gap:5px;padding:17px 20px;display:flex}.stat-label{color:var(--muted);font-size:12px}.stat-num{letter-spacing:-.035em;color:var(--ink);font-variant-numeric:tabular-nums;font-size:28px;font-weight:500;line-height:1.3}.stat-num small{color:var(--muted);letter-spacing:0;margin-left:4px;font-size:12px;font-weight:400}.stat-sub{color:var(--muted);font-variant-numeric:tabular-nums;font-size:12px}.chart-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin:28px 0 12px;display:flex}.chart-head .h2{color:var(--ink);font-size:13px}.legend{color:var(--muted);align-items:center;gap:6px;font-size:11px;display:flex}.dot{border-radius:2px;width:8px;height:8px;margin-left:8px;display:inline-block}.dot.ok{background:var(--accent)}.dot.ng{background:var(--soft-2)}.chart{grid-template-columns:repeat(7,1fr);gap:8px;height:150px;display:grid}.col{flex-direction:column;align-items:center;gap:8px;display:flex}.col-bar{background:#ebece6;border-radius:8px;flex-direction:column-reverse;flex:1;gap:2px;width:100%;max-width:28px;display:flex;overflow:hidden}.seg{width:100%;display:block}.seg.ok{background:var(--accent)}.seg.ng{background:var(--soft-2)}.col-label{color:var(--muted);font-size:11px}.col.is-today .col-label{color:var(--ink);font-weight:500}.acc-head,.acc li{grid-template-columns:minmax(84px,1fr) 1.3fr 1.3fr;align-items:center;column-gap:16px;display:grid}.acc-head{color:var(--muted);padding:0 0 8px;font-size:11px}.acc li{border-top:1px solid var(--line);min-height:53px;padding:13px 3px}.acc li:last-child{border-bottom:1px solid var(--line)}.acc-name{font-size:13px}.acc-cell{align-items:center;gap:8px;display:flex}.acc-bar{background:var(--track);border-radius:5px;flex:1;height:5px;overflow:hidden}.acc-bar span{background:var(--accent);border-radius:inherit;height:100%;display:block}.acc-num{color:var(--muted);font-variant-numeric:tabular-nums;text-align:right;min-width:32px;font-size:11px}.rows{border-top:1px solid var(--line)}.rows li{border-bottom:1px solid var(--line)}.row{text-align:left;color:#a0a7a8;align-items:center;gap:14px;width:100%;min-height:53px;padding:13px 3px;transition:background .2s;display:flex}.row:hover{background:#eeeee7}.row-main{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.row-title{color:var(--ink);font-size:13px;line-height:1.6}.row-sub{color:var(--muted);font-variant-numeric:tabular-nums;font-size:11px}.row-score{color:var(--ink);font-variant-numeric:tabular-nums;font-size:15px;font-weight:500}.row-score small{color:var(--muted);font-size:11px;font-weight:400}.row svg{width:16px;height:16px}.empty{color:var(--muted);flex-direction:column;align-items:center;gap:20px;padding:64px 0;font-size:13px;display:flex}.set-section+.set-section{margin-top:28px}.set-section .h2{margin:0 0 8px}.menu{border-top:1px solid var(--line)}.menu-item{text-align:left;border-bottom:1px solid var(--line);width:100%;min-height:53px;color:var(--ink);align-items:center;gap:14px;padding:13px 3px;font-size:13px;line-height:1.6;transition:background .2s;display:flex}button.menu-item:hover{background:#eeeee7}.menu-item>span:first-child{flex:1}.menu-item svg{color:#9aa19c;flex:none;width:16px;height:16px}.menu-value{color:#7c857e;flex:none;margin-left:auto;font-size:11px}.menu-item.is-static{padding-top:4px;padding-bottom:4px}.menu-item.is-danger{color:#ad5852}.switch{flex:none;width:52px;height:44px;position:relative}.switch:before{content:"";background:#dce0d8;border-radius:30px;transition:background .2s;position:absolute;inset:7px 0}.switch span{background:var(--white);border-radius:50%;width:22px;height:22px;transition:transform .2s;position:absolute;top:11px;left:4px;box-shadow:0 1px 3px #29352c18}.switch[aria-checked=true]:before{background:var(--accent)}.switch[aria-checked=true] span{transform:translate(22px)}.set-detail-head{color:#4e5861;align-items:center;gap:12px;margin-bottom:24px;font-size:13px;display:flex}.set-back{width:32px;height:33px;color:var(--muted);border-radius:9px;flex:none;place-items:center;display:grid}.set-back:hover{background:#eaece5}.set-back svg{width:18px;height:18px}.options{gap:8px;display:grid}.about{color:var(--ink);gap:14px;font-size:14px;line-height:1.9;display:grid}.about-paper{color:#4e5861;margin-top:10px;font-size:13px}.about-cite{color:var(--accent);text-underline-offset:3px;overflow-wrap:anywhere;font-size:12px;line-height:1.7;text-decoration:underline}.option{border:1px solid var(--line);background:var(--white);color:#434b53;text-align:left;border-radius:13px;align-items:center;gap:12px;min-height:50px;padding:14px 16px;transition:border-color .18s,background .18s;display:flex}.option:hover{border-color:#a4afd5}.option[aria-checked=true]{background:var(--accent-soft);color:#344cad;border-color:#7282d8}.option-label{flex:1;font-size:13px;line-height:1.6}.option-mark{border:1px solid #cdd3d7;border-radius:50%;flex:none;width:16px;height:16px}.option[aria-checked=true] .option-mark{border:5px solid var(--accent);background:#fff}.set-dialog{border:1px solid var(--line);width:min(420px,100% - 40px);color:var(--ink);background:var(--paper);border-radius:18px;padding:26px;box-shadow:0 16px 70px #24282b22}.set-dialog::backdrop{background:#24282b48}.set-dialog h2{margin:0;font-size:17px;font-weight:500}.set-dialog p{color:var(--muted);margin:18px 0 26px;font-size:12px;line-height:1.9}.set-dialog-actions{justify-content:flex-end;gap:12px;display:flex}.set-dialog-actions button{border:1px solid var(--line);background:var(--white);min-height:44px;color:var(--ink);border-radius:10px;padding:10px 17px;font-size:12px}.set-dialog-actions .is-danger{color:#ad5852}.focus{min-height:100svh}.quiz,.result{width:100%;max-width:768px;margin:0 auto;padding:0 28px 30px}.quiz{flex-direction:column;min-height:100svh;padding-bottom:196px;display:flex}.quiz-top{align-items:center;gap:12px;height:64px;display:flex}.quiz-top .icon-btn{margin-left:-10px}.steps{flex:1;grid-auto-columns:1fr;grid-auto-flow:column;gap:5px;display:grid}.steps li{background:#dfe2df;border-radius:5px;height:3px;transition:background .2s}.steps li.now{background:#c5cbef}.steps li.ok{background:var(--accent)}.steps li.ng{background:var(--warn)}.count{color:#87909b;font-variant-numeric:tabular-nums;text-align:right;min-width:36px;font-size:11px}.stage{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:20px;padding:24px 0;display:flex}.frame{color:var(--ink);text-align:center;max-width:30em;padding:0 8px;font-size:19px;line-height:1.9}.blank{border-bottom:2px solid var(--accent);vertical-align:-.1em;width:3.2em;height:1.1em;margin:0 .15em;display:inline-block}.kind{color:var(--deep);background:var(--accent-soft);border-radius:20px;padding:5px 12px;font-size:11px}.play{background:var(--soft);border-radius:50%;place-items:center;width:132px;height:132px;transition:transform .15s;display:grid;position:relative}.play:active{transform:scale(.96)}.play-core{background:var(--accent);color:#fff;border-radius:50%;place-items:center;width:92px;height:92px;transition:background .2s;display:grid}.play:hover .play-core{background:var(--deep)}.play-core svg{width:34px;height:34px;margin-left:4px}.play.is-playing:before,.play.is-playing:after{content:"";border:2px solid var(--accent);opacity:0;border-radius:50%;animation:1.6s ease-out infinite ripple;position:absolute;inset:0}.play.is-playing:after{animation-delay:.8s}@keyframes ripple{0%{opacity:.5;transform:scale(.72)}to{opacity:0;transform:scale(1.18)}}@media (prefers-reduced-motion:reduce){.play.is-playing:before,.play.is-playing:after{animation:none}}.note{min-height:18px;color:var(--muted);font-size:12px}.choices{grid-template-columns:1fr 1fr;gap:12px;display:grid}.choice{border:1px solid var(--line);background:var(--white);min-height:120px;color:var(--ink);border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:20px 10px;transition:border-color .18s,background .18s;display:flex;position:relative}.choice:not(:disabled):hover{border-color:#a8b1d9}.choice:not(:disabled):active{background:var(--accent-soft);border-color:var(--accent)}.choice:disabled{cursor:default}.choice-kana{letter-spacing:-.01em;font-size:26px;font-weight:500}.choice-info{flex-direction:column;align-items:center;gap:2px;display:none}.choice:disabled .choice-info{display:flex}.choice-written{font-size:13px}.choice-meaning{color:var(--muted);text-align:center;font-size:11px;line-height:1.6}.choice-mark{color:#fff;border-radius:50%;place-items:center;width:22px;height:22px;display:grid;position:absolute;top:10px;right:10px}.choice-mark svg{width:13px;height:13px}.choice.is-right{background:var(--soft);border-color:var(--accent)}.choice.is-right .choice-mark{background:var(--accent)}.choice.is-wrong{background:var(--warn-soft);border-color:var(--warn)}.choice.is-wrong .choice-mark{background:var(--warn)}.choice.is-dim{opacity:.5}.sheet{z-index:20;padding-bottom:env(safe-area-inset-bottom);transition:transform .22s ease-out;position:fixed;bottom:0;left:0;right:0;transform:translateY(105%)}.sheet.is-open{transform:none}.sheet.ok{background:var(--soft)}.sheet.ng{background:var(--warn-soft)}.sheet-inner{flex-direction:column;gap:14px;max-width:768px;margin:0 auto;padding:18px 28px 20px;display:flex}.sheet-text{flex-direction:column;gap:4px;display:flex}.verdict{align-items:center;gap:8px;font-size:15px;font-weight:500;display:flex}.sheet.ok .verdict{color:var(--deep)}.sheet.ng .verdict{color:var(--warn)}.verdict-icon{color:#fff;border-radius:50%;place-items:center;width:22px;height:22px;display:grid}.verdict-icon svg{width:13px;height:13px}.sheet.ok .verdict-icon{background:var(--accent)}.sheet.ng .verdict-icon{background:var(--warn)}.script{color:var(--ink);padding-left:30px;font-size:13px;line-height:1.8}.sheet-actions{gap:12px;display:flex}.sheet-actions .btn{flex:1}.sheet-actions .icon-btn{border-radius:13px;width:50px;height:50px}.sheet.ng .btn{background:var(--warn)}.sheet.ng .btn:hover{background:#944a45}@media (prefers-reduced-motion:reduce){.sheet{transition:none}}@media (width<=540px){.quiz,.result{padding-left:21px;padding-right:21px}.sheet-inner{padding:16px 21px 18px}.btn,.sheet-actions .icon-btn{height:46px;min-height:46px}.sheet-actions .icon-btn{width:46px}}.result-title{color:#4e5861;flex-direction:column;flex:1;align-items:center;font-size:13px;display:flex}.result-title small{color:#87909b;font-size:11px}.result-hero{flex-direction:column;align-items:center;gap:28px;padding:24px 0 8px;display:flex}.ring-score{width:156px;height:156px;position:relative}.ring-score svg{width:100%;height:100%}.ring-bg{fill:none;stroke:var(--soft);stroke-width:8px}.ring-fg{fill:none;stroke:var(--accent);stroke-width:8px;stroke-linecap:round;transition:stroke-dasharray .6s ease-out}.ring-text{font-variant-numeric:tabular-nums;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.ring-text strong{letter-spacing:-.045em;color:var(--ink);font-size:40px;font-weight:500;line-height:1}.ring-text span{color:var(--muted);align-self:flex-end;margin-bottom:62px;margin-left:2px;font-size:15px}.meters{gap:14px;width:100%;display:grid}.meter{grid-template-columns:96px 1fr 36px;align-items:center;gap:12px;font-size:12px;display:grid}.meter-label{color:var(--muted)}.meter-bar{background:var(--track);border-radius:5px;height:5px;overflow:hidden}.meter-bar span{background:var(--accent);border-radius:inherit;height:100%;display:block}.meter-num{text-align:right;color:var(--ink);font-variant-numeric:tabular-nums}.all-ok{color:var(--deep);align-items:center;gap:8px;font-size:13px;display:flex}.all-ok svg{width:16px;height:16px}.miss{border-top:1px solid var(--line)}.miss li{border-bottom:1px solid var(--line);align-items:flex-start;gap:12px;padding:14px 3px;display:flex}.miss-body{flex:1;gap:4px;min-width:0;display:grid}.miss-row{flex-wrap:wrap;align-items:baseline;gap:10px;display:flex}.miss-row svg{flex:none;align-self:center;width:14px;height:14px}.miss-row.ok svg{color:var(--accent)}.miss-row.ng svg{color:var(--warn)}.miss-row.ng .miss-kana{color:var(--muted)}.miss-kana{font-size:16px;font-weight:500}.miss-written{font-size:13px}.miss-meaning{color:var(--muted);font-size:11px}.miss-script{color:var(--muted);margin-top:2px;padding-left:24px;font-size:12px;line-height:1.8}.result-actions{padding:14px 0 calc(14px + env(safe-area-inset-bottom));background:linear-gradient(to top, var(--paper) 75%, #f6f4ef00);grid-template-columns:1fr 1fr;gap:12px;margin-top:28px;display:grid;position:sticky;bottom:0}.test-card{background:var(--white);border:1px solid var(--line);border-radius:13px;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;padding:16px 16px 16px 20px;display:flex}.test-card-text{flex-direction:column;gap:3px;min-width:0;display:flex}.test-card-title{font-size:14px;font-weight:500}.test-card-sub{color:var(--muted);font-variant-numeric:tabular-nums;font-size:11px}.test-card .btn:disabled{background:var(--track);color:var(--faint)}.dev-skip{color:#8b805c;padding:8px 0;font-size:11px;text-decoration:underline}.cat.is-weak{border-color:#a8b1d9}.cat.is-weak .cat-soon{color:var(--accent)}.cat-soon.is-done{color:var(--deep);background:var(--accent-soft);border-radius:20px;padding:3px 8px}.test-run{padding-bottom:40px}.test-bar{background:#dfe2df;border-radius:5px;flex:1;height:3px;overflow:hidden}.test-bar span{background:#c5cbef;height:100%;transition:width .2s;display:block}.levels{border-top:1px solid var(--line);margin-top:16px}.level{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;min-height:53px;padding:13px 3px;display:flex}.level-name{font-size:13px}.level-tag{background:var(--track);color:var(--muted);border-radius:20px;padding:3px 10px;font-size:11px}.level.is-weak .level-tag{background:var(--warn-soft);color:var(--warn)}.level.is-strong .level-tag{background:var(--accent-soft);color:var(--deep)}.teacher{color:var(--muted);margin-top:28px;font-size:12px}.teacher summary{cursor:pointer;padding:8px 0}.teacher dl{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px 16px;margin:8px 0 0;display:grid}.teacher dl div{justify-content:space-between;gap:8px;display:flex}.teacher dt{color:var(--muted)}.teacher dd{color:var(--ink);font-variant-numeric:tabular-nums;margin:0}.result:has(.teacher) .result-actions{grid-template-columns:1fr}.result-actions:has(>:only-child){grid-template-columns:1fr}.enough{color:var(--deep);text-align:center;margin-top:24px;font-size:12px}.sheet-actions .btn.compare{flex:0 auto;font-size:13px}.sheet .btn.compare,.sheet.ng .btn.compare{background:var(--white);color:var(--ink)}.sheet .btn.compare:hover{background:#f4f5f2}.test-links{gap:14px;margin:-8px 0 20px 4px;display:flex}.test-links button{color:var(--muted);text-underline-offset:3px;padding:4px 0;font-size:11px;text-decoration:underline}.gate{flex-direction:column;gap:20px;max-width:400px;margin:0 auto;padding:56px 28px 30px;display:flex}.gate-form{flex-direction:column;gap:16px;display:flex}.field{color:var(--muted);flex-direction:column;gap:6px;font-size:12px;display:flex}.input{border:1px solid var(--line);background:var(--white);min-height:50px;color:var(--ink);font:inherit;border-radius:13px;padding:0 16px;font-size:16px;transition:border-color .18s}.input:focus{border-color:#a8b1d9;outline:none}.input:focus-visible{outline-offset:2px;outline:3px solid #7081ed}.gate-error{min-height:18px;color:var(--warn);margin-top:-4px;font-size:12px}.gate .btn:disabled{background:var(--track);color:var(--faint)}.gate-links{justify-content:center;gap:18px;margin-top:4px;display:flex}.gate-links a{color:var(--muted);text-underline-offset:3px;padding:4px 0;font-size:11px;text-decoration:underline}.gate-text{text-align:center;color:var(--ink);font-size:14px;line-height:1.9}.unsendable{color:var(--warn);margin:0 0 12px 4px;font-size:11px}.set-section .unsendable{margin:8px 0 0 3px}
