/* Bencium + UI/UX Pro Max: one adaptive interface across devices. */
html{scroll-padding-top:100px;scroll-padding-bottom:100px;color-scheme:light}body.dark{color-scheme:dark}button,a,input,select{touch-action:manipulation}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.shell,.header-actions,.article-head,.ux-lesson-meta,.access-row{min-width:0}input,select{max-width:100%}.article table{max-width:100%;overflow-wrap:anywhere}.particle-table th,.particle-table td{padding:clamp(6px,1.5vw,12px)}.article h2,.ux-lesson-body h2,.access-row{overflow-wrap:anywhere}.profile-button,.sync-label{min-height:44px}.header-actions #profile-control{display:flex;align-items:center;gap:8px}.profile-button{white-space:nowrap}.sync-label{max-width:140px;line-height:1.3}.note-viewer-close{min-width:44px;min-height:44px}.filter-row input,.filter-row select,.search input,.allow-form input{font-size:16px}.filter-row label{min-width:0}.quiz-actions .button{min-height:48px}
@media(max-width:900px){html{scroll-padding-top:90px;scroll-padding-bottom:100px}body:not(.entry-mode)>aside{padding-top:max(14px,env(safe-area-inset-top));padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}.shell>header{height:auto;min-height:72px;padding:10px 18px;gap:8px}.header-actions{gap:6px}.header-actions #profile-control{display:grid;gap:0}.profile-button{font-size:11px;min-height:44px}.sync-label{font-size:11px;min-height:44px;max-width:135px}.breadcrumb{white-space:normal;line-height:1.4;max-width:125px}.breadcrumb span{margin:0 4px}.icon-button{width:44px;height:44px}.ux-reading-meter{top:0;z-index:30}.shell>main{padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}.filter-row input,.filter-row select,.search input{font-size:16px}.filter-row .button{font-size:13px}.source-link{min-height:44px}.article>section{scroll-margin-top:125px}.ux-reader-tools button,.ux-reader-tools .button,.ux-topic-nav a{font-size:12px}.ux-topic-nav a{line-height:1.5}.access-actions{flex-wrap:wrap;gap:8px}.access-actions .button{font-size:13px}.note-viewer{max-height:calc(100dvh - 24px)}.note-viewer-body img{max-height:calc(100dvh - 180px)}nav{padding-left:max(8px,env(safe-area-inset-left));padding-right:max(8px,env(safe-area-inset-right))}nav a{min-width:0}.login-stage{min-height:100dvh;padding-top:max(24px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom))}.entry-mode .shell>main{padding:0}}
@media(max-width:360px){.filter-row{grid-template-columns:1fr}.header-actions{gap:4px}.breadcrumb{font-size:10px;max-width:82px}.profile-button,.sync-label{font-size:10px}.article>section{padding:22px 17px}.article>section h2{font-size:26px}.lighting-legend>div{grid-template-columns:1fr}.quiz-actions{align-items:stretch;flex-direction:column}.quiz-actions .button{width:100%;flex:auto}.ux-reader-tools>*{flex:1;justify-content:center;text-align:center}.ux-lesson-meta{flex-wrap:wrap}.login-card{padding:28px 20px}.login-card h1{font-size:30px}}
@media(max-width:900px) and (max-height:500px) and (orientation:landscape){body:not(.entry-mode)>aside{padding-top:8px;padding-bottom:8px;min-height:52px}.brand-icon{width:30px;height:32px}.brand small{display:none}.shell>header{min-height:54px;padding-top:4px;padding-bottom:4px}.header-actions #profile-control{display:flex}.sync-label{max-width:160px}.shell>main{padding-top:20px}nav{padding-top:2px;padding-bottom:calc(2px + env(safe-area-inset-bottom))}nav a{min-height:48px;flex-direction:row;gap:8px}nav a span{font-size:11px}.article>section{scroll-margin-top:70px}.login-stage{padding:16px}.login-brand{margin-bottom:16px}.login-card{padding:24px}.note-viewer-body img{max-height:none}.note-viewer-header{padding:8px 12px}}

.stat strong,.ux-ring strong,.quiz-top,progress{font-variant-numeric:tabular-nums}input[aria-invalid=true]{border-color:var(--danger)}.search:focus-within{outline:2px solid var(--focus);outline-offset:3px}input,select,button,a{scroll-margin-block:125px 110px}