/* JLPT method guides — Editorial Study Sheet / Editorial Exam Sheet, token V1. */
@font-face{font-family:"Be Vietnam Pro";src:url('/tra-cuu-fonts/be-vietnam-pro-400-vietnamese.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Be Vietnam Pro";src:url('/tra-cuu-fonts/be-vietnam-pro-600-vietnamese.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
*{box-sizing:border-box}
html{color-scheme:light;background:#e9e4d9;scroll-behavior:auto}
html[data-theme="dark"]{color-scheme:dark;background:#081421}
body.jlpt-guide{margin:0;padding:0 var(--tl-space-4) var(--tl-space-7);color:var(--tl-ink);font-family:var(--tl-font-ui);font-size:var(--tl-text-body);line-height:1.65;overflow-wrap:anywhere}
body.jlpt-guide::before{content:"";position:fixed;z-index:-1;inset:0;background:linear-gradient(rgba(242,237,224,.86),rgba(242,237,224,.91)),var(--guide-scene) center/cover no-repeat;pointer-events:none}
html[data-theme="dark"] body.jlpt-guide::before{background:linear-gradient(rgba(4,17,29,.86),rgba(4,17,29,.93)),var(--guide-scene) center/cover no-repeat}
[hidden]{display:none!important}
a{color:inherit;text-underline-offset:.2em}
button,select,input{font:inherit;color:inherit}
button,select{min-height:var(--tl-control-min);border:1px solid var(--tl-hair);border-radius:var(--tl-radius-control);background:var(--tl-paper);padding:var(--tl-space-2) var(--tl-space-3)}
button{cursor:pointer}
button:hover,a:hover{color:var(--tl-seal)}
select{width:100%;max-width:100%;cursor:pointer}
select option{background:var(--tl-glass-strong);color:var(--tl-ink)}
:focus-visible{outline:3px solid var(--tl-focus);outline-offset:3px}
h1,h2,h3,h4,p,figure{margin:0}
h2,h3,h4{line-height:1.4}
ol,ul{margin:var(--tl-space-3) 0;padding-left:var(--tl-space-5)}
li+li{margin-top:var(--tl-space-3)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.skip-link{position:fixed;z-index:10;left:var(--tl-space-4);top:var(--tl-space-2);transform:translateY(-160%);background:var(--tl-ink);color:var(--tl-paper);padding:var(--tl-space-3)}
.skip-link:focus{transform:none}
.guide-header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--tl-space-4);align-items:center;max-width:1060px;margin:var(--tl-space-4) auto var(--tl-space-3)}
.guide-header h1{font-size:22px;font-weight:600}
.back-link{display:flex;align-items:center;min-height:var(--tl-control-min);padding:var(--tl-space-2) var(--tl-space-3);border-right:1px solid var(--tl-hair);text-decoration:none;font-weight:600}
.settings-trigger{display:grid;place-items:center;min-width:var(--tl-control-min);padding:var(--tl-space-2)}
.settings-fallback{display:flex;align-items:center;min-height:var(--tl-control-min)}
.guide-paper{max-width:1060px;margin:0 auto;padding:var(--tl-space-4) var(--tl-space-5) var(--tl-space-5);border:1px solid var(--tl-glass-border);border-radius:var(--tl-radius-surface);background:var(--tl-paper);box-shadow:var(--tl-shadow);backdrop-filter:blur(var(--tl-blur));-webkit-backdrop-filter:blur(var(--tl-blur))}
.skill-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--tl-space-2);margin-bottom:var(--tl-space-4);border-bottom:1px solid var(--tl-hair)}
.skill-tabs a{display:flex;justify-content:center;align-items:center;min-height:var(--tl-control-min);padding:var(--tl-space-2);text-decoration:none;white-space:nowrap;border-bottom:3px solid transparent;font-weight:600}
.skill-tabs a[aria-selected="true"]{border-color:var(--tl-seal);color:var(--tl-seal)}
.guide-panel+.guide-panel{margin-top:var(--tl-space-7)}
.panel-heading{margin-bottom:var(--tl-space-4);font-size:26px}
.type-tools{display:flex;align-items:center;gap:var(--tl-space-3);margin-bottom:var(--tl-space-3)}
.type-picker{min-width:0;flex:1}
.type-tools>button{flex-shrink:0;background:transparent}
.type-heading{margin-bottom:var(--tl-space-4);font-size:22px}
.guide-type+.guide-type{margin-top:var(--tl-space-7)}
.example-passage figcaption{margin-bottom:var(--tl-space-2);color:var(--tl-ink-soft);font-size:16px}
.passage-text{font-family:var(--tl-font-jp);font-size:var(--tl-text-jp);line-height:1.9;line-break:strict;word-break:normal;overflow-wrap:anywhere}
.passage-text p+p{margin-top:var(--tl-space-3)}
.passage-text p[lang="vi"]{font-family:var(--tl-font-ui);font-size:var(--tl-text-body-large);line-height:1.7}
.passage-text p[lang="vi"] [lang="ja"]{font-family:var(--tl-font-jp);font-size:var(--tl-text-jp)}
.example-form{margin-top:var(--tl-space-5)}
.example-form fieldset{min-width:0;margin:0;padding:0;border:0}
.example-form legend{width:100%;padding:0 0 var(--tl-space-3);font-family:var(--tl-font-jp);font-size:22px;line-height:1.7}
.answer-option{display:flex;gap:var(--tl-space-3);align-items:baseline;min-height:var(--tl-control-min);padding:var(--tl-space-3) var(--tl-space-2);border-top:1px solid var(--tl-hair);cursor:pointer}
.answer-option:last-child{border-bottom:1px solid var(--tl-hair)}
.answer-option:has(input:checked){background:var(--tl-wash)}
.answer-option input{flex-shrink:0;width:20px;height:20px;margin:0;accent-color:var(--tl-seal);align-self:center}
.option-number{flex-shrink:0;font-family:var(--tl-font-mono);font-size:16px;color:var(--tl-ink-soft)}
.answer-option [lang="ja"]{font-family:var(--tl-font-jp);font-size:22px;line-height:1.65}
.primary-action{margin-top:var(--tl-space-4);min-height:var(--tl-control-primary);background:var(--tl-ink);color:var(--tl-paper);font-weight:600}
.primary-action:hover{background:var(--tl-seal);color:var(--tl-paper)}
.answer-status:not(:empty){margin-top:var(--tl-space-3);font-weight:600}
.answer-explanation{margin-top:var(--tl-space-5);padding-left:var(--tl-space-4);border-left:3px solid var(--tl-seal)}
.answer-explanation h4{font-size:18px}
.answer-explanation h4 [lang="ja"]{font-family:var(--tl-font-jp);font-size:22px}
.answer-explanation p{margin-top:var(--tl-space-3)}
.rationale-list{padding-left:var(--tl-space-4)}
.correct-rationale strong{color:var(--tl-success)}
html[data-theme="dark"] .correct-rationale strong{color:var(--tl-focus)}
.detail-source,.settings-source{margin-top:var(--tl-space-6);padding-top:var(--tl-space-5);border-top:1px solid var(--tl-hair)}
.detail-source h3,.settings-source h3{margin:var(--tl-space-5) 0 var(--tl-space-3)}
.detail-source p,.settings-source p{margin:var(--tl-space-3) 0}
.type-footer,.skill-footer{display:flex;align-items:center;flex-wrap:wrap;gap:var(--tl-space-3) var(--tl-space-4);margin-top:var(--tl-space-4)}
.skill-footer{padding-top:var(--tl-space-4);border-top:1px solid var(--tl-hair)}
.skill-footer>a,.text-action{display:inline-flex;align-items:center;min-height:var(--tl-control-min);text-align:left;padding:var(--tl-space-2) 0;border:0;border-radius:0;background:none;text-decoration:underline;text-underline-offset:.2em;color:var(--tl-seal)}
.skill-footer>p{flex-basis:100%;color:var(--tl-ink-soft)}
.inline-action{min-height:var(--tl-control-min);padding:var(--tl-space-2);background:transparent;text-decoration:underline}
.editorial-chapter{padding-top:var(--tl-space-5);margin-top:var(--tl-space-5);border-top:1px solid var(--tl-hair)}
.exam-panel h3{font-size:22px}
.exam-first>ol{margin-top:var(--tl-space-3)}
.open-rows{margin:var(--tl-space-4) 0}
.open-rows>div{display:grid;grid-template-columns:minmax(100px,.3fr) minmax(0,1fr);gap:var(--tl-space-4);padding:var(--tl-space-3) 0;border-top:1px solid var(--tl-hair)}
.open-rows dt{font-weight:600}
.open-rows dd{margin:0}
.open-rows.mistakes>div{grid-template-columns:minmax(160px,.5fr) minmax(0,1fr)}
.timing-table{width:100%;border-collapse:collapse;margin:var(--tl-space-4) 0;text-align:left}
.timing-table caption{text-align:left;margin-bottom:var(--tl-space-3);font-weight:600}
.timing-table th,.timing-table td{border-bottom:1px solid var(--tl-hair);padding:var(--tl-space-3) var(--tl-space-2);vertical-align:top}
.timing-table tbody th{font-weight:400}
.timing-table td:last-child{white-space:nowrap}
.guide-dialog{width:min(760px,calc(100% - 36px));max-height:calc(100dvh - 36px);padding:var(--tl-space-5);border:1px solid var(--tl-glass-border);border-radius:var(--tl-radius-panel);background:var(--tl-glass-strong);color:var(--tl-ink);box-shadow:var(--tl-shadow);backdrop-filter:blur(var(--tl-blur));-webkit-backdrop-filter:blur(var(--tl-blur));overflow:auto;overscroll-behavior:contain}
.guide-dialog::backdrop{background:rgba(5,18,30,.65);backdrop-filter:blur(4px)}
.dialog-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--tl-space-4);margin-bottom:var(--tl-space-4)}
.dialog-heading h2{font-size:24px}
.dialog-heading button{flex-shrink:0}
.dialog-body h3{margin:var(--tl-space-5) 0 var(--tl-space-3)}
.dialog-body p{margin:var(--tl-space-3) 0}
.theme-setting{display:flex;align-items:center;gap:var(--tl-space-4)}
.theme-setting label{font-weight:600}
.theme-setting select{width:auto;flex:1}
.source-links{display:grid;gap:var(--tl-space-2)}
.source-links a{display:flex;align-items:center;justify-content:space-between;gap:var(--tl-space-3);min-height:var(--tl-control-min);padding:var(--tl-space-2) 0;border-bottom:1px solid var(--tl-hair)}
.enhanced-only{display:none}
.is-enhanced .enhanced-only{display:inline-flex}
.is-enhanced .settings-trigger{display:grid}
.is-enhanced .type-tools,.is-enhanced .type-footer{display:flex}
.is-enhanced .no-enhancement,.is-enhanced .detail-source,.is-enhanced main>.settings-source{display:none}
.is-enhanced .panel-heading,.is-enhanced .type-heading{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.is-enhanced .guide-panel,.is-enhanced .guide-type{margin-top:0}
@media(max-width:600px){
 body.jlpt-guide{padding:0 var(--tl-space-3) var(--tl-space-6)}
 .guide-header{gap:var(--tl-space-3);margin-top:var(--tl-space-3)}
 .guide-header h1{font-size:20px}
 .back-link{padding-left:var(--tl-space-2);padding-right:var(--tl-space-3)}
 .guide-paper{padding:var(--tl-space-3) var(--tl-space-4) var(--tl-space-5);border-radius:var(--tl-radius-panel)}
 .skill-tabs{gap:0}
 .skill-tabs a{padding-inline:var(--tl-space-1)}
 .passage-text{font-size:22px;line-height:1.85}
 .answer-option [lang="ja"],.example-form legend{font-size:21px}
 .answer-option{gap:var(--tl-space-2);padding-inline:0}
 .primary-action{width:100%;justify-content:center}
 .open-rows>div,.open-rows.mistakes>div{grid-template-columns:1fr;gap:var(--tl-space-2)}
 .guide-dialog{padding:var(--tl-space-4)}
 .dialog-heading h2{font-size:22px}
}
@media(prefers-reduced-transparency:reduce){.guide-paper,.guide-dialog{background:rgb(250,247,239)}html[data-theme="dark"] .guide-paper,html[data-theme="dark"] .guide-dialog{background:rgb(8,26,43)}}
@media print{body.jlpt-guide{background:white;color:black;padding:0}body.jlpt-guide::before,.guide-header,.skill-tabs,.enhanced-only,.guide-dialog{display:none!important}.guide-paper{max-width:none;border:0;box-shadow:none;background:white;padding:0}.guide-panel[hidden],.guide-type[hidden],.answer-explanation[hidden],.is-enhanced .detail-source,.is-enhanced main>.settings-source{display:block!important}.is-enhanced .panel-heading,.is-enhanced .type-heading{position:static;width:auto;height:auto;clip-path:none;white-space:normal;margin-top:26px}.guide-panel{break-before:page}.answer-option{break-inside:avoid}.settings-source{break-before:page}}