/* Touch layouts. Desktop keeps the original workspace layout. */
.mobile-only,.nav-backdrop,.nav-close,.mobile-task-picker,.mobile-filter-heading,.mobile-library-sort,.mobile-admin-toggle{display:none}
html{scroll-padding-top:76px;-webkit-text-size-adjust:100%}
.modal{display:flex;flex-direction:column;overflow:hidden;max-height:calc(var(--viewport-height,100dvh) - 48px)}
.modal-head,.modal-foot{flex-shrink:0}
.modal-body{overflow:auto;min-height:0;overscroll-behavior:contain}
.modal-backdrop{top:var(--viewport-top,0px);bottom:auto;height:var(--viewport-height,100dvh)}
.modal-foot{flex-wrap:wrap}
.modal-head h2{min-width:0;overflow-wrap:anywhere}
.modal-head .btn{flex-shrink:0}
.image-edit-row>div{min-width:0}
.search-box .field,.search-box .grow{min-width:0}
.editor-toolbar-top{background:var(--card)}

@media(max-width:900px){
  .shell{min-height:100dvh}
  .main{width:100%}
  .mobile-only,.mobile-menu{display:inline-flex}
  .sidebar{display:flex;position:fixed;inset:0 auto 0 0;z-index:81;width:min(300px,86vw);height:100vh;height:100dvh;padding:calc(16px + env(safe-area-inset-top)) 12px calc(12px + env(safe-area-inset-bottom));transform:translateX(-105%);visibility:hidden;pointer-events:none;box-shadow:none;transition:transform .2s ease,visibility .2s}
  .sidebar.open{transform:translateX(0);visibility:visible;pointer-events:auto;box-shadow:12px 0 40px #0003}
  .sidebar .brand{padding-right:40px;min-height:55px;font-size:17px}
  .nav-close{display:inline-flex;position:absolute;right:10px;top:calc(14px + env(safe-area-inset-top))}
  .sidebar .nav a{min-height:46px;font-size:14px;padding:11px 14px}
  .sidebar .nav{min-height:0;overscroll-behavior:contain}
  .sidebar-foot .btn{min-width:44px;min-height:44px}
  .nav-backdrop:not([hidden]){display:block;position:fixed;inset:0;z-index:80;border:0;border-radius:0;background:#11182780;backdrop-filter:blur(2px)}
  .topbar{position:sticky;top:0;z-index:30;height:auto;min-height:60px;padding:calc(6px + env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) 6px max(12px,env(safe-area-inset-left));gap:8px}
  .topbar>.row{min-width:0;gap:4px}
  .topbar-right{gap:2px;flex-shrink:0}
  .topbar-right small{display:none}
  .topbar-right .avatar{width:40px;height:40px}
  .breadcrumb{font-size:13px;min-width:0;gap:6px}
  .breadcrumb strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .content{padding:20px max(14px,env(safe-area-inset-right)) calc(28px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));max-width:760px}
  .btn,.btn.small,.btn.icon-only,.page-title .btn,.editor-toolbar .btn,.selection-bar .btn,.task-footer .btn{min-height:44px;font-size:13px;padding:9px 12px}
  .btn.icon-only{min-width:44px;padding:10px}
  .text-btn{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
  .tab,.task-list-head .tab{min-height:42px;font-size:13px;padding:8px 11px}
  .chip{min-height:44px;font-size:14px}
  .field,.search-box .field,.task-list-head .field,.input-area textarea,.editor-input.body,.modal input,.modal textarea,.modal select{font-size:16px!important}
  input.field,select.field{min-height:46px}
  input[type=checkbox]{width:20px;height:20px;flex-shrink:0}
  label:has(input[type=checkbox]){min-height:44px;display:flex;align-items:center;gap:8px}
  .page-title>.row{align-items:flex-start;flex-wrap:wrap;gap:12px}
  .page-title>.row>.row{flex-wrap:wrap;gap:8px}
  .page-title p{font-size:13px}
  .notice{font-size:13px;overflow-wrap:anywhere}
  .two-col,.charts,.create-layout,.tasks-layout,.source-grid,.profile-grid{grid-template-columns:minmax(0,1fr)}
  .create-card,.card-pad{padding:18px}
  .create-heading p{font-size:13px}
  .create-heading .quick-icon{flex-shrink:0}
  .input-area textarea{min-height:240px}
  .input-bottom{gap:8px;font-size:12px}
  .action-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .action-row .btn{width:100%;white-space:normal;min-height:46px}
  .action-row .btn.primary{order:-1;grid-column:1/-1}
  .recent{display:none}
  .mobile-task-picker{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
  .mobile-task-picker .btn{width:100%;justify-content:space-between}
  .tasks-layout{gap:12px}
  .tasks-layout .task-side{display:none;grid-row:1;min-width:0}
  .tasks-layout.show-task-list .task-side{display:block}
  .task-list-scroll{max-height:42dvh}
  .task-item{padding:15px}
  .task-item strong{font-size:14px}
  .task-item .row{font-size:12px}
  .task-list-actions{flex-wrap:wrap;gap:8px;padding:10px 14px}
  .task-list-actions select{font-size:16px!important;min-height:44px!important}
  .task-list-head .tabs{flex-wrap:nowrap;overflow:auto}
  .task-list-head .tab{flex-shrink:0}
  .task-footer .btn{flex:1}
  .editor-paper{padding:22px 18px;min-height:320px}
  .article-title{font-size:22px;line-height:1.6}
  .article-meta{font-size:12px;gap:8px;margin-bottom:22px}
  .editor-toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding:12px;gap:8px}
  .editor-toolbar>.grow{grid-column:1/-1}
  .editor-toolbar .btn{white-space:normal;min-width:0}
  .editor-toolbar [data-action=save-edit]{grid-column:1/-1}
  .editor-toolbar-top.is-editing{position:sticky;top:calc(60px + env(safe-area-inset-top));z-index:21;box-shadow:0 4px 14px #0001}
  .editor-toolbar-top.is-editing>.grow,.editor-toolbar-top.is-editing [data-action^=copy-]{display:none}
  .editor-toolbar-top.is-editing [data-action=save-edit]{grid-column:auto}
  .editor-input.title{font-size:20px}
  .editor-input.body{min-height:50dvh;line-height:1.9}
  .image-panel{padding:12px}
  .image-panel>.row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .image-panel b{grid-column:1/-1;font-size:14px}
  .image-panel .grow{display:none}
  .image-panel .btn{padding:9px 3px;white-space:normal}
  .image-panel small{font-size:12px}
  .mobile-filter-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
  .mobile-filter-heading small{font-size:12px;min-width:0;overflow-wrap:anywhere}
  .filters{padding:14px}
  .filters .filter-row{gap:8px}
  .filters .tabs{gap:4px}
  .filters:not(.expanded) .reading-thresholds,.filters:not(.expanded) .date-filter,.filters:not(.expanded) .filter-category-row{display:none}
  .filter-kind-row>.tabs:first-child{width:100%;display:grid;grid-template-columns:1fr 1fr}
  .filter-search-row .date-filter{flex-wrap:wrap}
  .filter-search-row .search-box{width:100%}
  .search-box .field{width:0;flex:1}
  .filter-row+.filter-row{margin-top:10px;padding-top:10px}
  .mobile-admin-toggle{display:inline-flex;width:100%;justify-content:space-between;margin-bottom:8px}
  .library-admin-info:not(.expanded) .library-admin-content{display:none}
  .library-admin-content>.row{flex-wrap:wrap;gap:6px}
  .mobile-library-sort{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:12px 0}
  .mobile-library-sort label{display:flex;align-items:center;gap:8px;font-size:13px;min-width:0}
  .mobile-library-sort select{min-width:0;width:132px}
  .library-table{overflow:visible;background:transparent;border:0;box-shadow:none}
  .library-table table,.library-table tbody{display:block;width:100%}
  .library-table thead{display:none}
  .library-table tbody{display:grid;gap:12px}
  .library-table tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-radius:12px;background:var(--card);padding:14px;gap:10px 8px;min-width:0}
  .library-table td{display:block;border:0;padding:0;min-width:0;font-size:14px}
  .library-table td:first-child,.library-table td:nth-child(2),.library-table td:last-child{grid-column:1/-1}
  .library-table td[data-label]::before{content:attr(data-label);display:block;font-size:11px;color:var(--muted);margin-bottom:2px}
  .library-table td:nth-child(2){white-space:normal;font-size:12px;color:var(--muted)}
  .library-table td:nth-child(2)::before{display:inline;margin-right:8px}
  .library-table td:last-child{border-top:1px solid var(--line);padding-top:10px}
  .library-table td:last-child>.row{justify-content:space-between;gap:10px!important}
  .library-table td:last-child .btn{flex:1;max-width:170px}
  .article-work{min-width:0;max-width:none;align-items:flex-start;gap:12px}
  .article-work>div:last-child{min-width:0;flex:1}
  .article-work .thumb{width:76px;height:64px}
  .work-title{font-size:15px;min-height:44px;-webkit-line-clamp:3;overflow-wrap:anywhere}
  .work-meta{flex-wrap:wrap;gap:4px 7px;font-size:11px}
  .work-meta>span{max-width:100%;overflow-wrap:anywhere}
  .selection-bar{bottom:calc(8px + env(safe-area-inset-bottom));flex-wrap:wrap;gap:4px;padding:10px 12px;z-index:25}
  .selection-bar>.row{width:100%;gap:8px}
  .selection-bar .btn{flex:1;white-space:normal}
  .pagination{gap:12px;margin:20px 0}
  .pagination .btn{min-width:76px}
  .table-wrap:not(.library-table){overscroll-behavior-x:contain}
  .source-item>.grow{min-width:0}
  .log-row .row{flex-wrap:wrap;gap:4px}
  .banner{flex-wrap:wrap;gap:8px}
  .banner .grow{min-width:150px}
  .chart{min-width:0}
  .chart-axis{overflow-x:auto;gap:16px;padding-left:12px}
  .chart-bar{flex-shrink:0;min-width:18px}
  .login-page,.login-form{min-height:100dvh}
  .login-page{grid-template-columns:1fr}
  .login-story{display:none}
  .login-form{padding:calc(28px + env(safe-area-inset-top)) max(22px,env(safe-area-inset-right)) calc(28px + env(safe-area-inset-bottom)) max(22px,env(safe-area-inset-left))}
  .login-box{width:100%;max-width:400px}
  .modal-backdrop{align-items:flex-end;padding:12px max(10px,env(safe-area-inset-right)) 0 max(10px,env(safe-area-inset-left))}
  .modal,.modal.wide{width:100%;max-height:100%;border-radius:18px 18px 0 0}
  .modal-head{padding:12px 16px}
  .modal-head h2{font-size:17px}
  .modal-body{padding:18px 16px;scroll-padding-block:16px}
  .modal-foot{padding:12px 16px calc(12px + env(safe-area-inset-bottom));gap:8px}
  .modal-foot .btn{flex:1;min-width:90px;white-space:normal}
  .modal-foot .btn.primary{flex-grow:1.2}
  .modal .two-col{grid-template-columns:1fr}
  .image-edit-row{grid-template-columns:70px minmax(0,1fr);gap:12px}
  .image-edit-row img{width:70px;height:85px}
  #toast{max-width:calc(100vw - 28px);width:max-content;white-space:normal;overflow-wrap:anywhere;top:calc(var(--viewport-top,0px) + 16px + env(safe-area-inset-top));font-size:14px}
}
@media(max-width:380px){
  .breadcrumb{font-size:12px}
  .topbar-right .avatar{display:none}
  .content{padding-left:12px;padding-right:12px}
  .template-grid{grid-template-columns:1fr}
  .distribution{gap:14px}
  .stat{padding:14px}
  .editor-paper{padding:20px 15px}
  .image-panel .btn{font-size:12px}
  .quick{padding:12px 9px}
  .quick p{display:none}
  .modal-foot .btn{min-width:80px;font-size:12px;padding:8px}
}
@media(prefers-reduced-motion:reduce){.sidebar{transition:none}}