/* FASE 1 · One compact app header, adaptively sized; no data/sync behavior. */
body.v23-shell-active>header{display:none!important}
#appShell{position:relative}
#appShell>.v23-topbar{display:none!important}
body #appShell>.accountBar.fase1-topbar{
 display:flex!important;flex-wrap:nowrap!important;align-items:center!important;
 position:relative;z-index:75;box-sizing:border-box;
 width:100%!important;max-width:100%!important;min-width:0!important;
 min-height:54px!important;margin:0!important;padding:5px max(9px,env(safe-area-inset-right,0px)) 5px max(9px,env(safe-area-inset-left,0px))!important;
 border-radius:0!important;gap:5px!important;
 background:var(--v24-navigation,var(--v22-soft,#fff5fa))!important;
 border:0!important;border-bottom:1px solid #ead4df!important;
 box-shadow:0 2px 8px #70384c0a!important;
}
body #appShell>.accountBar.fase1-topbar>.fase1-identity{
 display:flex;flex-direction:column;justify-content:center;flex:1 1 0!important;
 min-width:0!important;width:auto!important;max-width:none!important;overflow:hidden;line-height:1.1;
}
#appShell .fase1-brand{display:block;font-size:clamp(12px,2.9vw,17px);font-weight:850;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--v24-text,#713a56)}
#appShell .fase1-identity #accountEmail{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;overflow-wrap:normal;word-break:normal;font-size:11px!important;line-height:1.2;opacity:.86;margin-top:2px}
#appShell .fase1-legacy-status{position:absolute!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;width:1px!important;height:1px!important;overflow:hidden!important;white-space:nowrap!important}
body #appShell>.accountBar.fase1-topbar button{
 box-sizing:border-box;flex:0 0 auto!important;display:flex!important;align-items:center;justify-content:center;
 width:43px!important;height:43px!important;min-width:43px!important;min-height:43px!important;
 max-width:none!important;margin:0!important;padding:0!important;border-radius:11px;
 font-weight:800;color:var(--v24-text,#753c57);
}
body #appShell>.accountBar.fase1-topbar button[hidden]{display:none!important}
body #appShell>.accountBar.fase1-topbar #fase1SyncToggle{width:auto!important;min-width:43px!important;padding:0 9px!important;gap:5px;border:1px solid #dcbfcf!important;background:var(--v24-secondary,#fff6fa)!important}
#fase1SyncToggle .fase1-sync-symbol{display:inline-flex;justify-content:center;align-items:center;width:21px;height:21px;border-radius:50%;font-size:15px;line-height:1;font-weight:900;background:#c9cccf;color:#273340;flex:none}
#fase1SyncToggle .fase1-sync-caption{font-size:11px;font-weight:750;white-space:nowrap}
#fase1SyncToggle[data-state="synced"] .fase1-sync-symbol{background:#166c52;color:white}
#fase1SyncToggle[data-state="syncing"] .fase1-sync-symbol{background:#366ec0;color:white;animation:fase1-spin .85s linear infinite}
#fase1SyncToggle[data-state="pending"] .fase1-sync-symbol{background:#bd7618;color:white}
#fase1SyncToggle[data-state="error"] .fase1-sync-symbol{background:#b53f51;color:white}
#fase1SyncToggle[data-state="offline"] .fase1-sync-symbol,#fase1SyncToggle[data-state="unconfigured"] .fase1-sync-symbol{background:#6c7583;color:white}
#fase1SyncToggle[data-state="checking"] .fase1-sync-symbol{background:#a67434;color:white}
@keyframes fase1-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){#fase1SyncToggle[data-state="syncing"] .fase1-sync-symbol{animation:none}}
/* Screen-reader access to original cloudStatus; the visible status comes from verified snapshot. */
#appShell>.fase1-sync-details{
 position:absolute;top:58px;right:8px;z-index:105;
 width:min(370px,calc(100% - 16px));min-width:0;max-height:min(440px,calc(100dvh - 95px));overflow:auto;
 padding:13px;border:1px solid #e6c9d8;border-radius:16px;
 background:var(--v24-cards,#fff);color:var(--v24-text,#57364a);
 box-shadow:0 12px 32px #44283e36;box-sizing:border-box;
 overscroll-behavior:contain;
}
#appShell>.fase1-sync-details[hidden]{display:none!important}
.fase1-details-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.fase1-details-head strong{font-size:14px}
#appShell .fase1-details-head button{width:35px;height:35px;min-height:35px;min-width:35px;padding:0;font-size:21px;border-radius:8px}
.fase1-status-long{font-weight:800;font-size:14px;margin:8px 0}
.fase1-stats{margin:9px 0;display:grid;gap:8px;grid-template-columns:repeat(2,minmax(0,1fr))}
.fase1-stats>div{padding:9px;border-radius:10px;background:var(--v22-soft,#fff5f9);min-width:0}
.fase1-stats dt{font-size:11px;opacity:.85}
.fase1-stats dd{font-size:12px;margin:5px 0 0;font-weight:750;overflow-wrap:anywhere}
.fase1-sync-hint{font-size:12px;line-height:1.45;overflow-wrap:anywhere}
#appShell #fase1SyncNow{display:block;width:100%;min-height:43px;margin-top:8px;font-size:13px}
#fase1SyncNow:disabled{opacity:.55;cursor:default}
#appShell .fase1-conflicts-panel{margin:10px 0 0;max-height:none;overflow:visible}
#appShell .fase1-conflicts-panel[hidden]{display:none!important}
#appShell .fase1-topbar button:focus-visible,#appShell>.fase1-sync-details button:focus-visible{outline:3px solid #2357b8;outline-offset:2px}
@media screen and (max-width:760px){
 body.v23-shell-active:not(.v21-calendar-active) #appShell>.accountBar.fase1-topbar{order:0!important;flex:0 0 auto!important;min-height:54px!important}
 body #appShell>.accountBar.fase1-topbar #fase1SyncToggle{padding:0!important;width:43px!important;min-width:43px!important}
 #fase1SyncToggle .fase1-sync-caption{display:none}
 body.v23-shell-active:not(.v21-calendar-active) #appShell>.page:not([hidden]),body.v23-shell-active:not(.v21-calendar-active) #appShell>#v13MasterPanel:not([hidden]){order:3!important}
 body.v23-shell-active:not(.v21-calendar-active) #appShell>.nav{order:4!important}
 /* Calendar: same global header, existing Back control moved into it. */
 body.v21-calendar-active #appShell{display:flex!important;flex-direction:column!important}
 body.v21-calendar-active #appShell>.accountBar.fase1-topbar{display:flex!important;order:0!important;flex:0 0 auto!important}
 body.v21-calendar-active #calendarPage{height:auto!important;min-height:0!important;max-height:none!important;flex:1 1 0!important;order:1;overflow:auto!important}
 body.v21-calendar-active #calendarPage .v21-calendar-head{display:none!important}
 body.v21-calendar-active #appShell>.nav{display:none!important}
}
@media(max-width:390px){
 body #appShell>.accountBar.fase1-topbar{gap:4px!important;padding-left:7px!important;padding-right:7px!important}
 body #appShell>.accountBar.fase1-topbar button,body #appShell>.accountBar.fase1-topbar #fase1SyncToggle{height:42px!important;width:42px!important;min-height:42px!important;min-width:42px!important}
 #appShell .fase1-brand{font-size:12.5px}
 #appShell .fase1-identity #accountEmail{font-size:10px!important}
}
@media screen and (min-width:761px){
 body #appShell>.accountBar.fase1-topbar{border-radius:0 0 12px 12px!important;min-height:59px!important;padding:7px 12px!important}
}
body.v22-night #appShell>.accountBar.fase1-topbar{background:#20242e!important;border-color:#484052!important;color:#f5eaf0}
body.v22-night #appShell .fase1-brand{color:#f9d2e7}
body.v22-night #appShell>.fase1-sync-details{background:#20242e;border-color:#494354;color:#f8e6f0}
body.v22-night .fase1-stats>div{background:#35303c}
@media print{#appShell>.accountBar.fase1-topbar,#appShell>.fase1-sync-details{display:none!important}}
/* Calendar Back remains readable even where older CSS iconifies other buttons. */
body #appShell>.accountBar.fase1-topbar #v21CalendarBack{font-size:26px!important;line-height:1!important}