@charset "UTF-8";
/* Locally hosted, open-license Noto Sans SC avoids decorative device theme fonts. */
@font-face {
  font-family:"Practice Sans";
  src:url("assets/practice-sans.woff2") format("woff2");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
body { font-family:"Practice Sans","PingFang SC","Microsoft YaHei",sans-serif; }
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; }

@media(max-width:760px) {
  .shell { padding:0 16px; padding-bottom:env(safe-area-inset-bottom); }
  .topbar { padding:16px 0 12px; gap:12px; }
  .brand { font-size:17px; }
  .brand small { display:none; }
  .brand-icon { width:34px; height:36px; font-size:23px; }
  .topbar>#settings { min-height:44px; font-size:14px; }
  .topbar nav { gap:8px; padding-top:12px; }
  .topbar nav button.glass-surface { min-width:0; min-height:44px; padding:9px 4px; font-size:14px; }
  .intro { padding:24px 0 20px; }
  .intro .eyebrow { display:none; }
  .intro h1 { font-size:clamp(21px,5.8vw,27px); line-height:1.5; margin:0 0 10px; }
  .intro p,.page-heading p { font-size:14px; line-height:1.8; }
  .practice-toolbar { gap:10px; flex-wrap:wrap; margin-bottom:12px; }
  .select-label { gap:8px; font-size:14px; min-width:0; }
  .select-label select { font-size:16px; max-width:min(190px,52vw); padding:9px 12px; min-height:44px; }
  .pool-count { font-size:12px; white-space:normal; }
  .topic-card { height:204px; padding:16px; }
  .card-tag { font-size:13px; letter-spacing:0; margin-bottom:10px; }
  .topic-card h2 { font-size:30px; line-height:1.4; max-height:80px; }
  .topic-card h2.long { font-size:24px; max-height:72px; }
  .topic-card p { font-size:14px; line-height:1.65; margin-top:12px; flex-shrink:0; }
  .card-number { font-size:120px; bottom:-28px; }
  .draw-bar { gap:10px; margin-top:14px; }
  .draw-bar .primary { width:100%; min-height:48px; font-size:16px; padding:11px 20px; }
  .draw-bar>span { width:100%; font-size:13px; text-align:center; }
  #resume-draw,#cancel-draw { min-height:44px; font-size:14px; }
  .timer-panel { margin-top:18px; padding:18px 12px; }
  .phase-line { font-size:14px; }
  .clock { font-size:clamp(58px,17vw,76px); letter-spacing:1px; margin:10px 0 8px; }
  .timer-hint { font-size:14px; min-height:24px; }
  .timer-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:16px; }
  .timer-actions button { min-width:0; min-height:46px; padding:10px 4px; font-size:14px; }
  .stage-steps { gap:7px; font-size:11px; margin-top:18px; flex-wrap:wrap; }
  .stage-steps i { width:10px; }
  .complete-task { padding:16px; align-items:flex-start; }
  .complete-task input { margin-top:5px; }
  .complete-task b { font-size:15px; }
  .complete-task small { font-size:13px; line-height:1.8; }
  .reference summary { padding:14px; font-size:14px; }
  .reference summary span { float:none; display:block; font-size:12px; margin-top:5px; }
  .reference-body { padding:0 16px 20px; font-size:15px; }
  .reference-body h3 { font-size:15px; }
  .reference-body small,.source-line,.reference-links { font-size:12px; }
  .sound-bar { gap:12px 16px; font-size:14px; margin-top:20px; }
  .sound-bar label { min-height:44px; }
  .sound-bar input[type=checkbox] { width:18px; height:18px; }
  .sound-bar small { width:100%; font-size:12px; text-align:center; }
  .sound-bar .link { min-height:44px; font-size:14px; }
  .page-heading { padding:26px 0 22px; }
  .page-heading h1 { font-size:27px; }
  .panel { padding:16px; }
  input,select,textarea { font-size:16px; min-height:44px; }
  input[type=checkbox],input[type=range] { min-height:0; }
  .library-tools { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .library-tools input[type=search],.library-tools select { grid-column:1/-1; width:100%; max-width:100%; }
  .library-tools button,.file-button { min-height:44px; font-size:14px; padding:10px; text-align:center; }
  .library-main .library-grid { grid-template-columns:1fr; }
  .library-card { padding:18px; }
  .library-card p { font-size:14px; }
  .library-card .eyebrow,.library-count { font-size:12px; }
  .library-card-bottom { font-size:12px; flex-wrap:wrap; }
  .library-card-bottom button.glass-surface.link { min-height:44px; font-size:14px; margin-left:4px; }
  .direction-panel h3 { font-size:16px; }
  .direction-modes button,.direction-form button,.book-bank-action { min-height:46px; font-size:15px; }
  .direction-presets button { min-height:44px; padding:8px 12px; font-size:13px; }
  .direction-result,.progress-row>div:first-child { font-size:14px; }
  .direction-result small,.category-progress .section-title span { font-size:12px; }
  .direction-result button.glass-surface.link,.progress-actions button.glass-surface.link { min-height:44px; font-size:13px; }
  .calendar-head h2 { font-size:18px; }
  .calendar-head button { min-height:44px; min-width:40px; }
  .calendar-grid { gap:3px; }
  .weekdays { font-size:13px; }
  .calendar-day { min-height:54px; font-size:14px; }
  .calendar-legend { font-size:12px; line-height:1.8; }
  .calendar-legend button.glass-surface.link { min-height:44px; font-size:13px; }
  .day-tasks label,.day-check { min-height:44px; font-size:15px; }
  .day-tasks small,.day-panel .small,.day-panel .muted { font-size:13px; }
  .emoji-picker { gap:6px; }
  .emoji-picker button.glass-surface { min-width:0; padding:10px 2px; font-size:24px; }
  .emoji-picker small { font-size:10px; }
  .section-title { flex-wrap:wrap; align-items:flex-start; }
  .section-title h2 { font-size:21px; }
  .section-title>span,.mini-date { font-size:12px; }
  .collection-grid { grid-template-columns:1fr; }
  .collected-card h3 { font-size:24px; }
  .collected-card p,.collected-card>small { font-size:13px; }
  .goal-panel h2 { font-size:24px; }
  .form-field,.setting-check,.goal-stats,.small { font-size:14px; }
  .goal-form button { min-height:48px; font-size:15px; }
  .daily-quote { padding:22px 16px; margin-top:26px; }
  .daily-quote>span,.daily-quote small { font-size:12px; }
  .daily-quote p { font-size:22px; line-height:1.8; }
  .local-note { font-size:12px; line-height:2; }
  .local-note button.glass-surface.link { min-height:44px; font-size:13px; }
  .modal { padding:12px; }
  .modal-card { padding:20px 16px; max-height:calc(100dvh - 24px); }
  .modal-heading { gap:12px; }
  .icon-button { min-width:44px; min-height:44px; }
  .form-row { flex-wrap:wrap; }
  .form-row>* { flex-basis:180px; }
}
