/* Siteboard phone and tablet pass. Loaded last, so it refines the other stylesheets without rewriting them.
   Goals: you always know what to press (strong primary buttons, bordered secondary buttons), big targets for gloves and sunlight,
   status that is colour AND text, a soft tinted background, a phone calendar on phones and roomy layouts on tablets.
   Contrast: primary #2b5e47 with white text is 7.0:1; chip text on its tint is 6:1 or better; secondary borders are 3:1+ against white. */

:root{
  --sb-primary:#2b5e47;--sb-primary-hover:#214a38;--sb-primary-ring:#b59a60;
  --sb-tint:#eef2ec;--sb-tint-2:#f6f3ea;--sb-edge:#7f8c85;
  --ok-fg:#1f5a3d;--ok-bg:#dcefe2;--wait-fg:#6e4a07;--wait-bg:#fbebc4;--bad-fg:#8e2a20;--bad-bg:#fadcd6;--info-fg:#24486b;--info-bg:#dde9f6;--plain-fg:#46524c;--plain-bg:#e9ece7
}

/* ---------- everywhere: calmer tinted background, clear buttons, visible focus, readable chips ---------- */
body{background:linear-gradient(180deg,var(--sb-tint) 0,var(--sb-tint-2) 900px) fixed,var(--sb-tint-2)}
.btn{border:1.5px solid var(--sb-edge);color:#1d2c26;font-weight:700}
.btn:hover{background:#eef2ec}
.btn.primary,.btn.primary.small{background:var(--sb-primary);border-color:var(--sb-primary);color:#fff;box-shadow:0 2px 0 #173a2b,0 6px 14px #2b5e4730}
.btn.primary:hover{background:var(--sb-primary-hover);border-color:var(--sb-primary-hover)}
.btn.primary:active{transform:translateY(1px);box-shadow:0 1px 0 #173a2b}
.btn.danger{color:var(--bad-fg);border-color:#c98b82}
.btn.gold{border-color:#b59a60;color:#5a4822}
:is(button,a,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid #192622;outline-offset:2px;box-shadow:0 0 0 6px #b59a6066}
.filter-button{border:1.5px solid #c9d0c9;background:#fff;color:#1d2c26;font-weight:650}
.filter-button.selected,.filter-button[aria-pressed="true"]{background:#192622;border-color:#192622;color:#fff}

.badge{font-size:12px;font-weight:700;padding:3px 9px;border-radius:99px;background:var(--plain-bg);color:var(--plain-fg)}
.badge.green,.badge.done{background:var(--ok-bg);color:var(--ok-fg)}
.badge.yellow,.badge.submitted{background:var(--wait-bg);color:var(--wait-fg)}
.badge.red{background:var(--bad-bg);color:var(--bad-fg)}
.badge.red::before{content:"!";display:inline-grid;place-items:center;width:15px;height:15px;border-radius:50%;background:var(--bad-fg);color:#fff;font-size:10px;font-weight:800}
.badge.progress{background:var(--info-bg);color:var(--info-fg)}
.badge.planned{background:var(--plain-bg);color:var(--plain-fg)}
.badge.booked{background:#ebe4f4;color:#553d73}

/* next meeting reminder: one clear coloured banner, not the whole calendar lit up */
.mc-next{display:flex;gap:12px;align-items:center;width:100%;text-align:left;margin:0 0 14px;padding:12px 16px;border:0;border-left:6px solid #7c3aed;border-radius:12px;background:linear-gradient(90deg,#efe8fd,#f7f3ff);color:#2e1a57;font:inherit}
.mc-next .icon{width:26px;height:26px;color:#5b21b6}
.mc-next>span{display:grid;gap:1px}
.mc-next small{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#5b21b6}
.mc-next b{font-size:16px}
.mc-next span span{font-size:14px;color:#3f2d6b}
.mc-phone,.m-tabs{display:none}

/* ---------- tablet (641 to 1100): roomy, two columns where useful, larger boxes ---------- */
@media(min-width:641px) and (max-width:1100px){
  body{font-size:15px}
  .btn{min-height:46px;padding:11px 16px;font-size:14px}
  .btn.small{min-height:40px;font-size:13px}
  .filter-button{min-height:44px;padding:8px 14px;font-size:14px}
  select,input:not([type=checkbox]):not([type=radio]),textarea{min-height:46px;font-size:15px}
  .badge{font-size:12.5px}
  .project-centred-layout>.main{padding-left:28px;padding-right:28px}
  .dashboard-projects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .dashboard-projects>.dashboard-project:last-child{grid-column:auto}
  .dashboard-project{padding:22px}
  .dashboard-work-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
  .ov-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
  .panel-body,.ov-card{font-size:15px}
  .mc-table{min-width:0}
  .mc-table td{height:104px}
  .mc-day{min-height:96px}
  .mc-chip{font-size:12.5px;padding:4px 7px}
  .mc-num{font-size:14px}
  .worker-shell{max-width:820px;padding:28px 28px 80px}
  .worker-actions{grid-template-columns:repeat(3,minmax(0,1fr))}
  .worker-shell .day{min-height:60px;min-width:110px;border:1.5px solid #cfd8d1;border-radius:12px;background:#fff;padding:8px 12px}
  .worker-shell .day b{font-size:16px}.worker-shell .day span{font-size:14px}
  .worker-shell .day.current{border-color:#192622;box-shadow:inset 0 0 0 1px #192622}
  .worker-heading p{font-size:16px}
  .worker-select{min-height:46px;font-size:15px}
  .worker-task{padding:24px}
  .worker-task h2{font-size:20px}
  .worker-task .instructions{font-size:15px;color:#3f4b45}
  .modal{max-width:min(720px,94vw)}
}

/* ---------- phone (up to 640) ---------- */
@media(max-width:640px){
  html,body{overflow-x:hidden}
  body{font-size:16px}
  .project-centred-layout>.main,.main{padding-left:16px;padding-right:16px}

  /* big, obvious controls */
  .btn,.btn.small{min-height:48px;padding:12px 16px;font-size:15px;border-radius:10px}
  .btn .icon{width:18px;height:18px}
  .filter-button{min-height:44px;padding:8px 14px;font-size:15px;border-radius:99px}
  .inline-filters{gap:8px;flex-wrap:wrap}
  .text-button{min-height:44px;font-size:15px}
  select,input:not([type=checkbox]):not([type=radio]),textarea{min-height:48px;font-size:16px;border-radius:10px}
  .form-row{grid-template-columns:1fr}
  .modal-footer{display:flex;flex-direction:column-reverse;gap:10px}
  .modal-footer .btn{width:100%}
  .page-heading>.btn,.page-heading .btn.primary{width:100%;font-size:16px}
  /* the top bar stays compact so nothing is pushed off screen */
  .workspace-controls{gap:6px;min-width:0}
  .workspace-header{grid-template-columns:auto minmax(0,1fr)!important;column-gap:8px!important}
  .workspace-brand{width:auto!important;min-width:0!important;max-width:106px}
  .workspace-controls{justify-content:flex-end}
  .workspace-brand .brand-mark{width:104px!important;height:50px!important;background-position:left center}
  .workspace-menu .icon{width:16px}
  .workspace-controls>.btn,.workspace-controls .btn{min-height:44px;padding:8px 11px;font-size:14px;border-radius:9px;white-space:nowrap}
  .workspace-header .btn.primary{box-shadow:none}

  /* readable text */
  .subtitle,.item-meta,.attention-content .detail,.queue-item p,.dashboard-project>p,.ov-hint,.form-hint,.tiny-info{font-size:15px;line-height:1.5}
  .item-title,.queue-item strong{font-size:16px}
  .badge{font-size:13px;padding:4px 10px}
  .panel,.ov-card{border-radius:14px}

  /* a few cards of the same kind: one swipe row instead of a long stack */
  .dashboard-projects{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-left:-16px;margin-right:-16px;padding:4px 16px 14px;scroll-padding-left:16px;-webkit-overflow-scrolling:touch}
  .dashboard-projects>.dashboard-project,.dashboard-projects>.dashboard-project:last-child{flex:0 0 84%;scroll-snap-align:start;grid-column:auto;margin:0}
  .dashboard-projects::-webkit-scrollbar{height:6px}.dashboard-projects::-webkit-scrollbar-thumb{background:#b8c2bb;border-radius:9px}

  /* headline figures two by two so the page is shorter */
  .ov-kpis{grid-template-columns:1fr 1fr!important;gap:10px}
  .ov-kpi{padding:14px 12px}
  .ov-kpi-value{font-size:21px}
  .ov-kpi-label{font-size:11.5px}
  .ov-kpi-note{font-size:13px}
  /* wide tables become stacked cards (labels come from the column headings, see mobile.js) */
  .ov-table-wrap,.data-wrap{overflow:visible}
  table.m-stack,table.m-stack tbody,table.m-stack tfoot,table.m-stack tr,table.m-stack td{display:block;width:100%}
  table.m-stack{min-width:0!important}
  table.m-stack thead{display:none}
  table.m-stack tr{border-bottom:1px solid var(--line);padding:10px 14px}
  table.m-stack td{border:0!important;padding:4px 0!important;display:flex;justify-content:space-between;gap:12px;text-align:right;font-size:15px}
  table.m-stack td[data-label]::before{content:attr(data-label);font-size:13px;font-weight:650;color:#5b6761;text-align:left;text-transform:none}
  table.m-stack td:first-child{display:block;text-align:left;font-size:16px;padding-bottom:6px!important}
  table.m-stack td:first-child::before{display:none}
  table.m-stack td:empty{display:none}

  /* ----- the crew screen ----- */
  .worker-shell{padding:16px 16px 96px}
  .project-centred-layout>.main{padding-bottom:96px}/* room for the notification bell, bottom-right on phones */
  .worker-heading h1{font-size:26px}
  .worker-heading p{font-size:15px}
  .worker-select{min-height:48px;font-size:15px;max-width:none}
  .worker-task{padding:18px;border-radius:14px}
  .worker-task h2{font-size:19px}
  .worker-task .instructions{font-size:16px;color:#3a4640;line-height:1.6}
  .worker-task .btn,.worker-actions .btn{min-height:52px;font-size:16px}
  .worker-actions{grid-template-columns:1fr;gap:10px}
  .worker-actions button{min-height:56px}
  .worker-note{font-size:14px}
  .eod-big,.ws-big{min-height:58px;font-size:18px}
  /* the clock box is always at the top and unmistakable */
  #ws-clock{border-width:2px;border-color:#2b5e47;background:#fff;box-shadow:0 6px 18px #1f3a2c1a}
  #ws-clock.ws-on{background:#e3f1e8}
  #ws-clock select{min-height:52px;font-size:17px}
  /* four tiles: each opens its own short view */
  .m-tabs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 18px}
  .m-tile{display:grid;justify-items:start;gap:2px;min-height:84px;padding:12px 14px;border-radius:14px;border:2px solid #cfd8d1;background:#fff;color:#1d2c26;text-align:left;font:inherit}
  .m-tile:last-child:nth-child(odd){grid-column:1/-1;min-height:64px}
  .worker-shell .days{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  .worker-shell .day{min-height:56px;border:1.5px solid #cfd8d1;border-radius:12px;background:#fff;padding:8px 10px}
  .worker-shell .day b{font-size:15px}.worker-shell .day span{font-size:13px}
  .worker-shell .day.current{border-color:#192622;box-shadow:inset 0 0 0 1px #192622}
  .m-tile .icon{width:24px;height:24px;margin-bottom:4px}
  .m-tile b{font-size:16px;line-height:1.2}
  .m-tile small{font-size:13px;color:#4f5c55}
  .m-tile-today .icon{color:#2b5e47}.m-tile-schedule .icon{color:#2a5d8f}.m-tile-report .icon{color:#8a5a00}.m-tile-materials .icon{color:#8f3b5a}
  .m-tile[aria-pressed="true"]{background:#192622;border-color:#192622;color:#fff}
  .m-tile[aria-pressed="true"] small,.m-tile[aria-pressed="true"] .icon{color:#e7dcc0}
  #app[data-mtab="today"] [data-mgroup]:not([data-mgroup="today"]):not([data-mgroup="all"]),
  #app[data-mtab="schedule"] [data-mgroup]:not([data-mgroup="schedule"]):not([data-mgroup="all"]),
  #app[data-mtab="report"] [data-mgroup]:not([data-mgroup="report"]):not([data-mgroup="all"]),
  #app[data-mtab="materials"] [data-mgroup]:not([data-mgroup="materials"]):not([data-mgroup="all"]){display:none!important}

  /* ----- the phone calendar (Schedule > Month) ----- */
  .cw .mc-desk{display:none}
  .mc-phone{display:grid;gap:14px}
  .mp-nav{display:grid;grid-template-columns:48px 1fr 48px auto;align-items:center;gap:6px}
  .mp-nav h2{text-align:center;font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mp-arrow{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--sb-edge);background:#fff;font-size:26px;line-height:1;color:#1d2c26}
  .mp-today{min-height:48px}
  .mp-seg{display:grid;grid-template-columns:repeat(3,1fr);background:#dfe5df;border-radius:12px;padding:4px;gap:4px}
  .mp-seg button{min-height:44px;border:0;border-radius:9px;background:transparent;font:inherit;font-size:15px;font-weight:650;color:#2c3a33}
  .mp-seg button.selected{background:#fff;color:#192622;box-shadow:0 1px 4px #0002}
  .mp-grid{background:#fff;border:1px solid var(--line);border-radius:16px;padding:8px 6px 10px}
  .mp-wd,.mp-days{display:grid;grid-template-columns:repeat(7,1fr)}
  .mp-wd span{text-align:center;font-size:12px;font-weight:700;color:#66726b;padding:4px 0 6px}
  .mp-day{display:grid;justify-items:center;align-content:start;gap:3px;min-height:52px;padding:4px 0;border:0;background:none;font:inherit;color:#1d2c26;border-radius:12px}
  .mp-day>span:first-child{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;font-size:16px;font-weight:600}
  .mp-day.is-out{color:#9aa49e}
  .mp-day.is-today>span:first-child{color:#b23b2e;font-weight:800}
  .mp-day.is-sel>span:first-child{background:#192622;color:#fff}
  .mp-day.is-today.is-sel>span:first-child{background:#b23b2e;color:#fff}
  .mp-day.has-meet>span:first-child{box-shadow:0 0 0 2px #7c3aed}
  .mp-dots{display:flex;gap:3px;height:7px}
  .mp-dots i{width:7px;height:7px;border-radius:50%;background:var(--c,#64748b)}
  .mp-list{display:grid;gap:8px}
  .mp-list h3{font-size:17px;margin:2px 2px 4px}
  .mp-item{display:grid;grid-template-columns:64px 1fr 18px;gap:10px;align-items:center;width:100%;min-height:60px;padding:10px 12px;border-radius:14px;border-left:6px solid var(--pc,var(--c));text-align:left;font:inherit;color:#14201b;-webkit-backdrop-filter:none;backdrop-filter:none}
  .mp-time{font-size:14px;font-weight:700;color:#2f3b35}
  .mp-what b{display:block;font-size:16px;line-height:1.3}
  .mp-what small{display:block;font-size:13.5px;color:#3d4943;line-height:1.4;margin-top:2px}
  .mp-go{font-size:24px;color:#4d5953}
  .mp-empty{padding:18px;border-radius:14px;background:#fff;border:1px dashed #b9c3bc;color:#4d5953;text-align:center}
  .mp-filters{background:#fff;border:1px solid var(--line);border-radius:14px;padding:4px 14px}
  .mp-filters summary{min-height:48px;display:flex;align-items:center;font-weight:650;cursor:pointer}
  .mp-filters select{width:100%;margin:0 0 10px}
  .cw-switch .filter-button{flex:1}
  /* week board and other wide grids keep their own scroll, clearly framed */
  .cw-scroll{border-radius:12px;border:1px solid var(--line);background:#fff}

  /* ----- the owner's Today screen (mobile.js folds it): urgent things open at the top, the rest behind big headers with counts ----- */
  .main>.dashboard-heading{display:block;margin-bottom:14px}
  .main>.dashboard-heading h1{font-size:24px;margin:4px 0 4px}
  .main>.dashboard-heading p{font-size:15px;margin:0}
  .main>.dashboard-heading .task-action-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
  .main>.dashboard-heading .task-action-row .btn{width:100%;padding:10px 8px;font-size:14.5px;white-space:normal;line-height:1.2}
  .mt-today{display:grid;gap:12px}
  .mt-today>.dashboard-metrics{grid-template-columns:1fr 1fr;margin:0;border-radius:14px;overflow:hidden}
  .mt-today>.dashboard-metrics>a{padding:12px 14px;min-height:76px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);color:#1d2c26}
  .mt-today>.dashboard-metrics>a:nth-child(2n){border-right:0}
  .mt-today>.dashboard-metrics>a:nth-last-child(-n+2){border-bottom:0}
  .mt-today>.dashboard-metrics span{font-size:13px;color:#46524c;font-weight:650}
  .mt-today>.dashboard-metrics strong{font-size:24px;margin:2px 0}
  .mt-today>.dashboard-metrics small{font-size:12.5px;color:#4f5c55;line-height:1.3;display:block}
  .mt-fold{background:#fff;border:1.5px solid #cfd8d1;border-left:6px solid var(--mt-c,#46524c);border-radius:14px;overflow:hidden;margin:0}
  .mt-fold.mt-has-bad{border-color:#d9a79f;border-left-color:var(--mt-c)}
  .mt-fold-h{margin:0;font-size:inherit}
  .mt-fold-btn{display:flex;align-items:center;gap:10px;width:100%;min-height:60px;padding:10px 12px 10px 14px;border:0;background:#fff;font:inherit;color:#14201b;text-align:left;cursor:pointer}
  .mt-fold-btn:active{background:#f1f4f0}
  .mt-fold-txt{display:grid;gap:2px;flex:1 1 auto;min-width:0}
  .mt-fold-txt b{font-size:16.5px;line-height:1.25}
  .mt-fold-txt small{font-size:13.5px;color:#4b5852;line-height:1.35;font-weight:500}
  .mt-count{flex:0 0 auto;min-width:34px;height:34px;padding:0 9px;border-radius:99px;display:inline-flex;align-items:center;justify-content:center;background:var(--plain-bg);color:#24302a;font-size:15px;font-weight:800;font-variant-numeric:tabular-nums}
  .mt-count.mt-bad{background:var(--bad-fg);color:#fff}
  .mt-count.mt-bad::before{content:"!";margin-right:2px}
  .mt-chev{flex:0 0 auto;width:12px;height:12px;border-right:3px solid #3d4943;border-bottom:3px solid #3d4943;transform:rotate(45deg);margin:0 6px 6px 2px;transition:transform .15s}
  .mt-fold-btn[aria-expanded="true"] .mt-chev{transform:rotate(-135deg);margin-bottom:-4px}
  .mt-fold-btn[aria-expanded="true"]{border-bottom:1px solid #e1e6e1}
  .mt-fold-body{padding:0}
  .mt-fold-body .mt-dup{display:none!important}
  /* the panels inside a fold lose their own frame and spacing, the fold is the frame */
  .mt-fold-body>.owner-view,.mt-fold-body>.panel,.mt-fold-body>section{margin:0!important;border:0!important;box-shadow:none!important;border-radius:0!important;background:transparent}
  .mt-fold-body>.owner-view>.ov-card,.mt-fold-body .ov-grid>.ov-card{border:0;box-shadow:none;border-radius:0;margin:0}
  .mt-fold-body>.owner-view .ov-grid{gap:0}
  .mt-fold-body>.owner-view .ov-grid>.ov-card+.ov-card{border-top:1px solid #e1e6e1}
  .mt-fold-body .ov-card>header{padding:10px 14px 4px;min-height:0}
  .mt-fold-body .ov-card>header:not(:has(> :not(.mt-dup))){display:none}
  .mt-fold-body .panel-head{padding:10px 14px 6px}
  .mt-fold-body>.section-title{margin:0;padding:8px 14px 0;justify-content:flex-end}
  .mt-fold-body>.dashboard-projects{margin:0;padding:10px 14px 14px;scroll-padding-left:14px}
  .mt-fold-body>.setup-home-banner,.mt-fold-body>.dashboard-routine{padding:14px}
  .mt-fold-body>.dashboard-routine{display:grid;gap:10px}
  .mt-fold-body .cu-list{margin:0;padding:0 14px}
  .mt-fold-body .cu-list li{padding:10px 0}
  .mt-fold-body .wd-latebar{padding-left:10px!important}
  .mt-fold-body .wd-counts{padding:0 14px}
  .mt-fold-body .queue-filters{padding:10px 12px;gap:8px}
  .mt-fold-body .queue-filters button{min-height:44px;padding:8px 14px;font-size:14.5px;border:1.5px solid #c9d0c9;border-radius:99px;color:#1d2c26;font-weight:650}
  .mt-fold-body .queue-filters .selected{background:#192622;border-color:#192622;color:#fff}
  .mt-fold-body .queue-item{padding:14px}
  .mt-fold-body .queue-item-meta{font-size:13.5px;color:#3d4943}
  /* ----- the programme (Gantt) on a phone: gantt.js draws a week-by-week list; the chart stays one tap away ----- */
  .gtp-switch{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:#dfe5df;border-radius:12px;padding:4px;margin:0 0 12px}
  .gtp-switch button{min-height:44px;border:0;border-radius:9px;background:transparent;font:inherit;font-size:15px;font-weight:700;color:#2c3a33}
  .gtp-switch button.selected{background:#fff;color:#192622;box-shadow:0 1px 4px #0002}
  .gt-wrap .gt-top .inline-filters{flex-wrap:wrap}
  .gtp-filters .cw-filters{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
  .gtp-filters select{width:100%}
  .gtp-sum{margin:0 2px 12px;font-size:15px;color:#33403a}
  .gtp-sum b{font-size:17px;color:#14201b}.gtp-sum .gtp-wait{color:#8a4f00}
  .gtp-week{display:grid;gap:10px;margin:0 0 20px}
  .gtp-wh{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 10px;padding:8px 2px 4px}
  .gtp-wh h3{margin:0;font-size:19px;color:#14201b}
  .gtp-wh span{font-size:14.5px;color:#46524c;font-weight:600}
  .gtp-wh .gtp-n{margin-left:auto;font-size:13.5px;background:var(--plain-bg);color:#24302a;padding:3px 10px;border-radius:99px}
  .gtp-this .gtp-wh h3{color:#a3261f}
  .gtp-daysh,.gtp-strip{display:grid;grid-template-columns:14px repeat(7,1fr) 14px;gap:3px;align-items:center}
  .gtp-daysh{padding:0 14px 0 20px;margin-bottom:-4px}
  .gtp-daysh span{text-align:center;font-size:13px;font-weight:700;color:#33403a;line-height:1.1;padding:3px 0;border-radius:8px}
  .gtp-daysh span small{display:block;font-size:10.5px;font-weight:700;color:#66726b}
  .gtp-daysh span.we{color:#7a857f}
  .gtp-daysh span.now{background:#a3261f;color:#fff}.gtp-daysh span.now small{color:#ffd9d5}
  .gtp-task{display:grid;gap:6px;width:100%;text-align:left;font:inherit;color:#14201b;background:#fff;border:1.5px solid #cfd8d1;border-left:6px solid var(--sc);border-radius:14px;padding:12px 14px;min-height:64px;cursor:pointer;box-shadow:0 1px 3px #1a302010}
  .gtp-task:active{background:#f4f6f2}
  .gtp-job{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:700;color:#3d4943}
  .gtp-job i{width:10px;height:10px;border-radius:3px;flex:0 0 auto}
  .gtp-top{display:flex;align-items:flex-start;gap:10px}
  .gtp-title{flex:1 1 auto;min-width:0;font-size:16.5px;line-height:1.3;overflow-wrap:anywhere}
  .gtp-st{flex:0 0 auto;color:#fff;font-size:12.5px;font-weight:750;padding:4px 10px;border-radius:99px;white-space:nowrap}
  .gtp-meta{font-size:14.5px;color:#3d4943}
  .gtp-strip i{height:14px;border-radius:3px;background:#edf0ec}
  .gtp-strip i.we:not(.on){background:#e3e7e2}
  .gtp-strip i.on{border-radius:0}.gtp-strip i.on.s{border-radius:7px 0 0 7px}.gtp-strip i.on.e{border-radius:0 7px 7px 0}.gtp-strip i.on.s.e{border-radius:7px}
  .gtp-strip i.now{box-shadow:0 0 0 2px #a3261f}
  .gtp-more{font-size:16px;line-height:1;color:#33403a;text-align:center}
  .gtp-when{font-size:14px;color:#33403a;font-variant-numeric:tabular-nums}
  .gtp-none{margin:0;padding:14px;border-radius:14px;border:1px dashed #b9c3bc;background:#fff;color:#4d5953;text-align:center}
  .gtp-earlier{margin:0 0 16px;background:#fff;border:1.5px solid #cfd8d1;border-radius:14px;padding:0 12px}
  .gtp-earlier>summary{min-height:52px;display:flex;align-items:center;flex-wrap:wrap;gap:2px 10px;font-weight:750;font-size:16px;cursor:pointer}
  .gtp-earlier>summary span{font-size:13.5px;font-weight:500;color:#4b5852}
  .gtp-earlier[open]{padding-bottom:12px}.gtp-earlier[open]>.gtp-task+.gtp-task{margin-top:8px}
  .gtp-hint{margin-top:4px}
  .mt-rest{display:grid;gap:10px;margin-top:6px}
  .mt-rest-h{margin:4px 2px 0;font-size:17px;font-weight:800;color:#192622;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
  .mt-rest-h span{font-size:13.5px;font-weight:500;color:#4b5852}
}
@media(max-width:640px) and (prefers-reduced-motion:reduce){.mt-chev{transition:none}}
@media(prefers-reduced-motion:reduce){.btn.primary:active{transform:none}}
@media print{body{background:#fff}.m-tabs,.mc-next,.mc-phone{display:none!important}}