/* TITI Planner v8.25 · Tablet and desktop book spreads. Mobile stays v8.24. */
:root{--titi-wide-gutter:18px}
.layout-mode-options{border:0!important;padding:0!important;margin:10px 0 8px!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important}
.layout-mode-options legend{font-size:11px;color:#77736e;margin:0 0 7px;padding:0}
.layout-mode-option{box-sizing:border-box;display:flex;align-items:center;gap:8px;border:1px solid #d4cfc8;border-radius:5px;padding:10px 9px;min-width:0;font-size:12px;cursor:pointer;background:#fffefa}
.layout-mode-option:has(input:checked){background:#ebeae5;border-color:#89867e;color:#272724;font-weight:600}
.layout-mode-option input{accent-color:#353330;flex:0 0 auto;width:16px;height:16px}
.layout-mode-option span{min-width:0;overflow-wrap:anywhere}
@media(max-width:370px){.layout-mode-options{grid-template-columns:1fr}}
/* Actual wide layouts, activated by the stored preference or breakpoint. */
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .app-shell{
  max-width:var(--titi-shell-max)!important;width:100%!important;
  height:100dvh!important;max-height:100dvh!important;
  padding-top:env(safe-area-inset-top,0px)!important;
  background:var(--folio-cover)!important;
}
body[data-titi-layout="tablet"]{--titi-shell-max:1080px;--titi-agenda-width:235px}
body[data-titi-layout="desktop"]{--titi-shell-max:1600px;--titi-agenda-width:310px}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .folio-top{
  margin-inline:var(--titi-wide-gutter)!important;
  flex-basis:105px!important;height:105px!important;min-height:105px!important;
}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .folio-top .app-header{
  height:50px!important;min-height:50px!important;flex-basis:50px!important;
  padding:8px 18px 0!important;
}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .folio-top .header-controls{gap:9px!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .folio-top .header-controls button,
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .folio-top #chatBtn{width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;max-width:34px!important;max-height:34px!important;flex-basis:34px!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .folio-top .page-heading{
  height:55px!important;min-height:55px!important;flex-basis:55px!important;
  padding:8px 21px!important;
}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .folio-top .page-heading h1{font-size:27px!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .folio-top .page-heading .subtext{font-size:11px!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .folio-top .date-navigation{gap:14px!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .folio-top .nav-arrow{font-size:12px!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .main-view{
  margin-inline:var(--titi-wide-gutter)!important;
  width:auto!important;
  min-width:0!important;
}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .main-view:has(> .titi-agenda-aside){
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(190px,var(--titi-agenda-width))!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  align-items:stretch!important;
  gap:0!important;
}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .main-view:has(> .titi-agenda-aside)>.day-view{
  grid-column:1;grid-row:1/4;min-width:0!important;min-height:0!important;height:100%!important;
}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .main-view:has(> .titi-agenda-aside)>.timeline-week-pills{grid-column:1;grid-row:1;min-width:0!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .main-view:has(> .titi-agenda-aside)>.week-compact-tools{display:none!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .main-view:has(> .titi-agenda-aside)>.timeline-shell{grid-column:1;grid-row:2/4;min-width:0!important;max-height:100%!important;min-height:0!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .main-view:has(> .titi-agenda-aside)>.month-folio-scroll{grid-column:1;grid-row:1/3;min-width:0!important;height:auto!important;max-height:100%!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .main-view:has(> .titi-agenda-aside)>.month-folio-footer{grid-column:1;grid-row:3;min-width:0!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .month-weekdays,
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .month-grid{
  width:100%!important;min-width:100%!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;
}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .month-entry{font-size:10px!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .month-cell .date-num{font-size:11px!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .week-track,
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .week-track.overview{
  min-width:100%!important;width:100%!important;
}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .week-track.overview .time-block .block-title{font-size:10px!important;line-height:1.26!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .tab-bar{
  margin-inline:var(--titi-wide-gutter)!important;
  justify-content:flex-start!important;gap:9px!important;
  height:55px!important;min-height:55px!important;flex-basis:55px!important;
  padding:8px 15px!important;
}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .tab-bar .tab{font-size:11px!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .tab-bar .tab span{padding:5px 12px!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .tab-bar .tab-add{margin-left:auto!important;height:34px!important;width:34px!important;min-width:34px!important;flex-basis:34px!important}
/* Quiet editorial side spread showing selected date and unsorted pinboard notes. */
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .titi-agenda-aside{
  display:flex;flex-direction:column;min-width:0;min-height:0;overflow-y:auto;
  grid-column:2;grid-row:1/4;
  border-left:1px solid #cfcbc4;background:#f6f5f2;
  padding:17px 15px 25px;gap:9px;overscroll-behavior:contain;
}
.wide-side-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #bcb8b0;padding:0 0 14px}
.wide-side-heading span{letter-spacing:2px;font-size:10px;color:#8b8781}
.wide-side-heading strong{font-size:21px;font-weight:580;color:#262522;letter-spacing:-.4px}
.wide-day-summary{display:flex;gap:12px;color:#79756f;font-size:11px;padding:4px 0 12px}
.wide-side-section{min-width:0;padding:8px 0 12px;border-top:1px solid #dfdcd6}
.wide-side-section h2{font-size:11px;letter-spacing:2px;font-weight:650;color:#5a5650;margin:2px 0 9px}
.wide-agenda-entry{display:flex;flex-direction:column;text-align:left;align-items:flex-start;gap:3px;border:0;border-left:2px solid #bcb9b2;background:transparent;padding:7px 8px;margin:0 0 5px;width:100%;min-width:0;cursor:pointer}
.wide-agenda-entry.is-event{border-color:#8e968f;background:#ecebe7}
.wide-agenda-entry:hover,.wide-agenda-entry:focus-visible{background:#e9e8e3}
.wide-entry-clock{font-size:10px;letter-spacing:.1px;color:#8b867e}
.wide-entry-name{font-size:12px;line-height:1.45;color:#34322e;overflow-wrap:anywhere;width:100%}
.wide-entry-name.completed{opacity:.5;text-decoration:line-through}
.wide-agenda-empty,.wide-pin-note{font-size:11px;color:#9b9790;line-height:1.6;padding:1px 0}
.wide-pin-note{color:#59554e;margin:0 0 4px;overflow-wrap:anywhere}
.wide-pins-heading{display:flex;align-items:center;justify-content:space-between}
.wide-pins-heading button{border:0;background:transparent;font-size:10px;color:#5a5753;text-decoration:underline;cursor:pointer}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .pin-wrap{width:100%;max-width:1150px;margin-inline:auto;padding:20px 32px!important}
body[data-titi-layout="desktop"] .pin-wrap{max-width:1350px}
/* On a small physical screen, the layout engine falls back to mobile regardless
   of the saved manual preference. No forced horizontal page overflow. */
@media(max-width:900px){
 body[data-titi-layout="tablet"]{--titi-wide-gutter:10px;--titi-agenda-width:208px}
 body[data-titi-layout="desktop"]{--titi-wide-gutter:10px;--titi-agenda-width:230px}
 body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .titi-agenda-aside{padding:15px 11px}
 body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .folio-top .app-header{padding-inline:10px!important}
 body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .folio-top .page-heading{padding-inline:12px!important}
}

/* Typography tuned for reading on larger screens, without changing phone sizes. */
body[data-titi-layout="tablet"] .day-timeline-grid .block-title{font-size:12px!important;line-height:1.3!important}
body[data-titi-layout="desktop"] .day-timeline-grid .block-title{font-size:13px!important;line-height:1.35!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .day-timeline-grid .block-time,
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .day-timeline-grid .item-type{font-size:10px!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .week-track .block-title{font-size:10px!important}
body[data-titi-layout="desktop"] .week-track.overview .block-title{font-size:11px!important}
body:is([data-titi-layout="tablet"],[data-titi-layout="desktop"]) .hour-label{font-size:10px!important}
