/* Avoid huge headers, inaccessible tab strips and clipped modal controls. */
#mobile-navigation-toggle,.mobile-section-picker{display:none}
.page-head,.section-head,.card-top{gap:16px}
.page-head>div,.section-head>div,.card-top>div{min-width:0}
.page-head h1,.node-card h3,.server-card h3{overflow-wrap:anywhere}
.actions{gap:8px;flex-wrap:wrap}
dialog{max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain}
.modal-head{position:sticky;top:0;z-index:2;background:var(--panel,#101722)}
.modal-head h2{min-width:0}.modal-head button{flex-shrink:0}
.drive-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.drive-card{min-width:0}.drive-card-label,.drive-card-mount{overflow-wrap:anywhere}
.drive-card-space{flex-wrap:wrap;gap:6px}
.slider-num-input{min-width:80px!important;max-width:120px}
input[type=range]{min-width:80px;max-width:100%;touch-action:pan-y}
/* Keep readable text space regardless of how many mod controls are present. */
.ark-load-order-item{display:grid;grid-template-columns:auto 52px minmax(0,1fr);grid-template-areas:"priority image info" "actions actions actions";align-items:start}
.ark-load-order-item .ark-order-badge{grid-area:priority;justify-self:start;white-space:nowrap}
.ark-load-order-item .ark-mod-thumb{grid-area:image}
.ark-load-order-item .ark-mod-info{grid-area:info;width:100%;min-width:0}
.ark-load-order-item .ark-mod-title-row{flex-wrap:wrap}
.ark-load-order-item .ark-mod-name{min-width:0;overflow-wrap:anywhere}
.ark-load-order-item .ark-mod-meta{line-height:1.6;overflow-wrap:anywhere}
.ark-load-order-item .ark-mod-meta code{white-space:nowrap}
.ark-load-order-item .ark-mod-actions{grid-area:actions;min-width:0;flex-wrap:wrap;justify-content:flex-end}
.ark-load-order-item .ark-mod-actions button{white-space:nowrap;min-height:44px;flex-shrink:0}
.ark-load-order-item .ark-order-controls{flex-shrink:0}
@media(max-width:640px){
 .ark-load-order-item{grid-template-columns:minmax(0,1fr) 44px;grid-template-areas:"priority image" "info info" "actions actions";gap:12px;padding:14px}
 .ark-load-order-item .ark-mod-thumb{width:44px;height:44px}
 .ark-load-order-item .ark-mod-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important}
 .ark-load-order-item .ark-order-controls{grid-column:1/-1}
 .ark-load-order-item .ark-order-controls button{flex:1;min-width:0}
 .ark-load-order-item .ark-mod-actions>button{width:100%;min-width:0}
 .ark-add-input-group{flex-direction:column;align-items:stretch!important}
 .ark-add-input-group input,.ark-add-input-group button{width:100%;min-width:0}
 .ark-add-input-group button{white-space:normal!important}
 .friend-hub-head{flex-wrap:wrap;gap:12px}
 .friend-connect-row{flex-direction:column;align-items:stretch;gap:10px}
 .friend-connect-row code{width:100%;min-width:0;overflow-wrap:anywhere}
 .friend-connect-row button{align-self:flex-start;min-height:44px}
}
.ark-workshop-panel{margin-top:20px}
.ark-workshop-panel h3{margin:0}
.ark-workshop-search-row{display:flex;gap:10px;align-items:stretch}
.ark-workshop-search-row input{flex:1;min-width:0}
.ark-workshop-search-row button{flex-shrink:0;min-height:44px}
.ark-workshop-results{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px;margin-top:16px}
.ark-workshop-card{display:flex;flex-direction:column;gap:12px;min-width:0;padding:16px;border:1px solid var(--line,#27384c);border-radius:12px}
.ark-workshop-card-heading{display:flex;align-items:center;gap:12px;min-width:0}
.ark-workshop-card-heading img{flex:none;object-fit:cover;border-radius:8px}
.ark-workshop-card-heading>div{min-width:0}
.ark-workshop-card h4{margin:0 0 4px;line-height:1.4;overflow-wrap:anywhere}
.ark-workshop-description{margin:0;line-height:1.5;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ark-workshop-card-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-top:auto}
.ark-workshop-card-actions button,.ark-workshop-card-actions a{min-height:44px;display:inline-flex;align-items:center}
.ark-workshop-pages{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:16px}
.ark-workshop-pages button{min-height:44px}
@media(max-width:640px){.ark-workshop-search-row{flex-direction:column}.ark-workshop-search-row input,.ark-workshop-search-row button{width:100%}.ark-workshop-pages{gap:8px}.ark-workshop-pages button{padding:10px}.ark-workshop-card{padding:12px}}
.panel input,.panel select,.panel textarea{max-width:100%;box-sizing:border-box}
@media(max-width:760px){
 .sidebar{position:relative!important;display:flex!important;flex-direction:row!important;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:12px 16px!important;gap:10px}
 .sidebar .brand{margin:0!important;padding:0!important}
 #mobile-navigation-toggle{display:inline-flex;align-items:center;min-height:44px;padding:8px 12px}
 .sidebar nav{display:none!important;width:100%;max-height:65dvh;overflow:auto!important}
 .sidebar.mobile-navigation-open nav{display:grid!important;grid-template-columns:1fr 1fr;gap:6px}
 .sidebar.mobile-navigation-open .sidebar-bottom{display:block!important;width:100%;padding:12px 0 0}
 .sidebar nav a{white-space:normal!important;min-width:0;min-height:48px;padding:10px!important;line-height:1.4}
 .sidebar nav a[hidden]{display:none!important}
 .topbar{padding:12px 16px!important;gap:10px!important}
 .topbar .breadcrumb{flex:1;min-width:0;font-size:11px}
 .topbar .width-choice,.topbar .cmd-kbd,.topbar #mobile-logout{display:none!important}
 .topbar .cmd-palette-trigger{order:3;flex:1 0 100%;justify-content:flex-start;min-height:42px}
 .topbar .top-right{margin-left:auto}
 .topbar #avatar{width:36px;height:36px}
 #main{padding:20px 16px!important}
 .page-head{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}
 .page-head h1{font-size:27px;line-height:1.2}
 .page-head p{font-size:13px;line-height:1.6}
 .mobile-section-picker{display:block;margin:18px 0 12px;font-size:12px;color:var(--muted)}
 .mobile-section-picker select{margin-top:6px;width:100%;min-height:46px;font-size:15px}
 .mobile-section-picker + .tabs{display:none!important}
 .panel,.node-card,.server-card{padding:18px!important}
 button,.button{min-height:42px;white-space:normal}
 .copy-btn-mini{min-height:36px!important;min-width:36px;padding:6px!important}
 .node-storage-section>div{flex-wrap:wrap;gap:8px}
 .node-path{align-items:flex-start!important}
 .node-path span{overflow-wrap:anywhere;min-width:0}
 dialog{width:calc(100vw - 20px)!important;max-width:calc(100vw - 20px)!important;margin:auto;padding:16px!important;max-height:calc(100dvh - 20px)}
 .modal-head h2{font-size:20px}
 #modal-content .actions{position:relative;flex-wrap:wrap}
 #modal-content .actions button{flex:1 1 140px}
 .form-grid,.form-cols,.settings-grid{grid-template-columns:minmax(0,1fr)!important}
 input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{font-size:16px}
 #request-progress{max-width:calc(100vw - 32px);text-align:center;font-size:11px}
}
