/* Trí Lữ THPT learner design recovery v1.
   R3 washi direction, canonical tokens, one open study surface. */
body.thpt-card-canary{
  min-height:100vh;
  background:
    linear-gradient(100deg,rgba(247,244,235,.60),rgba(247,244,235,.89) 46%,rgba(247,244,235,.72)),
    url('/assets/learner-design/wave-sakura.png') left top/cover scroll no-repeat;
  color:var(--tl-ink);
  font-size:18px;
}
html[data-mode=dark] body.thpt-card-canary,
html[data-theme=dark] body.thpt-card-canary{
  background:
    linear-gradient(100deg,rgba(5,18,30,.79),rgba(5,18,30,.92) 48%,rgba(5,18,30,.79)),
    url('/assets/learner-design/wave-sakura.png') left top/cover scroll no-repeat;
}
@font-face{font-family:BrandScript;src:url('/assets/learner-design/brand-script.woff2') format('woff2');font-weight:700;font-display:swap}
.thpt-card-canary .study-header{
  width:min(1120px,calc(100% - 32px));margin:16px auto 0;padding:10px 14px;
  background:var(--tl-glass);border:1px solid var(--tl-glass-border);border-radius:18px;
  backdrop-filter:blur(var(--tl-blur));box-shadow:0 12px 34px rgba(23,40,51,.08);
}
.thpt-card-canary .study-header .brand{
  display:inline-flex;align-items:center;gap:12px;color:var(--tl-ink);font-size:0
}
.thpt-card-canary .study-header .brand::before{content:'智旅';flex:0 0 40px;width:40px;height:42px;box-sizing:border-box;padding:5px 9px 4px;background:#ad665b;color:#fff9ed;border-radius:3px;box-shadow:inset 0 0 0 3px #ad665b,inset 0 0 0 4px rgba(255,247,230,.48);writing-mode:vertical-rl;white-space:nowrap;font:17px/1 var(--tl-font-jp);letter-spacing:1px;transform:rotate(-2deg)}
.thpt-card-canary .study-header .brand span{display:block;position:relative;padding-bottom:10px;font:700 33px/1.18 BrandScript,Georgia,serif;letter-spacing:0}
.thpt-card-canary .study-header .brand span::after{content:'NIHONGO';position:absolute;left:3px;bottom:0;font:600 8px/1 var(--tl-font-ui);letter-spacing:.29em;color:var(--tl-ink-soft)}
.thpt-card-canary main{max-width:1000px;padding:24px 24px 56px}
.thpt-card-canary [data-thpt-course-return]{margin:2px 0 14px;padding-left:8px}
.thpt-card-canary #overview,.thpt-card-canary #session{
  position:relative;overflow:hidden;padding:clamp(24px,5vw,54px);
  background:linear-gradient(135deg,var(--tl-glass-strong),var(--tl-paper));
  border:1px solid var(--tl-glass-border);border-radius:var(--tl-radius-surface);
  box-shadow:var(--tl-shadow);backdrop-filter:blur(var(--tl-blur));
}
.thpt-card-canary h1{font-family:var(--tl-font-jp);font-weight:600;letter-spacing:-.025em}
.thpt-card-canary h2{font-size:clamp(25px,3.5vw,34px);line-height:1.3}
.thpt-card-canary .eyebrow{
  font:700 12px/1.4 var(--tl-font-mono);letter-spacing:.13em;color:var(--tl-seal)
}
.thpt-card-canary .intro{
  font-size:clamp(18px,2.4vw,21px);line-height:1.65;color:var(--tl-ink-soft)
}
.thpt-card-canary button,.thpt-card-canary select{
  min-height:44px;background:color-mix(in srgb,var(--tl-paper-soft) 76%,transparent);
  border-color:color-mix(in srgb,var(--tl-ink) 20%,transparent);font-weight:600;
}
.thpt-card-canary button:hover{
  border-color:var(--tl-focus);
  background:color-mix(in srgb,var(--tl-paper) 86%,var(--tl-focus) 4%);
}
.thpt-card-canary .primary{
  min-height:50px;background:var(--tl-ink);color:#fffaf0;border-color:transparent;
  box-shadow:0 8px 24px color-mix(in srgb,var(--tl-ink) 16%,transparent);
}
.thpt-card-canary .primary:hover,.thpt-card-canary .primary:focus-visible{
  background:color-mix(in srgb,var(--tl-ink) 88%,var(--tl-focus));color:#fffaf0
}
html[data-mode=dark] .thpt-card-canary .primary,
html[data-theme=dark] .thpt-card-canary .primary{background:var(--tl-seal);color:#172833}
html[data-mode=dark] .thpt-card-canary .primary:hover,
html[data-mode=dark] .thpt-card-canary .primary:focus-visible,
html[data-theme=dark] .thpt-card-canary .primary:hover,
html[data-theme=dark] .thpt-card-canary .primary:focus-visible{
  background:color-mix(in srgb,var(--tl-seal) 88%,white);color:#172833
}
.thpt-card-canary .single-lesson{
  display:grid;grid-template-columns:1.1fr .9fr;gap:0 40px;align-items:start
}
.thpt-card-canary .single-lesson>.eyebrow,
.thpt-card-canary .single-lesson>.lesson-entry-steps,
.thpt-card-canary .single-lesson>.actions,
.thpt-card-canary .single-lesson>.word-pos{grid-column:1}
.thpt-card-canary .single-lesson>.lesson-preview{grid-column:2;grid-row:1/6}
.thpt-card-canary .lesson-preview{
  grid-template-columns:1fr;padding:0 0 0 30px;border:0;
  border-left:1px solid var(--tl-hair);gap:0;
}
.thpt-card-canary .lesson-preview>div{padding:12px 0;border-bottom:1px solid var(--tl-hair)}
.thpt-card-canary .lesson-preview-word{font-size:clamp(28px,3.8vw,42px);line-height:1.45}
.thpt-card-canary .lesson-entry-steps{
  display:grid;gap:8px;padding:20px 0;margin:0;list-style:none;counter-reset:step
}
.thpt-card-canary .lesson-entry-steps li{
  counter-increment:step;padding-left:34px;position:relative
}
.thpt-card-canary .lesson-entry-steps li::before{
  content:'0' counter(step);position:absolute;left:0;color:var(--tl-seal);
  font:600 12px var(--tl-font-mono);
}
.thpt-card-canary .session-heading{align-items:flex-start}
.thpt-card-canary .stage-rail{
  margin:22px 0 6px;border-bottom:1px solid var(--tl-hair);gap:0
}
.thpt-card-canary .stage-rail button{padding-inline:14px;background:transparent}
.thpt-card-canary #card.word-focus-card{
  padding:34px 0 12px;background:transparent;border:0;border-radius:0;box-shadow:none
}
.thpt-card-canary .word-focus-hero-grid{
  display:grid;grid-template-columns:minmax(250px,.85fr) minmax(240px,1fr);
  gap:30px;align-items:center;padding-bottom:28px;border-bottom:1px solid var(--tl-hair);
}
.thpt-card-canary .word-focus-title{
  color:var(--tl-ink);font-family:var(--tl-font-jp);font-weight:500;letter-spacing:.01em
}
.thpt-card-canary .word-meaning{color:var(--tl-focus);font-weight:600}
.thpt-card-canary .chapter{
  display:grid;grid-template-columns:180px 1fr;gap:24px;padding-top:22px;margin-top:0
}
.thpt-card-canary .chapter h3{
  font:700 12px/1.5 var(--tl-font-mono);letter-spacing:.08em;
  text-transform:uppercase;color:var(--tl-seal);
}
.thpt-card-canary .chapter>.vi{grid-column:2}
.thpt-card-canary .jp{font-size:clamp(22px,3vw,29px);line-height:1.9}
.thpt-card-canary .actions{padding-top:2px}
.thpt-card-canary textarea,.thpt-card-canary input[type=text]{
  background:color-mix(in srgb,var(--tl-paper) 78%,transparent);
  border:1px solid var(--tl-hair);box-shadow:inset 0 1px 7px rgba(23,40,51,.06);
  font-size:21px;
}
.thpt-card-canary textarea{min-height:150px;resize:vertical}
.thpt-card-canary textarea::placeholder{font-family:var(--tl-font-ui);font-style:normal;color:var(--tl-ink-soft);opacity:1}
.thpt-card-canary .apply-scaffold{
  margin:14px 0;border-bottom:1px solid var(--tl-hair)
}
.thpt-card-canary .apply-scaffold[open]{padding-bottom:18px}
.thpt-card-canary .apply-save-state{font-size:16px;color:var(--tl-ink-soft);margin-top:-4px}
.thpt-card-canary .apply-save-state[data-saved=false]{color:var(--tl-danger);font-weight:700}
.thpt-card-canary .summary-row{float:none;padding:18px 0;border-bottom:1px solid var(--tl-hair)}
.thpt-card-canary .summary-row-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px
}
.thpt-card-canary .summary-row-head span{float:none;font-size:14px;color:var(--tl-ink-soft)}
.thpt-card-canary .summary-word{
  padding:0;border:0;background:transparent;font:500 27px/1.5 var(--tl-font-jp);color:var(--tl-ink)
}
.thpt-card-canary .summary-transfer{margin:6px 0 10px;white-space:pre-wrap}
.thpt-card-canary .summary-transfer.is-empty{color:var(--tl-ink-soft);font-style:italic}
.thpt-card-canary .summary-edit{min-height:44px;padding:6px 12px;font-size:15px}
.thpt-card-canary .summary-drafts{margin-top:26px;border-top:1px solid var(--tl-hair);border-bottom:1px solid var(--tl-hair)}
.thpt-card-canary .summary-drafts>summary{min-height:56px;display:flex;align-items:center;font-weight:700}
.thpt-card-canary .summary-draft{display:grid;width:100%;gap:6px;padding:16px 0;border:0;border-top:1px solid var(--tl-hair);border-radius:0;background:transparent;text-align:left}
.thpt-card-canary .summary-draft-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.thpt-card-canary .summary-draft-head b{font:500 25px/1.45 var(--tl-font-jp)}
.thpt-card-canary .summary-draft-head small{font:500 14px/1.5 var(--tl-font-ui);color:var(--tl-ink-soft)}
.thpt-card-canary .summary-draft .summary-transfer{margin:0;font-size:16px}
.thpt-card-canary #card:has(#applyInput) .chapter{border-top:0;padding-top:16px}
html[data-mode=dark] .thpt-card-canary #session,html[data-theme=dark] .thpt-card-canary #session{background:linear-gradient(135deg,rgba(8,26,43,.74),rgba(8,26,43,.66))}
html[data-mode=dark] .thpt-card-canary textarea,html[data-theme=dark] .thpt-card-canary textarea{background:rgba(5,18,30,.46);border-color:rgba(210,235,248,.27)}
html[data-mode=dark] .thpt-card-canary .apply-save-state,html[data-theme=dark] .thpt-card-canary .apply-save-state{color:#d6dedf}
html[data-mode=dark] .thpt-card-canary .apply-save-state[data-saved=false],html[data-theme=dark] .thpt-card-canary .apply-save-state[data-saved=false]{color:#ffad9c}
.thpt-card-canary .card-navigation{border-top:1px solid var(--tl-hair);padding-top:16px}
.thpt-card-canary #notice:not(:empty){
  margin:14px 8px;padding:12px 15px;border-left:3px solid var(--tl-seal);background:var(--tl-glass)
}
.thpt-card-canary footer{padding-inline:8px}
.thpt-card-canary dialog{background:var(--tl-glass-strong);backdrop-filter:blur(var(--tl-blur))}
@media(max-width:760px){
  body.thpt-card-canary{background-position:30% top}
  .thpt-card-canary main{padding:18px 16px 42px}
  .thpt-card-canary #overview,.thpt-card-canary #session{padding:24px}
  .thpt-card-canary .single-lesson{display:block}
  .thpt-card-canary .lesson-preview{
    grid-template-columns:repeat(3,minmax(0,1fr));padding:14px 0;
    border-left:0;border-block:1px solid var(--tl-hair)
  }
  .thpt-card-canary .lesson-preview>div{padding:6px 10px;border:0}
  .thpt-card-canary .lesson-preview-word{font-size:26px}
  .thpt-card-canary .word-focus-hero-grid{grid-template-columns:1fr;gap:6px;padding-bottom:20px}
  .thpt-card-canary .chapter{grid-template-columns:1fr;gap:6px}
  .thpt-card-canary .chapter>.vi{grid-column:1}
}
@media(max-width:430px){
  .thpt-card-canary .study-header{width:calc(100% - 20px);margin-top:10px;padding:8px 9px}
  .thpt-card-canary .study-header .brand::before{width:36px;height:39px;flex-basis:36px;font-size:15px;padding-inline:8px}
  .thpt-card-canary .study-header .brand span{display:block;font-size:27px}
  .thpt-card-canary main{padding:12px 10px 34px}
  .thpt-card-canary #overview,.thpt-card-canary #session{padding:20px 18px;border-radius:22px}
  .thpt-card-canary .lesson-preview-meaning{font-size:16px}
  .thpt-card-canary .lesson-entry-steps{padding:16px 0}
  .thpt-card-canary .single-lesson .actions button{min-width:0}
  .thpt-card-canary .session-heading{display:block}
  .thpt-card-canary .session-heading>button{margin-top:12px}
  .thpt-card-canary .stage-rail{margin-inline:-18px;padding-inline:14px}
  .thpt-card-canary .stage-rail button{font-size:16px;padding-inline:10px}
  .thpt-card-canary #card.word-focus-card{padding-top:26px}
  .thpt-card-canary .word-focus-title{font-size:clamp(38px,13vw,52px)!important}
  .thpt-card-canary .actions{display:grid}
  .thpt-card-canary .actions button{width:100%}
  .thpt-card-canary .card-navigation{display:grid;grid-template-columns:1fr auto 1fr}
  .thpt-card-canary .card-navigation button{min-width:0}
  .thpt-card-canary .summary-row-head{align-items:flex-start}
}
@media(prefers-reduced-transparency:reduce){
  .thpt-card-canary #overview,.thpt-card-canary #session,.thpt-card-canary .study-header{
    backdrop-filter:none;background:var(--tl-paper)
  }
}