/* 紙・手書きの質感を維持し、実際の情報と操作の面積を増やす。 */
.folio-reference {--home-rule:#b5a38155;--home-muted:#716650;--home-sky:#a8d0e0;--home-green:#d8dcb9;--home-pink:#efc9b8}
.folio-reference .ref-home.is-active {padding:0 max(2px,env(safe-area-inset-right)) max(2px,env(safe-area-inset-bottom)) max(2px,env(safe-area-inset-left))}
.ref-book {max-width:none;padding:5px;grid-template-columns:minmax(0,1fr) 7px minmax(0,1fr);font-size:clamp(13px,1.8cqw,24px)}
.ref-left {padding:2px 3% 2%;grid-template-rows:minmax(120px,27%) minmax(145px,29%) minmax(90px,18%) minmax(96px,1fr) 26px;gap:1.5%}
.ref-right {padding:2px 5.5% 2% 3%;grid-template-rows:minmax(210px,39%) minmax(140px,25%) minmax(100px,1fr);gap:1.6%}
.ref-right::after {display:none}
.ref-weather-block {display:block;grid-row:1;min-height:0;position:relative}
.ref-home .home-update-button {position:absolute;left:8px;bottom:7px;z-index:3;display:flex;align-items:center;justify-content:center;gap:5px;min-width:65px;min-height:36px;padding:4px 9px;border:1px solid #b5a38188;border-radius:4px;background:#fffaf0ed;color:#403d30;font:13px/1.3 var(--body);box-shadow:0 1px 3px #64523d33;cursor:pointer;transition:background .15s}
.ref-home .home-update-button svg {width:17px!important;height:17px!important}
.ref-home .home-update-button:hover {background:#f3e1c4}
.ref-home .home-update-button:focus-visible {outline:2px solid #516f76;outline-offset:2px}
.ref-home .home-update-button:disabled {opacity:.65;cursor:progress}
@media(prefers-reduced-motion:reduce) {.ref-home .home-update-button {transition:none}}
.ref-weather {height:100%;width:100%}
.ref-weather>img.ref-weather-art {display:block;width:100%;height:100%;object-fit:cover;object-position:center bottom}
.ref-weather[data-weather-background*="-"]>img.ref-weather-art {object-fit:contain;object-position:center bottom;background:#f6f0e3}
.ref-weather .weather-outlook {position:absolute;right:4%;top:29%;z-index:2;font:11px/1.35 var(--body);background:#fffaf0e6;color:#304047;padding:2px 4px;border-radius:3px;max-width:48%}
.weather-outlook:not([hidden]) {display:table}
.ref-weather[data-weather-background*="-"] .ref-weather-stats {top:35%}
.ref-weather[data-weather-background*="-"] .home-weather-mark {display:none}
.ref-weather-block:has(.ref-weather[data-weather-background*="-"]) .home-update-button {left:auto;bottom:auto;right:8px;top:8px}
.ref-weather-main,.ref-weather-stats {text-shadow:0 1px 3px #ffffffaa}
.ref-weather-stats {background:#fffaf0ba;border-radius:3px;padding:0 .3em;color:#24383d}
.ref-weather-main {left:4%;top:6%;max-width:67%}
.ref-weather-main>div {gap:.35em;flex-wrap:wrap}
.ref-weather-main #weatherLabel {max-width:12em;font-size:.85em}
.ref-weather-main strong {font-size:2.5em}
.ref-weather-stats {top:46%;left:4%;font-size:.75em}
.home-weather-mark {position:absolute;right:12%;top:1%;width:18%;height:26%;display:grid;place-items:center;pointer-events:none}
.ref-home .home-weather-mark svg {width:100%!important;height:100%!important;stroke-width:2.5}
.ref-today {grid-row:2;padding:.25em .55em .4em;grid-template-rows:1.8em minmax(0,1fr)}
.ref-today>.ref-heading,.ref-todo>.ref-heading,.ref-future>.ref-heading {margin-top:0}
.ref-today-list {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.7em;padding:0;overflow:hidden}
.home-agenda-column {display:flex;flex-direction:column;min-width:0;min-height:0}
.home-agenda-column+section {border-left:1px solid var(--home-rule);padding-left:.7em}
.home-agenda-column h3 {font:600 .83em/1.6 var(--body);margin:0;border-bottom:1px solid var(--home-rule)}
.home-task-scroll {min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.home-task-row {display:flex;gap:.2em;align-items:start;border-bottom:1px dashed var(--home-rule);padding:.22em 0;min-width:0}
.ref-home .home-task-check {flex:0 0 1.05em;font:400 1.3em/1.7 sans-serif;min-height:32px}
.ref-home .home-task-open {flex:1;min-width:0;text-align:left;display:flex;flex-direction:column;min-height:36px;padding:0}
.home-task-open small {font:.7em/1.5 var(--body);color:var(--home-muted);white-space:normal}
.home-task-open span {font:.88em/1.45 var(--body);overflow-wrap:anywhere}
.ref-todo {grid-row:3;padding:.25em .55em .4em;display:grid;grid-template-rows:1.8em minmax(0,1fr);min-height:0}
.ref-todo .home-task-row {padding:.1em 0}
.ref-todo .home-task-open {flex-direction:row;align-items:baseline;gap:.6em;min-height:30px}
.ref-todo .home-task-open small {flex:0 0 8.4em}
.ref-favorites-block {grid-row:4;display:block;min-height:0}
.ref-favorites {height:100%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:8px 9px;overflow:visible;padding:0;align-items:center}
.ref-favorites>button {width:100%;height:100%;min-height:0;padding:0;background:none;box-shadow:none;border:0}
.ref-favorites .app-tile {width:min(100%,64px)!important;height:auto!important;aspect-ratio:1;border-radius:0!important;max-height:100%!important}
.ref-favorites .app-tile img {border-radius:0}
.ref-favorites .add-app-button .app-tile {font-size:30px!important;width:100%!important;height:100%!important}
.ref-dock {grid-row:5;height:26px;font-size:1em}
.ref-dock>button {font-size:.68em}
.ref-calendar {grid-row:1;padding:0 .25em .25em;grid-template-rows:1.7em 1.5em minmax(0,1fr)}
.ref-calendar-controls {justify-content:flex-start;padding-right:4em;gap:.2em}
.ref-calendar-controls h1 {order:-1;margin-right:.2em}
.ref-calendar-switch {top:0;right:.25em;z-index:4}
.ref-calendar-switch button {font-size:.7em;min-width:32px;min-height:28px;opacity:1}
.ref-calendar-controls h1 {font-size:1.12em}
.ref-calendar-grid .calendar-day {font-size:1.12em!important}
.ref-future {grid-row:2;padding:.25em .5em .25em;grid-template-rows:1.8em minmax(0,1fr)}
#homeFamilyNext {display:grid;grid-template-rows:repeat(4,minmax(0,1fr));overflow:auto}
.home-family-next {display:grid;grid-template-columns:4em minmax(0,1fr);align-items:center;gap:.55em;width:100%;min-height:30px;border-bottom:1px dashed var(--home-rule)!important;text-align:left}
.home-family-next>span {font-size:.85em;color:var(--person);font-weight:600;overflow-wrap:anywhere}
.home-family-next>div {min-width:0;display:grid;grid-template-columns:7em minmax(0,1fr);gap:.4em;align-items:baseline}
.home-family-next time,.home-family-next small {font:.7em/1.6 var(--body)}
.home-family-next b {font:.82em/1.5 var(--body);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.home-photo-pair {grid-row:3;display:grid;grid-template-columns:1fr 1fr;gap:10px;min-height:0;min-width:0;padding:2px}
.home-photo-pair .ref-photo {width:100%;height:100%;min-height:0;transform:none;border:4px solid #fffaf1;border-bottom-width:6px;box-shadow:0 2px 4px #806b4933}
.ref-actions {grid-row:4;gap:.6em;align-items:center}
.ref-actions button {width:36px;height:36px}
.ref-actions button svg {width:23px!important;height:23px!important}
.folio-reference .folio-edge-tabs {right:3px!important;top:12%;width:32px}
.folio-reference .folio-edge-tabs button {width:32px!important;height:72px;border-radius:5px 3px 3px 5px!important;box-shadow:-2px 2px 3px #785b3430}
.ref-right {grid-template-columns:minmax(0,1fr)}
.ref-right-apps {grid-row:1/4;grid-column:1;padding-right:0;min-width:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:8px}
.ref-right-apps .right-apps-grid {width:100%!important;height:100%!important;min-height:0;max-width:none!important;gap:10px!important;overflow:auto}
.ref-right-apps .right-apps-grid>button {min-width:0!important;width:100%!important;max-width:none!important;display:flex!important;align-items:center;justify-content:center;min-height:44px!important}
.ref-right-apps .app-tile {width:min(100%,clamp(56px,9cqw,108px))!important;height:auto!important;aspect-ratio:1;max-width:100%!important;flex:none}
.ref-right-apps .app-tile img,.ref-right-apps .app-tile svg {width:100%!important;height:100%!important;object-fit:contain}
.ref-right-apps .right-apps-grid>button[data-launch-package]>span:not(.app-tile),.ref-right-apps .right-apps-grid small {display:none}
.ref-actions {grid-column:1}
.folio-reference [data-view="apps"] .app-tile {width:76px!important;height:76px!important;min-width:76px!important;max-width:none!important}
.folio-reference [data-view="apps"] .app-tile img,.folio-reference [data-view="apps"] .app-tile svg {width:100%!important;height:100%!important;object-fit:contain}
.folio-reference [data-view="apps"] .app-picker-item {min-height:96px!important;grid-template-columns:76px minmax(0,1fr) auto!important}
.ref-home .is-left-portal>.ref-todo,.ref-home .is-left-portal>.ref-favorites-block {visibility:hidden}
.dark .home-task-open small {color:#d2c3a8}.dark .home-family-next>span {color:#e4d7bc}
@media(width < 700px), (aspect-ratio < 4/5) {
 .ref-book {padding:4px;font-size:clamp(14px,3.9vw,21px)}
 .ref-left {padding:2px 3% 1.5%;grid-template-rows:minmax(120px,26%) minmax(150px,29%) minmax(80px,17%) minmax(100px,1fr) 42px;gap:1.3%}
 .ref-weather-block {grid-row:1;display:block}
 .ref-today {grid-row:2}
 .ref-todo {grid-row:3}
 .ref-favorites-block {display:block;grid-row:4}
 .ref-cover-shortcuts {grid-row:5;display:grid;grid-template-columns:1fr 1.2fr .8fr;gap:5px;padding:0}
 .ref-cover-shortcuts button {font:11px/1.3 var(--body);gap:4px;min-height:38px;white-space:nowrap}
 .ref-cover-shortcuts button:nth-child(3) {background:linear-gradient(#b9d7dfaa,#b9d7dfaa),var(--ref-texture)}
 .ref-cover-shortcuts button:nth-child(2)::after {display:none}
 .ref-cover-shortcuts svg {width:19px!important;height:19px!important}
 .ref-home.is-cover-calendar .ref-right {padding:28px 24px 8px 8px;grid-template-rows:minmax(210px,39%) minmax(150px,25%) minmax(100px,1fr);gap:1.5%}
 .ref-dock {display:none}
 .ref-home .empty-state {font-size:.8em;padding:.5em 0}
 .home-family-next>div {grid-template-columns:1fr;gap:0}
 .folio-reference [data-view="apps"] .app-tile {width:64px!important;height:64px!important;min-width:64px!important}
 .folio-reference [data-view="apps"] .app-picker-item {grid-template-columns:64px minmax(0,1fr) auto!important;min-height:84px!important}
}
@media(max-height:650px) {.folio-reference .ref-home.is-active{overflow:auto}.ref-book{min-height:635px}}

/* 各セルの実寸を基準に正方形化。幅だけで拡大せず、行数が増えたら高さにも合わせる。 */
.ref-home .home-add-entry {font:.68em/1.4 var(--body);min-height:30px;padding:0 .3em}
.home-return-tab {position:fixed;top:4px;left:15px;z-index:55;width:76px;min-height:32px;padding:3px 14px;border:1px solid #b89c7040;border-radius:3px 3px 8px 5px;background:#eccb96 var(--ref-texture);background-blend-mode:multiply;box-shadow:1px 2px 3px #785b3430;font:15px/1.5 var(--body);color:var(--ref-ink);cursor:pointer}
.home-return-tab[hidden] {display:none!important}
.folio-reference.has-home-return .ref-home .ref-left {padding-top:34px}
.folio-reference.has-home-return .detail-view,.folio-reference.has-home-return .ref-detail.is-active {padding-top:40px!important}
.folio-reference .folio-edge-tabs [data-edge-target="apps"] {background-color:#d4d6aa!important}
.folio-reference .folio-edge-tabs [data-edge-target="ai"] {background-color:#aad4e2!important}
.folio-reference .folio-edge-tabs [data-edge-target="candidates"] {background-color:#edb8a7!important}
.folio-reference .folio-edge-tabs [data-edge-target="memo"] {background-color:#eccb96!important}
.folio-reference .folio-edge-tabs [data-edge-target="settings"] {background-color:#cbb9d8!important}
.ref-home #favorites>button,.ref-home #rightAppsGrid>button {
 container-type:size;box-sizing:border-box;display:grid!important;place-items:center;
 width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;
 padding:0!important;gap:0!important;align-content:normal!important;
}
.ref-home #favorites>button .app-tile,.ref-home #rightAppsGrid>button .app-tile {
 --fit-icon:min(90cqw,90cqh);
 width:var(--fit-icon)!important;height:var(--fit-icon)!important;
 min-width:0!important;min-height:0!important;max-width:100%!important;max-height:100%!important;
 aspect-ratio:1;margin:0!important;flex:none;box-sizing:border-box;
}
.ref-home #favorites .app-tile>img,.ref-home #favorites .app-tile>svg,
.ref-home #rightAppsGrid .app-tile>img,.ref-home #rightAppsGrid .app-tile>svg {
 display:block;width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;
 max-width:100%!important;max-height:100%!important;object-fit:contain!important;
}
