/* v0.4: isolated responsive layer; no change to course/payment permissions. */
.mobile-nav{display:none}
#mobile-more{width:min(94vw,480px);max-height:85vh;max-height:85dvh;overflow:auto;border:1px solid var(--line);border-radius:16px;padding:22px;color:var(--ink);background:#fff}
#mobile-more:not([open]){display:none}
#mobile-more::backdrop{background:rgb(14 22 18 / .55)}
.more-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}
.more-heading h2{margin:0}.more-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:22px}
.more-links a{display:flex;align-items:center;gap:10px;min-height:52px;padding:12px;border:1px solid var(--line);border-radius:8px;color:var(--ink)}
.more-links a[aria-current]{background:var(--gold-light);border-color:var(--gold)}
.filter-toggle,.filter-search-submit,.filter-chips,.card-details-toggle{display:none}
.filter-body{display:contents}.return-list{display:inline-flex;align-items:center;margin-bottom:16px;min-height:44px}
.payment-details{border:0;padding:0;margin:0}.payment-details>summary{display:none}.payment-details>.payment-content{display:block}
.table-scroll{max-width:100%}
/* Keyboard focus remains visible without a fixed submit bar. */
body.keyboard-open .mobile-nav{display:none}
@media (pointer:coarse){
 .button,.button.small,.tabs a,.logout,summary{min-height:48px}
 .button,.tabs a{display:inline-flex;align-items:center;justify-content:center}
 .tabs{flex-wrap:wrap}.inline{gap:12px}.inline form{gap:12px;flex-wrap:wrap}
 .field input,.field select,.field textarea{font-size:16px;min-height:48px}
 input[type=checkbox],input[type=radio]{width:22px;height:22px;flex-shrink:0;accent-color:var(--gold)}
 .check{min-height:48px;gap:12px}summary{padding-block:10px}
 .button.danger{margin-inline-start:12px}
}
@media (min-width:768px) and (max-width:1366px) and (pointer:coarse){
 .sidebar{width:172px;overflow-y:auto;overscroll-behavior:contain}
 .sidebar .brand{padding:24px 15px}.sidebar .brand span{font-size:27px}.sidebar .brand small{font-size:8px;letter-spacing:.1em}
 .sidebar nav{margin-top:0}.nav-link{padding:12px 14px;gap:10px;font-size:13px;min-height:50px}
 .sidebar-bottom{margin:18px 16px}.workspace{margin-left:172px}
 main{padding:24px}.topbar{padding:0 24px}.panel{padding:20px}
 .split-even{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
 .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metrics{grid-template-columns:repeat(4,minmax(0,1fr))}
 .metric{padding:14px}.metric strong{font-size:27px}.metric span{font-size:13px}
 .toolbar .field{min-width:145px;flex:1}.toolbar input{max-width:none}
 .panel,.field,.course-card,.split>*{min-width:0}h1{font-size:30px}
 .wide-table{min-width:640px;border-collapse:separate;border-spacing:0}
 .wide-table tr>:first-child{position:sticky;left:0;z-index:1;background:#fff;min-width:110px;max-width:170px;box-shadow:1px 0 var(--line)}
 .wide-table tr>th:first-child{background:#f6f7f8}.wide-table .ranking-self>:first-child{background:#faf2df}
}
@media (max-width:767px){
 html{scroll-padding-block:20px 105px}body{overflow-wrap:anywhere}body.menu-open{overflow:hidden}
 .sidebar{display:none}.workspace{margin-left:0}
 main{padding:22px 16px calc(96px + env(safe-area-inset-bottom,0px));min-width:0}
 .topbar{height:auto;min-height:58px;padding:8px 16px;gap:12px}.top-note{display:none}.topbar b{padding:0 6px}
 #menu-toggle{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;font-size:23px;color:var(--ink);text-decoration:none}
 .mobile-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;z-index:30;inset:auto 0 0;background:#fff;border-top:1px solid #d6dcd8;box-shadow:0 -4px 16px #17201808;padding:6px max(6px,env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(6px,env(safe-area-inset-left,0px))}
 .mobile-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:56px;border-radius:9px;color:#65706a;font-size:11px;text-decoration:none;line-height:1.4}
 .mobile-nav a[aria-current]{background:#f5eedf;color:#70551e;font-weight:700}.mobile-nav .icon{width:22px;height:22px}.more-icon{height:22px;font-size:18px;line-height:16px;letter-spacing:2px}
 #mobile-more{margin:auto auto 0;width:100%;max-width:100%;border-radius:18px 18px 0 0;padding:20px 18px calc(24px + env(safe-area-inset-bottom,0px))}
 .more-links a{font-size:14px}.more-links{gap:8px}.more-heading .button{min-width:84px}
 h1{font-size:27px}h2{font-size:21px}.heading{margin-bottom:20px}
 .panel{padding:16px;margin-bottom:18px;border-radius:10px;min-width:0}.panel>*{max-width:100%}
 .split,.split-even,.form-grid,.course-list{grid-template-columns:minmax(0,1fr);gap:16px}.split{gap:0}
 .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.metric{padding:14px;border-radius:8px}.metric strong{font-size:27px}
 .course-card{padding:18px;min-width:0}.course-card .course-top{flex-wrap:wrap}
 .field{min-width:0;font-size:14px}.field input,.field select,.field textarea,input.cell{font-size:16px;min-height:48px;max-width:100%;scroll-margin-block:24px}
 input[type=file]{font-size:14px}.button,.button.small{min-height:48px;padding:11px 15px;font-size:14px;white-space:normal;text-align:center}
 input[type=checkbox],input[type=radio]{width:22px;height:22px;flex-shrink:0;accent-color:var(--gold)}
 .check{gap:12px;min-height:48px;align-items:center}
 .inline{gap:12px;align-items:center}.inline form{flex-wrap:wrap;gap:12px;max-width:100%}.inline select{min-height:48px;max-width:100%;font-size:16px}
 .inline .field{flex:1;min-width:130px}.inline form .button.danger{flex-basis:100%;margin-top:12px}.button.danger{margin-inline-start:0;margin-block:8px}
 .tabs{display:flex;flex-wrap:wrap;gap:8px}.tabs a{min-height:48px;display:inline-flex;align-items:center;padding:10px 12px;font-size:14px}
 .toolbar{gap:10px;align-items:end}.toolbar .field{min-width:0;flex:1 1 100%}.toolbar input{max-width:none}
 nav[aria-label="期數導覽"]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 nav[aria-label="期數導覽"] .button{width:100%}
 .responsive-filter{display:flex;flex-wrap:wrap;gap:10px}
 .responsive-filter>.field{flex:1 1 calc(100% - 90px)}
 .filter-toggle,.filter-search-submit{display:inline-flex}
 .filter-body{display:none;flex:1 1 100%;padding:16px;background:#f7f8f6;border:1px solid var(--line);border-radius:10px}
 .filter-body.is-open{display:flex;flex-wrap:wrap;gap:14px}.filter-body>.field{flex:1 1 100%}
 .filter-chips{display:flex;flex-wrap:wrap;gap:8px;flex-basis:100%}
 .filter-chip{display:inline-flex;align-items:center;min-height:44px;border:1px solid #dfd3bb;background:#faf6ed;padding:7px 11px;border-radius:20px;color:#70551e;font-size:12px}
 .filter-chips:empty{display:none}
 .table-scroll{overflow:auto;overscroll-behavior-x:contain;margin-block:12px;max-width:100%}
 th,td{padding:12px 10px;white-space:normal}
 .wide-table{min-width:620px;border-collapse:separate;border-spacing:0}
 .wide-table tr>:first-child{position:sticky;left:0;z-index:1;background:#fff;min-width:100px;max-width:145px;box-shadow:1px 0 #d8ded9}
 .wide-table tr>th:first-child{background:#f6f7f8}.wide-table .ranking-self>:first-child{background:#faf2df}
 .compact-ranking{table-layout:fixed;font-size:13px}.compact-ranking th:first-child{width:18%}.compact-ranking th:last-child{width:36%}
 .compact-ranking td,.compact-ranking th{padding:12px 7px;overflow-wrap:anywhere;white-space:normal}
 .student-cards,.student-cards tbody{display:block;width:100%}
 .student-cards .table-head{display:none}
 .student-cards tr:not(.table-head){display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;border:1px solid var(--line);border-radius:10px;padding:14px;margin-bottom:12px}
 .student-cards td{display:block;padding:0;border:0;min-width:0;white-space:normal;position:static!important}
 .student-cards td:nth-child(1){grid-column:1;grid-row:1;align-self:start;padding-top:4px}
 .student-cards td:nth-child(2){grid-column:2;font-size:16px;font-weight:600}
 .student-cards td:nth-child(2) small{font-size:12px;font-weight:400}
 .student-cards td:nth-child(3){display:none;grid-column:2;font-size:13px;color:var(--muted)}
 .student-cards tr.is-expanded td:nth-child(3){display:block}
 .student-cards td:nth-child(3)::before{content:'學校：'}
 .student-cards td:nth-child(4),.student-cards td:nth-child(5){grid-column:2}
 .student-cards td:nth-child(5){display:flex;flex-wrap:wrap;gap:10px}
 .card-details-toggle{display:inline-flex}
 .payment-details{margin-top:14px;border-top:1px solid var(--line);padding-top:10px}
 .payment-details>summary{display:list-item;min-height:48px;padding:10px 4px}
 .payment-details:not([open])>.payment-content{display:none}
 .payment-content>.inline{margin-block:16px}
 .auth-layout{grid-template-columns:1fr}.auth-main{padding:0}.auth-brand{padding:24px;min-height:100px}.auth-brand>p,.auth-brand div:nth-child(2){display:none}
 .auth-brand .brand{padding:0}.auth-form{padding:28px 22px}.auth-form h1{font-size:27px}
 summary{min-height:48px;padding-block:10px}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
