/* HET 2026: Fluent-inspired surfaces, hierarchy and focus; approved document fonts are inherited. */
:root{--het-surface:#fff;--het-canvas:#f5f6f8;--het-border:#d9dfe7;--het-focus:#064c88;--het-radius:10px;--het-shadow:0 2px 8px #172b4d08;--line:#d9dfe7;--muted:#555;--ink:#000}
@media screen{
 body{background:var(--het-canvas);color:#000}
 body #app>header{background:#ffffffed!important;border-bottom:1px solid var(--het-border)!important;box-shadow:0 1px 8px #172b4d06!important;padding-block:12px!important;min-height:66px}
 body #app>header .brand{font-weight:600;letter-spacing:.01em}
 body #main{padding:24px!important}body #main>h1{margin:0 0 20px;letter-spacing:-.02em;font-size:30px;line-height:1.8}
 body #main :is(.panel,.card,.rd-kpis>div,.gs-summary article){border:1px solid var(--het-border);border-radius:var(--het-radius);box-shadow:var(--het-shadow);background:#fff}
 body #main .panel{padding:20px;margin-bottom:16px}body #main .panel .panel{box-shadow:none;border-radius:6px}
 body #main :is(h2,h3){color:#000;letter-spacing:-.01em}body #main h2{margin:0 0 12px;font-size:22px;line-height:1.8}body #main h3{font-size:18px;line-height:1.8}
 body :is(button,a.button,.btn){border-radius:7px;box-shadow:0 1px 2px #172b4d08;transition:background-color .12s,border-color .12s,box-shadow .12s;min-height:40px}
 body :is(button,a.button,.btn):hover:not(:disabled){box-shadow:0 2px 5px #172b4d14}
 body :is(button,a.button,.btn):active:not(:disabled){box-shadow:none}
 body :is(button,.button).primary{background:#b00020;border-color:#b00020;color:#fff}
 body :is(button,input,select,textarea,a,summary):focus-visible{outline:2px solid var(--het-focus)!important;outline-offset:3px!important}
 body :is(input,select,textarea){border-color:#bdc7d2;border-radius:6px;background:#fff;color:#000;box-shadow:0 1px 1px #172b4d04}
 body :is(input,select,textarea):focus{border-color:#064c88;box-shadow:inset 0 -2px #064c88}
 body :is(input,select,textarea)[aria-invalid=true]{border-color:#b00020}
 body input[type=checkbox]{accent-color:#064c88;box-shadow:none;border-radius:4px}
 body :is(.muted,.field-help,small){color:#555;opacity:1}
 body .toolbar{gap:10px;padding:12px 0}body .actions{gap:10px;flex-wrap:wrap}
 body table{border-collapse:separate;border-spacing:0;background:#fff}
 body thead th{background:#f2f5f8!important;color:#173e57!important;border-bottom:1px solid #c7d2df!important;font-weight:700}
 body tbody td{border-bottom:1px solid #e7ebf0}body tbody tr:hover td{background:#f7faff}
 body .badge{border-radius:5px;font-weight:600;padding:4px 9px;box-shadow:none;line-height:1.8}
 body :is(.status-done,.status-completed,.gs-ready){color:#08663c!important;background:#e7f4ed}
 body :is(.error,.status-danger){color:#b00020!important}body :is(.status-problem,.status-error){background:#fbe9ed;color:#b00020}
 body .notice{border-radius:7px;border:1px solid #d4e1ee;background:#eff6fc;color:#173e57;padding:12px 14px}
 body dialog{border:1px solid #cbd5df;border-radius:12px;box-shadow:0 24px 72px #172b4d35;padding:24px;box-sizing:border-box;max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);overflow:auto;scroll-padding-block:24px}
 body dialog::backdrop{background:#10283d66;backdrop-filter:blur(2px)}
 body dialog .dialog-head{background:#fff;border-bottom:1px solid #dde4ec;padding:18px 22px}
 body dialog :is(.dialog-body,.modal-body){padding:20px 22px}
 body .check-card{border-radius:7px;border:1px solid #d8e0e9;padding:12px;gap:10px;background:#fff}
 body .check-card:has(input:checked){background:#eef5fc;border-color:#7aa5cd}body .check-card small{display:block}
 body .weekly-line-settings form{display:grid;gap:14px}body .weekly-line-settings .notice{margin:0}body .weekly-settings-result{color:#b00020}
 body .het-activity{backdrop-filter:blur(12px)}
 @media(min-width:901px){
  :root body #app[data-het-sidebar]>.manager-nav{background:#f7f8fa!important;border-right:1px solid var(--het-border)!important;padding:12px 10px!important}
  :root body #app[data-het-sidebar] .manager-nav :is(a,button){position:relative;background:transparent!important;color:#28374a!important;border-radius:6px!important;padding-left:14px!important;box-shadow:none!important}
  :root body #app[data-het-sidebar] .manager-nav :is(a,button):hover{background:#e9edf3!important}
  :root body #app[data-het-sidebar] .manager-nav :is(a,button).active{background:#e4edf7!important;color:#064c88!important;font-weight:700!important}
  :root body #app[data-het-sidebar] .manager-nav .active::before{content:'';position:absolute;left:2px;top:25%;bottom:25%;width:3px;background:#064c88;border-radius:3px}
 }
 @media(max-width:760px){
  body #main{padding:14px!important}body #main>h1{font-size:25px;margin-bottom:14px}
  body #main .panel{padding:16px;margin-bottom:12px;border-radius:9px}body #main h2{font-size:20px}
  body :is(button,.button){min-height:44px}body .actions{gap:8px}
  body dialog{border-radius:12px 12px 0 0}body dialog :is(.dialog-head,.dialog-body,.modal-body){padding:14px 16px}
  body .toolbar{padding:8px 0;gap:8px}
 }
 @media(prefers-reduced-motion:reduce){body :is(button,a.button,.btn){transition:none}}
 @media(forced-colors:active){body :is(button,input,select,textarea,.panel,.badge){border:1px solid CanvasText!important}body .manager-nav .active{outline:2px solid Highlight}}
}

@media screen{body :is(.unit-report-head,.unit-report-summary){align-items:center;min-height:44px;gap:10px}body .unit-report-head>:is(b,strong,span){align-self:center;margin-block:0}}
@media screen and (max-width:760px){:root body .het-activity:not([data-state=error]){left:auto!important;right:8px!important;width:max-content!important;max-width:calc(var(--het-vv-width,100vw) - 104px)!important;border-radius:999px!important}:root body .sidebar-toggle{min-height:36px!important}}

/* R260: legacy dialogs own their content padding; framed dialog layouts own it internally. */
@media screen{
 body dialog:is(.create-job-dialog,.mh-dlg):not(.job-detail-dialog),body dialog:has(>.dialog-head,>.dialog-body,>.modal-body){padding:0}
 body dialog.job-detail-dialog{padding:26px}
 body dialog.water-delete{width:min(620px,calc(100vw - 32px));padding:26px}
 body dialog:has(#manager-passkey-add,.manager-passkey-devices){width:min(1060px,calc(100vw - 48px))}
 body dialog:has(#manager-passkey-revoke){width:min(600px,calc(100vw - 48px))}
 body dialog.water-delete label,body dialog:has(#manager-passkey-add) label{display:block;margin-block:14px}
 body dialog.water-delete .actions{margin-top:24px}
 body dialog>h2:first-child{margin-top:0}
 body dialog:has(#visit-form){width:min(1180px,calc(100vw - 48px))}
 body dialog :is(form,.grid,.actions)>*{min-width:0}
 body dialog :is(input:not([type=checkbox]):not([type=radio]),select,textarea){max-width:100%;box-sizing:border-box}
 body dialog .actions{row-gap:12px}
 body .ti-mail-body,body .ti-mail-body *,body .ti-mail-row,body .ti-mail-row *,body .ti-original-copy,body .ti-original-copy *{font-family:Verdana,Arial,sans-serif!important;font-size:10pt!important;line-height:1.5}
 @media(max-width:760px){body dialog.water-delete{padding:18px!important;width:calc(100vw - 20px)}body .ti-mail-row{flex-wrap:wrap}body .ti-mail-row>button{margin-left:auto}}
}

/* R260: compact overview with full, opt-in attendance details. */
@media screen{
 body .planning-card .attendance-notice,body .month-visit-chip .attendance-notice{padding:5px 7px!important;margin:3px 0!important;font-size:12px!important;line-height:1.5!important;min-height:0;max-width:100%;box-sizing:border-box;touch-action:pan-y}
 body .attendance-notice summary{font-size:12px!important;line-height:1.5;cursor:pointer;min-height:28px;display:flex;align-items:center}
 body .attendance-notice p{white-space:pre-line;overflow:auto;max-height:180px;font-size:13px!important;line-height:1.6!important;margin:6px 0!important}
 body .planning-card{align-content:start!important;gap:5px!important}
 body .planning-card>.drag-handle{position:absolute!important;right:7px;top:6px;min-height:26px!important;height:26px!important;width:28px!important;min-width:28px!important;padding:0!important;display:grid!important;place-items:center}
 body .planning-card>.resize-handle{position:absolute!important;top:50%!important;transform:translateY(-50%);height:36px!important;min-height:36px!important;min-width:18px!important;width:18px!important;display:grid!important;place-items:center;padding:0!important;z-index:7}
 body .planning-card>.resize-handle.left{left:-8px}body .planning-card>.resize-handle.right{right:-8px}
 body .planning-card-head{padding-right:30px!important;min-height:28px;align-items:center!important}
 body #main .planning-card :is(.planning-job-title,.planning-site){font-size:14px!important;line-height:1.45!important;margin:0!important;display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden!important}
 body .month-cell{align-self:start;min-height:210px!important;max-height:480px;overflow:auto!important;scrollbar-gutter:stable;overscroll-behavior:contain}
 body .month-grid{align-items:start!important}
 body .month-visit-chip{position:relative;align-content:start!important}
 body .month-visit-chip .attendance-notice[open]{grid-column:1/-1}
 body .puzzle-list{align-items:flex-start!important;max-height:230px;overflow:auto!important}
 body .puzzle-card{min-height:0!important;height:206px!important;box-sizing:border-box;display:grid;align-content:start;gap:4px!important;padding:12px!important;overflow:hidden!important}
 body .puzzle-card .puzzle-notch{position:absolute;right:7px;top:7px;min-height:24px!important;width:28px;background:transparent}
 body .puzzle-card-head{padding-right:30px;margin:0!important;gap:5px}
 body .puzzle-card>strong,body .puzzle-card>.puzzle-site{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:14px!important;line-height:1.4}
 body .puzzle-card>small{font-size:12px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 body .puzzle-card .puzzle-schedule-button{min-height:34px!important;margin:2px 0 0!important;padding:4px 10px}
 @media(min-width:761px){body .week-day.lane-layout{min-height:calc(100px + max(1,var(--lane-count))*230px)!important}body .week-day.lane-layout>.planning-card[data-lane]{top:calc(54px + var(--lane)*230px)!important;height:216px!important;overflow:auto!important;padding:10px!important}}
 @media(max-width:760px){:root body #main .planning-card :is(.planning-job-title,.planning-site){display:-webkit-box!important;max-height:4.4em!important;overflow:hidden!important;-webkit-line-clamp:3!important}body .month-cell{max-height:400px}body .puzzle-card{height:210px!important}}
}

/* Override the older unlimited-height Planning rules at their original scope. */
@media screen{
 :root body #main .planning-card[data-lane]{position:relative!important;inset:auto!important;height:216px!important;max-height:216px!important;min-height:0!important;overflow:auto!important;padding:10px!important;box-sizing:border-box!important;align-content:start!important;gap:4px!important}
 :root body #main .planning-card>.drag-handle{position:absolute!important;right:6px!important;top:6px!important;width:28px!important;height:26px!important;min-height:26px!important;padding:0!important;display:grid!important;place-items:center}
 :root body #main .planning-card>.resize-handle{position:absolute!important;inset:auto!important;top:50%!important;transform:translateY(-50%);width:18px!important;height:36px!important;min-height:36px!important;display:grid!important;place-items:center;margin:0!important;padding:0!important;z-index:7}
 :root body #main .planning-card>.resize-handle.left{left:0!important}:root body #main .planning-card>.resize-handle.right{right:0!important}
 :root body #main .planning-card :is(.planning-job-title,.planning-site){display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;line-clamp:2!important;overflow:hidden!important;height:auto!important;max-height:2.9em!important;white-space:normal!important;font-size:14px!important;line-height:1.45!important;margin:0!important}
 :root body #main .planning-card .attendance-notice{padding:4px 6px!important;margin:2px 0!important;max-height:150px!important;overflow:auto!important}
 :root body #main .month-visit-chip .month-title{display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;overflow:hidden!important;max-height:2.9em!important;white-space:normal!important;line-height:1.45!important;font-size:12px!important}
 :root body #main .month-cell{align-self:start!important;min-height:210px!important;max-height:480px!important;overflow:auto!important}
 @media(max-width:760px){:root body #main .week-day.lane-layout>.planning-card[data-lane]{height:auto!important;max-height:300px!important;min-height:0!important;overflow:auto!important}:root body #main .month-cell{max-height:400px!important}}
}

@media screen{html.manager-ipad-portrait #main .week-grid{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain}html.manager-ipad-portrait #main{min-width:0}}

@media screen{
 :root body #main .planning-controls [data-plan-view].active{background:#173e57!important;border-color:#173e57!important;color:#fff!important}
 :root body #main .week-grid{grid-template-columns:repeat(7,minmax(0,1fr))!important;min-width:0;overflow-x:auto;gap:8px}
 :root body #main .week-day{min-width:0!important}
 :root body #main [data-drag-body],:root body #main [data-unscheduled]{touch-action:pan-y}
 :root body #main :is(.drag-handle,.puzzle-notch,.resize-handle){touch-action:none!important}
 @media(max-width:1100px){:root body #main .week-grid{grid-template-columns:repeat(7,minmax(150px,1fr))!important}}
}

/* R260 narrow calendar columns: reserve the drag tool, and allow Thai tone marks between wrapped lines. */
@media screen{
 :root body #main .planning-card .planning-card-head{box-sizing:border-box!important;width:100%!important;min-width:0!important;padding-right:32px!important;align-items:start!important}
 :root body #main .planning-card .planning-card-head>div{min-width:0!important;max-width:100%!important;display:flex!important;flex-wrap:wrap!important;gap:3px 5px!important;align-items:center!important}
 :root body #main .planning-card .planning-time{white-space:nowrap!important}
 :root body #main .planning-card :is(.planning-job-title,.planning-site){line-height:1.95!important;max-height:3.9em!important}
 :root body #main .month-visit-chip .month-title{line-height:1.95!important;max-height:3.9em!important}
 :root body #main .puzzle-card{height:230px!important;max-height:230px!important;overflow:auto!important}
 :root body #main .puzzle-card>strong{line-height:1.95!important}
 :root body #main .puzzle-card>.puzzle-site{line-height:1.95!important;-webkit-line-clamp:1!important}
}

/* R261 task groups remain visible on desktop and flow into the existing mobile menu. */
body .manager-nav.admin-nav-r261{display:flex!important;flex-direction:column!important;gap:12px!important;align-items:stretch!important;padding-bottom:16px}
body .admin-nav-r261 .admin-nav-group{display:block!important;margin:0;padding:0}
body .admin-nav-r261 .admin-nav-group h2{font-size:12px!important;font-family:inherit!important;font-weight:600!important;line-height:1.5!important;letter-spacing:.03em;color:#65778a;margin:6px 12px!important}
body .admin-nav-r261 .admin-nav-group>div{display:flex!important;flex-direction:column!important;gap:2px}
body .admin-nav-r261 :is(a,button){width:100%;text-align:left;min-height:34px!important;padding:7px 12px!important;box-sizing:border-box}
body .workload-legend span.active,body .workload-legend .active,body .team-workload-legend .active{color:#243c50!important;background:transparent!important}
body .workload-legend .active:before,body .team-workload-legend .active:before{background:#176b9c!important}
@media screen{
 :root body #main .week-day>h3{font-size:17px!important;line-height:1.5!important;margin:5px 0 9px!important}
 :root body #main .planning-card{font-size:13px!important;padding:9px!important;max-height:190px!important}
 :root body #main .planning-card :is(.planning-job-title,.planning-site){font-size:14px!important;line-height:1.65!important;max-height:3.3em!important}
 :root body #main .planning-card :is(.planning-time,.planning-job-code){font-size:12px!important;line-height:1.5!important}
 :root body #main .planning-card :is(button,.badge){font-size:12px!important;line-height:1.5!important}
 :root body #main .planning-card button{padding:6px 8px!important;min-height:32px!important}
 :root body #main .month-visit-chip{font-size:12px!important;padding:7px!important}
 :root body #main .month-visit-chip .month-title{font-size:13px!important;line-height:1.65!important;max-height:3.3em!important}
 :root body #main .puzzle-card{font-size:13px!important;height:205px!important;max-height:205px!important}
 :root body #main .puzzle-card>strong{font-size:14px!important;line-height:1.65!important}
 :root body #main .puzzle-card>.puzzle-site{font-size:13px!important;line-height:1.65!important}
}

body .team-chart-key span.active{color:#243c50!important;background:transparent!important}
body .team-chart-key span.active:before{background:#176b9c!important}
body .recommendation-filter{display:flex;align-items:end;gap:16px;flex-wrap:wrap}
body .recommendation-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.5fr);gap:24px}
body .recommendation-card h2{font-size:22px;line-height:1.5}
body .recommendation-card h3{font-size:18px;line-height:1.6}
body .recommendation-plan{display:flex;flex-direction:column;gap:8px;border-left:1px solid #dbe4ed;padding-left:22px}
@media(max-width:760px){body .recommendation-card{grid-template-columns:1fr}body .recommendation-plan{border-left:0;border-top:1px solid #dbe4ed;padding:16px 0 0}}

@media screen{:root body #main .week-day .week-day-head h3{font-size:17px!important;line-height:1.5!important;margin:4px 0!important}}

/* Compact type keeps the original Thai ascent clearance; only Planning is reduced. */
@media screen{
 :root body #main .week-day .week-day-head h3{font-size:16px!important;line-height:1.95!important;margin:4px 0!important}
 :root body #main .week-day.lane-layout>.planning-card[data-lane]{height:202px!important;max-height:202px!important;padding:8px!important;gap:3px!important}
 :root body #main .planning-card .planning-card-head{min-height:22px!important}
 :root body #main .planning-card :is(.planning-time,.planning-job-code){font-size:11px!important;line-height:1.95!important}
 :root body #main .planning-card :is(.planning-job-title,.planning-site){font-size:12px!important;line-height:1.95!important;max-height:3.9em!important}
 :root body #main .planning-card .planning-site{font-size:11.5px!important;max-height:1.95em!important;-webkit-line-clamp:1!important;line-clamp:1!important}
 :root body #main .planning-card :is(button,.badge){font-size:10.5px!important;line-height:1.95!important}
 :root body #main .planning-card .planning-edit-single{min-height:30px!important;padding:4px 7px!important}
 :root body #main .month-visit-chip .month-title{font-size:11.5px!important;line-height:1.95!important;max-height:3.9em!important}
 :root body #main .month-visit-chip :is(.month-code,.month-site){font-size:10.5px!important;line-height:1.95!important}
 :root body #main .puzzle-card>strong,:root body #main .puzzle-card>.puzzle-site{font-size:12px!important;line-height:1.95!important}
}

@media screen{
 :root body #main .planning-card .planning-code-tools{display:flex!important;align-items:center!important;gap:4px!important;width:100%!important;min-width:0!important}
 :root body #main .planning-card .planning-code-tools>.planning-job-code{flex:1!important;min-width:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
 :root body #main .planning-card .planning-code-tools>.resize-handle{position:static!important;inset:auto!important;transform:none!important;flex:0 0 18px!important;width:18px!important;height:26px!important;min-height:26px!important;padding:0!important;margin:0!important;display:grid!important;place-items:center!important;line-height:1!important}
}

@media screen{:root body #main .planning-card .planning-code-tools>.resize-handle{min-width:18px!important;max-width:18px!important;box-sizing:border-box!important}}

/* R262: actual search-result buttons, not the old article selector. */
:root body #main .dashboard-search-result{display:grid!important;grid-template-columns:minmax(0,1fr) max-content!important;gap:12px 20px!important;width:100%!important;text-align:left!important;align-items:start!important;min-height:0!important;height:auto!important;padding:16px!important;white-space:normal!important}
:root body #main .dashboard-search-result>div{display:flex!important;flex-direction:column!important;gap:7px!important;min-width:0!important;width:100%!important}
:root body #main .dashboard-search-result :is(small,b,p){display:block!important;position:static!important;width:auto!important;min-width:0!important;margin:0!important;line-height:1.6!important;white-space:normal!important;overflow-wrap:anywhere!important}
:root body #main .dashboard-search-result small{font-size:12px!important;font-weight:400!important}
:root body #main .dashboard-search-result b{font-size:15px!important;font-weight:600!important}
:root body #main .dashboard-search-result p{font-size:12px!important;font-weight:400!important}
:root body #main .dashboard-search-result>.badge{display:inline-flex!important;align-self:start!important;justify-self:end!important;width:auto!important;max-width:100%!important;white-space:normal!important;line-height:1.5!important}
@media(max-width:700px){:root body #main .dashboard-search-result{grid-template-columns:minmax(0,1fr)!important}:root body #main .dashboard-search-result>.badge{justify-self:start!important}}

/* R262 sidebar editor: same controls for pointer, touch and keyboard. */
body .sidebar-editor-r262 .sidebar-editor-toolbar{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin:16px 0}
body .sidebar-editor-r262 .sidebar-editor-toolbar label{flex:1 1 200px;min-width:0}
body .sidebar-editor-r262 .sidebar-editor-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
body .sidebar-editor-r262 .sidebar-editor-group{border:1px solid #cbd9e5;border-radius:10px;padding:14px;min-width:0;background:#f7fafc}
body .sidebar-editor-r262 .sidebar-editor-group-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
body .sidebar-editor-r262 .sidebar-editor-group-head>label{flex:1;min-width:0;font-size:12px}
body .sidebar-editor-r262 .sidebar-editor-item{display:flex;align-items:center;gap:8px;padding:8px 0;border-top:1px solid #dde6ee;min-height:54px}
body .sidebar-editor-r262 .sidebar-editor-item>label{display:flex!important;align-items:center;gap:8px;flex:1;min-width:0;margin:0;line-height:1.5}
body .sidebar-editor-r262 .sidebar-editor-item input[type=checkbox]{width:20px;height:20px;min-width:20px;margin:0}
body .sidebar-editor-r262 .sidebar-editor-item label span{overflow-wrap:anywhere;font-size:13px}
body .sidebar-editor-r262 .sidebar-order-actions{display:flex;gap:4px;flex:none}
body .sidebar-editor-r262 .sidebar-order-actions button{width:34px;min-width:34px;padding:4px;min-height:36px}
body .sidebar-editor-r262 .sidebar-drag-handle{touch-action:none;cursor:grab;width:38px;min-width:38px;min-height:42px;padding:4px;flex:none}
body .sidebar-editor-r262 .sidebar-drop-target{outline:3px solid #176b9c;outline-offset:2px;background:#e9f3fb}
body .sidebar-editor-r262 .sidebar-drop-empty{padding:22px 10px;border:1px dashed #aebfce;text-align:center;color:#405b70}
body .sidebar-drag-ghost{position:fixed;z-index:99999;pointer-events:none;background:#173e57;color:white;padding:10px 16px;border-radius:8px;max-width:280px;font:14px HETMixed,Arial,sans-serif;box-shadow:0 4px 18px #0003}
@media(max-width:850px){body .sidebar-editor-r262 .sidebar-editor-groups{grid-template-columns:minmax(0,1fr)}}
@media(pointer:coarse){body .sidebar-editor-r262 .sidebar-order-actions button,body .sidebar-editor-r262 .sidebar-drag-handle{min-width:44px;width:44px;min-height:44px}}