:root{
 --glass-panel:rgba(250,251,250,.55);
 --glass-sidebar:rgba(240,244,243,.65);
 --glass-chrome:rgba(248,250,248,.38);
 --glass-picker:rgba(250,252,251,.52);
 --glass-modal:rgba(247,250,248,.88);
 --glass-level:0%;
}

/* Every glass surface now follows the user-selected density. */
.sidebar,.topbar,.footer,.card,.panel,.calendar-picker,.sharing-inbox,.tag-filters,.calendar-toolbar,.calendar-grid,.calendar-list,.modal,.date-editor,.clock-row,.clock-heading,.add-clock,.news-page-list,.source-tabs,.profile-menu{background:var(--glass-panel)}
.sidebar{background:var(--glass-sidebar)}
.topbar,.footer{background:var(--glass-chrome)}
.calendar-picker{background:var(--glass-picker)}
.modal{background:var(--glass-modal)}

/* Account menu */
.topbar{position:relative;z-index:6;overflow:visible}
.page-content{position:relative;z-index:0}
.profile-menu-wrap{position:relative;display:flex;align-items:center}
.avatar{display:grid;place-items:center;padding:0;text-transform:uppercase;font-weight:700;transition:transform .18s ease,background .18s ease}
.avatar:hover{transform:translateY(-1px)}
.profile-menu{position:absolute;z-index:9;right:0;top:calc(100% + 12px);width:min(286px,calc(100vw - 28px));padding:16px;border:1px solid var(--glass-line);border-radius:16px;backdrop-filter:blur(20px) saturate(120%);-webkit-backdrop-filter:blur(20px) saturate(120%);box-shadow:0 20px 60px #1d353c26;display:grid;gap:15px}
.profile-menu[hidden]{display:none}
.profile-menu{background:rgb(250,251,250)}
.avatar.guest-avatar,.profile-initial.guest-avatar{background:#e0e3e5;color:#92999e;border-color:#d1d6d9;overflow:hidden}
.guest-avatar svg{display:block;width:100%;height:100%;fill:currentColor}
.profile-account-actions{display:grid;gap:4px;border-top:1px solid #dce2e3;padding-top:10px}
.profile-account-action{border:0;background:transparent;color:var(--ink);text-align:left;padding:10px;border-radius:8px;font-size:12px}
.profile-account-action:hover{background:#e9eeee}
.profile-account-action.sign-out{color:#b43c3c}
.profile-account-action.sign-out:hover{background:#f7e9e9}
.profile-menu-head{display:flex;align-items:center;gap:11px;min-width:0}
.profile-initial{width:34px;height:34px;flex:0 0 auto;display:grid;place-items:center;border:1px solid #8da0a04d;border-radius:50%;background:rgba(255,255,255,.36);color:#355c65;font:700 12px var(--mono)}
.profile-menu-head>div{display:grid;gap:3px;min-width:0}
.profile-menu-head strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.profile-menu-head small,.profile-control>span{font:10px var(--mono);color:#65777b;letter-spacing:.03em}
.profile-control{display:grid;gap:7px;min-width:0}
.profile-control select{width:100%;min-width:0;border:1px solid #91a0a04d;border-radius:9px;background-color:rgba(255,255,255,.32);padding:9px 38px 9px 11px;color:var(--ink);font-size:12px}
.opacity-control>span{display:flex;justify-content:space-between;gap:12px}
.opacity-control output{font-variant-numeric:tabular-nums;color:#355c65}
.opacity-control input[type="range"]{width:100%;height:13px;margin:2px 0 0;border:1px solid var(--glass-line);border-radius:999px;appearance:none;-webkit-appearance:none;background:linear-gradient(to right,rgba(53,92,101,.44) 0 var(--glass-level),rgba(255,255,255,.22) var(--glass-level) 100%);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 1px 3px #30484e18}
.opacity-control input[type="range"]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:20px;height:20px;border:1px solid #ffffffba;border-radius:50%;background:#496d75;box-shadow:0 3px 12px #243b4144}
.opacity-control input[type="range"]::-moz-range-thumb{width:20px;height:20px;border:1px solid #ffffffba;border-radius:50%;background:#496d75;box-shadow:0 3px 12px #243b4144}

/* Calendar density and truncation */
.calendar-grid,.cal-row,.cal-day{min-width:0}
.cal-day{min-height:124px;overflow:hidden;cursor:default}
.day-number{cursor:pointer}
.cal-event{display:block;width:100%;min-width:0;max-width:100%;min-height:0;text-align:left;white-space:normal;overflow:hidden;border:0;border-left:2px solid var(--event-color);cursor:pointer}
.cal-event>span{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;line-height:1.3;max-height:2.6em;overflow-wrap:anywhere}
.more-events{display:block;width:100%;margin-top:4px;padding:2px 4px;border:0;background:transparent;color:#536f77;text-align:left;font:9px var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* A date opens a complete, scrollable event list. */
.date-modal-events{display:grid;gap:7px;max-height:min(58vh,520px);overflow:auto;padding:2px}
.date-modal-event{width:100%;display:grid;grid-template-columns:minmax(70px,90px) minmax(0,1fr);gap:6px 12px;align-items:center;text-align:left;border:1px solid #87999a2e;border-radius:10px;background:rgba(255,255,255,.3);color:inherit;padding:12px}
.date-modal-event time{font:10px var(--mono);color:var(--green)}
.date-modal-event strong{min-width:0;overflow-wrap:anywhere;font-size:12px;font-weight:600}
.date-modal-event>span{grid-column:2;display:flex;flex-wrap:wrap;gap:5px;min-width:0}
.date-modal-empty{margin:4px 0;color:var(--muted);font-size:13px}

/* Defensive overflow rules for narrow screens and long user content. */
.card,.panel,.calendar-picker,.sharing-inbox,.tag-filters,.calendar-toolbar,.calendar-list,.calendar-item,.event-row,.request-row,.picker-heading,.picker-tools,.profile-menu,.modal,.modal-head{min-width:0;overflow-wrap:anywhere}
.calendar-item>*{min-width:0}
.calendar-item strong,.overview-event strong,.news-headline,.news-full-row h3,.detail-content{overflow-wrap:anywhere;word-break:break-word}
.tag-chips{min-width:0;display:flex;flex-wrap:wrap;gap:4px}
.modal-head h2{min-width:0;overflow-wrap:anywhere}

@media(max-width:600px){
 .topbar-right{position:relative}
 .profile-menu{position:absolute;top:calc(100% + 12px);right:0}
 .cal-day{min-height:98px;padding:6px 4px}
 .cal-event{font-size:8px;padding:3px;margin-top:2px}
 .month-agenda{display:none}
 .calendar-item.event-row{grid-template-columns:minmax(72px,90px) minmax(0,1fr)}
 .calendar-item.event-row .tag-chips{grid-column:2}
 .date-modal-event{grid-template-columns:1fr;gap:5px}
 .date-modal-event>span{grid-column:1}
 .request-row{align-items:flex-start;flex-wrap:wrap}
}