/* The phone layout stays full width; wide screens gain a persistent left navigation. */
html{color-scheme:light dark;scroll-padding-top:90px}
#diantu-preview{padding:0}
#diantu-mobile{border:0;border-radius:0;max-width:none;min-height:100dvh;padding-bottom:env(safe-area-inset-bottom)}
#diantu-mobile .dt-header{padding-top:max(18px,env(safe-area-inset-top));padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
#diantu-mobile .dt-nav{position:sticky;top:0;z-index:10;background:var(--dt-bg);padding-top:6px}
#diantu-mobile main{min-width:0;max-width:100%;padding-bottom:32px}
#diantu-mobile button,#diantu-mobile input,#diantu-mobile select,#diantu-mobile summary{min-height:44px}
#diantu-mobile input,#diantu-mobile select{font-size:16px}
#diantu-mobile .dt-membership{font-size:13px;display:inline-flex;align-items:center;min-height:44px;text-decoration:none;font-weight:600}
#diantu-mobile .dt-plan-controls select,#diantu-mobile .dt-province-group .dt-category-select{font-size:16px}
#diantu-mobile .dt-controls{gap:10px;align-items:end}
#diantu-mobile .dt-controls label{min-width:0;max-width:100%;overflow-wrap:anywhere}
#diantu-mobile .dt-controls select{width:100%;max-width:100%}
#diantu-mobile .dt-switch button{flex:0 1 auto;white-space:normal}
#diantu-mobile .dt-chart{width:100%;height:auto;max-height:350px}
#diantu-mobile .dt-job,#diantu-mobile .dt-plan,#diantu-mobile .dt-result{min-width:0;overflow-wrap:anywhere}
#diantu-mobile .dt-result-top>div:first-child{min-width:0}
#diantu-mobile .dt-result-count{font-size:22px}
#diantu-mobile .dt-org-group summary,#diantu-mobile .dt-province-group summary{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer}
#diantu-mobile summary::before{content:'▸';color:var(--dt-green);flex:0 0 auto}
#diantu-mobile details[open]>summary::before{content:'▾'}
#diantu-mobile .dt-org-group summary span,#diantu-mobile .dt-province-group summary span{float:none;flex-shrink:0;font-size:12px}
#diantu-mobile .dt-table-wrap{max-width:100%;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
#diantu-mobile .dt-footer{border-top:1px solid var(--dt-line);padding:20px 16px;font-size:12px;color:var(--dt-muted);line-height:1.8}
#diantu-mobile .dt-footer a{color:var(--dt-green);display:inline-block;padding:6px 8px 6px 0}
#diantu-mobile .dt-footer p{margin:0}
#diantu-mobile .dt-version-note{font-size:11px}
#diantu-mobile a:focus-visible,#diantu-mobile button:focus-visible,#diantu-mobile input:focus-visible,#diantu-mobile select:focus-visible,#diantu-mobile summary:focus-visible{outline:3px solid var(--dt-blue);outline-offset:3px}
#diantu-mobile .dt-update{display:flex;gap:12px;align-items:center;justify-content:center;padding:10px;background:var(--dt-soft);grid-column:1/-1}
@media(max-width:374px){
 #diantu-mobile main{padding:16px 12px 28px}
 #diantu-mobile .dt-header{padding-left:12px;padding-right:12px;gap:8px}
 #diantu-mobile .dt-pair{gap:10px;font-size:12px}
 #diantu-mobile .dt-pair b{font-size:16px}
 #diantu-mobile .dt-form{gap:10px}
 #diantu-mobile .dt-result-top{gap:8px}
 #diantu-mobile .dt-result-count{font-size:20px}
 #diantu-mobile .dt-pages{flex-wrap:wrap}
 #diantu-mobile th,#diantu-mobile td{padding:8px 5px}
}
@media(min-width:600px) and (max-width:899px){
 #diantu-mobile main{max-width:740px;margin:auto;padding:28px}
 #diantu-mobile .dt-header,#diantu-mobile .dt-nav,#diantu-mobile .dt-footer{padding-left:28px;padding-right:28px}
 #diantu-mobile .dt-nav button{font-size:14px}
}
@media(min-width:900px){
 body{background:light-dark(#f4f7f5,#111713)}
 #diantu-preview{padding:28px}
 #diantu-mobile{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:204px minmax(0,1fr);grid-template-rows:auto 1fr auto;border:1px solid var(--dt-line);border-radius:16px;overflow:visible;min-height:calc(100vh - 56px)}
 #diantu-mobile .dt-header{grid-column:1/-1;padding:24px 30px;border-bottom:1px solid var(--dt-line)}
 #diantu-mobile .dt-brand b{font-size:26px}
 #diantu-mobile .dt-brand div>span{font-size:13px}
 #diantu-mobile .dt-year{font-size:13px}
 #diantu-mobile .dt-nav{grid-column:1;grid-row:2;display:flex;flex-direction:column;gap:10px;padding:24px 16px;border-bottom:0;border-right:1px solid var(--dt-line);align-self:start;position:sticky;top:20px}
 #diantu-mobile .dt-nav button{flex-direction:row;gap:12px;padding:14px 16px;font-size:16px;justify-content:flex-start}
 #diantu-mobile main{grid-column:2;grid-row:2;padding:28px 36px 40px}
 #diantu-mobile h1{font-size:30px;margin-top:10px}
 #diantu-mobile h2{font-size:20px}
 #diantu-mobile .dt-sub{font-size:14px}
 #diantu-mobile .dt-search{max-width:640px}
 #diantu-mobile .dt-hero{padding:20px 24px;max-width:640px}
 #diantu-mobile .dt-number{font-size:44px}
 #diantu-mobile .dt-controls{display:flex;flex-wrap:wrap}
 #diantu-mobile .dt-controls label{min-width:150px}
 #diantu-mobile .dt-plan-controls label{display:flex;flex-direction:column;align-items:stretch;max-width:100%;width:310px}
 #diantu-mobile .dt-form{grid-template-columns:repeat(3,minmax(0,1fr));max-width:800px}
 #diantu-mobile .dt-form .dt-full{grid-column:auto;align-self:end}
 #diantu-mobile .dt-switch button{font-size:14px;padding:9px 16px}
 #diantu-mobile table{font-size:14px}
 #diantu-mobile th,#diantu-mobile td{padding:10px 12px}
 #diantu-mobile .dt-chart{max-width:800px}
 #diantu-mobile .dt-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
 #diantu-mobile .dt-job-line,#diantu-mobile .dt-result p,#diantu-mobile .dt-gender{font-size:14px}
 #diantu-mobile .dt-footer{grid-column:1/-1;padding:18px 30px}
}
@supports not (color:light-dark(white,black)){
 html{color-scheme:light}body{background:#f4f7f5}
 #diantu-mobile{--dt-bg:#fff;--dt-paper:#f4f7f5;--dt-text:#18251f;--dt-muted:#53665c;--dt-green:#126c45;--dt-soft:#e8f3ed;--dt-line:#d7e1db;--dt-grid:#697a70;--dt-orange:#a95616;--dt-blue:#386bb2;--dt-selected:#126c45;--dt-on:#fff}
}
/* Keep filter labels above their controls, including narrow phone screens. */
#diantu-mobile .dt-controls label{display:flex;flex-direction:column;align-items:stretch;flex:1 1 130px;gap:5px}
#diantu-mobile .dt-plan-controls label{width:auto;flex-basis:100%}
@media(min-width:900px){#diantu-mobile .dt-controls label{flex:0 1 240px}#diantu-mobile .dt-plan-controls label{flex-basis:310px}}
/* WebKit native select controls ignore minimum height until their appearance is reset. */
#diantu-mobile select{-webkit-appearance:none;appearance:none;min-height:44px;height:44px;padding:8px 32px 8px 10px;border:1px solid var(--dt-line);border-radius:8px;background-color:var(--dt-bg);background-image:linear-gradient(45deg,transparent 50%,var(--dt-muted) 50%),linear-gradient(135deg,var(--dt-muted) 50%,transparent 50%);background-position:calc(100% - 16px) 19px,calc(100% - 11px) 19px;background-size:5px 5px;background-repeat:no-repeat}
@media(max-width:899px){#diantu-mobile #rec-form label.dt-subjects{grid-column:1/-1;order:5}#diantu-mobile #rec-form label.dt-gender-field{order:4}#diantu-mobile #rec-form .dt-full{order:6}}
