/* Premium UI V1: offline font roles; licensed local fonts can be added later. */
:root{color-scheme:dark;--bg:#0A0D14;--bg-elevated:#10141D;--surface:#151A24;--surface-2:#1B212D;--surface-3:#232A38;--border:#262D3B;--border-strong:#333C4E;--text:#EDEFF4;--text-dim:#9BA3B4;--text-faint:#666F82;--accent:#8B7CF6;--accent-2:#E8B368;--accent-soft:rgba(139,124,246,.14);--accent-line:rgba(139,124,246,.35);--grad-brand:linear-gradient(135deg,#8B7CF6 0%,#E8B368 100%);--success:#34D399;--warning:#D97706;--danger:#F0667A;--info:#4EC1E0;--success-soft:rgba(52,211,153,.13);--warning-soft:rgba(217,119,6,.16);--danger-soft:rgba(240,102,122,.14);--info-soft:rgba(78,193,224,.14);--font-ui:"Segoe UI Variable","Segoe UI",system-ui,sans-serif;--font-display:Georgia,Constantia,serif;--font-data:"Cascadia Mono",Consolas,monospace;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-14:56px;--space-18:72px;--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-pill:999px;--shadow-card:0 1px 0 rgba(255,255,255,.03) inset,0 24px 48px -30px rgba(0,0,0,.7);--shadow-pop:0 1px 0 rgba(255,255,255,.04) inset,0 30px 60px -20px rgba(0,0,0,.75);--glow-accent:0 0 0 1px var(--accent-line),0 0 32px -8px rgba(139,124,246,.45);--motion-fast:120ms;--motion-state:200ms;--motion-emphasis:350ms;font:14px var(--font-ui);color:var(--text);background:var(--bg)}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 15% 0%,rgba(139,124,246,.055),transparent 48%),radial-gradient(ellipse at 90% 0%,rgba(232,179,104,.035),transparent 42%);background-attachment:fixed}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;background:none;color:inherit;min-height:44px;min-width:44px;transition:background var(--motion-fast) ease,border-color var(--motion-fast) ease}button:disabled{opacity:.5;cursor:not-allowed}button:not(:disabled):active{background:var(--surface-3)}a{color:inherit}svg{width:22px;height:22px;flex-shrink:0}h1,h2,h3,p{margin-top:0}h1,h2,h3{text-wrap:balance}h1{font-size:clamp(28px,3vw,42px);line-height:1.15;font-weight:800;letter-spacing:-.02em;margin-bottom:12px}h2{font-size:17px;line-height:1.4;font-weight:700;letter-spacing:-.01em}h3{font-size:15px}p{line-height:1.6;color:var(--text-dim)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}input:focus,select:focus,textarea:focus{border-color:var(--accent)}.muted,.hint{color:var(--text-dim)}.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:11px;font-weight:700;line-height:16px;color:var(--text-dim);margin-bottom:12px}.mono,.metric,.stat-value,time,.time-block{font-family:var(--font-data);font-variant-numeric:tabular-nums}.skip-link{position:fixed;top:-100px;left:16px;z-index:30;background:var(--surface-3);padding:12px 20px;border-radius:8px}.skip-link:focus{top:12px}
/* Shell */
.shell{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100dvh}.sidebar{position:sticky;top:0;height:100dvh;background:rgba(16,20,29,.94);backdrop-filter:blur(14px);border-right:1px solid var(--border);padding:32px 16px 20px;display:flex;flex-direction:column;overflow-y:auto}.brand{display:flex;align-items:center;gap:12px;margin-bottom:40px;padding:0 8px}.brand-mark{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;border:1px solid var(--accent-line);border-radius:14px;background:var(--accent-soft);color:var(--text);font:italic 30px var(--font-display)}.brand strong{display:block;font-size:19px;letter-spacing:-.02em;font-weight:700}.brand small{display:block;font-size:9px;letter-spacing:.14em;margin-top:4px;color:var(--text-dim)}.nav-label{font-size:11px;letter-spacing:.14em;color:var(--text-dim);margin:0 12px 12px}.sidebar nav{display:grid;gap:4px}.nav-item{position:relative;display:flex;align-items:center;gap:12px;min-height:44px;padding:8px 12px;border:1px solid transparent;border-radius:var(--radius-md);text-decoration:none;font-size:13px;font-weight:600;color:var(--text-dim);width:100%;justify-content:flex-start}.nav-item svg{width:20px;height:20px}.nav-item:hover{background:var(--surface-2)}.nav-item.active{background:var(--accent-soft);border-color:var(--accent-line);color:var(--text)}.nav-item.active:before{content:"";position:absolute;left:-1px;top:10px;bottom:10px;width:2px;background:var(--accent);border-radius:2px}.nav-tools{border-top:1px solid var(--border);padding-top:16px;margin-top:20px;display:grid;gap:4px}.sidebar-bottom{margin-top:auto;padding-top:24px}.profile{border:1px solid var(--border);background:var(--surface);border-radius:14px;padding:12px;display:flex;align-items:center;gap:12px}.avatar{display:grid;place-items:center;flex-shrink:0;width:36px;height:36px;border-radius:50%;background:var(--accent-soft);border:1px solid var(--accent-line);font-size:12px;font-weight:700}.profile-name{min-width:0;overflow-wrap:anywhere;font-size:12px}.profile-name small{display:block;color:var(--text-dim);font-size:11px;margin-top:4px}.local-tag{font-size:11px;color:var(--text-dim);display:flex;align-items:center;gap:8px;padding:16px 12px 0}.local-tag svg{height:14px;width:14px}.workspace{min-width:0}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 40px;border-bottom:1px solid var(--border);background:rgba(16,20,29,.8);backdrop-filter:blur(14px)}.topbar-left{display:flex;align-items:center;gap:8px}.breadcrumb{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--text-dim)}.breadcrumb svg{width:16px;height:16px}.breadcrumb span:last-child{color:var(--text)}.topbar-right{display:flex;align-items:center;gap:24px;font-size:12px;color:var(--text-dim)}.private-badge{display:flex;align-items:center;gap:8px}.private-badge svg{width:16px;height:16px}.content{max-width:1180px;margin:auto;padding:40px;min-width:0}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:32px}.page-heading p{margin:0;max-width:65ch}.page-heading.personal h1{font-family:var(--font-display);font-weight:400;font-style:italic;letter-spacing:0;font-size:clamp(34px,3.5vw,42px)}.drawer-toggle{display:none}.drawer-close{margin-left:auto}body:has(dialog[open]){overflow:hidden}
/* Shared components */
.button{min-height:44px;padding:10px 20px;border-radius:var(--radius-md);font-size:13px;font-weight:700;border:1px solid transparent;text-decoration:none}.primary{background:var(--grad-brand);color:#1A1024}.primary:hover{filter:brightness(1.08)}.secondary{background:var(--surface-2);border-color:var(--border-strong);color:var(--text)}.secondary:hover{background:var(--surface-3)}.ghost{border-color:var(--border);background:transparent;color:var(--text-dim)}.ghost:hover{background:var(--surface-2)}.danger{background:var(--danger-soft);border-color:rgba(240,102,122,.35);color:var(--danger)}.text-link{font-size:12px;color:var(--text-dim);gap:8px;padding:8px;border-radius:8px;white-space:nowrap}.text-link:hover{background:var(--surface-2)}.text-link svg{width:16px;height:16px}.card{background:linear-gradient(180deg,var(--surface),var(--surface-2));border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-card);padding:20px;min-width:0}.card-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.card-header h2{display:flex;align-items:center;gap:12px;margin:0}.card-header h2 svg{color:var(--text-dim);width:20px;height:20px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.pill{display:inline-flex;align-items:center;gap:8px;padding:4px 10px;border:1px solid transparent;border-radius:var(--radius-pill);font-size:11.5px;font-weight:700;line-height:1.4;max-width:100%;color:var(--text-dim);background:var(--surface-2)}.pill:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}.pill.good{color:var(--success);background:var(--success-soft)}.pill.warning{color:var(--warning);background:var(--warning-soft)}.pill.bad{color:var(--danger);background:var(--danger-soft)}.pill.neutral{color:var(--text-dim);border-color:var(--border-strong)}.chip{display:inline-flex;align-items:center;gap:8px;font-size:12px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-pill);padding:4px 12px;color:var(--text-dim)}.chip svg{width:14px;height:14px}.chip-row{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.chip.selected{color:var(--text);background:var(--accent-soft);border-color:var(--accent-line)}.empty{text-align:center;padding:32px 16px;display:flex;flex-direction:column;align-items:center;gap:12px;color:var(--text-dim);line-height:1.6}.empty>svg{width:40px;height:40px;color:var(--text-dim);margin-bottom:4px}.empty strong{font-size:15px;color:var(--text);font-weight:600}.empty p{font-size:13px;max-width:48ch;margin:0}.empty .button{margin-top:8px}.progress{display:block;width:100%;height:6px;accent-color:var(--accent);border:0;border-radius:8px;overflow:hidden;margin:12px 0}.progress::-webkit-progress-bar{background:var(--surface-3)}.progress::-webkit-progress-value{background:var(--accent)}.progress::-moz-progress-bar{background:var(--accent)}.ring{position:relative;width:96px;height:96px;flex-shrink:0;display:grid;place-items:center}.ring svg{position:absolute;width:100%;height:100%;transform:rotate(-90deg)}.ring-track{stroke:var(--surface-3)}.ring-value{stroke:var(--accent);transition:stroke-dasharray var(--motion-state) ease}.ring strong{font:600 21px var(--font-data)}.metric{font-size:32px;line-height:1.2;font-weight:600;overflow-wrap:anywhere}.metric small{font-family:var(--font-ui);font-size:12px;color:var(--text-dim);font-weight:400}.hint{font-size:12.5px;line-height:1.6;margin:12px 0 0}.footer{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--border);padding-top:20px;margin-top:40px;font-size:11px;color:var(--text-dim)}
/* Today */
.hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 180px;gap:32px;background:radial-gradient(ellipse at 85% 120%,rgba(232,179,104,.08),transparent 60%),linear-gradient(180deg,var(--surface),var(--surface-2));border:1px solid var(--border-strong);border-radius:var(--radius-lg);padding:32px;margin-bottom:24px;box-shadow:var(--shadow-card);overflow:hidden}.hero h2{font-size:24px;line-height:1.3;margin-bottom:12px;max-width:30ch}.hero p{font-size:14px;max-width:60ch;margin-bottom:16px}.hero-aside{border-left:1px solid var(--border-strong);padding-left:24px;display:flex;flex-direction:column;justify-content:center;gap:12px}.hero-aside strong{font:600 40px var(--font-data)}.hero-aside span,.hero-aside small{font-size:12px;color:var(--text-dim);line-height:1.6}.attention{margin-bottom:24px}.attention-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.attention-item{display:flex;align-items:flex-start;gap:12px;padding:12px;text-align:left;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;min-width:0}.attention-item>svg{color:var(--text-dim);width:18px;height:18px;margin-top:4px}.attention-item strong{display:block;font-size:12px;overflow-wrap:anywhere;line-height:1.5}.attention-item small{display:block;font-size:11px;color:var(--text-dim);margin:4px 0 8px}.stat-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--border);border-radius:14px;background:linear-gradient(180deg,var(--surface),var(--surface-2));padding:20px 0;margin-bottom:24px;box-shadow:var(--shadow-card)}.stat{padding:0 20px;border-right:1px solid var(--border);min-width:0;display:flex;align-items:center;gap:12px}.stat:last-child{border:0}.stat>svg{padding:8px;width:40px;height:40px;border-radius:50%;background:var(--accent-soft);color:var(--text-dim)}.stat-value{font-size:26px;line-height:1.2;font-weight:600}.stat-label{font-size:11px;color:var(--text-dim);margin-top:8px;line-height:1.4}.home-grid .card:first-child{border-top-color:var(--accent-line)}
/* Collections */
.record{display:flex;align-items:center;gap:12px;padding:16px 0;border-bottom:1px solid var(--border);min-width:0}.record:last-child{border-bottom:0}.record:first-child{padding-top:0}.record-copy{min-width:0;flex:1}.record-title{font-size:14px;font-weight:600;text-align:left;justify-content:flex-start;padding:4px 0;overflow-wrap:anywhere;min-height:44px}.record-title:hover{color:var(--accent)}.record-detail{color:var(--text-dim);font-size:12.5px;line-height:1.6;overflow-wrap:anywhere;white-space:pre-wrap}.record-action{width:44px;height:44px;flex-shrink:0;border:1px solid var(--border-strong);border-radius:50%;color:var(--text-dim)}.record-action:hover{background:var(--accent-soft)}.record-action.done{background:var(--success-soft);color:var(--success)}.record.completed .record-title{text-decoration:line-through;color:var(--text-dim)}.record.completing{opacity:.5;transition:opacity var(--motion-emphasis) ease}.record.completing .record-title{text-decoration:line-through}.priority-flag{color:var(--warning);width:16px;height:16px}.record>.pill{flex-shrink:0}.time-block{border-left:2px solid var(--accent);padding-left:12px;min-width:44px;font-size:18px}.collection-toolbar{display:flex;align-items:center;gap:16px;margin-bottom:24px;flex-wrap:wrap}.search-field{position:relative;flex:1;max-width:400px;min-width:180px}.search-field>svg{position:absolute;left:12px;top:13px;color:var(--text-dim);width:18px;height:18px;pointer-events:none}.search-field input{padding-left:40px}.collection-toolbar .hint{margin:0}.collection{display:grid;gap:16px}.collection .record-detail{max-height:180px;overflow:auto}.note-grid,.cert-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.group-title{font-size:11px;letter-spacing:.14em;color:var(--text-dim);text-transform:uppercase;display:flex;align-items:center;gap:8px;margin:8px 0 0}.group-title svg{width:16px;height:16px}.note-card{display:flex;flex-direction:column;align-items:flex-start;min-height:200px}.note-card .record-detail{flex:1;margin:8px 0 16px}.note-card .chip-row{margin:0}.cert-top{display:flex;align-items:center;gap:20px;margin-bottom:16px}.cert-footer{border-top:1px solid var(--border);padding-top:16px;display:flex;gap:12px;justify-content:space-between;align-items:center;flex-wrap:wrap}.module-summary{margin-bottom:24px}.summary-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}.summary-heading h2{margin:0}.summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.summary-grid .metric{margin-top:12px}.summary-grid p{font-size:12px;margin:8px 0 0}.fitness-summary{display:flex;align-items:center;gap:24px}.fitness-summary>div:last-child{flex:1}.week-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin-bottom:24px}.day-cell{border:1px solid var(--border);border-radius:14px;padding:12px 8px;min-width:0;display:flex;flex-direction:column;gap:8px;background:var(--surface);text-align:center}.day-cell.current{background:var(--accent-soft);border-color:var(--accent-line)}.day-cell strong{font:600 20px var(--font-data)}.day-cell span,.day-cell small{color:var(--text-dim);font-size:11px}.day-cell.selected{outline:2px solid var(--accent);outline-offset:2px}.week-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.streak{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}.streak-day{display:grid;justify-items:center;gap:8px;font-size:11px;color:var(--text-dim)}.streak-dot{display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--border-strong);border-radius:50%;background:var(--surface-2)}.streak-dot.logged{background:var(--accent-soft);border-color:var(--accent-line);color:var(--text)}.streak-dot svg{width:16px;height:16px}.preview-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:24px}.integration-icon{width:56px;height:56px;padding:12px;background:var(--accent-soft);border-radius:14px;margin-bottom:24px}.integration-icon svg{width:32px;height:32px}.info-note{display:flex;gap:12px;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:16px;color:var(--text-dim);font-size:13px;line-height:1.6}.info-note svg{width:18px;height:18px;flex-shrink:0;margin-top:4px}.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.quick-grid button{justify-content:flex-start}
.briefing-section{margin-top:20px}.briefing-section:first-child{margin-top:0}.briefing-workspace .group-title{margin-top:0}
/* Forms and dialogs */
label{display:grid;gap:8px;font-size:13px;font-weight:600;color:var(--text)}input,select,textarea{width:100%;min-width:0;min-height:44px;padding:12px;background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:14px;transition:border-color var(--motion-fast) ease}input::placeholder,textarea::placeholder{color:var(--text-dim)}textarea{resize:vertical;min-height:120px}input[type=checkbox]{width:20px;min-height:20px;height:20px;accent-color:var(--accent);flex-shrink:0}.check-label{display:flex;align-items:center;gap:12px;min-height:44px;font-weight:500}.check-label input{margin:0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.full{grid-column:1/-1}.form-actions{display:flex;justify-content:flex-end;gap:12px;flex-wrap:wrap;margin-top:24px}.form-error{color:var(--danger);font-size:12.5px;line-height:1.6;margin-top:12px}.form-error:not(:empty){padding:12px;border:1px solid rgba(240,102,122,.35);border-radius:8px;background:var(--danger-soft);display:flex;align-items:flex-start;gap:8px}.form-error svg{width:18px;height:18px;flex-shrink:0}.form-error:empty{display:none}input[aria-invalid=true]{border-color:var(--danger)}.field-with-icon{position:relative;display:block}.field-with-icon>svg{position:absolute;left:12px;top:14px;width:18px;height:18px;color:var(--text-dim);pointer-events:none}.field-with-icon input{padding-left:40px}.settings-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:24px;align-items:start}.settings-grid .card{margin-bottom:24px}.settings-grid form{display:grid;gap:20px}.settings-grid h2{margin-bottom:20px}.checks{display:grid;grid-template-columns:1fr 1fr;gap:8px}.checks .check-label{padding:8px;background:var(--surface-2);border-radius:8px}fieldset{border:1px solid var(--border);border-radius:14px;padding:16px;margin:0;min-width:0}legend{padding:0 8px;font-size:13px;font-weight:600}dialog{border:1px solid var(--border-strong);background:var(--surface);color:var(--text);border-radius:var(--radius-lg);padding:24px;width:min(640px,calc(100% - 32px));max-height:90dvh;overflow-y:auto;box-shadow:var(--shadow-pop)}dialog[open]{animation:dialog-in 180ms ease-out}dialog::backdrop{background:rgba(5,6,10,.6)}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.dialog-heading h2{margin:0;font-size:20px}.dialog-heading button{border-radius:8px}.dialog-heading button:hover{background:var(--surface-2)}#navigation{padding:0;width:288px;height:100dvh;max-height:100dvh;max-width:calc(100vw - 32px);margin:0;border-radius:0 20px 20px 0}#navigation .sidebar{position:relative;height:100%;width:100%;border:0;padding-top:16px}#navigation .brand{margin:8px 0 24px}#navigation .sidebar nav{gap:4px}#toast{position:fixed;right:24px;bottom:24px;left:auto;transform:none;background:var(--surface-3);border:1px solid var(--border-strong);box-shadow:var(--shadow-pop);color:var(--text);padding:12px 20px;border-radius:14px;font-size:13px;max-width:min(360px,calc(100vw - 48px));z-index:20}#toast:empty{display:none}
/* Personal sign-in */
.auth-shell{display:grid;grid-template-columns:1.1fr 1fr;min-height:100dvh;max-width:1440px;margin:auto}.auth-story{padding:56px;display:flex;flex-direction:column;justify-content:space-between}.auth-story .brand{margin-bottom:72px;padding:0}.auth-story h1{font-family:var(--font-display);font-weight:400;font-size:clamp(42px,5vw,72px);letter-spacing:0;line-height:1.15}.auth-story h1 em{font-weight:400;color:var(--text)}.auth-story>div>p{max-width:42ch;font-size:15px}.auth-story footer{font-size:12px;color:var(--text-dim);margin-top:56px;display:flex;gap:12px;align-items:center}.auth-story footer svg{width:18px;height:18px}.auth-main{padding:40px;display:grid;place-items:center}.auth-panel{max-width:400px;width:100%;padding:32px;border:1px solid var(--border);border-radius:20px;background:linear-gradient(180deg,var(--surface),var(--surface-2));box-shadow:var(--shadow-card)}.auth-panel h2{font-size:26px;line-height:1.3;margin-bottom:12px}.auth-panel>p{font-size:13px;margin-bottom:24px}.auth-panel form{display:grid;gap:20px}.auth-panel .hint{font-size:12px;display:flex;align-items:flex-start;gap:8px}.auth-panel .hint svg{width:16px;height:16px;flex-shrink:0}.auth-panel .button{width:100%}.auth-avatar{width:56px;height:56px;border:1px solid var(--accent-line);background:var(--accent-soft);border-radius:50%;display:grid;place-items:center;margin-bottom:24px}.auth-avatar svg{width:26px;height:26px}.auth-features{display:flex;gap:16px;flex-wrap:wrap;margin-top:32px}.auth-features span{font-size:12px;display:flex;gap:8px;align-items:center;color:var(--text-dim)}.auth-features svg{width:16px;height:16px}.loading{padding:56px 24px;text-align:center}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes dialog-in{from{opacity:.5;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
@media(min-width:900px) and (max-width:1199px){.content{padding:32px 24px}.topbar{padding:0 24px}.stat-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 0}.stat:nth-child(2){border:0}.hero{grid-template-columns:minmax(0,1fr) 140px;padding:24px;gap:24px}.attention-list{grid-template-columns:1fr}.settings-grid,.preview-grid{grid-template-columns:1fr}.summary-grid{gap:16px}.metric{font-size:26px}}
@media(max-width:899px){.shell{display:block}.shell>.sidebar{display:none}.drawer-toggle{display:inline-flex}.topbar{padding:0 24px;height:64px}.content{padding:32px 24px}.settings-grid{grid-template-columns:1fr}.stat-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 0}.stat:nth-child(2){border:0}.attention-list{grid-template-columns:1fr}.hero{padding:24px}.auth-story{padding:40px 32px}.auth-main{padding:32px 24px}.auth-panel{padding:24px}.topbar-right{gap:12px}}
@media(max-width:619px){.content{padding:24px 16px}.topbar{padding:0 16px}.topbar-right>span:first-child{display:none}.breadcrumb>span:first-child,.breadcrumb>svg{display:none}.private-badge{font-size:11px}.page-heading{gap:16px;align-items:flex-start;margin-bottom:24px}.page-heading .button{padding:10px 12px;min-width:48px}.page-heading .button .action-label{display:none}.page-heading.personal h1{font-size:34px}.page-heading p{font-size:13px}.hero{grid-template-columns:1fr;padding:20px;gap:20px}.hero h2{font-size:21px}.hero p{font-size:13px}.hero-aside{border-left:0;border-top:1px solid var(--border);padding:16px 0 0;display:grid;grid-template-columns:auto 1fr;gap:8px 16px;align-items:center}.hero-aside strong{font-size:28px;grid-row:span 2}.hero-aside small{font-size:11px}.grid,.note-grid,.cert-grid,.preview-grid{grid-template-columns:1fr}.card{padding:16px}.stat-row{padding:16px 0;gap:20px 0}.stat{padding:0 12px;gap:8px}.stat>svg{width:32px;height:32px;padding:6px}.stat-value{font-size:24px}.stat-label{font-size:11px;margin-top:4px}.record{flex-wrap:wrap;gap:8px}.record>.pill{margin-left:auto}.record-title{font-size:13px}.record-detail{font-size:12px}.record-copy{min-width:120px}.collection-toolbar{gap:12px}.search-field{flex-basis:100%;max-width:none}.collection-toolbar .hint{width:100%}.summary-grid{grid-template-columns:1fr;gap:20px}.summary-grid>div+div{border-top:1px solid var(--border);padding-top:16px}.week-strip{overflow-x:auto;display:flex;scroll-snap-type:x proximity;padding:4px 2px 12px}.day-cell{flex:0 0 64px;scroll-snap-align:start}.week-controls{gap:12px}.week-controls span{font-size:12px}.fitness-summary{gap:16px;align-items:flex-start}.ring{width:64px;height:64px}.ring strong{font-size:16px}.streak{gap:8px}.streak-dot{width:28px;height:28px}.cert-top{gap:16px}.form-grid{grid-template-columns:1fr;gap:16px}.settings-grid{gap:0}.checks{grid-template-columns:1fr 1fr}.checks .check-label{font-size:12px;gap:8px;padding:4px}.form-actions{gap:8px}.form-actions .button{flex:1;padding:12px}.button,input,select{min-height:48px}button{min-height:44px}.footer{font-size:11px;flex-direction:column;gap:8px;margin-top:32px}.auth-shell{grid-template-columns:1fr}.auth-story{padding:24px}.auth-story .brand{margin-bottom:32px}.auth-story h1{font-size:40px}.auth-story>div>p{font-size:13px}.auth-story footer{display:none}.auth-features{margin-top:20px;gap:12px}.auth-main{padding:0 16px 32px}.auth-panel{max-width:100%;padding:24px}.auth-panel h2{font-size:24px}dialog{padding:20px}.quick-grid{grid-template-columns:1fr 1fr}.chip-row{gap:8px}}
@media(max-width:379px){.stat>svg{display:none}.page-heading.personal h1{font-size:32px}.card{padding:16px}.checks,.quick-grid{grid-template-columns:1fr}.hero{padding:16px}.auth-story{padding:24px 16px}.auth-story h1{font-size:34px}.cert-footer{align-items:flex-start;flex-direction:column}.fitness-summary{flex-direction:column}}.device-placeholder-list{display:grid;gap:8px;margin-top:16px}.device-placeholder{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:11px 0;border-top:1px solid var(--border)}.device-placeholder:first-child{border-top:0}.device-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;color:var(--text-dim);background:var(--surface-3)}.device-icon svg{width:18px;height:18px}.device-placeholder strong,.device-placeholder span{display:block}.device-placeholder strong{font-size:13px}.device-placeholder div span{margin-top:3px;color:var(--text-dim);font-size:11px}
html, body { overflow-x: hidden; }

/* Mail — Aurora Prism V1 integration surface. */
.mail-page{max-width:1540px;margin:0 auto}.mail-page-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:18px}.mail-page-heading h1{margin:0 0 6px;font-size:clamp(28px,3vw,38px)}.mail-page-heading p{margin:0;max-width:60ch}.mail-workspace{display:grid;grid-template-columns:220px minmax(320px,420px) minmax(0,1fr);gap:12px;min-height:calc(100dvh - 210px)}.mail-workspace>.card{padding:0;overflow:hidden}.mail-rail,.mail-list-panel,.mail-reader{display:flex;flex-direction:column;min-height:0}.mail-rail-head{padding:18px 16px 14px;border-bottom:1px solid var(--border)}.mail-rail-head strong,.mail-rail-head small{display:block}.mail-rail-head strong{font-size:20px;margin:4px 0}.mail-rail-head small{font-size:11px;color:var(--text-dim)}.mail-rail-section{padding:12px 10px;border-bottom:1px solid var(--border)}.mail-rail-label{display:block;padding:0 8px 7px;color:var(--text-dim);font-size:10px;letter-spacing:.13em;text-transform:uppercase}.mail-rail-item{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:40px;padding:7px 9px;border:1px solid transparent;border-radius:10px;color:var(--text-dim);font-size:12px;text-align:left}.mail-rail-item>span{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mail-rail-item svg{width:16px;height:16px}.mail-rail-item small{color:var(--text-faint);font:11px var(--font-data)}.mail-rail-item:hover{background:var(--surface-2);color:var(--text)}.mail-rail-item.active{color:var(--text);background:linear-gradient(90deg,rgba(39,200,255,.11),rgba(139,124,246,.1));border-color:rgba(39,200,255,.25);box-shadow:inset 2px 0 var(--info)}.mail-rail-foot{display:flex;align-items:center;gap:7px;margin-top:auto;padding:12px 14px;color:var(--text-dim);font-size:10px}.mail-rail-foot svg{width:14px;height:14px;color:var(--success)}.mail-list-panel{background:linear-gradient(180deg,var(--surface),var(--surface-2))}.mail-list-head{padding:14px;border-bottom:1px solid var(--border)}.mail-search{max-width:none;min-width:0}.mail-list-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px}.mail-list-caption{font-size:11px;color:var(--text-dim);letter-spacing:.08em;text-transform:uppercase}.mail-list-toolbar .hint{margin:0;font-size:10px}.mail-list{min-height:0;overflow:auto;padding:8px}.mail-row{position:relative;display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:start;gap:9px;margin:0;padding:12px 9px;border:1px solid transparent;border-bottom-color:var(--border);border-radius:11px;cursor:pointer}.mail-row:first-child{border-top:0}.mail-row:hover,.mail-row:focus-visible{background:var(--surface-2)}.mail-row.selected{background:linear-gradient(90deg,rgba(39,200,255,.10),rgba(139,124,246,.09));border-color:rgba(39,200,255,.25);box-shadow:inset 3px 0 var(--info)}.mail-row.handled{opacity:.65}.mail-provider-dot{display:inline-block;width:9px;height:9px;margin-top:5px;border-radius:3px;background:var(--accent)}.mail-provider-dot.provider-google{background:#6c87ff}.mail-provider-dot.provider-microsoft{background:#57d2ff}.mail-provider-dot.provider-icloud{background:#b28dff}.mail-row-top{display:flex;align-items:baseline;gap:6px;min-width:0}.mail-row-top strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.mail-account{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-dim);font-size:9px}.mail-subject{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:3px;font-size:12px;font-weight:700}.mail-snippet{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:3px;color:var(--text-dim);font-size:10px}.mail-row-meta{display:flex;align-items:center;gap:7px;margin-top:6px}.mail-row-meta time{margin-left:auto;color:var(--text-faint);font-size:9px}.mail-signal{display:inline-flex;align-items:center;max-width:18ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:2px 6px;border:1px solid rgba(217,119,6,.22);border-radius:999px;background:var(--warning-soft);color:#f5c77d;font-size:9px}.handled-signal{border-color:rgba(52,211,153,.24);background:var(--success-soft);color:var(--success)}.mail-unread-dot{width:6px;height:6px;margin-top:5px;border-radius:50%;background:var(--info);box-shadow:0 0 9px rgba(78,193,224,.8)}.mail-empty{padding:12px}.mail-empty .empty{min-height:180px;padding:32px 10px}.mail-reader{position:relative;background:linear-gradient(180deg,rgba(21,26,36,.98),rgba(16,22,32,.99))}.mail-reader-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px;border-bottom:1px solid var(--border)}.mail-reader-head strong{display:block;margin-top:3px;font-size:12px}.mail-reader-close{display:none;border-radius:8px}.mail-reader-content{min-height:0;overflow:auto;padding:22px 24px}.mail-reader-tags{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:15px}.mail-reader-content h2{margin:0 0 14px;font-size:clamp(20px,2.2vw,28px);line-height:1.2}.mail-reader-from{display:flex;align-items:center;gap:10px;padding-bottom:16px;border-bottom:1px solid var(--border)}.mail-reader-avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:linear-gradient(145deg,rgba(39,200,255,.22),rgba(139,124,246,.22));font-size:12px;font-weight:800}.mail-reader-from strong,.mail-reader-from small{display:block}.mail-reader-from strong{font-size:12px}.mail-reader-from small{margin-top:3px;color:var(--text-dim);font-size:11px}.mail-reader-content .message-body{max-height:none;margin:18px 0 0;border-color:var(--border);background:rgba(255,255,255,.018);font-size:13px;line-height:1.75}.mail-reader-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.mail-reader-actions .button{min-height:42px}.mail-reader-foot{display:flex;align-items:center;gap:7px;padding:12px 18px;border-top:1px solid var(--border);color:var(--text-dim);font-size:10px}.mail-reader-foot svg{width:14px;height:14px;color:var(--success)}.mail-reader-empty{display:grid;place-items:center;align-content:center;gap:9px;min-height:360px;padding:30px;text-align:center;color:var(--text-dim)}.mail-reader-empty svg{width:34px;height:34px;color:var(--accent)}.mail-reader-empty strong{color:var(--text);font-size:14px}.mail-reader-empty p{max-width:30ch;margin:0;font-size:12px}
@media (max-width:1279px) and (min-width:900px){.mail-workspace{grid-template-columns:225px minmax(0,1fr)}.mail-reader{display:none}.mail-workspace[data-reader-open] .mail-list-panel{display:none}.mail-workspace[data-reader-open] .mail-reader{display:flex;grid-column:2}.mail-workspace[data-reader-open] .mail-reader-close{display:inline-flex}}
@media (max-width:899px){.mail-page-heading{align-items:flex-start;flex-direction:column;margin-bottom:12px}.mail-page-heading h1{font-size:30px}.mail-workspace{display:block;min-height:0}.mail-rail{display:none}.mail-list-panel{min-height:calc(100dvh - 170px)}.mail-reader{display:none;min-height:calc(100dvh - 170px)}.mail-workspace[data-reader-open] .mail-list-panel{display:none}.mail-workspace[data-reader-open] .mail-reader{display:flex}.mail-reader-close{display:inline-flex}.mail-reader-content{padding:18px 16px}.mail-reader-content h2{font-size:22px}.mail-reader-actions{display:grid;grid-template-columns:1fr}.mail-reader-actions .button{width:100%}}

/* Mail functional polish: bounded workspace, compact controls, and internal scrolling. */
.mail-workspace{height:calc(100dvh - 210px);min-height:520px;overflow:hidden}.mail-rail{overflow:auto}.mail-list-panel,.mail-reader{height:100%;overflow:hidden}.mail-list{flex:1;min-height:0;overflow:auto}.mail-list-footer{display:flex;justify-content:center;align-items:center;min-height:58px;padding:8px 12px;border-top:1px solid var(--border);color:var(--text-dim)}.mail-load-more{min-height:38px;padding:8px 14px;font-size:11px}.mail-caught-up{font-size:10px}.mail-filter-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:10px}.mail-filter-label{color:var(--text-dim);font-size:10px;letter-spacing:.08em;text-transform:uppercase}.mail-filter-chip,.mail-filter-context{min-height:30px;padding:5px 10px;border:1px solid var(--border);border-radius:999px;color:var(--text-dim);font-size:10px}.mail-filter-chip:hover{background:var(--surface-2);color:var(--text)}.mail-filter-chip.active{border-color:var(--accent-line);background:var(--accent-soft);color:var(--text)}.mail-filter-context{margin-left:auto;background:rgba(78,193,224,.08);border-color:rgba(78,193,224,.2);color:var(--info)}.mail-reader-head-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}.mail-reader-head-actions .button{min-height:36px;padding:7px 10px;font-size:11px}.mail-reader-content{flex:1;overflow:auto}.mail-reader-content .message-body{max-height:min(45vh,520px);overflow:auto}.mail-reader-empty{min-height:0;height:100%}.mail-reader-close-label{display:none}
@media (max-width:1279px) and (min-width:900px){.mail-workspace{height:calc(100dvh - 210px);min-height:500px}.mail-reader-head-actions .button{display:inline-flex}.mail-reader-head-actions .mail-reader-close{display:inline-flex}.mail-reader-close-label{display:inline}}
@media (max-width:899px){.mail-workspace{height:calc(100dvh - 170px);min-height:0;overflow:visible}.mail-list-panel{min-height:0;height:100%}.mail-reader{height:100%;min-height:0}.mail-reader-head{align-items:flex-start}.mail-reader-head-actions{flex:0 1 auto}.mail-reader-head-actions .button{display:inline-flex}.mail-reader-head-actions .mail-reader-close{display:inline-flex}.mail-reader-close-label{display:inline}.mail-reader-content{padding:18px 16px}.mail-reader-content .message-body{max-height:42vh}.mail-filter-context{margin-left:0}}
.mail-reader-head{position:sticky;top:0;z-index:2;background:rgba(21,26,36,.98);backdrop-filter:blur(12px)}

/* Keep the large Mail rail identifiable while preserving its internal scroll. */
.mail-rail-head{position:sticky;top:0;z-index:2;background:rgba(21,26,36,.98);backdrop-filter:blur(12px)}
.mail-rail-item[data-mail-account]:not([data-mail-account="all"]){align-items:flex-start;gap:8px}
.mail-account-label{display:grid;min-width:0;gap:2px;line-height:1.2}
.mail-account-provider,.mail-account-name{display:flex;align-items:center;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-account-provider{gap:8px;color:var(--text)}
.mail-account-provider svg{flex:0 0 auto}
.mail-account-name{padding-left:24px;color:var(--text-dim);font-size:10px}
.mail-rail-item[data-mail-account]:not([data-mail-account="all"]) small{flex:0 0 auto;margin-top:2px}
@media (min-width:1280px){.mail-workspace{grid-template-columns:250px minmax(380px,420px) minmax(0,1fr)}}
.content:has(.mail-page){max-width:none;width:100%;}
.mail-page{max-width:none;width:100%;}
.mail-rail-item[data-mail-account] > .mail-account-label{display:grid;flex:1 1 auto;min-width:0;max-width:100%;gap:2px;overflow:hidden;white-space:normal;}
@media (min-width:1280px){.mail-workspace{grid-template-columns:270px minmax(420px,520px) minmax(0,1fr);}}

/* Global page density: keep functional content close to the application bar. */
@media (min-width:900px){
  .content{padding-top:24px;}
  .page-heading{margin-bottom:20px;}
  .page-heading .eyebrow{margin-bottom:8px;}
  .page-heading h1{margin-bottom:6px;}
  .mail-page-heading{margin-bottom:12px;}
  .mail-page-heading .eyebrow{margin-bottom:6px;}
}
@media (min-width:620px) and (max-width:899px){
  .content{padding-top:24px;}
  .page-heading{margin-bottom:20px;}
  .mail-page-heading{margin-bottom:12px;}
}
@media (max-width:619px){
  .content{padding-top:20px;}
  .mail-page-heading{margin-bottom:12px;}
}

/* Shared shell density: normal modules use the available workspace width and compact headers. */
.content{max-width:none;width:100%;}
.page-heading{margin-bottom:18px;}
.page-heading .eyebrow{margin-bottom:7px;}
.page-heading h1{margin-bottom:5px;}
.page-heading p{line-height:1.45;}

/* Planner Aurora Prism V1 */
.planner-page{width:100%;max-width:none}
.planner-heading{margin-bottom:12px}
.planner-heading .button{min-height:44px}
.planner-week-card{padding:12px;margin-bottom:12px}
.planner-week-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.planner-date-controls{display:flex;align-items:center;gap:8px}
.planner-date-controls strong{margin-left:4px;font-size:15px}
.planner-view-switch{display:flex;gap:4px;padding:3px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
.planner-view-switch button,.planner-task-tabs button{min-height:36px;padding:7px 12px;border:0;border-radius:8px;color:var(--text-dim);background:transparent}
.planner-view-switch button.active,.planner-task-tabs button.active{color:var(--text);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent-line)}
.planner-week-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.planner-day{min-height:68px;padding:9px;border:1px solid var(--border);border-radius:10px;color:var(--text-dim);background:var(--surface-2);text-align:left}
.planner-day span,.planner-day strong,.planner-day small{display:block}
.planner-day strong{margin-top:5px;font-size:17px;color:var(--text)}
.planner-day small{height:9px;margin-top:5px}
.planner-day small i,.planner-day small em{display:inline-block;width:6px;height:6px;margin-right:3px;border-radius:50%;background:var(--info)}
.planner-day small em{background:var(--warning)}
.planner-day.today{border-color:rgba(39,200,255,.35)}
.planner-day.selected{border-color:var(--accent-line);background:linear-gradient(135deg,rgba(39,200,255,.13),rgba(139,124,246,.14));box-shadow:inset 0 0 0 1px var(--accent-line)}
.planner-grid{display:grid;grid-template-columns:minmax(230px,.9fr) minmax(420px,1.35fr) minmax(270px,.9fr);gap:12px;align-items:start}
.planner-left,.planner-center,.planner-right{display:grid;gap:12px;min-width:0}
.planner-card{padding:14px;min-width:0}
.planner-card .card-header{margin-bottom:10px}
.planner-card .card-header h2{display:flex;align-items:center;gap:8px;margin:2px 0 0;font-size:16px}
.planner-card .card-header h2 svg{width:18px;height:18px;color:var(--accent)}
.planner-card .card-header .hint{margin:3px 0 0}
.planner-card-list{display:grid;gap:6px}
.planner-event-row,.planner-task-row{display:flex;align-items:center;gap:9px;min-width:0;padding:9px 0;border-top:1px solid var(--border)}
.planner-event-row:first-child,.planner-task-row:first-child{border-top:0}
.planner-event-row>svg{width:18px;height:18px;flex:0 0 auto;color:var(--info)}
.planner-event-row.provider-google>svg{color:#8b9dff}
.planner-event-row.provider-hub>svg{color:var(--accent-2)}
.planner-event-row>div,.planner-task-row>div{min-width:0;flex:1}
.planner-event-row strong,.planner-event-row small,.planner-task-row strong,.planner-task-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.planner-event-row strong,.planner-task-row strong{font-size:12px}
.planner-event-row small,.planner-task-row small{margin-top:3px;color:var(--text-dim);font-size:10px}
.planner-empty{display:flex;align-items:center;gap:8px;min-height:56px;color:var(--text-dim);font-size:11px}
.planner-empty svg{width:18px;height:18px;color:var(--accent)}
.planner-overdue-card{border-color:rgba(248,113,113,.2);background:linear-gradient(145deg,rgba(90,25,42,.28),rgba(20,23,34,.9))}
.planner-overdue-card .eyebrow,.planner-overdue-card h2 svg{color:#ff7979}
.planner-check{display:grid;place-items:center;width:24px;height:24px;flex:0 0 auto;border:1px solid var(--text-dim);border-radius:50%;color:var(--success);background:transparent}
.planner-check svg{width:15px;height:15px}
.planner-task-row.completed{opacity:.55}
.planner-task-row.completed strong{text-decoration:line-through}
.planner-task-tabs{display:flex;gap:4px;flex-wrap:wrap;margin:0 0 10px;padding:3px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
.planner-task-tabs button{min-height:34px;padding:6px 10px;font-size:11px}
.planner-task-group{margin-top:10px}
.planner-task-group>.eyebrow{display:block;padding-top:8px;border-top:1px solid var(--border);font-size:9px}
.planner-task-group:first-of-type>.eyebrow{border-top:0;padding-top:0}
.planner-source-list{display:grid;gap:5px}
.planner-source{display:flex;align-items:center;gap:9px;width:100%;min-height:44px;padding:7px 8px;border:1px solid transparent;border-radius:9px;color:var(--text);background:transparent;text-align:left}
.planner-source:hover,.planner-source:focus-visible{border-color:var(--accent-line);background:var(--accent-soft)}
.planner-source>svg{width:18px;height:18px;flex:0 0 auto;color:var(--info)}
.planner-source>span{min-width:0;flex:1}
.planner-source strong,.planner-source small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.planner-source small{margin-top:2px;color:var(--text-dim);font-size:10px}
.planner-source i{font-style:normal;color:var(--text-dim);font-size:9px}
.planner-source.muted{opacity:.5}
.planner-source-note{margin:10px 0 0}
.planner-timeline-card{min-height:690px}
.planner-day-nav{display:flex;align-items:center;gap:5px}
.planner-all-day{display:grid;gap:4px;margin-bottom:12px;padding:8px;border:1px solid var(--border);border-radius:9px;background:rgba(39,200,255,.04)}
.planner-all-day>span{font-size:9px;letter-spacing:.12em;color:var(--text-dim)}
.planner-timeline{display:grid;grid-template-columns:66px minmax(0,1fr);min-height:610px}
.planner-time-labels{display:grid;grid-template-rows:repeat(17,1fr);padding-right:9px;color:var(--text-faint);font:10px var(--font-data);text-align:right}
.planner-time-grid{position:relative;min-height:610px;border-left:1px solid var(--border);background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(6.25% - 1px),var(--border) 6.25%)}
.planner-time-grid>i{display:none}
.planner-event-block{position:absolute;left:8px;right:8px;min-height:40px;padding:0 6px;border:1px solid rgba(39,200,255,.48);border-left:3px solid var(--info);border-radius:8px;background:linear-gradient(90deg,rgba(39,200,255,.25),rgba(39,200,255,.08));overflow:hidden}
.planner-event-block.provider-google{border-color:rgba(139,124,246,.56);border-left-color:var(--accent-2);background:linear-gradient(90deg,rgba(139,124,246,.27),rgba(139,124,246,.08))}
.planner-event-block.provider-hub{border-left-color:var(--accent-2);background:linear-gradient(90deg,rgba(139,124,246,.25),rgba(139,124,246,.08))}
.planner-event-block .planner-event-row{height:100%;padding:7px 2px;border:0}
.planner-event-block .planner-event-row>svg{width:15px;height:15px}
.planner-agenda-list{display:grid;gap:3px}
.planner-time-grid{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(16,minmax(38px,1fr));align-content:start}
.planner-time-grid .planner-event-block{grid-column:1;top:auto;left:auto;right:auto;width:auto;height:auto;min-height:40px;margin:4px 8px;align-self:start}
.planner-time-grid .planner-slot-1{grid-row:1}.planner-time-grid .planner-slot-2{grid-row:2}.planner-time-grid .planner-slot-3{grid-row:3}.planner-time-grid .planner-slot-4{grid-row:4}.planner-time-grid .planner-slot-5{grid-row:5}.planner-time-grid .planner-slot-6{grid-row:6}.planner-time-grid .planner-slot-7{grid-row:7}.planner-time-grid .planner-slot-8{grid-row:8}.planner-time-grid .planner-slot-9{grid-row:9}.planner-time-grid .planner-slot-10{grid-row:10}.planner-time-grid .planner-slot-11{grid-row:11}.planner-time-grid .planner-slot-12{grid-row:12}.planner-time-grid .planner-slot-13{grid-row:13}.planner-time-grid .planner-slot-14{grid-row:14}.planner-time-grid .planner-slot-15{grid-row:15}.planner-time-grid .planner-slot-16{grid-row:16}
.planner-time-grid .planner-lane-1{transform:translateY(42px)}.planner-time-grid .planner-lane-2{transform:translateY(84px)}
@media(max-width:1199px){.planner-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"left right" "center center"}.planner-left{grid-area:left}.planner-right{grid-area:right}.planner-center{grid-area:center}.planner-timeline-card{min-height:620px}}
@media(max-width:699px){.planner-heading{align-items:flex-start;flex-direction:column}.planner-heading .button{width:100%}.planner-week-toolbar{align-items:flex-start;flex-direction:column}.planner-view-switch{width:100%}.planner-view-switch button{flex:1}.planner-week-strip{gap:4px}.planner-day{min-height:60px;padding:7px 5px}.planner-day strong{font-size:14px}.planner-day span{font-size:10px}.planner-grid{display:flex;flex-direction:column}.planner-left,.planner-center,.planner-right{display:contents}.planner-timeline-card{order:3;min-height:0}.planner-right .planner-tasks-card{order:2}.planner-right .planner-calendars-card{order:5}.planner-left .planner-today-card{order:1}.planner-left .planner-upcoming-card{order:4}.planner-left .planner-overdue-card{order:4}.planner-timeline{display:block;min-height:0}.planner-time-labels{display:none}.planner-time-grid{display:none}.planner-event-block{position:static;min-height:0;margin-top:5px}.planner-event-block .planner-event-row{height:auto}.planner-agenda-list{display:grid}.planner-day-nav .button{min-height:40px}}
.mail-page-heading{margin-bottom:10px;}
.mail-page-heading p{line-height:1.45;}

/* Fitness Aurora Prism V1: real workout data with compact honest placeholders. */
.fitness-page{width:100%;max-width:none;margin:0 auto}
.fitness-heading{margin-bottom:18px}
.fitness-heading .button{min-height:44px}
.fitness-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:12px}
.fitness-kpi{display:flex;align-items:center;gap:12px;min-width:0;padding:14px;border:1px solid var(--border);border-radius:14px;background:linear-gradient(145deg,rgba(25,32,46,.96),rgba(19,25,37,.96));box-shadow:0 8px 24px rgba(3,8,18,.12)}
.fitness-kpi.good{border-color:rgba(52,211,153,.35);background:linear-gradient(145deg,rgba(17,63,57,.8),rgba(19,31,42,.96))}
.fitness-kpi-icon{display:grid;place-items:center;flex:0 0 auto;width:38px;height:38px;border-radius:11px;background:var(--accent-soft);color:var(--accent)}
.fitness-kpi-icon svg{width:21px;height:21px}
.fitness-kpi>div{min-width:0}.fitness-kpi .eyebrow{display:block;margin:0 0 5px;font-size:9px}.fitness-kpi strong{display:block;font:700 24px var(--font-data);letter-spacing:-.03em;white-space:nowrap}.fitness-kpi small{display:block;margin-top:3px;color:var(--text-dim);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fitness-card{min-width:0;padding:16px}.fitness-card-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.fitness-card-heading>div{min-width:0}.fitness-card-heading h2{display:flex;align-items:center;gap:8px;margin:3px 0 0;font-size:16px}.fitness-card-heading h2 svg{width:18px;height:18px;color:var(--accent)}.fitness-card-heading small{display:block;margin-top:4px;color:var(--text-dim);font-size:11px}.fitness-card-heading .pill{flex-shrink:0}.fitness-chart{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;min-height:190px;padding-top:8px}.fitness-chart-scale{display:flex;flex-direction:column;justify-content:space-between;padding-bottom:26px;color:var(--text-dim);font:10px var(--font-data);text-align:right}.fitness-chart-bars{display:flex;align-items:stretch;height:190px;gap:8px;min-width:0;border-bottom:1px solid var(--border);background:repeating-linear-gradient(to bottom,transparent 0,transparent 32px,rgba(119,154,205,.12) 33px)}.fitness-chart-day{display:flex;flex:1;flex-direction:column;justify-content:flex-end;min-width:0;height:100%;text-align:center}.fitness-chart-track{display:flex;align-items:flex-end;justify-content:center;flex:0 0 150px;height:150px;min-height:0}.fitness-chart-bar{display:block;width:min(28px,65%);min-height:0;border-radius:7px 7px 2px 2px;background:linear-gradient(180deg,#a88cff,#6a55d4);box-shadow:0 0 16px rgba(139,124,246,.24)}.fitness-chart-day strong{margin-top:8px;color:var(--text);font-size:10px}.fitness-chart-day small{margin-top:3px;color:var(--text-dim);font:10px var(--font-data)}
.fitness-goal-row{display:grid;grid-template-columns:34px minmax(100px,1fr) minmax(70px,1fr) auto;align-items:center;gap:10px;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2)}.fitness-goal-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--accent-soft);color:var(--accent)}.fitness-goal-icon svg{width:18px;height:18px}.fitness-goal-row strong,.fitness-goal-row small{display:block}.fitness-goal-row strong{font-size:12px}.fitness-goal-row small{margin-top:3px;color:var(--text-dim);font-size:10px}.fitness-goal-row>b{font:11px var(--font-data);color:var(--text-dim)}.fitness-progress{height:8px;overflow:hidden;border-radius:99px;background:rgba(119,154,205,.18)}.fitness-progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent),#a78bfa)}.fitness-goals-card>.hint{margin-top:12px}
.fitness-empty-state{display:grid;align-content:center;justify-items:start;gap:8px;min-height:64px;color:var(--text-dim)}.fitness-empty-state strong{color:var(--text);font-size:13px}.fitness-empty-state span{font-size:11px;line-height:1.5}.fitness-empty-state .button{margin-top:4px}.fitness-empty-card{min-height:220px}.fitness-empty-card .fitness-empty-state{min-height:140px}.fitness-trend-card{min-height:220px}
.fitness-log-tabs{display:flex;gap:3px;padding:3px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}.fitness-log-tabs button,.fitness-log-tabs span{flex:1;min-height:34px;padding:7px 8px;border:0;border-radius:8px;color:var(--text-dim);font-size:11px;text-align:center}.fitness-log-tabs button.active{color:var(--text);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent-line)}.fitness-log-tabs span{opacity:.55}.fitness-quick-card>.hint{margin:12px 0}.fitness-activity-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.fitness-activity-options .button{justify-content:flex-start;min-width:0;min-height:40px;padding:7px 9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.fitness-activity-options svg{width:15px;height:15px;flex:0 0 auto}.fitness-quick-empty{padding:14px;border:1px dashed var(--border-strong);border-radius:10px;color:var(--text-dim);font-size:11px;line-height:1.5}.fitness-log-button{width:100%;margin-top:10px;min-height:44px}.fitness-recent-list{display:grid;gap:0}.fitness-recent-row{display:grid;grid-template-columns:34px minmax(0,1fr) 18px;align-items:center;gap:9px;width:100%;padding:10px 0;border:0;border-top:1px solid var(--border);color:var(--text);text-align:left}.fitness-recent-row:first-child{border-top:0;padding-top:0}.fitness-recent-row:hover{color:var(--accent)}.fitness-recent-row>svg{width:16px;height:16px;color:var(--text-dim)}.fitness-recent-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--accent-soft);color:var(--accent)}.fitness-recent-icon svg{width:18px;height:18px}.fitness-recent-row strong,.fitness-recent-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fitness-recent-row strong{font-size:11px}.fitness-recent-row small{margin-top:3px;color:var(--text-dim);font-size:10px}.fitness-health-card .hint{margin:0 0 12px}.fitness-planned-list{display:grid;gap:0}.fitness-planned-list>div{display:grid;grid-template-columns:20px minmax(0,1fr) auto;align-items:center;gap:8px;padding:9px 0;border-top:1px solid var(--border)}.fitness-planned-list>div:first-child{border-top:0}.fitness-planned-list svg{width:16px;height:16px;color:var(--text-dim)}.fitness-planned-list strong,.fitness-planned-list small{display:block}.fitness-planned-list strong{font-size:11px}.fitness-planned-list small{margin-top:3px;color:var(--text-dim);font-size:9px}.fitness-planned-list small{grid-column:2 / -1;margin-top:-5px}
@media (max-width:1199px){.fitness-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:899px){.fitness-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:619px){.fitness-heading{align-items:flex-start}.fitness-heading .button{padding:10px 12px}.fitness-heading .button:not(:has(svg)){font-size:0}.fitness-kpis{gap:8px}.fitness-kpi{padding:11px 10px;gap:8px}.fitness-kpi-icon{width:32px;height:32px}.fitness-kpi-icon svg{width:18px;height:18px}.fitness-kpi strong{font-size:19px}.fitness-kpi small{font-size:10px}.fitness-chart{min-height:170px}.fitness-chart-bars{height:170px}.fitness-chart-track{flex-basis:130px;height:130px;min-height:0}.fitness-goal-row{grid-template-columns:32px minmax(0,1fr) auto}.fitness-progress{grid-column:2/-1}.fitness-goal-row>b{grid-column:3;grid-row:1}.fitness-card{padding:14px}}

.fitness-svg-chart{height:190px;min-height:0;padding-top:8px}
.fitness-svg-chart svg{display:block;width:100%;height:100%;overflow:visible}
.fitness-svg-chart .fitness-chart-grid line{stroke:rgba(119,154,205,.16);stroke-width:1}
.fitness-svg-chart .fitness-chart-bars rect{fill:#8b7cf6;filter:drop-shadow(0 0 8px rgba(139,124,246,.28))}
.fitness-svg-chart text{fill:var(--text-dim);font-size:10px}
.fitness-svg-chart .fitness-chart-scale-label{font:10px var(--font-data)}
@media (max-width:619px){.fitness-svg-chart{height:170px}}

/* Fitness empty states stay compact until the underlying data exists. */
.fitness-empty-card,.fitness-trend-card{min-height:150px}
.fitness-empty-card .fitness-empty-state,.fitness-trend-card .fitness-empty-state{min-height:74px}
.fitness-activity-card.fitness-activity-empty{min-height:150px}
.fitness-activity-card.fitness-activity-empty .fitness-empty-state{min-height:74px}

/* Fitness Aurora Prism V2: denser live-data command center presentation. */
.fitness-page{max-width:1560px;margin-inline:auto}
.fitness-heading{margin-bottom:14px}
.fitness-kpis{gap:10px;margin-bottom:10px}
.fitness-kpi{padding:13px 14px;border-radius:16px;background:linear-gradient(145deg,rgba(24,34,53,.98),rgba(14,21,35,.98));box-shadow:0 10px 28px rgba(3,8,18,.16)}
.fitness-kpi.good{background:linear-gradient(145deg,rgba(14,67,61,.88),rgba(15,31,43,.98))}
.fitness-kpi-icon{width:40px;height:40px;border-radius:12px;background:linear-gradient(145deg,rgba(130,112,255,.24),rgba(41,179,255,.14));box-shadow:inset 0 0 0 1px rgba(164,148,255,.16)}
.fitness-card{padding:13px 14px;border-radius:16px;background:linear-gradient(145deg,rgba(22,31,48,.96),rgba(14,21,35,.98));box-shadow:0 12px 28px rgba(3,8,18,.12)}.fitness-card>.hint{margin-top:8px}
.fitness-card-heading{margin-bottom:11px}
.fitness-empty-card,.fitness-trend-card{min-height:176px}
.fitness-body-card{min-height:0}
.fitness-empty-card .fitness-empty-state,.fitness-trend-card .fitness-empty-state{min-height:92px}
.fitness-metric-hero{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:10px;margin:5px 0 10px}
.fitness-metric-hero strong{font:700 27px var(--font-data);letter-spacing:-.04em;color:var(--text)}
.fitness-metric-hero small{grid-column:1/-1;color:var(--text-dim);font-size:11px}
.fitness-metric-change{font:600 11px var(--font-data);padding:4px 7px;border-radius:999px;background:var(--surface-2)}
.fitness-metric-change.good{color:var(--success)}.fitness-metric-change.warning{color:var(--warning)}
.fitness-primary-row:has(.fitness-activity-empty){align-items:start}
.fitness-weight-spark{height:86px;margin-top:4px;border-top:1px solid rgba(119,154,205,.12);border-bottom:1px solid rgba(119,154,205,.12)}
.fitness-weight-spark svg{display:block;width:100%;height:100%}.fitness-weight-spark polyline{fill:none;stroke:#a88cff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 7px rgba(139,124,246,.32))}.fitness-weight-spark line{stroke:rgba(119,154,205,.18);stroke-width:1}
.fitness-activity-options{gap:8px}.fitness-activity-options .button{min-height:42px;border-radius:11px;background:linear-gradient(145deg,rgba(33,45,70,.9),rgba(18,27,44,.9))}
.fitness-recent-row{padding:9px 0}.fitness-recent-icon{background:linear-gradient(145deg,rgba(130,112,255,.25),rgba(41,179,255,.12))}
@media (min-width:1600px){.fitness-page{max-width:1760px}}
@media (max-width:1199px){.fitness-page{max-width:none}.fitness-card{padding:14px}}
@media (max-width:619px){.fitness-heading{margin-bottom:16px}.fitness-kpis{gap:8px}.fitness-kpi{padding:11px 10px}.fitness-card{padding:14px}.fitness-metric-hero strong{font-size:24px}}

/* Fitness Aurora Prism V4: Figma-matched compact KPI/goal bars, ring-empty states, horizontal quick log. */
.fitness-kpi{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:9px}
.fitness-kpi-top{display:flex;align-items:center;gap:8px}
.fitness-kpi-top .eyebrow{margin:0}
.fitness-kpi-value{display:flex;align-items:baseline;gap:6px}
.fitness-kpi-value small{margin:0;white-space:nowrap;overflow:visible}
.fitness-kpi.muted{opacity:.72}
.fitness-kpi.muted .fitness-kpi-icon{background:var(--surface-3);color:var(--text-dim)}
.fitness-kpi.warning{border-color:rgba(217,119,6,.35);background:linear-gradient(145deg,rgba(63,42,17,.8),rgba(31,23,15,.96))}
.fitness-kpi.warning .fitness-kpi-icon{background:linear-gradient(145deg,rgba(217,119,6,.32),rgba(217,119,6,.14));color:#fbbf6d}
.fitness-kpi-bar.warning span{background:var(--warning);box-shadow:0 0 6px rgba(217,119,6,.4)}
.fitness-kpi-bar{margin-top:auto;height:4px;border-radius:99px;overflow:hidden;background:var(--surface-3)}
.fitness-kpi-bar span{display:block;height:100%;border-radius:inherit}
.fitness-kpi-bar.good span{background:var(--success);box-shadow:0 0 6px rgba(52,211,153,.4)}
.fitness-kpi-bar.accent span{background:linear-gradient(90deg,var(--accent),#a78bfa);box-shadow:0 0 6px rgba(139,124,246,.4)}
.fitness-kpi-bar.info span{background:#4ec1e0;box-shadow:0 0 6px rgba(78,193,224,.4)}
.fitness-kpi-bar.muted span{background:var(--border-strong)}
.fitness-goal-row{display:flex;flex-direction:column;gap:7px;padding:10px 0;border:0;border-top:1px solid var(--border)}
.fitness-goal-row:first-child{border-top:0;padding-top:0}
.fitness-goal-row:last-child{padding-bottom:0}
.fitness-goal-row-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.fitness-goal-row-top strong{font-size:12px}
.fitness-goal-row-top b{font:12px var(--font-data);color:var(--text-dim)}
.fitness-weight-spark polygon{fill:url(#fitness-weight-fill)}
.fitness-chart-placeholder{display:grid;place-items:center;height:44px;margin-top:6px;border:1px dashed var(--border-strong);border-radius:10px;color:var(--text-faint)}
.fitness-chart-placeholder svg{width:18px;height:18px}
.fitness-ring-empty{display:grid;place-items:center;flex-shrink:0;width:64px;height:64px;border-radius:50%;border:6px solid var(--surface-3);color:var(--text-dim);font:600 15px var(--font-data)}
.fitness-ring-empty-row{display:flex;align-items:center;gap:16px}
.fitness-ring-empty-row .hint{margin:0}
.fitness-nutrition-rings{display:flex;justify-content:space-around;gap:12px;margin:4px 0 8px}
.fitness-nutrition-card .hint,.fitness-habits-card .hint{margin-top:8px}
.fitness-ring-empty-col{display:flex;flex-direction:column;align-items:center;gap:7px}
.fitness-ring-empty-col small{color:var(--text-dim);font-size:11px}
.fitness-habit-list{display:grid;gap:4px;margin-bottom:8px}
.fitness-habit-row{display:flex;align-items:center;gap:10px;padding:6px 0;color:var(--text-dim);font-size:12px}
.fitness-habit-row input{width:18px;height:18px;flex-shrink:0;accent-color:var(--border-strong)}
.fitness-activity-row{display:flex;gap:6px}
.fitness-activity-tile{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0;padding:8px 4px;border:1px solid var(--border);border-radius:11px;background:var(--surface-2);text-align:center}
.fitness-activity-tile:hover{background:var(--surface-3)}
.fitness-activity-tile:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.fitness-activity-tile small{max-width:100%;overflow:hidden;white-space:normal;line-height:1.25;font-size:9.5px;color:var(--text-dim)}
.fitness-activity-tile-icon{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;flex:0 0 auto}
.fitness-activity-tile-icon svg{width:13px;height:13px}
.fitness-recent-icon.accent-violet,.fitness-activity-tile.accent-violet .fitness-activity-tile-icon{background:linear-gradient(145deg,rgba(139,124,246,.32),rgba(139,124,246,.14));color:#c4b5fd}
.fitness-recent-icon.accent-cyan,.fitness-activity-tile.accent-cyan .fitness-activity-tile-icon{background:linear-gradient(145deg,rgba(78,193,224,.32),rgba(78,193,224,.14));color:#7dd3e8}
.fitness-recent-icon.accent-green,.fitness-activity-tile.accent-green .fitness-activity-tile-icon{background:linear-gradient(145deg,rgba(52,211,153,.32),rgba(52,211,153,.14));color:#6ee7b7}
.fitness-recent-icon.accent-amber,.fitness-activity-tile.accent-amber .fitness-activity-tile-icon{background:linear-gradient(145deg,rgba(217,119,6,.32),rgba(217,119,6,.14));color:#fbbf6d}
@media (max-width:619px){.fitness-ring-empty{width:52px;height:52px;border-width:5px}.fitness-activity-tile{padding:8px 4px}}

/* Investing Aurora Prism V1: manual portfolio mirror, honest-empty market/price states. */
/* Investing V2 dashboard layout/visuals have moved entirely to public/investing-v2.css (a literal
   port of the Figma "Investing V2 Dashboard Design" export, the same pattern already established by
   mail-v2.css/budget-v4.css for their own redesigns) - there is exactly one place that styles the
   Investing dashboard now, not two competing ones. Only rules genuinely shared with, or owned by,
   the Investing DIALOGS (Manage accounts list, Record Activity type menu, transaction/account forms -
   out of scope for the dashboard port) remain here. */
tr[data-edit]{cursor:pointer}
tr[data-edit]:hover{background:var(--surface-2)}
.field-with-action{display:flex;gap:8px;align-items:center}.field-with-action input{min-width:0;flex:1}.field-with-action .button{min-height:40px;white-space:nowrap}
.investing-account-row{display:flex;align-items:center;gap:8px;padding:10px 0;border-top:1px solid var(--border)}.investing-account-row:first-child{border-top:0}.investing-account-row>div{flex:1;min-width:0}.investing-account-row strong,.investing-account-row small{display:block}.investing-account-row small{color:var(--text-dim);margin-top:3px}
.investing-activity-menu{display:grid;gap:16px;max-height:min(70vh,560px);overflow-y:auto;padding-right:2px}
.investing-activity-group>.eyebrow{display:block;margin-bottom:8px}
.investing-activity-list{display:grid;gap:7px}
.investing-activity-item{display:flex;align-items:center;gap:11px;width:100%;padding:11px 12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);color:var(--text);text-align:left}
.investing-activity-item:hover{background:var(--surface-3);border-color:var(--border-strong)}
.investing-activity-item svg:last-child{width:16px;height:16px;color:var(--text-faint);flex-shrink:0;margin-left:auto}
.investing-activity-copy{flex:1;min-width:0;display:grid;gap:1px}
.investing-activity-copy strong{font-size:13px}
.investing-activity-copy small{color:var(--text-dim);font-size:11px}
.investing-activity-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--surface-3);color:var(--text-dim);flex-shrink:0}
.investing-activity-icon svg{width:16px;height:16px}
.investing-activity-icon.accent-green{background:linear-gradient(145deg,rgba(52,211,153,.32),rgba(52,211,153,.14));color:#6ee7b7}
.investing-activity-icon.accent-red{background:linear-gradient(145deg,rgba(240,102,122,.32),rgba(240,102,122,.14));color:#f79fb0}
.investing-activity-icon.accent-cyan{background:linear-gradient(145deg,rgba(78,193,224,.32),rgba(78,193,224,.14));color:#7dd3e8}
.investing-activity-icon.accent-violet{background:linear-gradient(145deg,rgba(139,124,246,.32),rgba(139,124,246,.14));color:#b9adff}
.investing-activity-icon.accent-amber{background:linear-gradient(145deg,rgba(217,119,6,.32),rgba(217,119,6,.14));color:#fbbf6d}
.investing-activity-group.primary .investing-activity-item{padding:13px 14px}
.investing-activity-group.primary .investing-activity-copy strong{font-size:14px}
.investing-activity-group.primary .investing-activity-icon{width:38px;height:38px}
.investing-activity-group.tertiary{opacity:.85}
.investing-activity-group.tertiary .investing-activity-item{padding:9px 12px;background:transparent}
.investing-activity-group.tertiary .investing-activity-icon{width:28px;height:28px;background:var(--surface-2)}
.investing-activity-group.tertiary .investing-activity-copy strong{font-size:12px;font-weight:600}
@media (max-width:619px){.investing-activity-item{padding:10px}}
/* Investing V2 dashboard responsive breakpoints now live in investing-v2.css alongside the rest of
   its layout - see the comment above. */
/* Projects Aurora Prism V1: visual-only fixture build. Codex connects real data later. */
.projects-page{max-width:1760px;margin-inline:auto}
.projects-heading{margin-bottom:14px;flex-wrap:wrap;gap:16px}
.projects-eyebrow-icon{display:flex;align-items:center;gap:6px}
.projects-eyebrow-icon svg{width:14px;height:14px}
.projects-heading-actions{display:flex;align-items:center;gap:10px}
.projects-search{max-width:260px}
.projects-search input{min-height:44px}
.projects-card{padding:15px;border-radius:16px;background:linear-gradient(145deg,rgba(22,31,48,.96),rgba(14,21,35,.98));box-shadow:0 12px 28px rgba(3,8,18,.12);min-width:0}
.projects-card-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.projects-card-heading>div:first-child{min-width:0}
.projects-card-heading h2{display:flex;align-items:center;gap:8px;margin:3px 0 0;font-size:16px}
.projects-card-heading h2 svg{width:18px;height:18px;color:var(--accent)}
.projects-card-heading .pill,.projects-card-heading .button,.projects-card-heading .text-link{flex-shrink:0}
/* repeat(4,...) matches every real caller (Planning home's 4 KPIs, Budget's Planned/Spent/
   Remaining/Used, the unified Budget tab's same 4) - it was repeat(5) for a 4-item grid, so each
   tile only got 4/5 of its rightful width and the KPI value/detail text visibly crowded/overlapped
   at any container narrower than full page width (surfaced once Budget's Overview summary card
   started sharing its row with Needs Attention instead of having the full page to itself). */
.projects-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}
/* Same fix already proven on Investing's narrower KPI tiles (.investing-kpi): let the detail text
   wrap onto its own line under the big number instead of fighting it for width on one baseline,
   which is what caused it to visibly crowd/get clipped in a narrower KPI row (see repeat(4) note
   above). */
.projects-kpis .fitness-kpi-value{align-items:flex-start;flex-direction:column;gap:2px}
.projects-kpis .fitness-kpi-value small{white-space:normal;overflow:visible;line-height:1.3}
/* Bounded primary workspace + compact secondary tabbed module - see "Bounded primary workspace" in
   docs/design/responsive-standard.md. The workspace card holds the tabs/filters/records together so
   controls stay right next to what they act on; Focus sits alongside it and never needs its height
   matched to the workspace's (an unrelated card, per the "when NOT appropriate" rule) - it just
   flows to its own natural, bounded (max 6 rows per tab) content height. */
.projects-layout-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,320px);gap:16px;align-items:start}
@media (max-width:899px){.projects-layout-grid{grid-template-columns:1fr}}
/* container-type is safe here (unlike a shrink-to-fit flex item, per the pitfall documented in
   responsive-standard.md) because this card's width comes from the grid track above, not its own
   content - .projects-list-row below reacts to this card's real available width, not the viewport,
   since that width varies with whether Focus is present, independent of any viewport breakpoint. */
.projects-workspace-card{min-width:0;container-type:inline-size;container-name:projects-workspace}
.projects-records{min-width:0}
/* "Show all" reveals every filtered record here instead of growing the page - internal scroll with
   a sticky-feeling cap, the same bounded-module technique already proven on Investing Holdings. */
.projects-records.projects-records-scroll{max-height:900px;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent}
.projects-records.projects-records-scroll::-webkit-scrollbar{width:7px}
.projects-records.projects-records-scroll::-webkit-scrollbar-track{background:transparent}
.projects-records.projects-records-scroll::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:8px}
.projects-records-toggle{margin-top:14px}
.projects-focus-card{min-width:0}
.projects-focus-card .projects-card-heading{margin-bottom:10px}
.projects-focus-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin-bottom:10px;padding:4px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);min-width:0}
button.projects-focus-tab{min-width:0;min-height:44px;padding:7px 5px;border:0;border-radius:8px;background:transparent;color:var(--text-dim);font-size:11px;font-weight:700;line-height:1.25;text-align:center}
button.projects-focus-tab.selected{background:var(--accent-soft);color:var(--text);box-shadow:inset 0 0 0 1px var(--accent-line)}
.projects-focus-panels{display:grid;min-width:0}
.projects-focus-panel{grid-area:1 / 1;display:grid;gap:0;min-width:0;visibility:hidden;pointer-events:none}
.projects-focus-panel.active{visibility:visible;pointer-events:auto}
.projects-focus-row{display:flex;align-items:center;gap:10px;width:100%;min-width:0;padding:9px 0;border-top:1px solid var(--border);color:var(--text);text-align:left}
.projects-focus-row:first-child{border-top:0;padding-top:0}
.projects-focus-copy{flex:1;min-width:0}
.projects-focus-copy strong{display:block;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.projects-focus-copy small{display:block;margin-top:2px;color:var(--text-dim);font-size:10.5px}
/* Milestones | Tasks: one bounded tabbed card instead of two always-stacked full-width sections -
   same accessible tab markup/behavior as .projects-focus-tabs above, scaled for table content. */
.projects-mt-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin-bottom:16px;padding:4px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);min-width:0;max-width:360px}
button.projects-mt-tab{min-width:0;min-height:44px;padding:7px 10px;border:0;border-radius:8px;background:transparent;color:var(--text-dim);font-size:12px;font-weight:700}
button.projects-mt-tab.selected{background:var(--accent-soft);color:var(--text);box-shadow:inset 0 0 0 1px var(--accent-line)}
.projects-mt-panels{display:grid;min-width:0}
.projects-mt-panel{grid-area:1 / 1;min-width:0;visibility:hidden;pointer-events:none}
.projects-mt-panel.active{visibility:visible;pointer-events:auto}
/* Top-of-workspace headline numbers for Budget (Total/Allocated/Spent/Remaining), styled as compact
   icon tiles (premium-mockup reference) - shown once here instead of also repeating in Overview's
   own summary card, per the "don't duplicate the same totals in multiple cards" rule. */
.projects-budget-workspace-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid var(--border)}
.projects-budget-workspace-summary>div{display:flex;align-items:center;gap:12px;min-width:0}
.projects-budget-workspace-summary>div>div{min-width:0}
.projects-budget-summary-icon{display:grid;place-items:center;flex:0 0 auto;width:40px;height:40px;border-radius:12px}
.projects-budget-summary-icon svg{width:19px;height:19px}
.projects-budget-summary-icon.tone-cyan{background:linear-gradient(145deg,rgba(78,193,224,.32),rgba(78,193,224,.14));color:#7dd3e8}
.projects-budget-summary-icon.tone-violet{background:linear-gradient(145deg,rgba(139,124,246,.32),rgba(139,124,246,.14));color:#c4b5fd}
.projects-budget-summary-icon.tone-danger{background:linear-gradient(145deg,rgba(240,102,122,.32),rgba(240,102,122,.14));color:#f79fb0}
.projects-budget-summary-icon.tone-green{background:linear-gradient(145deg,rgba(52,211,153,.32),rgba(52,211,153,.14));color:#6ee7b7}
.projects-budget-workspace-summary .eyebrow{margin:0}
.projects-budget-workspace-summary strong{display:block;font:600 19px var(--font-data);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.projects-budget-workspace-summary small{display:block;color:var(--text-dim);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:619px){.projects-budget-workspace-summary{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:14px}}
/* Calendar + Needs Attention share one row on the Budget workspace tab (Figma reference) - the
   calendar takes the flexible share, Attention stays a fixed-ish column so its rows don't stretch
   unreasonably wide on ultra-wide windows. Independent cards, not a shared-row alignment contract
   (see responsive-standard.md's "when equal-height rows are/aren't appropriate") - each keeps its
   own natural height. Stacks to one column at the same width the rest of Planning already stacks. */
.projects-budget-calendar-row{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px}
.projects-cal-card{flex:1.4;min-width:0}
.projects-budget-attention-col{flex:1;min-width:280px;max-width:340px}
@media (max-width:899px){.projects-budget-calendar-row{flex-direction:column}.projects-budget-attention-col{max-width:none;width:100%}}
.projects-cal-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.projects-cal-nav{display:flex;align-items:center;gap:4px}
/* Compact inline icon-only utility controls (prev/next month), sized consistently with the same
   family of existing controls in this file (.projects-row-action, 28px) - not primary actions, so
   not held to the 44px floor reserved for primary/direct-manipulation targets; the day cells below,
   which ARE what the user directly taps to see real expenses, keep the full 44px floor instead. */
.projects-cal-nav-btn{display:grid;place-items:center;width:28px;height:28px;min-width:0;min-height:0;padding:0;border-radius:8px;background:var(--surface-2);border:1px solid var(--border);color:var(--text-dim)}
.projects-cal-nav-btn:hover{background:var(--surface-3)}
.projects-cal-nav-btn svg{width:15px;height:15px}
.projects-cal-weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));margin-bottom:4px}
.projects-cal-weekdays span{text-align:center;font-size:10.5px;font-weight:600;color:var(--text-dim);letter-spacing:.04em}
.projects-cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.projects-cal-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:44px;min-width:0;border-radius:8px;background:var(--surface-2);color:var(--text-dim);font-size:11px}
.projects-cal-cell.empty{background:transparent;visibility:hidden}
.projects-cal-cell:disabled{cursor:default}
.projects-cal-cell.has-expenses{background:var(--accent-soft);color:var(--text);cursor:pointer}
.projects-cal-cell.has-expenses:hover{box-shadow:inset 0 0 0 1px var(--accent-line)}
.projects-cal-cell.today{box-shadow:inset 0 0 0 1px var(--accent-line)}
.projects-cal-cell.selected{background:var(--accent);color:#1a1024}
.projects-cal-daynum{font-weight:600}
.projects-cal-amount{font:600 9.5px var(--font-data);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.projects-cal-day-detail{margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}
.projects-cal-day-detail .eyebrow{margin-bottom:8px}
.projects-cal-day-row{display:flex;justify-content:space-between;gap:8px;padding:6px 0;font-size:12.5px;border-top:1px solid var(--border);}
.projects-cal-day-row:first-of-type{border-top:0}
.projects-cal-hint{margin-top:12px}
@media (max-width:619px){.projects-cal-cell{font-size:10px}.projects-cal-amount{font-size:8.5px}}
/* The single Work/Event Plan/Progress/Purchase Plan/Plan workspace tab (see projectsWorkTab) -
   generalizes the same accessible tab pattern above past a fixed 2 tabs to whatever subset of
   Milestones & Tasks/Budget/Timeline/Resources a type actually has. */
.projects-work-tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:4px;margin-bottom:16px;padding:4px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);min-width:0}
button.projects-work-tab{min-width:0;min-height:40px;padding:7px 10px;border:0;border-radius:8px;background:transparent;color:var(--text-dim);font-size:12px;font-weight:700}
button.projects-work-tab.selected{background:var(--accent-soft);color:var(--text);box-shadow:inset 0 0 0 1px var(--accent-line)}
.projects-work-panels{display:grid;min-width:0}
.projects-work-panel{grid-area:1 / 1;min-width:0;visibility:hidden;pointer-events:none}
.projects-work-panel.active{visibility:visible;pointer-events:auto}
/* Each sub-tab reuses its existing full-featured renderer unchanged (projectsTasksTab etc.), which
   still returns its own .card wrapper - stripping that nested chrome here lets it read as a section
   of this one bounded workspace card instead of a card-inside-a-card. */
.projects-work-panel .projects-card{background:none;border:0;box-shadow:none;padding:0}
.projects-work-panel .projects-primary-row,.projects-work-panel .projects-budget-row{gap:20px}
.projects-work-panel .projects-kpis{margin-bottom:20px}
.projects-work-panel>div>*+*{margin-top:20px}
.projects-toolbar{margin-bottom:16px}
.projects-toolbar-row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.projects-toolbar-controls{display:flex;align-items:center;gap:10px}
.projects-status-tabs{display:flex;gap:2px;padding:3px;border:1px solid var(--border);border-radius:11px;background:var(--surface-2)}
.projects-status-tab{padding:8px 14px;border-radius:8px;font-size:12px;font-weight:600;color:var(--text-dim);white-space:nowrap}
.projects-status-tab.active{color:var(--text);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent-line)}
/* Status (the tab row above) is the one prominent filter control; Type/Priority/Sort are
   deliberately recessed (muted background, smaller text, no border) below it so they read as
   secondary refinement, not three more controls competing with Status for attention - the actual
   plans stay the visually dominant content on the page. The "Filters" toggle only matters below
   620px: the [open] class purely tracks aria-expanded there, and this media-query override keeps
   the row permanently visible above it regardless of that state - see the responsive block below. */
.projects-filters-toggle{display:none;font-weight:600}
.projects-filters-toggle svg{width:15px;height:15px}
.projects-filter-fields{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;padding:8px;border-radius:10px;background:var(--surface-2)}
/* Each filter is the same .ui-select dark-Aurora listbox used in dialogs (see customSelectMarkup's
   compact option) rather than a native <select> - flex:0 1 auto keeps them sized to their own
   content in one compact row where space allows, instead of every control stretching full-width. */
.projects-filter-fields .ui-select{flex:0 1 auto}
.projects-filter-fields .ui-select[data-name=projectTypeFilter] .ui-select-trigger{min-width:150px}
.projects-filter-fields .ui-select[data-name=projectSort] .ui-select-trigger{min-width:158px}
.projects-filter-fields .ui-select[data-name=projectPriorityFilter] .ui-select-trigger{min-width:118px}
.projects-view-toggle{display:flex;gap:2px;padding:3px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
.projects-view-toggle button{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;color:var(--text-dim)}
.projects-view-toggle button.active{color:var(--text);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent-line)}
.projects-view-toggle svg{width:15px;height:15px}
.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.projects-grid-card{display:flex;flex-direction:column;text-align:left;border-radius:16px;background:linear-gradient(145deg,rgba(22,31,48,.96),rgba(14,21,35,.98));border:1px solid var(--border);box-shadow:0 12px 28px rgba(3,8,18,.12);overflow:hidden;min-width:0}
.projects-grid-card:hover{border-color:var(--border-strong)}
.projects-card-thumb{display:grid;place-items:center;height:76px}
.projects-card-thumb svg{width:30px;height:30px}
.projects-card-thumb.accent-violet,.projects-workspace-thumb.accent-violet{background:linear-gradient(145deg,rgba(139,124,246,.32),rgba(139,124,246,.14));color:#c4b5fd}
.projects-card-thumb.accent-cyan,.projects-workspace-thumb.accent-cyan{background:linear-gradient(145deg,rgba(78,193,224,.32),rgba(78,193,224,.14));color:#7dd3e8}
.projects-card-thumb.accent-green,.projects-workspace-thumb.accent-green{background:linear-gradient(145deg,rgba(52,211,153,.32),rgba(52,211,153,.14));color:#6ee7b7}
.projects-card-thumb.accent-amber,.projects-workspace-thumb.accent-amber{background:linear-gradient(145deg,rgba(217,119,6,.32),rgba(217,119,6,.14));color:#fbbf6d}
/* min-width:0 is required here: .projects-card-top strong is white-space:nowrap (for its own
   ellipsis truncation), which gives it an unshrinkable min-content width equal to its full text -
   without min-width:0 on this grid item, a long title forces the whole card body wider than its
   actual card, which (already correctly min-width:0-constrained by the grid track) just clips the
   overflow, making the title appear to start mid-word instead of truncating with an ellipsis. This
   was always a latent bug (the mobile breakpoint already carried this same min-width:0), only
   visible once cards became narrower than a long title's full width - which happens routinely now
   that the workspace shares its row with the Focus module. */
.projects-card-body{padding:14px;display:grid;gap:8px;min-width:0}
.projects-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.projects-card-top strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.projects-card-top svg{width:16px;height:16px;color:var(--text-dim);flex-shrink:0}
.projects-card-body>small{color:var(--text-dim);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.projects-card-meta{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--text-dim)}
.projects-card-meta b{font:700 12px var(--font-data);color:var(--text)}
.projects-card-next{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--text-dim);border-top:1px solid var(--border);padding-top:8px}
.projects-card-next svg{width:14px;height:14px}
.projects-card-date{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--text-dim)}
.projects-card-date svg{width:14px;height:14px}
.projects-inline-bar{display:inline-block;width:80px;vertical-align:middle;margin-right:8px}
/* Type differentiation: Budget cards lead with money (Planned/Spent/Left) instead of the generic
   progress-bar/budget-line stack every other card type shows - see projectsCard()'s type-specific
   emphasis logic in app.js. */
.projects-card-budget-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.projects-card-budget-stats div{display:flex;flex-direction:column;gap:2px;padding:6px 0;border-top:1px solid var(--border)}
.projects-card-budget-stats span{font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim)}
.projects-card-budget-stats b{font:700 13px var(--font-data);color:var(--text)}
.projects-card-meta-primary{font-size:12px;color:var(--text);font-weight:600;justify-content:flex-start}
.projects-card-meta-primary span{color:var(--text)}
.projects-workspace-header{margin-bottom:16px}
.projects-back{margin-bottom:12px}
.projects-workspace-top{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.projects-workspace-thumb{display:grid;place-items:center;flex-shrink:0;width:64px;height:64px;border-radius:16px}
.projects-workspace-thumb svg{width:28px;height:28px}
.projects-workspace-titles{flex:1;min-width:200px}
.projects-workspace-titles h1{margin-bottom:4px;font-size:24px}
.projects-workspace-titles small{color:var(--text-dim);font-size:12px}
.projects-workspace-dates{display:flex;flex-direction:column;align-items:flex-end;gap:4px;font-size:12px;color:var(--text-dim);text-align:right}
.projects-workspace-dates span{display:flex;align-items:center;gap:6px}
.projects-workspace-dates svg{width:14px;height:14px}
.projects-workspace-dates small.good{color:var(--success)}
.projects-workspace-dates small.bad{color:var(--danger)}
.projects-tabs{display:inline-flex}
.projects-tab-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);grid-template-areas:"summary budget" "attention attention";gap:10px}
.projects-tab-grid>section:nth-child(1){grid-area:summary}
.projects-tab-grid>section:nth-child(2){grid-area:budget}
.projects-tab-grid>section:nth-child(3){grid-area:attention}
.projects-summary-list{display:grid;gap:12px}
.projects-summary-list>div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:12px;align-items:start;padding-bottom:12px;border-bottom:1px solid var(--border)}
.projects-summary-list>div:last-child{border-bottom:0;padding-bottom:0}
.projects-summary-list dt{font-size:11px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em}
.projects-summary-list dd{margin:0;font-size:13px;display:flex;align-items:center;gap:8px}
.projects-summary-list dd svg{width:15px;height:15px;color:var(--text-dim)}
.projects-budget-mini{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
.projects-budget-mini.projects-budget-mini-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.projects-budget-mini>div{display:flex;flex-direction:column;gap:4px;padding:10px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
.projects-budget-mini span{font-size:10px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em}
.projects-budget-mini b{font:700 14px var(--font-data)}
/* Modernized actionable Needs Attention row (see projectsAttentionPanel): icon badge + copy + one
   quiet "View" action per condition, bounded to 5 by default like every other list here - replaces
   the old plain warning-text-only row with something the user can actually act on. */
.projects-attention-list{display:flex;flex-direction:column;gap:8px}
.projects-attention-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:var(--surface-2)}
.projects-attention-row svg{width:18px;height:18px;flex-shrink:0}
.projects-attention-row.warning svg{color:var(--warning)}
.projects-attention-row.bad svg{color:var(--danger)}
.projects-attention-copy{flex:1;min-width:0}
.projects-attention-row strong{display:block;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.projects-attention-row small{display:block;margin-top:3px;color:var(--text-dim);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.projects-attention-action{flex-shrink:0;padding:0 16px;font-size:11.5px}
.projects-budget-row{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
.projects-category-list,.projects-expenses-list{max-height:none;overflow:visible}
.projects-category-list.expanded,.projects-expenses-list.expanded{max-height:440px;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
.projects-budget-workspace-card button{min-height:44px}
.projects-budget-workspace-card .projects-cal-nav-btn{width:44px;height:44px;min-width:44px;padding:0}
.projects-budget-workspace-card .projects-row-action{width:44px;height:44px}
.projects-category-card>.projects-card-heading,.projects-expenses-card>.projects-card-heading{margin-bottom:12px}
.projects-category-desktop .projects-table{min-width:760px;table-layout:auto}
.projects-category-desktop .projects-table th,.projects-category-desktop .projects-table td{padding-left:7px;padding-right:7px}
.projects-category-desktop .projects-table th:first-child,.projects-category-desktop .projects-table td:first-child{padding-left:0}
.projects-category-desktop .projects-table th:last-child,.projects-category-desktop .projects-table td:last-child{padding-right:0;width:48px}
.projects-category-mobile,.projects-expenses-mobile{display:none}
.projects-records-toggle{min-height:44px;margin-top:6px;padding:8px 2px;display:inline-flex;align-items:center}
.projects-row-action{width:44px;height:44px;border-radius:10px}
.projects-row-action svg{width:16px;height:16px}
.projects-category-mobile-row{display:grid;gap:7px;padding:11px 0;border-top:1px solid var(--border)}
.projects-category-mobile-row:first-child{border-top:0;padding-top:0}
.projects-category-mobile-head,.projects-category-mobile-values,.projects-category-mobile-used{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
.projects-category-mobile-head strong{min-width:0;overflow-wrap:anywhere;font-size:13px}
.projects-category-mobile-head .pill{flex:0 0 auto}
.projects-category-mobile-values>span{display:grid;gap:2px;min-width:0}
.projects-category-mobile-values small,.projects-category-mobile-used small{color:var(--text-dim);font-size:10px}
.projects-category-mobile-values b{font-size:12px}
.projects-category-mobile-values i{color:var(--text-dim);font-style:normal}
.projects-category-mobile-used .fitness-kpi-bar{flex:1}
.projects-expense-mobile-row{display:grid;grid-template-columns:minmax(0,1fr) auto 44px;align-items:center;gap:8px;padding:9px 0;border-top:1px solid var(--border)}
.projects-expense-mobile-row:first-child{border-top:0;padding-top:0}
.projects-expense-mobile-row>div{display:grid;gap:3px;min-width:0}
.projects-expense-mobile-row strong{overflow-wrap:anywhere;font-size:12px}
.projects-expense-mobile-row small{color:var(--text-dim);font-size:10px;overflow-wrap:anywhere}
.projects-expense-mobile-row>b{font-size:12px}
.projects-expense-mobile-row .projects-row-action{grid-column:3;grid-row:1/3}
.projects-table-bar{display:flex;align-items:center;gap:8px;min-width:110px}
.projects-table-bar .fitness-kpi-bar{flex:1}
.projects-table-bar small{font:600 10px var(--font-data);color:var(--text-dim);width:28px;text-align:right}
.projects-task-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.bad-text{color:var(--danger)}
.projects-timeline{display:grid;gap:0}
.projects-timeline-row{display:flex;gap:12px;padding:12px 0;border-top:1px solid var(--border)}
.projects-timeline-row:first-child{border-top:0;padding-top:0}
.projects-timeline-dot{width:10px;height:10px;border-radius:50%;margin-top:5px;flex-shrink:0;background:var(--border-strong)}
.projects-timeline-dot.accent{background:var(--accent)}
.projects-timeline-dot.good{background:var(--success)}
.projects-timeline-dot.info{background:#4ec1e0}
.projects-timeline-dot.warning{background:var(--warning)}
.projects-timeline-copy{flex:1;min-width:0}
.projects-timeline-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.projects-timeline-top strong{font-size:12.5px}
.projects-timeline-copy small{display:block;margin-top:3px;color:var(--text-dim);font-size:11px}
.projects-timeline-copy time{display:block;margin-top:4px;font:10px var(--font-data);color:var(--text-faint)}
.projects-upcoming-list{display:grid;gap:0}
.projects-upcoming-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--border)}
.projects-upcoming-row:first-child{border-top:0;padding-top:0}
.projects-upcoming-date{display:flex;flex-direction:column;align-items:center;justify-content:center;width:38px;flex-shrink:0;padding:6px 0;border-radius:9px;background:var(--surface-2);text-align:center}
.projects-upcoming-date strong{font:700 9px var(--font-ui);text-transform:uppercase;color:var(--text-dim)}
.projects-upcoming-date small{font:700 15px var(--font-data);color:var(--text)}
.projects-upcoming-copy{flex:1;min-width:0}
.projects-upcoming-copy strong{display:block;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.projects-upcoming-copy small{display:block;margin-top:2px;color:var(--text-dim);font-size:10.5px}
/* Generic donut + table + range-tab primitives used by Projects. */
.projects-table-wrap{overflow-x:auto}
.projects-table{width:100%;border-collapse:collapse;min-width:520px}
.projects-table th{padding:0 10px 10px;text-align:left;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);font-weight:700;border-bottom:1px solid var(--border)}
.projects-table td{padding:11px 10px;border-bottom:1px solid var(--border);font-size:12.5px;white-space:nowrap}
.projects-table tbody tr:last-child td{border-bottom:0}
.projects-table td.mono{font-family:var(--font-data);font-variant-numeric:tabular-nums}
.projects-amount-cell{font-weight:700;text-align:right}
.projects-row-action{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;color:var(--text-dim)}
.projects-row-action:hover{background:var(--surface-2);color:var(--accent)}
.projects-row-action svg{width:16px;height:16px}
.projects-primary-row{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:10px}
.projects-range-tabs{display:flex;gap:2px;padding:3px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);flex-shrink:0}
.projects-range-tabs span{padding:5px 10px;border-radius:8px;font-size:10.5px;font-weight:600;color:var(--text-dim);cursor:pointer}
.projects-range-tabs span.active{color:var(--text);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent-line)}
.projects-donut-row{display:flex;align-items:center;gap:20px}
.projects-donut{position:relative;flex-shrink:0;width:140px;height:140px;border-radius:50%}
.projects-donut-hole{position:absolute;inset:20px;border-radius:50%;background:var(--surface);display:grid;place-items:center;text-align:center}
.projects-donut-hole strong{display:block;font:700 15px var(--font-data);color:var(--text)}
.projects-donut-hole small{display:block;margin-top:2px;color:var(--text-dim);font-size:9px}
.projects-legend{display:grid;gap:9px;min-width:0}
.projects-legend-row{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text)}
.projects-legend-row b{margin-left:auto;font:600 11px var(--font-data);color:var(--text-dim)}
.projects-legend-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
/* Premium finish: glossy top-edge highlight + soft shadow on Projects surfaces, restrained glow on hover/focus. */
.projects-card,.projects-grid-card,.projects-donut{position:relative}
.projects-card:before,.projects-grid-card:before{content:"";position:absolute;inset:0 0 auto;height:1px;border-radius:16px 16px 0 0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);pointer-events:none}
.projects-card,.projects-grid-card{box-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 16px 32px -18px rgba(3,8,18,.55)}
.projects-grid-card{transition:border-color var(--motion-state) ease,box-shadow var(--motion-state) ease,transform var(--motion-state) ease}
.projects-grid-card:hover{border-color:var(--accent-line);box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 20px 40px -16px rgba(3,8,18,.6),0 0 0 1px var(--accent-line);transform:translateY(-1px)}
.projects-grid-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.projects-status-tab:hover,.projects-range-tabs span:hover,.projects-view-toggle button:hover{color:var(--text);background:var(--surface-3)}
.projects-view-toggle button.active{box-shadow:inset 0 0 0 1px var(--accent-line),0 0 14px -6px var(--accent-line)}
.projects-donut{box-shadow:0 0 0 1px rgba(255,255,255,.05) inset,0 18px 34px -20px rgba(3,8,18,.6)}
.projects-donut-hole{box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 8px 18px -12px rgba(3,8,18,.5)}
.projects-row-action:hover,.text-link.projects-back:hover{box-shadow:0 0 0 1px var(--accent-line)}
.projects-table-bar .fitness-kpi-bar,.projects-inline-bar .fitness-kpi-bar,.fitness-kpi-bar{position:relative;overflow:hidden}
.fitness-kpi-bar span{position:relative}
.fitness-kpi-bar span:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.16),transparent 60%);pointer-events:none}
/* List view */
.projects-list{display:grid;gap:8px}
/* The name column previously had no floor (minmax(0,1.4fr)) while six sibling columns each kept
   their own min-content width - once this row's real available width shrank (the workspace card
   sharing space with Focus, or the compact 900-1199px icon-rail band), the name's fr-share lost
   that competition first, and text-overflow:ellipsis on a handful of remaining pixels produced
   fragments like "Tes..." instead of a readable truncated name. minmax(140px,1.4fr) gives it a
   guaranteed floor; below that, the container query further down switches to a compact two-row
   layout (name gets its own full-width line, wrapping to two lines) rather than clipping further. */
.projects-list-row{display:grid;grid-template-columns:44px minmax(140px,1.4fr) auto 90px 40px minmax(0,.9fr) minmax(0,.7fr) 70px 16px;align-items:center;gap:14px;width:100%;padding:10px 14px;text-align:left;border:1px solid var(--border);border-radius:12px;background:linear-gradient(145deg,rgba(22,31,48,.96),rgba(14,21,35,.98));box-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 10px 20px -16px rgba(3,8,18,.5);transition:border-color var(--motion-state) ease,box-shadow var(--motion-state) ease}
.projects-list-row:hover{border-color:var(--accent-line);box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 0 0 1px var(--accent-line)}
.projects-list-row:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.projects-list-row .projects-card-thumb{height:40px;width:40px;border-radius:10px;flex-shrink:0}
.projects-list-row .projects-card-thumb svg{width:18px;height:18px}
.projects-list-name{min-width:0;display:grid;gap:2px}
.projects-list-name strong{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.projects-list-name small{color:var(--text-dim);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.projects-list-chips{margin:0;flex-wrap:nowrap;min-width:0;overflow:hidden}
.projects-list-bar{width:90px;min-width:0}
.projects-list-pct{font:700 12px var(--font-data);color:var(--text);text-align:right;min-width:0}
/* min-width:0 + overflow:hidden - a grid item's default min-width is auto (its content's full
   min-content size), so at the row width where the workspace card shares space with Focus, these
   three fr-sized columns refused to shrink below "No target date"/"No budget"'s full text width
   and visibly spilled over into their neighboring column instead of eliding - the same family of
   grid/flex "automatic minimum size" bug hit repeatedly elsewhere in this codebase. */
.projects-list-money{font:12px var(--font-data);color:var(--text-dim);white-space:nowrap;text-align:right;min-width:0;overflow:hidden;text-overflow:ellipsis}
.projects-list-date{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--text-dim);white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}
.projects-list-date svg{width:13px;height:13px;flex-shrink:0}
.projects-list-days{font-size:11px;font-weight:700;white-space:nowrap;text-align:right;min-width:0;overflow:hidden;text-overflow:ellipsis}
.projects-list-days.good{color:var(--success)}
.projects-list-days.bad{color:var(--danger)}
.projects-list-row>svg:last-child{width:16px;height:16px;color:var(--text-dim);flex-shrink:0}
/* The dense 9-column row (thumb/name/chips/bar/pct/money/date/days/chevron) realistically needs
   ~960px+ of its own width to lay out every column without any of them collapsing to near-zero -
   and the workspace card's real width is ~780-800px any time Focus (its paired card, see
   .projects-layout-grid) is present, which is effectively always at every viewport this page
   supports (.content caps out at 1100px usable regardless of how wide the window is). Below that,
   name priority wins outright: the name gets a full line (wrapping to two lines instead of
   ellipsis-truncating) with type/status chips right under it as the "useful summary" -
   Progress/Money/Date/Days (lower-priority, still visible on the detail page) drop rather than
   being squeezed to a near-zero column and visually overlapping their neighbors, which is what the
   dense layout actually did at the real ~784px width before this fix. Driven by the workspace
   card's own width (a container query), not the viewport, since Focus narrows it independent of
   any viewport breakpoint. */
@container projects-workspace (max-width: 960px) {
  .projects-list-row{grid-template-columns:40px minmax(0,1fr) auto;grid-template-areas:"thumb name chev" "meta meta meta";row-gap:8px;padding:10px 12px}
  .projects-list-row .projects-card-thumb{grid-area:thumb;height:36px;width:36px}
  .projects-list-name{grid-area:name}
  .projects-list-name strong{white-space:normal;overflow:visible;text-overflow:clip;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .projects-list-row>svg:last-child{grid-area:chev}
  .projects-list-chips{grid-area:meta;flex-wrap:wrap}
  .projects-list-bar,.projects-list-pct,.projects-list-money,.projects-list-date,.projects-list-days{display:none}
}
/* Notes and Resources */
.projects-notes-list,.projects-resource-list{display:grid;gap:10px}
.projects-note-row,.projects-resource-row{padding:14px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);box-shadow:0 1px 0 rgba(255,255,255,.03) inset}
.projects-note-row p{margin:0 0 8px;color:var(--text);font-size:13px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}
.projects-note-row time{color:var(--text-dim);font-size:10.5px}
.projects-note-footer{display:flex;align-items:center;justify-content:space-between;gap:8px}
.projects-resource-row{display:flex;align-items:center;gap:8px}
.projects-resource-row a{display:flex;align-items:center;gap:12px;flex:1;min-width:0;padding:14px;border:1px solid var(--border);border-radius:12px;color:inherit;text-decoration:none;transition:border-color var(--motion-state) ease,background var(--motion-state) ease}
.projects-resource-row a:hover,.projects-resource-row a:focus-visible{border-color:var(--accent-line);background:var(--accent-soft)}
.projects-resource-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--accent-soft);color:var(--accent);flex-shrink:0}
.projects-resource-icon svg{width:16px;height:16px}
.projects-resource-row a>svg:last-child{width:16px;height:16px;color:var(--text-dim);flex-shrink:0}
.projects-resource-copy{min-width:0;flex:1;display:grid;gap:2px}
.projects-resource-copy strong{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.projects-resource-copy small{color:var(--text-dim);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.projects-resource-row{padding:0;border:0;background:none;box-shadow:none}
/* Milestones (Tasks tab) */
.projects-milestone-list{display:grid;gap:0}
.projects-milestone-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--border)}
.projects-milestone-row:first-child{border-top:0}
.projects-milestone-copy{flex:1;min-width:0;display:grid;gap:2px}
.projects-milestone-copy strong{font-size:13px}
.projects-milestone-copy small{color:var(--text-dim);font-size:11px}
.projects-card-no-progress{margin:0;color:var(--text-dim);font-size:11px;font-style:italic}
.fitness-kpi.bad{border-color:rgba(240,102,122,.35);background:linear-gradient(145deg,rgba(63,20,26,.8),rgba(31,17,20,.96))}
.fitness-kpi.bad .fitness-kpi-icon{background:linear-gradient(145deg,rgba(240,102,122,.32),rgba(240,102,122,.14));color:var(--danger)}
.fitness-kpi-bar.bad span{background:var(--danger);box-shadow:0 0 6px rgba(240,102,122,.4)}
@media (max-width:1199px){.projects-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.projects-tab-grid{grid-template-columns:1fr;grid-template-areas:"summary" "budget" "attention"}.projects-budget-row,.projects-primary-row{grid-template-columns:1fr}.projects-workspace-dates{align-items:flex-start;text-align:left}}
@media (min-width:620px) and (max-width:899px){.projects-category-desktop .projects-table{min-width:680px}.projects-category-desktop .projects-table th,.projects-category-desktop .projects-table td{padding-left:5px;padding-right:5px}.projects-category-desktop .projects-table td{font-size:11px}.projects-category-desktop .projects-table-bar{min-width:82px;gap:5px}}
@media (max-width:619px){.projects-category-desktop,.projects-expenses-desktop{display:none}.projects-category-mobile,.projects-expenses-mobile{display:block}.projects-category-list.expanded,.projects-expenses-list.expanded{max-height:390px}.projects-budget-workspace-card .projects-mt-tabs{max-width:none;width:100%;margin-bottom:12px}.projects-budget-workspace-card .projects-mt-tab{font-size:11px;padding-left:6px;padding-right:6px}.projects-budget-workspace-card>.projects-mt-panels .card{padding:14px}.projects-category-mobile-used>.projects-row-action{flex:0 0 44px}}
@media (max-width:619px){.projects-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.projects-heading{flex-direction:column;align-items:flex-start}.projects-heading-actions{width:100%}.projects-search{max-width:none;flex:1}.projects-toolbar{flex-direction:column;align-items:stretch}.projects-status-tabs{overflow-x:auto}.projects-filters-toggle{display:inline-flex}.projects-filter-fields{display:none}.projects-filter-fields.open{display:flex}.projects-filter-fields .ui-select{flex:1 1 calc(50% - 4px);min-width:0}.projects-filter-fields .ui-select-trigger{min-width:0}.projects-view-toggle{flex:0 0 auto}.projects-workspace-top{flex-direction:column;align-items:flex-start}.projects-workspace-dates{width:100%}
  .projects-grid{gap:10px}
  .projects-grid-card{flex-direction:row;align-items:flex-start;padding:12px;gap:10px}
  .projects-grid-card .projects-card-thumb{height:40px;width:40px;flex-shrink:0;border-radius:10px}
  .projects-grid-card .projects-card-thumb svg{width:18px;height:18px}
  .projects-card-body{padding:0;gap:4px;flex:1;min-width:0}
  .projects-card-top strong{font-size:13px}
  .projects-card-body .chip-row{margin:0}
  .projects-card-next,.projects-card-date{border-top:0;padding-top:0;display:inline-flex;font-size:10px}
  .projects-status-tabs{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
  .projects-filter-fields{width:100%}
  .projects-filter-fields .ui-select[data-name=projectSort],.projects-filter-fields .ui-select[data-name=projectPriorityFilter]{flex:1 1 calc(50% - 4px)}
  .projects-filter-fields .ui-select[data-name=projectSort] .ui-select-trigger,.projects-filter-fields .ui-select[data-name=projectPriorityFilter] .ui-select-trigger{min-width:0}
  .projects-view-toggle{flex:0 0 auto}
  .projects-note-row{padding:12px}
  .projects-resource-row a{padding:12px}
}

/* Mail desktop density: preserve the Aurora Prism panes while bringing the workspace
   closer to the app bar and fitting more readable rows in the viewport. */
@media (min-width:900px){
  .content:has(.mail-page){padding-top:16px;}
  .mail-page-heading{gap:12px;margin-bottom:8px;}
  .mail-page-heading h1{margin-bottom:4px;}
  .mail-page-heading p{line-height:1.35;}
  .mail-workspace{height:calc(100dvh - 178px);min-height:520px;}
  .mail-rail-head{padding:12px 14px 10px;}
  .mail-rail-head strong{margin:2px 0;font-size:18px;}
  .mail-rail-section{padding:8px 8px;}
  .mail-rail-label{padding:0 8px 5px;}
  .mail-rail-item{min-height:40px;padding:5px 8px;}
  .mail-rail-foot{padding:9px 12px;}
  .mail-list-head{padding:10px 12px;}
  .mail-list-toolbar{margin-top:7px;}
  .mail-filter-row{margin-top:7px;}
  .mail-list{padding:5px 6px;}
  .mail-row{padding:9px 8px;}
  .mail-row-meta{margin-top:4px;}
  .mail-reader-head{padding:11px 16px;}
  .mail-reader-content{padding:16px 20px;}
  .mail-reader-tags{margin-bottom:11px;}
  .mail-reader-content h2{margin-bottom:11px;}
  .mail-reader-from{padding-bottom:12px;}
  .mail-reader-actions{margin-top:14px;}
  .mail-reader-foot{padding:9px 16px;}
}

/* Final Mail-only spacing pass: keep the rail and list dense without reducing type size. */
@media (min-width:900px){
  .mail-rail-head{padding:9px 14px 7px;}
  .mail-rail-head .eyebrow{margin-bottom:3px;}
  .mail-rail-section{padding:6px 8px;}
  .mail-rail-label{padding-bottom:4px;}
  .mail-list-head{padding:8px 10px;}
  .mail-filter-row{margin-top:5px;}
  .mail-list-toolbar{margin-top:5px;}
  .mail-list{padding:4px 6px;}
  .mail-row{padding:8px 8px;}
  .mail-list-footer{min-height:50px;padding:6px 10px;}
}

/* Planner Aurora Prism structure refinement: month-first navigation and compact agendas. */
.planner-page{width:100%;max-width:none}
.planner-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:10px}
.planner-heading h1{margin:0 0 4px}
.planner-heading p{margin:0;color:var(--text-dim)}
.planner-heading .button{min-height:42px}
.planner-toolbar{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;margin-bottom:12px}
.planner-month-controls{position:relative;display:flex;align-items:center;gap:6px;min-width:0}
.planner-month-label{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 12px;border:1px solid var(--border);border-radius:9px;color:var(--text);background:var(--surface-2);font:600 14px var(--font-ui);white-space:nowrap}
.planner-month-label svg{width:16px;height:16px;color:var(--accent)}
.planner-view-switch{display:flex;gap:3px;padding:3px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
.planner-view-switch button,.planner-task-tabs button{min-height:34px;padding:6px 12px;border:0;border-radius:8px;color:var(--text-dim);background:transparent}
.planner-view-switch button.active,.planner-task-tabs button.active{color:var(--text);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent-line)}
.planner-mini-popover{position:absolute;z-index:20;top:calc(100% + 8px);left:30px;width:286px;padding:12px;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface-1);box-shadow:0 20px 45px rgba(0,0,0,.42);opacity:0;pointer-events:none;transform:translateY(-4px);transition:opacity .15s ease,transform .15s ease}
.planner-mini-popover.open{opacity:1;pointer-events:auto;transform:translateY(0)}
.planner-mini-head,.planner-selected-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}
.planner-mini-head strong{font-size:13px}
.planner-mini-head>div{display:flex;gap:3px}
.planner-mini-weekdays,.planner-mini-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.planner-mini-weekdays{margin:10px 0 4px;color:var(--text-faint);font-size:9px;text-align:center}
.planner-mini-day{min-height:29px;border:1px solid transparent;border-radius:6px;color:var(--text-dim);background:transparent;font-size:11px}
.planner-mini-day:hover,.planner-mini-day:focus-visible{border-color:var(--accent-line);background:var(--accent-soft);color:var(--text)}
.planner-mini-day.outside{opacity:.35}.planner-mini-day.today{color:var(--info);font-weight:700}.planner-mini-day.selected{border-color:var(--accent-line);background:linear-gradient(135deg,rgba(39,200,255,.18),rgba(139,124,246,.18));color:var(--text);font-weight:700}
.planner-mini-today{display:flex;margin-top:10px;padding-top:8px;border-top:1px solid var(--border);font-size:10px}
.planner-grid{display:grid;grid-template-columns:minmax(250px,.82fr) minmax(520px,1.7fr) minmax(280px,.9fr);gap:12px;align-items:start}
.planner-left,.planner-center,.planner-right{display:grid;gap:12px;min-width:0;align-content:start}
.planner-card{padding:13px;min-width:0}
.planner-card .card-header{margin-bottom:9px}.planner-card .card-header h2{display:flex;align-items:center;gap:7px;margin:2px 0 0;font-size:15px}.planner-card .card-header h2 svg{width:17px;height:17px;color:var(--accent)}
.planner-week-agenda{display:grid;gap:2px}.planner-week-day{padding:8px 0;border-top:1px solid var(--border)}.planner-week-day:first-child{border-top:0}.planner-week-day.today{margin:0 -5px;padding:8px 5px;border:1px solid rgba(39,200,255,.25);border-radius:8px;background:rgba(39,200,255,.045)}
.planner-week-day-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:3px}.planner-week-day-head strong{font-size:11px}.planner-week-day-head small{color:var(--text-dim);font-size:10px}.planner-week-empty{display:block;padding:4px 0;color:var(--text-faint);font-size:10px}
.planner-overdue-card{border-color:rgba(248,113,113,.2);background:linear-gradient(145deg,rgba(90,25,42,.28),rgba(20,23,34,.9))}.planner-overdue-card .eyebrow,.planner-overdue-card h2 svg{color:#ff7979}
.planner-month-card{padding:14px}.planner-month-weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;margin:0 0 5px;color:var(--text-faint);font-size:9px;letter-spacing:.08em;text-align:center;text-transform:uppercase}.planner-month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.planner-month-day{display:flex;flex-direction:column;align-items:stretch;min-width:0;min-height:82px;padding:7px;border:1px solid var(--border);border-radius:8px;color:var(--text);background:rgba(255,255,255,.018);text-align:left}.planner-month-day:hover,.planner-month-day:focus-visible{border-color:var(--accent-line);background:var(--accent-soft)}.planner-month-day.outside{opacity:.38}.planner-month-day.today{border-color:rgba(39,200,255,.48)}.planner-month-day.selected{border-color:var(--accent-line);background:linear-gradient(145deg,rgba(39,200,255,.14),rgba(139,124,246,.12));box-shadow:inset 0 0 0 1px var(--accent-line)}.planner-month-day>strong{font-size:11px}.planner-month-day>div{display:grid;gap:3px;margin-top:6px;min-width:0}.planner-chip{display:block;overflow:hidden;padding:3px 4px;border-left:2px solid var(--info);border-radius:3px;color:var(--text-dim);background:rgba(39,200,255,.12);font-size:9px;line-height:1.15;text-overflow:ellipsis;white-space:nowrap}.planner-chip.provider-google{border-left-color:var(--accent-2);background:rgba(139,124,246,.13)}.planner-chip.provider-hub{border-left-color:var(--accent-2);background:rgba(139,124,246,.12)}.planner-chip.reminder-chip{border-left-color:var(--warning);background:rgba(217,119,6,.12)}.planner-month-day small{display:block;margin-top:2px;color:var(--text-faint);font-size:9px}.planner-selected-agenda{margin-top:12px;padding-top:11px;border-top:1px solid var(--border)}.planner-selected-heading{margin-bottom:5px}.planner-selected-heading h3{margin:2px 0 0;font-size:13px}.planner-selected-agenda .planner-event-row,.planner-selected-agenda .planner-task-row{padding:7px 0}
.planner-event-row,.planner-task-row{display:flex;align-items:center;gap:8px;min-width:0;padding:7px 0;border-top:1px solid var(--border)}.planner-event-row:first-child,.planner-task-row:first-child{border-top:0}.planner-event-row>svg{width:16px;height:16px;flex:0 0 auto;color:var(--info)}.planner-event-row.provider-google>svg{color:#9b8cff}.planner-event-row.provider-hub>svg{color:var(--accent-2)}.planner-event-row>div,.planner-task-row>div{min-width:0;flex:1}.planner-event-row strong,.planner-event-row small,.planner-task-row strong,.planner-task-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.planner-event-row strong,.planner-task-row strong{font-size:11px}.planner-event-row small,.planner-task-row small{margin-top:2px;color:var(--text-dim);font-size:9px}.planner-task-row.completed{opacity:.55}.planner-task-row.completed strong{text-decoration:line-through}.planner-check{display:grid;place-items:center;width:24px;height:24px;flex:0 0 auto;border:1px solid var(--text-dim);border-radius:50%;color:var(--success);background:transparent}.planner-check svg{width:14px;height:14px}
.planner-compact-week-card{min-height:0}.planner-week-columns{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}.planner-week-column{min-width:0;padding:7px;border:1px solid var(--border);border-radius:8px;background:rgba(255,255,255,.018)}.planner-week-column.selected{border-color:var(--accent-line);background:var(--accent-soft)}.planner-week-column>button{display:grid;gap:2px;width:100%;padding:0 0 7px;border:0;color:var(--text);background:transparent;text-align:left}.planner-week-column>button strong{font-size:11px}.planner-week-column>button small{color:var(--text-dim);font-size:9px}.planner-list-groups{display:grid;gap:12px}.planner-list-group h3{margin:0 0 3px;padding-bottom:5px;border-bottom:1px solid var(--border);font-size:12px}.planner-list-group .planner-event-row,.planner-list-group .planner-task-row{padding:8px 0}
.planner-task-tabs{display:flex;gap:3px;flex-wrap:wrap;margin:0 0 9px;padding:3px;border:1px solid var(--border);border-radius:9px;background:var(--surface-2)}.planner-task-tabs button{min-height:32px;padding:5px 9px;font-size:10px}.planner-task-group{margin-top:9px}.planner-task-group>.eyebrow{display:block;padding-top:7px;border-top:1px solid var(--border);font-size:9px}.planner-task-group:first-of-type>.eyebrow{border-top:0;padding-top:0}.planner-source-list{display:grid;gap:4px}.planner-source{display:flex;align-items:center;gap:8px;width:100%;min-height:42px;padding:6px 7px;border:1px solid transparent;border-radius:8px;color:var(--text);background:transparent;text-align:left}.planner-source:hover,.planner-source:focus-visible{border-color:var(--accent-line);background:var(--accent-soft)}.planner-source>svg{width:17px;height:17px;flex:0 0 auto;color:var(--info)}.planner-source>span{min-width:0;flex:1}.planner-source strong,.planner-source small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.planner-source small{margin-top:2px;color:var(--text-dim);font-size:9px}.planner-source i{font-style:normal;color:var(--text-dim);font-size:9px}.planner-source.muted{opacity:.5}.planner-source-note{margin:8px 0 0;font-size:10px}
@media (max-width:1499px) and (min-width:1200px){.planner-grid{grid-template-columns:minmax(220px,.78fr) minmax(470px,1.45fr) minmax(250px,.82fr)}.planner-month-day{min-height:76px}}
@media (max-width:1199px){.planner-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"center center" "left right"}.planner-center{grid-area:center}.planner-left{grid-area:left}.planner-right{grid-area:right}.planner-week-columns{grid-template-columns:repeat(4,minmax(0,1fr))}.planner-week-column:nth-child(n+5){display:none}}
@media (max-width:699px){.planner-heading{align-items:flex-start;flex-direction:column;gap:10px}.planner-heading .button{width:100%}.planner-toolbar{align-items:stretch;flex-direction:column}.planner-month-controls{justify-content:center}.planner-view-switch{width:100%}.planner-view-switch button{flex:1}.planner-grid{display:flex;flex-direction:column}.planner-center{order:1}.planner-left{order:2}.planner-right{order:3}.planner-month-grid{gap:3px}.planner-month-day{min-height:52px;padding:5px}.planner-month-day>strong{font-size:10px}.planner-chip{padding:2px;font-size:8px}.planner-month-day>div{margin-top:4px;gap:2px}.planner-month-day>div .planner-chip:nth-child(n+2),.planner-month-day small{display:none}.planner-month-weekdays{gap:3px;font-size:8px}.planner-week-columns{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:3px}.planner-week-column{min-width:145px;scroll-snap-align:start}.planner-mini-popover{left:50%;transform:translate(-50%,-4px)}.planner-mini-popover.open{transform:translate(-50%,0)}}

/* Planner final information architecture polish. */
.planner-heading-actions{display:flex;align-items:center;gap:8px}.planner-heading-actions .button{white-space:nowrap}
.planner-month-day{min-height:50px;padding:6px}.planner-month-day>div{margin-top:4px;gap:2px}.planner-chip{padding:2px 3px;font-size:8px}.planner-month-card .card-header h2{font-size:14px}
.planner-notes-drawer{position:fixed;z-index:40;top:0;right:0;bottom:0;width:min(410px,calc(100vw - 24px));display:flex;flex-direction:column;padding:22px;border-left:1px solid var(--border-strong);background:linear-gradient(160deg,rgba(20,27,43,.99),rgba(8,12,21,.99));box-shadow:-24px 0 60px rgba(0,0,0,.42)}
.planner-notes-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:16px;border-bottom:1px solid var(--border)}.planner-notes-head h2{display:flex;align-items:center;gap:8px;margin:4px 0 0;font-size:21px}.planner-notes-head h2 svg{width:19px;height:19px;color:var(--accent)}
.planner-notes-tools{display:grid;gap:9px;padding:14px 0}.planner-notes-tools .search-field{min-height:42px}.planner-notes-tools>.button{width:100%}.planner-notes-list{display:grid;gap:6px;overflow-y:auto;padding-right:3px}.planner-note-item{display:flex;align-items:flex-start;gap:10px;width:100%;padding:11px;border:1px solid var(--border);border-radius:10px;color:var(--text);background:rgba(255,255,255,.025);text-align:left}.planner-note-item:hover,.planner-note-item:focus-visible{border-color:var(--accent-line);background:var(--accent-soft)}.planner-note-icon{display:grid;place-items:center;width:28px;height:28px;flex:0 0 auto;border-radius:8px;color:var(--accent);background:rgba(139,124,246,.12)}.planner-note-icon svg{width:15px;height:15px}.planner-note-item>span:last-child{display:grid;min-width:0;gap:3px}.planner-note-item strong,.planner-note-item small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.planner-note-item strong{font-size:12px}.planner-note-item small{color:var(--text-dim);font-size:10px}.planner-note-item time{color:var(--text-faint);font-size:9px}.planner-notes-empty{display:grid;justify-items:center;gap:6px;padding:40px 14px;color:var(--text-dim);text-align:center}.planner-notes-empty svg{width:24px;height:24px;color:var(--accent)}.planner-notes-empty strong{color:var(--text)}.planner-notes-empty span{font-size:11px}
@media (min-width:700px) and (max-width:1499px){.planner-month-day{min-height:46px}}
@media (max-width:699px){.planner-heading-actions{width:100%;display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr)}.planner-heading-actions .button{width:100%;padding-inline:8px}.planner-month-day{min-height:42px;padding:4px}.planner-notes-drawer{width:100%;padding:18px 16px}.planner-notes-head h2{font-size:19px}}
.home-hero { height: 116px; margin-bottom: 10px; }
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
@media(max-width:619px){#toast{right:16px;bottom:calc(16px + env(safe-area-inset-bottom));left:16px;max-width:none;width:auto}}
/* Phase 2 account and local data controls */
.recovery-banner{display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem;margin-bottom:1.25rem;border-color:rgba(164,143,255,.45);background:linear-gradient(135deg,rgba(164,143,255,.12),rgba(255,255,255,.03))}.recovery-code{display:inline-block;margin-top:.5rem;padding:.7rem .85rem;border:1px solid var(--line-strong);border-radius:.5rem;letter-spacing:.12em;font:600 .9rem/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}.recovery-code-display{margin:.8rem 0 0;color:var(--text)}.recovery-code-display code{font:600 .9rem ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.08em}.settings-actions{display:flex;flex-wrap:wrap;gap:.65rem}.text-button{display:inline-flex;align-items:center;justify-content:center;margin-top:1rem;padding:0;border:0;background:none;color:var(--muted);font:inherit;text-decoration:underline;text-underline-offset:.2em;cursor:pointer}.text-button:hover,.text-button:focus-visible{color:var(--text)}
@media (max-width:600px){.recovery-banner{flex-direction:column}.recovery-banner .button{width:100%}.settings-actions>*{flex:1 1 100%}}
/* Phase 3A automation and connection surfaces */
.automation-card{border-color:rgba(164,143,255,.28)}.automation-card>h2,.automation-card .connection-header{display:flex;align-items:center;gap:.7rem}.connection-header{margin:1rem 0}.connection-header .integration-icon{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--line-strong);border-radius:12px;color:var(--accent)}.connection-header .integration-icon svg{width:22px;height:22px}.connection-header strong,.connection-header small{display:block}.connection-header small{margin-top:.2rem;color:var(--muted)}.sync-freshness{font-size:.86rem;color:var(--text)}.connection-actions{margin-top:1rem}.diagnostics{margin-top:1.1rem;border-top:1px solid var(--line);padding-top:.8rem;color:var(--muted);font-size:.8rem}.diagnostics summary{cursor:pointer;color:var(--text);font-weight:650}.automation-today{margin:1.25rem 0;padding:1.15rem;border:1px solid rgba(164,143,255,.35);border-radius:16px;background:linear-gradient(135deg,rgba(164,143,255,.1),rgba(255,255,255,.025))}.automation-today .card-header{margin-bottom:.8rem}.automation-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.automation-columns>div{min-width:0}.automation-columns .record{margin-top:.55rem}.synced-record{position:relative}.synced-record>svg{flex:0 0 auto;width:20px;height:20px;color:var(--accent)}.synced-record.stale{opacity:.7}.synced-record.stale:after{content:'Stale';margin-left:auto;font-size:.7rem;color:var(--warning)}.synced-record strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.synced-record small{display:block;margin-top:.2rem}.chip svg{width:13px;height:13px}.pill.bad{color:#fecaca;background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.28)}
@media(max-width:760px){.automation-columns{grid-template-columns:1fr}.automation-today{padding:.95rem}}
.connection-card{border:1px solid var(--border);border-radius:14px;padding:16px;margin:14px 0;background:var(--surface-2)}.connection-card .connection-header{margin:0 0 12px}.connection-card .connection-header>.pill{margin-left:auto}.synced-record[tabindex]{cursor:pointer}.synced-record[tabindex]:hover,.synced-record[tabindex]:focus-visible{background:var(--surface-2);outline:2px solid var(--accent);outline-offset:2px;border-radius:8px}.synced-record.handled{opacity:.68}.message-meta{display:grid;gap:4px;padding-bottom:16px;border-bottom:1px solid var(--border)}.message-meta span{font-size:12px;color:var(--text-dim)}.message-tags{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.message-body{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7;max-height:45vh;overflow:auto;border:1px solid var(--border);background:var(--surface-2);border-radius:10px;padding:16px;font-size:14px}
.home-assistant-slots{display:flex;flex-direction:column;gap:12px;margin-top:16px}.home-assistant-slot-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 12px;border:1px solid var(--border);border-radius:12px;padding:12px 14px;background:var(--surface-2)}.home-assistant-slot-row>div:first-child{min-width:0}.home-assistant-slot-row strong{display:block;font-size:13px;font-weight:600}.home-assistant-slot-row small{display:block;font-size:12px;color:var(--text-dim);overflow-wrap:anywhere}.home-assistant-picker{flex:1 1 100%;margin-top:4px;padding-top:12px;border-top:1px solid var(--border)}.home-assistant-picker-list{display:flex;flex-direction:column;gap:6px;max-height:260px;overflow-y:auto;margin-top:10px}.home-assistant-picker-row{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:44px;padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface);text-align:left}.home-assistant-picker-row:hover,.home-assistant-picker-row:focus-visible{background:var(--surface-3)}.home-assistant-picker-row.active{border-color:var(--accent-line);background:var(--accent-soft)}.home-assistant-picker-row small{color:var(--text-dim);font-size:11px}.home-assistant-picker-clear{margin-top:8px}
.home-assistant-metadata-group{display:flex;flex-direction:column;gap:8px;margin:-2px 0 4px 20px;padding-left:12px;border-left:2px solid var(--border)}
.home-assistant-slot-row-compact{padding:9px 12px;background:transparent}.home-assistant-slot-row-compact strong{font-size:12px;font-weight:600;color:var(--text-dim)}.home-assistant-slot-row-compact small{font-size:11px}
.ht-camera-live-badge{display:inline-block;margin-top:4px;padding:2px 7px;border-radius:999px;background:rgba(239,68,68,.16);color:#f87171;font-size:8px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.ht-camera{cursor:pointer}.ht-camera:hover .ht-camera-shot,.ht-camera:focus-visible .ht-camera-shot{outline:2px solid var(--accent-line);outline-offset:1px}
.camera-viewer-body{display:flex;gap:20px;align-items:flex-start}
.camera-viewer-media{flex:1 1 60%;min-width:0;aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#10162a,#141b2f);border:1px solid var(--border);border-radius:12px;overflow:hidden}
.camera-viewer-media svg{width:40px;height:40px;color:#66708d}
.camera-viewer-media img{width:100%;height:100%;object-fit:cover;display:block}
.camera-viewer-meta{flex:1 1 32%;min-width:160px;display:flex;flex-direction:column;gap:10px}
.camera-viewer-badge{display:inline-flex;align-self:flex-start;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;background:var(--surface-2);color:var(--text-dim)}
.camera-viewer-badge[data-live]{background:rgba(239,68,68,.16);color:#f87171}
.camera-viewer-meta-line{margin:0;font-size:12.5px;color:var(--text-dim);line-height:1.5}
.camera-viewer-refresh{align-self:flex-start}
@media(max-width:619px){.camera-viewer-body{flex-direction:column}.camera-viewer-media{flex:none;width:100%}.camera-viewer-meta{flex:none;width:100%}}
.mail-filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.mail-filters .check-label{min-height:44px;padding:6px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface-2);font-size:12px}

/* Projects V1 correction pass: milestone derived-progress line, starter-milestone preview. */
.projects-milestone-progress{margin-top:1px}
.projects-template-preview{list-style:none;margin:0;padding:10px 12px;display:grid;gap:6px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:13px;color:var(--text-dim)}
.projects-template-preview li{position:relative;padding-left:16px}
.projects-template-preview li:before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:var(--accent)}

/* Planning V2: type badges, read-only type indicator, lifecycle actions, budget category setup. */
.pill.type-project{color:var(--accent);background:var(--accent-soft)}
.pill.type-budget{color:var(--success);background:var(--success-soft)}
.pill.type-event{color:var(--info);background:var(--info-soft)}
.pill.type-goal{color:var(--warning);background:var(--warning-soft)}
.pill.type-purchase{color:var(--accent-2);background:rgba(232,179,104,.16)}
.pill.type-other{color:var(--text-dim);background:var(--surface-3)}
.projects-type-readonly{display:flex;align-items:center;gap:10px;min-height:44px}
.projects-type-readonly .hint{margin:0}
.projects-lifecycle-actions{display:flex;gap:4px;align-items:center}
.projects-note-title{display:block;font-size:14px;margin-bottom:6px}
.projects-category-check-list{display:grid;gap:6px;margin-bottom:14px}
.projects-category-check-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface-2)}
.projects-category-check-row .check-label{min-height:auto;flex:1;min-width:0}
.projects-category-check-row input[type=number]{width:140px;min-height:36px;padding:6px 10px}
.projects-category-add-row{display:flex;gap:8px;margin-bottom:16px}
.projects-category-add-row input{flex:1}
@media (max-width:619px){.projects-category-check-row{flex-wrap:wrap}.projects-category-check-row input[type=number]{width:100%}}

/* Aurora Prism shell: keep desktop navigation fixed while the workspace scrolls. */
.projects-budget-overview{display:grid;gap:14px}
.projects-budget-summary-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:hidden;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}
.projects-budget-summary-item{display:flex;align-items:center;gap:12px;min-width:0;padding:15px 16px;border-right:1px solid var(--border)}
.projects-budget-summary-item:last-child{border-right:0}
.projects-budget-summary-item>span:last-child{display:grid;min-width:0;gap:3px}
.projects-budget-summary-item small,.projects-month-overview-grid small{font-size:11px;color:var(--text-faint)}
.projects-budget-summary-item strong{font-size:20px;line-height:1.15;overflow-wrap:anywhere}
.projects-budget-summary-item em,.projects-month-overview-grid em{font-size:10px;color:var(--text-dim);font-style:normal}
.projects-month-overview-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.projects-month-overview-grid>div{display:grid;gap:5px;padding:12px;border-radius:var(--radius-sm);background:var(--surface-2);min-width:0}
.projects-month-overview-grid strong{font-size:17px;overflow-wrap:anywhere}
.projects-month-overview-grid .projects-card-heading{margin-bottom:8px}
.projects-bills-list{display:grid;max-height:380px;overflow:auto;overscroll-behavior:contain}
.projects-bill-row{display:grid;grid-template-columns:52px minmax(100px,1fr) auto auto auto auto;align-items:center;gap:12px;padding:10px 2px;border-bottom:1px solid var(--border)}
.projects-bill-date{display:grid;text-align:center;padding:4px;border-radius:8px;background:var(--surface-2)}
.projects-bill-date strong{font-size:13px;color:var(--accent)}
.projects-bill-date small,.projects-bill-copy small{font-size:10px;color:var(--text-faint)}
.projects-bill-copy{display:grid;min-width:0;gap:3px}
.projects-bill-copy strong{overflow-wrap:anywhere}
.projects-cal-cell.bill-overdue:after{background:var(--danger,#fb7185)}
.projects-cal-cell.bill-today:after{background:var(--warning,#fbbf24)}
.projects-cal-cell.bill-paid:after{background:var(--success,#34d399)}
.projects-cal-day-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.projects-cal-day-row>span{flex:1;min-width:0}
.projects-cal-view{display:flex;border:1px solid var(--border);border-radius:8px;overflow:hidden}
.projects-cal-view button{min-height:44px;padding:0 9px;background:transparent;border:0;color:var(--text-dim);font-size:11px;cursor:pointer}
.projects-cal-view button[aria-pressed=true]{background:var(--accent-soft);color:var(--accent);font-weight:700}
.projects-calendar-list{max-height:330px}
@media(max-width:1199px){.projects-budget-summary-item{padding:12px 10px;gap:8px}.projects-budget-summary-item strong{font-size:17px}.projects-bill-row{grid-template-columns:44px minmax(80px,1fr) auto auto;gap:8px}.projects-bill-row>.pill{grid-column:2}.projects-bill-row>.button,.projects-bill-row>.projects-row-action{grid-row:1;grid-column:auto}}
@media(max-width:699px){.projects-budget-summary-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.projects-budget-summary-item{min-height:78px;border-bottom:1px solid var(--border)}.projects-budget-summary-item:nth-child(2){border-right:0}.projects-budget-summary-item:nth-child(n+3){border-bottom:0}.projects-month-overview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.projects-bill-row{grid-template-columns:42px minmax(0,1fr) auto;gap:8px}.projects-bill-row>.pill{grid-column:2}.projects-bill-row>.projects-row-action{grid-column:3;grid-row:1}.projects-bill-row>.button{grid-column:2/-1;min-height:44px}.projects-bill-row>.mono{grid-column:3;grid-row:2}.projects-bills-list{max-height:420px}}
@media (min-width: 900px) {
  .shell { display: block; }
  .sidebar {
    position: fixed;
    top: 0;
    left: 0;
    height: 100dvh;
    width: 240px;
    min-height: 0;
    overflow: hidden;
    padding-top: 20px;
    padding-bottom: 12px;
  }
  .workspace { min-height: 100dvh; margin-left: 240px; }
  .sidebar .brand { margin-bottom: 22px; }
  .sidebar nav {
    flex: 0 1 auto;
    min-height: 0;
    align-content: start;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(119,154,205,.35) transparent;
    gap: 2px;
  }
  .sidebar nav::-webkit-scrollbar { width: 5px; }
  .sidebar nav::-webkit-scrollbar-thumb { background: rgba(119,154,205,.35); border-radius: 999px; }
  .sidebar .nav-tools {
    flex: 0 0 auto;
    margin-top: 10px;
    padding-top: 10px;
    gap: 0;
  }
  .sidebar .sidebar-bottom { flex: 0 0 auto; padding-top: 10px; }
  .sidebar .local-tag { padding-top: 8px; }
}
@media (min-width: 900px) and (max-height: 800px) {
  .sidebar .nav-tools [data-logout] { display: none; }
  .sidebar .profile { padding-top: 7px; padding-bottom: 7px; }
  .sidebar .local-tag { display: none; }
}
/* LaguerreHub Responsive Design Standard V1 - compact band (900-1199px): the sidebar becomes a slim
   icon-only rail instead of a slightly-narrowed copy of the full desktop sidebar, reclaiming real
   width for page content at half-window sizes. nav-item-label/brand text/profile text are hidden
   (title attributes on each link - see navContents() in app.js - keep names on hover/focus); the
   mobile drawer (<900px) is unaffected and always keeps full labels. See
   docs/design/responsive-standard.md for the full standard. */
@media (min-width: 900px) and (max-width: 1199px) {
  .sidebar { width: 76px; padding-left: var(--space-2); padding-right: var(--space-2); }
  .workspace { margin-left: 76px; }
  .sidebar .brand { justify-content: center; gap: 0; padding: 0; }
  .sidebar .brand strong, .sidebar .brand small, .sidebar .nav-label, .sidebar .profile-name, .sidebar .nav-item-label { display: none; }
  .sidebar .nav-item { justify-content: center; padding: var(--space-2); gap: 0; }
  .sidebar .nav-item.active:before { left: 0; }
  .sidebar .profile { flex-direction: column; padding: var(--space-2); gap: 0; }
  .sidebar .local-tag { justify-content: center; padding-left: 0; padding-right: 0; }
}

/* Planner editor forms stay compact while retaining accessible controls. */
dialog#editor { position: fixed; left: 50vw; top: 50dvh; right: auto; bottom: auto; margin: 0; translate: -50% -50%; max-height: calc(100dvh - 32px); overflow-y: auto; padding: 18px; width: min(600px, calc(100% - 32px)); }
/* Groups the New/Edit Planning form into Basics / Details / Notes instead of one undifferentiated
   grid of fields, so a long type-specific form (e.g. Project's 8+ fields) reads as sections instead
   of a wall of inputs - no fields removed or reordered, purely a visual divider. */
#projects-modal-form .projects-modal-section{margin:4px 0 -6px;padding-top:12px;border-top:1px solid var(--border)}
#projects-modal-form .projects-modal-section:first-of-type{margin-top:0;padding-top:0;border-top:0}
#projects-modal-form .projects-modal-section .eyebrow{margin-bottom:0}
dialog#editor .dialog-heading { margin-bottom: 14px; gap: 12px; }
dialog#editor .form-grid { gap: 14px; }
dialog#editor .form-actions { margin-top: 16px; gap: 8px; }
dialog#editor .form-error { margin-top: 8px; }
@media (max-width: 619px) {
  dialog#editor { padding: 16px; }
  dialog#editor .dialog-heading { margin-bottom: 12px; }
  dialog#editor .form-grid { gap: 12px; }
  dialog#editor .form-actions { margin-top: 12px; }
}

/* Final shared page-density standard. */
.content{max-width:none;width:100%;}
.page-heading{margin-bottom:18px;}
.page-heading .eyebrow{margin-bottom:7px;}
.page-heading h1{margin-bottom:5px;}
.page-heading p{line-height:1.45;}
.mail-page-heading{margin-bottom:10px;}
.mail-page-heading p{line-height:1.45;}

/* Accessible custom dropdown (replaces native <select> in dialogs) - the closed trigger
   matches the input/select baseline; the open listbox is a real styled panel instead of the
   OS-native popup Chromium renders for <select>, which can't be reskinned to match this theme. */
.ui-select{display:grid;gap:8px;font-size:13px;font-weight:600;color:var(--text);position:relative}
/* Compact variant: the Planning toolbar's Type/Priority/Sort filters reuse this same accessible
   listbox instead of a native <select> (which Chromium renders with unstyleable OS-white popup
   chrome) - no visible label row, a smaller recessed trigger matching .projects-filter-fields. */
.ui-select-compact{gap:0;font-weight:400;color:var(--text-dim)}
.ui-select-compact .ui-select-trigger{min-height:36px;padding:0 26px 0 10px;background:transparent;border-color:var(--border);border-radius:8px;font-size:11.5px;color:var(--text-dim)}
.ui-select-compact.open .ui-select-trigger,.ui-select-compact .ui-select-trigger:focus-visible{color:var(--text)}
.ui-select-compact .ui-select-value{color:inherit}
.ui-select-trigger{width:100%;min-width:0;min-height:44px;padding:12px;background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:14px;font-weight:400;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;transition:border-color var(--motion-fast) ease}
.ui-select-trigger:hover{border-color:var(--border-strong)}
.ui-select.open .ui-select-trigger{border-color:var(--accent)}
.ui-select-trigger svg{width:16px;height:16px;color:var(--text-dim);flex-shrink:0;transition:transform var(--motion-fast) ease}
.ui-select.open .ui-select-trigger svg{transform:rotate(180deg)}
.ui-select-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-select-list{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:15;margin:0;padding:6px;list-style:none;background:var(--surface-3);border:1px solid var(--border-strong);border-radius:var(--radius-sm);box-shadow:var(--shadow-pop);max-height:240px;overflow-y:auto}
.ui-select-list[hidden]{display:none}
.ui-select.drop-up .ui-select-list,.ui-combobox.drop-up .ui-select-list{top:auto;bottom:calc(100% + 6px)}
.ui-select-list li{padding:10px 12px;border-radius:8px;font-size:14px;font-weight:500;color:var(--text);cursor:pointer;min-height:36px;display:flex;align-items:center}
.ui-select-list li:hover,.ui-select-list li.hl{background:var(--accent-soft)}
.ui-select-list li[aria-selected=true]{color:var(--accent);font-weight:700}
.ui-select-list li[hidden]{display:none}
@media(max-width:619px){.ui-select-trigger{min-height:48px}}
/* App-controlled Category combobox: free typing is still allowed (custom categories), but the
   popover is our own dark listbox instead of a native <datalist>, and autocomplete="off" on the
   input stops Chromium's separate "saved form values" white autofill suggestions from appearing -
   that was the actual source of the browser "Saved data" popup during normal category typing. */
.ui-combobox{display:grid;gap:8px;font-size:13px;font-weight:600;color:var(--text);position:relative}
.ui-combobox-field{display:flex;align-items:center;gap:6px;min-height:44px;padding:0 10px 0 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);transition:border-color var(--motion-fast) ease}
.ui-combobox-field:hover{border-color:var(--border-strong)}
.ui-combobox.open .ui-combobox-field{border-color:var(--accent)}
.ui-combobox-field input{flex:1;min-width:0;min-height:auto;width:auto;padding:12px 0;background:transparent;border:0;border-radius:0;color:var(--text);font-size:14px;font-weight:400}
.ui-combobox-toggle{flex-shrink:0;width:26px;height:26px;min-width:0;min-height:0;padding:0;color:var(--text-dim);border-radius:6px}
.ui-combobox-toggle:hover{background:var(--surface-3)}
.ui-combobox-toggle svg{width:16px;height:16px;transition:transform var(--motion-fast) ease}
.ui-combobox.open .ui-combobox-toggle svg{transform:rotate(180deg)}
/* Investing V2's Market News styling now lives entirely in investing-v2.css. */

/* Home / Today ? approved Figma Midnight Aurora Prism composition. */
.home-today-shell .workspace{--bg:#06070d;--surface:#0b1020;--surface-2:#10162a;--border:rgba(160,180,240,.13);--text:#f3f6ff;--text-dim:#9aa6c7;--text-faint:#8591af;--accent:#7c6ef5;background:var(--bg);color:var(--text)}
@media(min-width:900px){.home-today-shell .workspace{display:flex;flex-direction:column;height:100dvh;min-height:0;overflow:hidden}.home-today-shell .content{width:100%;max-width:none;padding:16px 24px;margin:0;display:flex;min-width:0;flex:1 1 auto;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.home-today-shell .topbar{display:none}.home-today-shell .footer{display:none}}
.ht-page.automation-today{display:flex;flex:none;flex-direction:column;gap:12px;min-height:0;width:100%;font-family:var(--font-ui);margin:0;padding:0;border:0;border-radius:0;background:radial-gradient(ellipse at 86% 100%,rgba(124,110,245,.085),transparent 48%),radial-gradient(ellipse at 10% 52%,rgba(34,211,238,.025),transparent 40%),transparent}
.ht-page button,.ht-page a{min-height:44px;min-width:44px}.ht-page button:focus-visible,.ht-page [tabindex]:focus-visible{outline:2px solid #a78bfa;outline-offset:-3px}.ht-page [hidden]{display:none!important}
.ht-page .ht-hero{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;grid-template-rows:auto;align-items:center;gap:20px;flex:none;height:74px;min-height:74px;margin:0;padding:10px 20px;border:1px solid rgba(124,110,245,.28);border-radius:16px;background:radial-gradient(ellipse at 80% -25%,rgba(34,211,238,.22),rgba(124,110,245,.28) 30%,transparent 60%),radial-gradient(ellipse at 10% 115%,rgba(100,55,220,.16),transparent 52%),linear-gradient(135deg,#10162a 50%,#180e36);box-shadow:inset 0 1px 0 rgba(180,160,255,.08),0 0 48px rgba(90,65,220,.18),0 2px 14px rgba(0,0,0,.65)}
.ht-welcome{grid-row:auto;grid-column:auto;min-width:0}.ht-hero h1{font-family:var(--font-ui);font-style:normal;font-size:clamp(24px,2.1vw,30px);font-weight:700;line-height:1.25;margin:0 0 4px;letter-spacing:-.02em;overflow-wrap:anywhere}.ht-hero h1>span{background:linear-gradient(90deg,#a78bfa,#22d3ee);background-clip:text;color:transparent}.ht-hero p{margin:0;font-size:13px;color:#9aa6c7}.ht-hero-date{font-size:12px}.ht-weather{grid-row:auto;grid-column:auto;display:flex;align-items:center;gap:10px;min-width:0}.ht-weather>svg{color:#a78bfa;width:28px;height:28px;flex:none}.ht-weather strong{font-size:13px;font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}.ht-weather small,.ht-clock small{display:block;font-size:11px;color:#9aa6c7;white-space:nowrap}.ht-weather.ht-weather-stale strong,.ht-weather.ht-weather-stale small{opacity:.72}.ht-clock{grid-row:auto;grid-column:auto;text-align:right}.ht-clock strong{font-weight:300;font-size:30px;line-height:1.2;font-variant-numeric:tabular-nums;white-space:nowrap}.ht-clock small{font-size:10px}.ht-private{grid-row:auto;grid-column:auto;display:flex;justify-content:flex-end;align-items:center;gap:5px;font-size:10px;color:#a78bfa;padding:6px 10px;white-space:nowrap;border:1px solid rgba(255,255,255,.13);border-radius:999px}.ht-private svg{width:12px;height:12px}.ht-clock small.sr-only{display:block}
.ht-dashboard{display:grid;grid-template-rows:auto auto auto;align-content:start;column-gap:12px;row-gap:10px;flex:none;min-height:0;max-height:none}.ht-primary,.ht-life,.ht-bottom{display:grid;gap:12px;min-width:0;min-height:0;grid-template-columns:repeat(2,minmax(0,1fr));flex:none}.ht-primary{height:272px;min-height:272px}.ht-life{grid-template-columns:repeat(3,minmax(0,1fr));min-height:132px}.ht-bottom{min-height:118px}
/* Large-desktop adaptive density: only a maximized large/tall-desktop window sizes the WHOLE
   dashboard from the real available viewport height, then distributes that height across the three
   rows - rather than growing each row by an independent guess. Trigger: min-width:1500px (not an
   earlier 1800px - a physical 3440px-wide ultrawide monitor under Windows display scaling can report
   an effective CSS viewport around ~1700px wide, well under 1800, so 1800 never activated in that
   real-world case even though it worked in an unscaled automated browser; 1500 leaves real margin
   above a half-screen CSS width around ~850px on the same scaled setup) and min-height:1000px (so a
   merely-wide-but-short window still doesn't trigger it). 122px = 16px .content top padding + 74px
   hero + 12px gap (measured, with the one-time recovery banner dismissed - the normal steady-state)
   + 16px .content bottom padding + ~4px final bottom breathing room (measured on the real
   scaled ~1700x1200 viewport, not the unscaled ~3440 automation one - an earlier 150px/~32px
   breathing figure, tuned only against the unscaled viewport, left a 48px gap there once the real
   scaled viewport was measured directly; 122px lands it at the intended ~16-24px), leaving a real
   but modest gap above the viewport edge instead of touching it. The three grid rows then share
   whatever height that leaves via fr, each floored at its known-safe minimum so no row can be
   squeezed below a usable size; .ht-primary's own fixed height/min-height (set above for normal/
   half-screen) is reset to auto here so it can stretch to fill its now-taller row instead of
   fighting it. Normal desktop and half-screen are completely unaffected - this media query does not
   match there. */
@media(min-width:1500px) and (min-height:1000px){
  .ht-dashboard{height:calc(100dvh - 122px);grid-template-rows:minmax(272px,1.4fr) minmax(160px,1fr) minmax(150px,.9fr)}
  .ht-primary{height:auto;min-height:0}
}
.ht-card{background:#0b1020;border:1px solid rgba(160,180,240,.13);border-radius:16px;display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden;box-shadow:0 1px 0 rgba(255,255,255,.015)}
.ht-card-header{display:flex;align-items:center;justify-content:space-between;padding:0 16px;min-height:39px;flex:none;gap:8px;border-bottom:1px solid var(--border)}.ht-card-header h2{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;line-height:1.3;margin:0;min-width:0}.ht-card-header h2 svg{width:16px;height:16px;color:#a78bfa}.ht-home .ht-card-header h2 svg,.ht-cameras .ht-card-header h2 svg{color:#22d3ee}.ht-fitness .ht-card-header h2 svg{color:#f43f5e}.ht-market .ht-card-header h2 svg{color:#10b981}
.ht-link{font-size:11px;padding:0 4px;color:#9aa6c7;gap:3px;border-radius:6px;white-space:nowrap}.ht-link svg{width:12px;height:12px}.ht-link:hover{color:#f3f6ff;background:rgba(124,110,245,.12)}
.ht-card-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#2a3050 transparent} .ht-home .ht-card-body{overflow:visible}.ht-empty{padding:20px 16px;color:#9aa6c7;font-size:12px}.ht-empty strong{color:#c2cbe1;font-weight:500}.ht-empty p{font-size:12px;margin:5px 0 0;line-height:1.5}
.ht-tabs{display:flex;gap:2px;background:rgba(255,255,255,.025);padding:2px 8px;flex:none;border-bottom:1px solid var(--border)}.ht-tabs button{flex:1;font-size:11px;line-height:1.3;border-radius:7px;padding:5px 4px;color:#9aa6c7}.ht-tabs button[aria-selected=true]{background:rgba(124,110,245,.15);color:#c4b5fd}.ht-mobile-tabs,.ht-page-tabs{display:none}
.ht-agenda-body{padding:6px 12px}.ht-event{display:grid;grid-template-columns:64px 10px minmax(0,1fr);gap:9px;align-items:start}.ht-event-time{font-size:10px;color:#9aa6c7;text-align:right;padding-top:14px;font-variant-numeric:tabular-nums}.ht-event-dot{width:8px;height:8px;border-radius:50%;background:#7c6ef5;margin-top:18px;position:relative}.ht-event:not(:last-child) .ht-event-dot:after{content:"";position:absolute;top:13px;left:3px;width:1px;height:30px;background:rgba(255,255,255,.08)}.ht-event-1 .ht-event-dot{background:#10b981}.ht-event-2 .ht-event-dot{background:#d97706}
.ht-page .record,.ht-page .synced-record{padding:9px 0;min-height:44px;background:none;box-shadow:none;border-radius:0;border-color:var(--border);margin:0;gap:7px}.ht-page .record strong,.ht-page .synced-record strong{font-size:12px;overflow-wrap:anywhere}.ht-page .record p,.ht-page .synced-record p{font-size:11px;margin:3px 0}.ht-page .record .meta,.ht-page .synced-record .meta{font-size:10px;gap:4px;flex-wrap:wrap}.ht-page .record .pill,.ht-page .synced-record .pill{font-size:9px;padding:2px 5px}.ht-event .record strong,.ht-event .synced-record strong{background:rgba(124,110,245,.24);border-radius:12px;padding:4px 9px;display:inline-block}.ht-event-1 .record strong,.ht-event-1 .synced-record strong{background:rgba(16,185,129,.22)}.ht-event-2 .record strong,.ht-event-2 .synced-record strong{background:rgba(217,119,6,.22)}
.ht-attention-project{display:flex;flex-direction:column;align-items:flex-start;width:100%;padding:10px 0;border-bottom:1px solid var(--border);text-align:left}.ht-attention-project>span{display:flex;gap:7px;align-items:center;font-size:12px}.ht-attention-project svg{width:16px;height:16px}.ht-attention-project small{font-size:11px;color:#fbbf24}
.ht-home-toggle{display:none}.ht-devices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px;align-content:start}.ht-device{border:1px solid rgba(140,160,220,.09);background:rgba(255,255,255,.018);padding:11px 12px;border-radius:12px;min-width:0}.ht-device>div{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:8px}.ht-device svg{width:18px;height:18px;color:#8591af}.ht-device-off{font-size:9px;color:#9aa6c7}.ht-device strong{display:block;font-size:13px;font-weight:600;color:#c2cbe1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ht-device small{display:block;font-size:11px;color:#9aa6c7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ht-device-note{grid-column:1/-1;margin:0;font-size:10px;line-height:1.4;color:#9aa6c7}.ht-device-stale small{color:var(--warning)}
.ht-fitness-body,.ht-market-body{padding:12px 16px}.ht-fitness-total{display:flex;align-items:baseline;gap:5px;flex-wrap:wrap}.ht-fitness-total strong{font-size:30px;line-height:1.2;font-weight:700}.ht-fitness-total span{font-size:17px;color:#9aa6c7}.ht-segments{display:flex;gap:4px;margin:12px 0}.ht-segments span{flex:1;height:8px;border-radius:2px;background:#1c2340}.ht-segments .filled{background:#7c6ef5}.ht-segments .filled:nth-child(n+4){background:#10b981}.ht-fitness-body p{display:flex;align-items:center;gap:5px;font-size:11px;margin:0}.ht-fitness-body p svg{width:13px;height:13px;color:#f97316}
.ht-camera-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:12px;align-content:start}.ht-camera{text-align:center;min-width:0}.ht-camera>div{aspect-ratio:2/1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:linear-gradient(135deg,#10162a,#141b2f);border:1px solid var(--border);border-radius:8px;overflow:hidden;position:relative}.ht-camera-shot img{width:100%;height:100%;object-fit:cover;display:block}.ht-camera-shot-stale img{opacity:.5;filter:grayscale(.4)}.ht-camera svg{width:20px;height:20px;color:#66708d}.ht-camera span{font-size:9px;color:#9aa6c7}.ht-camera strong{display:block;font-size:10px;font-weight:500;margin-top:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ht-camera small{display:block;font-size:9px;color:#9aa6c7;margin-top:2px}.ht-camera-updated{font-size:8px!important;color:#66708d!important}
/* V2.1 density refinement: the content area (label + grid) uses flex:1 to fill essentially all
   remaining body height after the compact context label and footer, instead of a small block
   centered in a mostly-empty card. Nav arrows/dots stay real 44px touch targets but absolutely
   positioned - zero extra layout height, required by the fixed-height mobile card
   (.ht-life>.ht-card: clamp(174px,36vw,230px), see @media(max-width:767px)). */
/* V2.2: the grid fills the body edge-to-edge (no reserved nav gutters) - arrows are pure overlays
   on top of the grid (z-index above the tiles, transparent background), so they cost zero width. */
.ht-market-body{display:flex;flex-direction:column;gap:4px;min-height:0;height:100%;box-sizing:border-box;padding:9px 10px}
.ht-market-context{flex:none;font-size:9px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-dim)}
.ht-market-content{position:relative;flex:1;display:flex;min-height:0;width:100%}
.ht-market-nav{position:absolute;top:0;bottom:0;width:44px;min-width:44px;height:auto;min-height:44px;padding:0;display:grid;place-items:center;color:#9aa6c7;background:transparent;z-index:1}
.ht-market-nav:hover{background:rgba(10,13,20,.35)}
.ht-market-nav svg{width:13px;height:13px}
.ht-market-prev{left:0}
.ht-market-next{right:0}
.ht-market-grid{flex:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:7px;margin:0;width:100%;min-height:0;box-sizing:border-box}
/* Partial pages (fewer than 4 symbols on the last watchlist page) get a deliberate layout instead
   of a tiny block floating in the corner: 3 = balanced 2-over-1, 2 = one per column centered, 1 =
   a single larger bounded row spanning the whole area (same typography, just more breathing room). */
.ht-market-grid[data-count="3"] .ht-market-tile:nth-child(1){grid-column:1;grid-row:1}
.ht-market-grid[data-count="3"] .ht-market-tile:nth-child(2){grid-column:2;grid-row:1}
.ht-market-grid[data-count="3"] .ht-market-tile:nth-child(3){grid-column:1/-1;grid-row:2}
.ht-market-grid[data-count="2"]{grid-template-rows:minmax(0,1fr)}
.ht-market-grid[data-count="1"]{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
.ht-market-grid[data-count="1"] .ht-market-tile{padding:14px 18px;justify-content:center}
.ht-market-tile{display:flex;flex-direction:column;justify-content:center;gap:4px;min-width:0;min-height:0;padding:7px 10px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}
.ht-market-tile-head{display:flex;align-items:baseline;gap:5px;min-width:0}
.ht-market-tile-symbol{font-size:11px;font-weight:700;letter-spacing:.02em;flex:none}
.ht-market-tile-label{font-size:9px;color:#9aa6c7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.ht-market-tile-row{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.ht-market-tile-price{font-size:13px;font-weight:700}
.ht-market-tile-point-change,.ht-market-tile-percent-change{font-size:10px;font-weight:600;color:#9aa6c7}
.ht-market-tile-point-change.positive,.ht-market-tile-percent-change.positive{color:var(--success)}
.ht-market-tile-point-change.negative,.ht-market-tile-percent-change.negative{color:var(--danger)}
.ht-market-tile-empty{font-size:11px;color:#666f82}
.ht-market-foot{position:relative;flex:none;display:flex;align-items:center;justify-content:center;min-height:16px}
.ht-market-foot>span{font-size:9px;line-height:1.3;color:#9aa6c7;text-align:center}
.ht-market-dots{position:absolute;right:0;top:50%;transform:translateY(-50%);display:flex}
.ht-market-dot{width:44px;height:44px;min-width:44px;min-height:44px;margin-left:-22px;padding:0;display:grid;place-items:center}
.ht-market-dot:first-child{margin-left:0}
.ht-market-dot:before{content:"";width:5px;height:5px;border-radius:50%;background:#394261}
.ht-market-dot.active:before{background:#10b981}
/* Below 768px the Market card's own height is capped hard (.ht-life>.ht-card:
   clamp(174px,36vw,230px) above) - a 2x2 grid of bordered, padded, two-line tiles doesn't fit
   there without clipping, so this is the explicitly-allowed fallback: one column of four compact
   single-line rows, each using the full card width so symbol+label+price+change all fit on one
   line without wrapping. */
@media(max-width:767px){
  .ht-market-grid,.ht-market-grid[data-count="1"],.ht-market-grid[data-count="2"],.ht-market-grid[data-count="3"]{grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(4,minmax(0,1fr))}
  .ht-market-grid[data-count="3"] .ht-market-tile:nth-child(1),.ht-market-grid[data-count="3"] .ht-market-tile:nth-child(2),.ht-market-grid[data-count="3"] .ht-market-tile:nth-child(3){grid-column:1;grid-row:auto}
  .ht-market-tile{flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:nowrap;padding:3px 8px;gap:6px}
  .ht-market-tile-head{flex-direction:row;flex:none;max-width:48%}
  .ht-market-tile-row{flex:none}
}
.ht-note{display:flex;align-items:center;gap:10px;text-align:left;padding:12px 16px;width:100%;border-bottom:1px solid var(--border)}.ht-note:last-child{border-bottom:0}.ht-note-icon{display:grid;place-items:center;width:30px;height:30px;flex:none;background:rgba(124,110,245,.14);border-radius:8px;color:#a78bfa}.ht-note-icon svg{width:14px;height:14px}.ht-note-copy{flex:1;min-width:0}.ht-note-copy strong,.ht-note-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ht-note-copy strong{font-size:12px;font-weight:600}.ht-note-copy small{font-size:11px;color:#9aa6c7;margin-top:4px}.ht-note time{font-family:var(--font-ui);font-size:10px;color:#9aa6c7;flex:none}
.ht-pulse-body{display:flex;flex-direction:column;gap:6px;padding:9px 16px;min-height:0}
.ht-pulse-status .pill{font-size:10px;padding:3px 9px}
.ht-pulse-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(58px,1fr));gap:6px}
.ht-pulse-stats small{display:block;font-size:8.5px;text-transform:uppercase;letter-spacing:.04em;color:#9aa6c7;white-space:nowrap}
.ht-pulse-stats strong{display:block;font-size:12.5px;font-weight:600;margin-top:1px;font-variant-numeric:tabular-nums;white-space:nowrap}
.ht-pulse-progress{display:flex;align-items:center;gap:8px}
.ht-pulse-progress-track{flex:1;height:5px;border-radius:999px;background:#1c2340;overflow:hidden}
.ht-pulse-progress-fill{display:block;height:100%;border-radius:999px;background:var(--text-dim,#9aa6c7)}
.ht-pulse-progress-fill.good{background:#10b981}.ht-pulse-progress-fill.warning{background:#f59e0b}.ht-pulse-progress-fill.bad{background:#f0667a}
.ht-pulse-progress small{font-size:9px;color:#9aa6c7;white-space:nowrap}
.ht-pulse-columns{display:grid;grid-template-columns:1fr 1fr;gap:14px;flex:1;min-height:0}
.ht-pulse-column{display:flex;flex-direction:column;gap:4px;min-width:0;min-height:0}
.ht-pulse-column+.ht-pulse-column{border-left:1px solid var(--border);padding-left:14px}
.ht-pulse-column-label{font-size:9px;text-transform:uppercase;letter-spacing:.05em;color:#9aa6c7}
.ht-pulse-bill{display:flex;align-items:baseline;gap:6px;font-size:11px}
.ht-pulse-bill-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#c2cbe1}
.ht-pulse-bill-amount{font-weight:600;font-variant-numeric:tabular-nums}
.ht-pulse-bill-date{color:#9aa6c7;font-size:10px;white-space:nowrap}
.ht-pulse-bill.overdue .ht-pulse-bill-date{color:#f0667a}
.ht-pulse-bills-total{font-size:9.5px;color:#9aa6c7;margin-top:1px}
.ht-pulse-category{display:flex;flex-direction:column;gap:1px}
.ht-pulse-category-name{font-size:11px;color:#c2cbe1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ht-pulse-category-detail{font-size:9.5px;color:#9aa6c7;font-variant-numeric:tabular-nums}
.ht-pulse-empty-note{font-size:10px;color:#9aa6c7;margin:0}
.ht-pulse-action{display:inline-flex;align-items:center;gap:3px;margin-top:2px;font-size:10px;color:#a78bfa;cursor:pointer}
.ht-pulse-action:hover{text-decoration:underline}
.ht-pulse-action svg{width:11px;height:11px}
.ht-pulse-activity{border-top:1px solid var(--border);padding-top:6px;display:flex;flex-direction:column;gap:3px}
.ht-pulse-activity-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:10.5px}
.ht-pulse-activity-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#c2cbe1}
.ht-pulse-activity-amount{font-weight:600;font-variant-numeric:tabular-nums;color:#f0667a;flex:none}
.ht-empty .button{margin-top:8px}
@media(max-width:767px){.ht-pulse-columns{grid-template-columns:1fr;gap:10px}.ht-pulse-column+.ht-pulse-column{border-left:0;padding-left:0;border-top:1px solid var(--border);padding-top:8px}}
@media(max-width:1279px){.ht-page .ht-hero{gap:16px;padding:8px 20px}.ht-hero h1{font-size:24px}.ht-hero-date{font-size:12px!important}.ht-private{font-size:10px}}
@media(max-width:1023px) and (min-width:768px){.home-today-shell .topbar{display:flex;flex:0 0 72px;height:72px;border-color:#262d3b}.home-today-shell .drawer-toggle{display:inline-flex}.home-today-shell .breadcrumb>span:first-child{font-size:0}.home-today-shell .breadcrumb>span:first-child:after{content:"LaguerreHub";font-size:14px;font-weight:600}.home-today-shell .breadcrumb>svg,.home-today-shell .breadcrumb>span:last-child{display:none}.home-today-shell .topbar-right{font-size:11px}.home-today-shell .topbar-right .mono{display:none}.home-today-shell .content{padding:12px 24px}.ht-dashboard{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto}.ht-primary,.ht-life,.ht-bottom{display:contents}.ht-card{min-height:180px}.ht-schedule,.ht-home{height:340px}.ht-cameras{grid-column:1/-1;grid-row:2}.ht-camera>div{aspect-ratio:auto;height:120px}.ht-camera-grid{padding:12px 16px}.ht-fitness,.ht-market{grid-row:3}.ht-notes,.ht-financial-pulse{grid-row:4;height:215px}.ht-hero h1{font-size:24px}.ht-page .ht-hero{height:auto;min-height:90px;padding:20px;gap:4px 16px}.ht-clock strong{font-size:26px}}
@media(max-width:899px){.home-today-shell .workspace{height:auto;min-height:100dvh;overflow:visible}.home-today-shell .topbar{height:64px;flex:0 0 64px;border-color:#262d3b}.home-today-shell .content{display:block;flex:none;min-height:0;overflow:visible;padding:12px 24px}.home-today-shell .topbar{display:flex}.home-today-shell .footer{display:none}}
@media(max-width:767px){.home-today-shell .content{padding:0 16px 12px}.ht-page-tabs{display:flex;margin:0 -16px;background:#090d18;border-bottom:1px solid var(--border)}.ht-page-tabs button{flex:1;font-size:12px;border-bottom:2px solid transparent}.ht-page-tabs button[aria-pressed=true]{color:#a78bfa;border-color:#7c6ef5}.ht-page .ht-hero{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto auto;gap:6px 8px;min-height:118px;padding:12px 16px}.ht-welcome{display:contents}.ht-hero-date{grid-row:1;grid-column:1;font-size:10px!important}.ht-hero h1{grid-row:2/4;grid-column:1;font-size:20px;margin:0}.ht-private{grid-row:1;grid-column:2;font-size:9px;padding:3px 7px}.ht-clock{grid-row:2;grid-column:2}.ht-clock strong{font-size:24px}.ht-weather{grid-row:3;grid-column:2;flex-direction:column;align-items:flex-end;justify-content:center;gap:0}.ht-weather strong{font-size:12px}.ht-weather small{font-size:9px}.ht-weather>svg{display:none}.ht-dashboard{display:flex;flex-direction:column;gap:12px}.ht-primary{display:contents}.ht-schedule{order:0;min-height:0;height:280px;flex:none}.ht-life{display:flex;flex-direction:column;gap:0;order:1;border:1px solid var(--border);border-radius:16px;background:#0b1020;min-height:0;flex:none}.ht-bottom{display:flex;flex-direction:column;gap:0;order:2;border:1px solid var(--border);border-radius:16px;background:#0b1020;min-height:0;flex:none}.ht-home{order:3;min-height:0;height:auto;flex:none}.ht-home-toggle{display:inline-flex}.ht-home .ht-card-header{border-bottom:0}.ht-devices{max-height:340px}.ht-home .ht-device-note{font-size:10px}.ht-life>.ht-card,.ht-bottom>.ht-card{border:0;box-shadow:none;height:clamp(174px,36vw,230px);min-height:0;border-radius:0 0 16px 16px}.ht-bottom>.ht-card{height:178px}.ht-life>.ht-card>.ht-card-header,.ht-bottom>.ht-card>.ht-card-header{min-height:44px}.ht-life>.ht-card>.ht-card-header h2,.ht-bottom>.ht-card>.ht-card-header h2{font-size:12px}.ht-mobile-tabs{display:flex;border-radius:16px 16px 0 0;padding:4px 6px}.ht-camera-grid{padding:10px}.ht-camera>div{height:auto;aspect-ratio:1}.ht-camera span{font-size:9px}.ht-cameras .ht-card-header{display:none!important}.ht-event{grid-template-columns:49px 8px minmax(0,1fr);gap:6px}.ht-event-time{font-size:9px}.ht-note{padding:12px}.ht-note time{display:none}.ht-device{padding:10px}.ht-device-off{display:none}.ht-tabs button{font-size:10px}.ht-dashboard[data-today-section-view=schedule]>.ht-life,.ht-dashboard[data-today-section-view=schedule]>.ht-bottom,.ht-dashboard[data-today-section-view=schedule] .ht-home,.ht-dashboard[data-today-section-view=home]>.ht-life,.ht-dashboard[data-today-section-view=home]>.ht-bottom,.ht-dashboard[data-today-section-view=home] .ht-schedule{display:none}.ht-page .recovery-banner{flex-direction:column}.ht-page .recovery-code{overflow-wrap:anywhere;word-break:break-all}}

/* Planner V2 Figma composition. */
.planner-page .planner-check{width:44px;height:44px;min-width:44px;min-height:44px;padding:0}.planner-page .planner-month-day{min-height:44px}.planner-page .planner-month-label,.planner-page .planner-view-switch button,.planner-page .planner-source-trigger{min-height:44px}
.planner-task-title{justify-content:flex-start;min-height:44px;min-width:0;max-width:100%;padding:4px 0;color:#F3F6FF;background:transparent;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:600}.planner-task-title:hover{color:#AC98FF}
.content:has(.planner-page){max-width:1640px;padding:22px 26px;background:#06070D}body:has(.planner-page){background:#06070D}
.planner-page{--planner-border:rgba(140,160,220,.10);--planner-secondary:#9AA6C7;--planner-muted:#66708D;width:100%;min-width:0;display:flex;flex-direction:column;gap:12px;color:#F3F6FF}
.planner-page .planner-heading{align-items:center;margin:0}.planner-page .planner-heading h1{font-size:28px;letter-spacing:-.03em;margin:0}.planner-page .planner-heading p{margin-top:4px;color:var(--planner-secondary);font-size:13px}.planner-page .planner-heading-actions .button{min-height:44px}.planner-page .planner-heading-actions .button.primary{background:linear-gradient(115deg,#7C5CFC,#D891C1 62%,#E8B368);color:#10121b}
.planner-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.planner-summary-tile{min-width:0;display:flex;align-items:center;gap:11px;padding:12px 14px;border:1px solid var(--planner-border);border-radius:12px;background:linear-gradient(150deg,rgba(16,22,42,.95),rgba(11,16,32,.96));box-shadow:0 10px 28px rgba(0,0,0,.16)}.planner-summary-icon{display:grid;place-items:center;width:36px;height:36px;flex:0 0 auto;border-radius:11px;color:#a691ff;background:rgba(124,92,252,.16)}.planner-summary-icon svg{width:17px;height:17px}.planner-summary-tile>span:last-child{display:grid;min-width:0;gap:2px}.planner-summary-tile small,.planner-summary-tile em{font-size:10px;line-height:1.3;color:var(--planner-secondary);font-style:normal}.planner-summary-tile strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;line-height:1.35}.planner-summary-tile em{color:var(--planner-muted)}.planner-summary-tile.is-overdue strong{color:#F87171}.planner-summary-tile:nth-child(2) .planner-summary-icon{color:#22D3EE;background:rgba(34,211,238,.12)}.planner-summary-tile:nth-child(3) .planner-summary-icon{color:#F87171;background:rgba(248,113,113,.12)}.planner-summary-tile:nth-child(4) .planner-summary-icon{color:#FBBF24;background:rgba(251,191,36,.12)}
.planner-page .planner-toolbar{margin:0;padding:8px 10px;border-color:var(--planner-border);background:rgba(11,16,32,.9);box-shadow:none}.planner-page .planner-month-label{background:#10162A;border-color:var(--planner-border);color:#F3F6FF;min-height:42px}.planner-page .planner-view-switch{background:#080c18;border-color:var(--planner-border)}.planner-page .planner-view-switch button{min-height:40px}.planner-page .planner-view-switch button.active{background:#7C5CFC;color:white;box-shadow:none}.planner-sources-wrap{position:relative}.planner-source-trigger{min-height:42px;padding:7px 12px;font-size:12px}.planner-source-popover{position:absolute;z-index:25;right:0;top:calc(100% + 7px);width:min(300px,calc(100vw - 32px));padding:9px;border:1px solid rgba(140,160,220,.2);border-radius:12px;background:#10162A;box-shadow:0 20px 50px rgba(0,0,0,.56)}.planner-source-popover .planner-source{min-height:48px}.planner-source-popover .planner-source[aria-pressed=true] i{color:#34D399}
.planner-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(350px,1fr);gap:12px;align-items:stretch;min-height:0}.planner-center,.planner-right{min-width:0;min-height:0;display:grid;align-content:start;gap:12px}.planner-right{grid-template-rows:minmax(280px,1.1fr) minmax(230px,.9fr)}.planner-page .planner-card{padding:13px;border-radius:13px;border-color:var(--planner-border);background:linear-gradient(160deg,#0B1020,#0A0F1D 75%);box-shadow:0 12px 28px rgba(0,0,0,.2)}.planner-page .planner-card .card-header{margin-bottom:9px}.planner-page .planner-card .card-header h2{font-size:14px;color:#F3F6FF}.planner-page .planner-card .card-header h2 svg{color:#9c88ff}.planner-page .planner-card .card-header .button{min-height:40px;padding:6px 11px}.planner-month-card{display:flex;flex-direction:column;min-height:0}.planner-month-card .card-header{min-height:34px}.planner-month-card .card-header .hint{white-space:nowrap;font-size:10px;margin:0}.planner-month-weekdays,.planner-month-grid{gap:4px}.planner-month-weekdays{color:#8090b2;font-size:9px}.planner-month-grid{grid-auto-rows:minmax(60px,1fr)}.planner-month-day{min-height:60px;padding:5px;border-color:rgba(140,160,220,.08);border-radius:7px;background:rgba(255,255,255,.014)}.planner-month-day>strong{color:#B8C6E8;font-size:10px}.planner-chip{font-size:8px;border-radius:4px}.planner-chip.event-chip{border-left-color:#22D3EE;background:rgba(34,211,238,.12)}.planner-chip.reminder-chip{border-left-color:#FBBF24;background:rgba(251,191,36,.12)}.planner-chip.plan-chip{border-left-color:#7C5CFC;background:rgba(124,92,252,.15)}.planner-selected-agenda{max-height:180px;overflow:auto}.planner-derived-row{width:100%;border:0;background:transparent;color:inherit;text-align:left}.planner-derived-row:hover,.planner-derived-row:focus-visible{background:rgba(124,92,252,.09)}.planner-entry-type{flex:0 0 auto;padding:3px 6px;border-radius:5px;color:#b6a7ff;background:rgba(124,92,252,.14);font-size:9px;font-weight:700}.planner-derived-row>span:nth-child(2){flex:1;min-width:0}.planner-derived-row>svg:last-child{width:14px;height:14px;color:var(--planner-muted)}.planner-derived-row strong,.planner-derived-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.planner-page .planner-event-row,.planner-page .planner-task-row{gap:8px;padding:6px 0}.planner-page .planner-task-row>div{min-width:0}.planner-page .planner-task-row small{font-size:9px}.planner-page .planner-check{width:30px;height:30px;min-width:30px;min-height:30px}.planner-page .planner-task-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:5px;padding:3px;background:#080c18;border-color:var(--planner-border)}.planner-page .planner-task-tabs button{min-height:44px;padding:5px 6px;font-size:10px}.planner-page .planner-task-tabs button.active{background:#7C5CFC;color:white}.planner-page .planner-task-tabs button span{color:#F87171}.planner-list-scroll{min-height:80px;max-height:250px;overflow:auto;overscroll-behavior:contain}.planner-page .planner-task-row{border-top-color:rgba(140,160,220,.08)}.planner-page .planner-tasks-card,.planner-page .planner-plans-card{display:flex;flex-direction:column;min-height:0}.planner-page .planner-card-content{display:flex;flex:1;flex-direction:column;min-height:0}.planner-page .planner-card-content>.planner-list-scroll{flex:1;min-height:80px}.planner-page .planner-card-footer{display:flex;align-items:center;flex:0 0 44px;height:44px;margin-top:auto;padding:0 3px;border-top:1px solid rgba(140,160,220,.08);box-sizing:border-box}.planner-page .planner-more-link{display:inline-flex;align-items:center;gap:8px;min-height:43px;padding:8px 0;border:0;border-radius:6px;color:#a995ff;background:transparent;box-shadow:none;font-size:12px;white-space:nowrap}.planner-page .planner-more-link:hover{color:#e4dcff;background:transparent;text-decoration:underline}.planner-page .planner-more-link:focus-visible{outline:2px solid rgba(169,149,255,.75);outline-offset:2px;background:transparent}.planner-page .planner-more-link svg{flex:0 0 auto}.planner-plan-tabs{display:flex;gap:3px;overflow:auto;padding:3px;border:1px solid var(--planner-border);border-radius:9px;background:#080c18}.planner-plan-tabs button{flex:1;min-width:max-content;min-height:44px;padding:5px 8px;border-radius:7px;color:var(--planner-secondary);font-size:10px}.planner-plan-tabs button.active{background:#7C5CFC;color:white}.planner-plan-list{max-height:220px}.planner-plan-row{display:flex;align-items:center;gap:9px;width:100%;min-height:52px;padding:6px 3px;border-bottom:1px solid rgba(140,160,220,.08);color:#F3F6FF;background:transparent;text-align:left}.planner-plan-row:hover{background:rgba(124,92,252,.07)}.planner-plan-icon{display:grid;place-items:center;width:30px;height:30px;flex:0 0 auto;border-radius:9px;color:#9C88FF;background:rgba(124,92,252,.15)}.planner-plan-icon.type-goal{color:#FBBF24;background:rgba(251,191,36,.12)}.planner-plan-icon.type-purchase{color:#22D3EE;background:rgba(34,211,238,.12)}.planner-plan-icon svg{width:15px;height:15px}.planner-plan-copy{display:grid;min-width:0;flex:1;gap:3px}.planner-plan-copy strong,.planner-plan-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.planner-plan-copy strong{font-size:11px}.planner-plan-copy small{color:var(--planner-secondary);font-size:9px;text-transform:capitalize}.planner-plan-row>svg:last-child{width:15px;height:15px;color:var(--planner-muted)}.planner-page .planner-empty{min-height:90px;color:var(--planner-secondary)}
.planner-agenda-card .planner-agenda-list{max-height:580px;overflow:auto}.planner-page .planner-week-columns{gap:4px}.planner-page .planner-week-column{background:#0A0F1D}.planner-mobile-tabs{display:none}.planner-add-backdrop{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:20px;background:rgba(2,4,10,.72);backdrop-filter:blur(5px)}.planner-add-menu{width:min(560px,100%);max-height:min(88dvh,760px);overflow:auto;padding:20px;border:1px solid rgba(140,160,220,.18);border-radius:18px;background:linear-gradient(150deg,#12182a,#0B1020);box-shadow:0 26px 80px rgba(0,0,0,.66)}.planner-add-menu>header{display:flex;align-items:center;justify-content:space-between;gap:12px}.planner-add-menu h2{margin:0;font-size:20px}.planner-add-menu>p{margin:7px 0 14px;font-size:12px}.planner-add-menu>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.planner-add-menu>div>button{justify-content:flex-start;min-height:70px;padding:10px;border:1px solid var(--planner-border);border-radius:11px;background:rgba(255,255,255,.02);text-align:left}.planner-add-menu>div>button:hover{border-color:rgba(124,92,252,.42);background:rgba(124,92,252,.08)}.planner-add-menu>div>button>span{display:grid;place-items:center;width:34px;height:34px;flex:0 0 auto;border-radius:10px;color:#AC98FF;background:rgba(124,92,252,.16)}.planner-add-menu>div>button>span svg{width:17px;height:17px}.planner-add-menu>div>button>strong{display:grid;min-width:0;flex:1;gap:3px;font-size:12px}.planner-add-menu>div>button>strong small{color:var(--planner-secondary);font-size:9px;font-weight:400;line-height:1.3}.planner-add-menu>div>button>svg:last-child{width:14px;height:14px;color:var(--planner-muted)}
.planner-budget-summary{margin:8px 0 14px}.planner-budget-summary .planner-summary-tile{min-height:74px}.planner-budget-summary .planner-summary-tile strong{font-size:20px}
/* Large-desktop adaptive density: only a maximized ultrawide/tall-desktop window (see the matching
   comment above .ht-dashboard for the measured viewport numbers) makes .planner-grid itself grow to
   fill the real leftover height in .planner-page (which already stretches to the locked shell's
   full content height - see the earlier "Planner reuses the same locked-shell bottom-spacing
   pattern" block), instead of sizing from its own minimum content. .planner-right already uses
   fr-based rows (minmax(280px,1.1fr)/minmax(230px,.9fr)) and its cards already flex their list to
   fill available space, so it automatically absorbs the extra height once .planner-grid is taller -
   no separate rule needed there. .planner-center only had one thing it wasn't already set up to
   do: it used grid+align-content:start, which packs .planner-month-card at the top instead of
   letting it grow, so it's switched to flex here so flex:1 on .planner-month-card can take effect;
   .planner-month-grid gets the same flex:1 so its own existing grid-auto-rows:minmax(60px,1fr)
   track sizing - already fr-based - distributes the real extra height across every week row
   automatically. The selected-date agenda gets a modest, bounded companion increase, and the right
   column's list cap is lifted since its card height is now itself the real bound. Trigger: see the
   matching comment above .ht-dashboard for why this is min-width:1500px, not an earlier 1800px. */
@media(min-width:1500px) and (min-height:1000px){
  .planner-grid{flex:1;min-height:0}
  .planner-center{display:flex;flex-direction:column}
  .planner-month-card{flex:1}
  .planner-month-grid{flex:1;min-height:0}
  .planner-selected-agenda{max-height:clamp(180px,16vh,260px)}
  .planner-list-scroll{max-height:none}
}
@media(max-width:1199px){.content:has(.planner-page){max-width:none;padding:20px}.planner-grid{grid-template-columns:minmax(0,1fr)}.planner-right{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto}.planner-list-scroll{max-height:300px}.planner-month-grid{grid-auto-rows:minmax(66px,1fr)}}
@media(max-width:699px){.content:has(.planner-page){padding:14px 14px calc(86px + env(safe-area-inset-bottom))}.planner-page{gap:10px}.planner-page .planner-heading{align-items:flex-start;flex-direction:row}.planner-page .planner-heading h1{font-size:24px}.planner-page .planner-heading p{font-size:11px;max-width:24ch}.planner-heading-actions{width:auto;display:flex;gap:6px}.planner-heading-actions .button{width:auto;min-height:44px;padding:7px 10px;font-size:11px}.planner-heading-actions [data-planner-notes]{font-size:0;min-width:44px}.planner-heading-actions [data-planner-notes] svg{width:17px;height:17px}.planner-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.planner-summary-tile{gap:8px;min-height:67px;padding:9px}.planner-summary-icon{width:30px;height:30px}.planner-summary-tile strong{font-size:12px}.planner-summary-tile small,.planner-summary-tile em{font-size:9px}.planner-grid{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:none;gap:10px}.planner-grid>.planner-center,.planner-grid>.planner-right{grid-area:auto}.planner-right{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}.planner-page .planner-toolbar{display:grid;grid-template-columns:1fr auto;gap:8px}.planner-month-controls{justify-content:center}.planner-page .planner-month-label{min-width:0;padding:7px 8px;font-size:11px}.planner-page .planner-month-controls>.icon-button{min-width:38px;min-height:42px}.planner-page .planner-view-switch{grid-column:1/-1}.planner-page .planner-view-switch button{min-height:44px;font-size:11px}.planner-source-trigger{font-size:0;min-width:44px;padding:7px}.planner-source-trigger svg{width:17px;height:17px}.planner-month-card{padding:9px!important}.planner-month-grid,.planner-month-weekdays{gap:2px}.planner-month-grid{grid-auto-rows:minmax(46px,1fr)}.planner-month-day{min-height:46px;padding:3px}.planner-chip{font-size:7px}.planner-month-day>div .planner-chip:nth-child(n+2),.planner-month-day small{display:none}.planner-month-weekdays{font-size:8px}.planner-selected-agenda{max-height:220px}.planner-page .planner-card{padding:12px}.planner-plan-tabs button{font-size:9px;padding-inline:4px}.planner-list-scroll{max-height:270px}.planner-mobile-tabs{position:fixed;z-index:30;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(3,1fr);padding:4px 8px calc(4px + env(safe-area-inset-bottom));border-top:1px solid var(--planner-border);background:rgba(9,13,24,.97);backdrop-filter:blur(12px)}.planner-mobile-tabs button{display:grid;justify-items:center;align-content:center;gap:2px;min-height:52px;color:var(--planner-secondary);font-size:10px}.planner-mobile-tabs button svg{width:18px;height:18px}.planner-mobile-tabs button.active{color:#AA95FF}.planner-page[data-planner-mobile-view="tasks"] .planner-center,.planner-page[data-planner-mobile-view="tasks"] .planner-plans-card{display:none}.planner-page[data-planner-mobile-view="plans"] .planner-center,.planner-page[data-planner-mobile-view="plans"] .planner-tasks-card{display:none}.planner-add-menu{padding:15px}.planner-add-menu>div{grid-template-columns:1fr}.planner-add-menu>div>button{min-height:64px}.planner-budget-summary{grid-template-columns:1fr}.planner-budget-summary .planner-summary-tile{min-height:62px}}

/* Responsive V3 Planner refinements: focused mobile sections put their selected
   work first, and the compact controls retain comfortable touch targets. */
@media(max-width:699px){
  .planner-page .planner-heading{flex-wrap:wrap}
  .planner-page .planner-heading>div:first-child{min-width:0;flex:1 1 120px}
  .planner-page .planner-heading-actions{flex-wrap:wrap}
  .planner-page[data-planner-mobile-view="tasks"] .planner-summary,
  .planner-page[data-planner-mobile-view="plans"] .planner-summary{display:none}
  .planner-page .planner-month-controls>.icon-button{width:44px;min-width:44px;height:44px;min-height:44px}
  .planner-page .planner-month-label{min-height:44px}
  .planner-page .planner-task-row .planner-check{width:44px;height:44px;min-width:44px;min-height:44px}
}

/* Planning detail pages keep the item identity and tabs close to the top on
   phones; dates and actions remain full-width and easy to reach. */
@media(max-width:619px){
  .projects-workspace-top{display:grid;grid-template-columns:48px minmax(0,1fr);align-items:start;gap:10px}
  .projects-workspace-thumb{width:48px;height:48px;border-radius:12px}
  .projects-workspace-thumb svg{width:22px;height:22px}
  .projects-workspace-titles{min-width:0}
  .projects-workspace-titles h1{font-size:20px;overflow-wrap:anywhere}
  .projects-workspace-dates,.projects-lifecycle-actions,.projects-workspace-top>.button{grid-column:1/-1;width:100%}
  .projects-workspace-dates{flex-direction:row;align-items:center;justify-content:space-between;gap:8px;text-align:left}
}
.planner-detail-backdrop{position:fixed;inset:0;z-index:55;display:grid;place-items:center;padding:18px;background:rgba(2,4,10,.74);backdrop-filter:blur(5px)}.planner-detail-modal{width:min(700px,100%);max-height:min(88dvh,760px);display:flex;flex-direction:column;overflow:hidden;border:1px solid rgba(140,160,220,.18);border-radius:17px;background:linear-gradient(150deg,#12182a,#0B1020);box-shadow:0 26px 80px rgba(0,0,0,.66)}.planner-detail-modal>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 20px;border-bottom:1px solid var(--planner-border)}.planner-detail-modal>header .eyebrow{margin:0;color:#A995FF;font-size:9px}.planner-detail-modal>header h2{margin:4px 0 0;font-size:19px;overflow-wrap:anywhere}.planner-detail-tabs{display:flex;gap:4px;overflow:auto;padding:9px 16px;border-bottom:1px solid var(--planner-border)}.planner-detail-tabs button{min-height:44px;min-width:max-content;padding:6px 12px;border-radius:8px;color:var(--planner-secondary);font-size:11px}.planner-detail-tabs button.active{color:white;background:#7C5CFC}.planner-detail-panel{min-height:120px;overflow:auto;padding:18px 20px}.planner-detail-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0}.planner-detail-fields>div{min-width:0;padding-bottom:9px;border-bottom:1px solid var(--planner-border)}.planner-detail-fields dt{color:var(--planner-muted);font-size:10px}.planner-detail-fields dd{margin:4px 0 0;color:#F3F6FF;font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere}.planner-detail-row{display:grid;grid-template-columns:26px minmax(0,1fr);align-items:center;gap:2px 8px;padding:9px 2px;border-bottom:1px solid var(--planner-border)}.planner-detail-row>span{grid-row:span 2;color:#9C88FF}.planner-detail-row>span svg{width:16px;height:16px}.planner-detail-row>strong{font-size:12px;overflow-wrap:anywhere}.planner-detail-row>small{color:var(--planner-secondary);font-size:10px}.planner-detail-note{padding:10px 0;border-bottom:1px solid var(--planner-border)}.planner-detail-note strong{font-size:12px}.planner-detail-note p{margin:6px 0;color:var(--planner-secondary);font-size:11px;white-space:pre-wrap}.planner-detail-note small{color:var(--planner-muted);font-size:9px}.planner-detail-modal>footer{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid var(--planner-border)}.planner-detail-modal>footer .button{min-height:44px;padding:8px 11px;font-size:11px}
@media(max-width:619px){.planner-detail-modal>header{padding:14px}.planner-detail-panel{padding:14px}.planner-detail-modal>footer{display:grid;grid-template-columns:1fr 1fr}.planner-detail-modal>footer [data-planner-detail-full]{grid-column:1/-1;grid-row:1}.planner-detail-fields{gap:10px}.planner-detail-fields>div{min-width:0}}

/* Fitness V4 — approved Figma composition using real Fitness data. */
.fitness-page{display:flex;flex-direction:column;gap:14px;min-width:0}
.fitness-heading{align-items:center;gap:16px}.fitness-header-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.fitness-header-health{display:flex;align-items:center;gap:9px;min-height:44px;padding:7px 12px;border:1px solid var(--border);border-radius:12px;background:linear-gradient(145deg,rgba(39,49,76,.58),rgba(21,26,42,.72))}.fitness-header-health>span:last-child{display:grid;gap:2px}.fitness-header-health strong{font-size:11px}.fitness-header-health small{font-size:10px;color:var(--text-dim)}.fitness-status-dot{width:8px;height:8px;border-radius:50%;background:var(--text-faint)}.fitness-status-dot.good{background:var(--success);box-shadow:0 0 10px rgba(52,211,153,.42)}.fitness-status-dot.warning{background:var(--warning)}
.fitness-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.fitness-kpi{min-width:0}.fitness-kpi-top{display:flex;align-items:center;gap:9px;min-width:0}.fitness-kpi-value strong{font-size:clamp(20px,2vw,27px)}.fitness-kpi-value small{white-space:normal;line-height:1.3}
.fitness-card{min-width:0}.fitness-activity-card,.fitness-progress-card{min-height:0;display:flex;flex-direction:column}.fitness-card-heading h2{font-size:16px}.fitness-card-heading small{line-height:1.4}.fitness-activity-summary{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 4px}.fitness-activity-summary>div{display:flex;align-items:baseline;gap:6px}.fitness-activity-summary strong{font:700 18px var(--font-data);color:var(--text)}.fitness-activity-summary span,.fitness-activity-summary small{font-size:10px;color:var(--text-dim)}.fitness-activity-summary>div strong:nth-of-type(2){margin-left:12px}.fitness-period-toggle,.fitness-range-toggle{display:flex;gap:3px;padding:3px;border:1px solid var(--border);border-radius:9px;background:var(--surface-2)}.fitness-period-toggle button,.fitness-range-toggle button{min-width:48px;min-height:44px;padding:7px 10px;border:0;border-radius:7px;background:transparent;color:var(--text-dim);font-size:11px}.fitness-period-toggle button[aria-pressed=true],.fitness-range-toggle button[aria-pressed=true]{background:var(--accent-soft);color:var(--text);box-shadow:inset 0 0 0 1px var(--accent-line)}.fitness-svg-chart{flex:1;min-height:150px;max-height:230px;height:auto;padding:8px 0 0}.fitness-svg-chart svg{display:block;width:100%;height:100%;min-height:150px;overflow:visible}.fitness-svg-chart .fitness-chart-grid line,.fitness-trend-grid line{stroke:var(--border);stroke-dasharray:3 5;stroke-width:1}.fitness-chart-scale-label{fill:var(--text-dim);font:10px var(--font-data)}.fitness-svg-bar rect{fill:var(--accent);opacity:.82}.fitness-svg-bar:nth-of-type(2n) rect{opacity:.65}.fitness-svg-bar text{fill:var(--text-dim);font:10px var(--font-data)}.fitness-chart-caption{display:flex;justify-content:space-between;gap:10px;color:var(--text-dim);font-size:10px}.fitness-progress-tabs,.fitness-wellness-tabs{display:flex;gap:4px;padding:3px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}.fitness-progress-tabs button,.fitness-wellness-tabs button{flex:1;min-width:0;min-height:44px;padding:7px 8px;border:0;border-radius:8px;background:transparent;color:var(--text-dim);font-size:11px}.fitness-progress-tabs button[aria-selected=true],.fitness-wellness-tabs button[aria-selected=true]{background:var(--surface-1);color:var(--text);box-shadow:inset 0 0 0 1px var(--accent-line)}.fitness-progress-panel{display:flex;flex:1;flex-direction:column;min-height:0;padding-top:12px}.fitness-range-toggle{align-self:flex-end;margin:0 0 10px}.fitness-range-toggle button{min-width:48px}.fitness-metric-hero{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px}.fitness-metric-hero>strong{font:750 clamp(24px,3vw,34px) var(--font-data);letter-spacing:-.035em}.fitness-metric-hero>small{flex-basis:100%;color:var(--text-dim);font-size:10px}.fitness-metric-change{font-size:11px;color:var(--text-dim)}.fitness-metric-change.good{color:var(--success)}.fitness-weight-spark{flex:1;min-height:90px;max-height:200px;margin:10px 0 4px}.fitness-weight-spark svg{display:block;width:100%;height:100%;min-height:90px;overflow:visible}.fitness-weight-spark polyline{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.fitness-weight-spark circle{fill:var(--surface-1);stroke:var(--accent);stroke-width:2}.fitness-trend-foot{display:flex;justify-content:space-between;gap:10px;color:var(--text-dim);font-size:10px}.fitness-chart-placeholder{display:grid;place-items:center;gap:8px;min-height:100px;margin:12px 0;color:var(--text-dim);text-align:center}.fitness-measurement-list{max-height:220px;overflow:auto;overscroll-behavior:contain}.fitness-measurement-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid var(--border);font-size:11px}.fitness-measurement-row strong{font:600 11px var(--font-data);color:var(--text)}.fitness-measurement-row time{color:var(--text-dim);font-size:10px}.fitness-add-measurement{align-self:flex-start;min-height:40px;margin-top:8px}.fitness-add-measurement:disabled{opacity:.62;cursor:not-allowed}
.fitness-quick-card .fitness-card-heading,.fitness-recent-card .fitness-card-heading,.fitness-goals-card .fitness-card-heading,.fitness-health-card .fitness-card-heading{margin-bottom:10px}.fitness-activity-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.fitness-activity-tile{min-height:44px;padding:7px 9px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);color:var(--text);font-size:11px;text-align:left}.fitness-activity-tile:hover{border-color:var(--accent-line);background:var(--surface-3)}.fitness-activity-tile-icon{width:28px;height:28px}.fitness-activity-tile-icon svg{width:16px;height:16px}.fitness-log-button{min-height:44px}.fitness-recent-list{max-height:300px;overflow:auto;overscroll-behavior:contain;padding-right:3px}.fitness-recent-row{min-height:54px;padding:8px 0}.fitness-view-all,.fitness-health-manage{display:flex;align-items:center;justify-content:flex-start;gap:7px;min-height:44px;padding:8px 2px;border:0;border-top:1px solid var(--border);background:transparent;color:var(--accent);font-size:11px;text-align:left}.fitness-view-all svg,.fitness-health-manage svg{width:14px;height:14px}.fitness-goal-progress{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:2px 0 8px}.fitness-goal-progress strong{font:700 20px var(--font-data)}.fitness-goal-progress span{margin-left:6px;color:var(--text-dim);font-size:10px}.fitness-goal-progress>b{font:600 12px var(--font-data);color:var(--accent)}.fitness-goals-card .fitness-kpi-bar{height:6px}.fitness-goal-link{min-height:40px;margin-top:8px}.fitness-health-sync{display:flex;align-items:flex-start;gap:8px;padding:9px 10px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);color:var(--text-dim);font-size:10px;line-height:1.45}.fitness-health-sync svg{width:15px;height:15px;flex:0 0 auto;color:var(--accent)}.fitness-health-card .fitness-planned-list{margin-top:8px}.fitness-health-card .fitness-planned-list>div{grid-template-columns:18px minmax(0,1fr) auto;padding:6px 0}.fitness-health-card .fitness-planned-list small{grid-column:auto;margin:0}.fitness-health-card .fitness-planned-list>div>span{display:grid;place-items:center}.fitness-health-card .fitness-planned-list svg{width:13px;height:13px}.fitness-wellness-card{display:grid;grid-template-columns:minmax(220px,.7fr) minmax(300px,1fr) minmax(260px,1.3fr);align-items:center;gap:16px}.fitness-wellness-card .fitness-card-heading{margin:0}.fitness-wellness-tabs{align-self:center}.fitness-wellness-empty{display:flex;align-items:center;gap:12px;min-width:0;padding:10px 12px;border:1px dashed var(--border-strong);border-radius:12px;color:var(--text-dim)}.fitness-wellness-empty strong{display:block;color:var(--text);font-size:11px}.fitness-wellness-empty p{margin:4px 0 0;font-size:10px;line-height:1.45}.fitness-wellness-icon{display:grid;place-items:center;width:36px;height:36px;flex:0 0 auto;border-radius:10px;background:var(--accent-soft);color:var(--accent)}.fitness-wellness-icon svg{width:18px;height:18px}.fitness-detail{width:min(100% - 32px,520px);max-height:min(80dvh,680px);padding:22px}.fitness-detail-body{display:grid;gap:16px}.fitness-detail-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.fitness-detail-facts>div{display:grid;gap:5px;min-width:0;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}.fitness-detail-facts span{color:var(--text-dim);font-size:10px}.fitness-detail-facts strong{overflow-wrap:anywhere;font-size:12px}.fitness-detail-notes{padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}.fitness-detail-notes p{margin:6px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.5}.fitness-history-dialog{width:min(100% - 32px,620px);max-height:min(84dvh,760px);padding:22px}.fitness-history-list{max-height:55dvh;overflow:auto;overscroll-behavior:contain}.fitness-history-list .fitness-recent-row{width:100%;padding:10px 2px}.fitness-progress-tabs button:focus-visible,.fitness-wellness-tabs button:focus-visible,.fitness-period-toggle button:focus-visible,.fitness-range-toggle button:focus-visible,.fitness-view-all:focus-visible,.fitness-health-manage:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
@media(max-width:1199px){.fitness-wellness-card{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.fitness-wellness-card .fitness-wellness-empty{grid-column:1/-1}}
@media(max-width:899px){.fitness-page{gap:12px}.fitness-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.fitness-wellness-card{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media(max-width:619px){.fitness-heading{align-items:flex-start}.fitness-header-actions{width:100%;justify-content:space-between}.fitness-header-health{flex:1}.fitness-header-actions>.button{min-height:44px}.fitness-kpis{gap:8px}.fitness-kpi{padding:11px 10px}.fitness-kpi-value strong{font-size:19px}.fitness-wellness-card{grid-template-columns:minmax(0,1fr);gap:10px}.fitness-wellness-card .fitness-wellness-empty{grid-column:auto}.fitness-card{padding:14px}.fitness-card-heading{gap:8px}.fitness-card-heading h2{font-size:15px}.fitness-period-toggle button,.fitness-range-toggle button{min-width:44px}.fitness-svg-chart{min-height:140px}.fitness-svg-chart svg{min-height:140px}.fitness-measurement-row{grid-template-columns:minmax(0,1fr) auto;gap:6px}.fitness-measurement-row time{grid-column:1/-1}.fitness-detail-facts{grid-template-columns:1fr}.fitness-detail{padding:18px}.fitness-history-dialog{padding:18px}}
@media(prefers-reduced-motion:reduce){.fitness-activity-tile,.fitness-progress-tabs button,.fitness-wellness-tabs button{transition:none!important;scroll-behavior:auto!important}}

/* Responsive V3 Pass A: phone and compact-tablet Fitness uses one focused section
   at a time; the existing desktop dashboard remains unchanged above 899px. */
.fitness-section-nav{display:none}
@media(max-width:899px){
  .fitness-page-mobile{gap:10px}
  .fitness-page-mobile .fitness-heading{align-items:flex-start;gap:8px}
  .fitness-page-mobile .fitness-heading>div:first-child{min-width:0}
  .fitness-page-mobile .fitness-heading h1{margin-bottom:2px}
  .fitness-page-mobile .fitness-heading p{margin:0;color:var(--text-dim);font-size:12px;line-height:1.35}
  .fitness-page-mobile .fitness-header-actions{width:100%;justify-content:space-between;gap:8px}
  .fitness-page-mobile .fitness-header-health{flex:1;min-width:0;min-height:44px;padding:6px 9px;text-decoration:none}
  .fitness-page-mobile .fitness-header-health strong{font-size:10px}
  .fitness-page-mobile .fitness-header-health small{font-size:9px}
  .fitness-page-mobile .fitness-header-actions>.button{min-height:44px;padding:8px 10px;font-size:11px}
  .fitness-section-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;padding:4px;border:1px solid var(--border);border-radius:13px;background:linear-gradient(145deg,rgba(23,29,47,.96),rgba(13,18,31,.96))}
  .fitness-section-nav button{display:grid;place-items:center;align-content:center;gap:3px;min-width:0;min-height:52px;padding:4px 2px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--text-dim);font-size:9px;line-height:1.1;text-align:center;overflow-wrap:anywhere}
  .fitness-section-nav button>span:first-child{display:grid;place-items:center;width:18px;height:18px}
  .fitness-section-nav button svg{width:17px;height:17px}
  .fitness-section-nav button[aria-selected=true]{border-color:var(--accent-line);background:linear-gradient(125deg,rgba(125,87,255,.34),rgba(55,89,220,.27));color:var(--text);box-shadow:0 4px 16px rgba(70,60,180,.18)}
  .fitness-section-nav button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
  .fitness-mobile-panel{display:grid;align-content:start;gap:10px;min-width:0;outline:none}
  .fitness-mobile-panel:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:12px}
  .fitness-mobile-panel .fitness-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .fitness-mobile-panel .fitness-kpi{padding:11px 10px}
  .fitness-mobile-panel .fitness-kpi-value strong{font-size:19px}
  .fitness-overview-actions{display:grid;gap:10px;min-width:0}
  .fitness-overview-quick{padding:12px!important}
  .fitness-overview-quick .fitness-card-heading{margin-bottom:9px}
  .fitness-overview-quick .fitness-card-heading h2{font-size:15px}
  .fitness-overview-quick .fitness-activity-options{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
  .fitness-overview-quick .fitness-activity-tile{display:flex;min-width:0;min-height:52px;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:4px 1px;font-size:9px;white-space:normal;text-align:center;overflow-wrap:anywhere}
  .fitness-overview-quick .fitness-activity-tile-icon{width:25px;height:25px}
  .fitness-overview-quick .fitness-activity-tile-icon svg{width:15px;height:15px}
  .fitness-mobile-panel .fitness-quick-card,.fitness-mobile-panel .fitness-activity-card,.fitness-mobile-panel .fitness-progress-card,.fitness-mobile-panel .fitness-goals-card,.fitness-mobile-panel .fitness-recent-card,.fitness-mobile-panel .fitness-nutrition-planned{min-width:0}
  .fitness-mobile-panel .fitness-goal-link,.fitness-mobile-panel .fitness-add-measurement{min-height:44px}
  .fitness-mobile-panel .fitness-recent-list{max-height:none;overflow:visible}
  .fitness-mobile-panel .fitness-recent-card{display:flex;flex-direction:column;gap:4px}
  .fitness-mobile-panel .fitness-recent-card .fitness-view-all{margin-top:4px}
  .fitness-mobile-panel .fitness-activity-options{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
  .fitness-mobile-panel .fitness-activity-tile{min-height:52px;padding:4px 2px;font-size:9px;white-space:normal;text-align:center;overflow-wrap:anywhere}
  .fitness-mobile-panel .fitness-activity-card{display:flex;flex-direction:column;gap:8px}
  .fitness-mobile-panel .fitness-progress-card{display:flex;flex-direction:column;gap:8px}
  .fitness-mobile-panel .fitness-progress-panel{overflow:visible}
  .fitness-mobile-panel .fitness-measurement-list{max-height:280px}
  .fitness-nutrition-planned{padding:16px}
  .fitness-nutrition-planned>.hint{margin:0;line-height:1.5}
}
.settings-fitness-preferences{display:grid;gap:10px;margin:14px 0;padding:12px;border:1px solid var(--border);border-radius:12px;background:linear-gradient(145deg,rgba(124,92,252,.06),rgba(21,26,42,.28))}
.settings-fitness-preferences legend{padding:0 6px;color:var(--text);font-size:12px;font-weight:700}
.settings-fitness-preferences>.hint{margin:0;font-size:11px;line-height:1.4}
.settings-fitness-preferences .form-grid{gap:12px}
@media(max-width:359px){
  .fitness-page-mobile .fitness-heading p{font-size:11px}
  .fitness-page-mobile .fitness-header-health{gap:6px;padding-inline:7px}
  .fitness-page-mobile .fitness-header-actions>.button{padding-inline:8px}
  .fitness-section-nav{gap:2px;padding:3px}
  .fitness-section-nav button{font-size:8px}
}


/* Fitness V4 responsive correction: use the available shell width. */
.content:has(.fitness-page){width:100%;max-width:none;padding:0}
.fitness-page{width:100%;max-width:none;margin:0;padding:16px 24px 10px;gap:10px}
.fitness-quick-card{padding:0!important;overflow:hidden}
.fitness-quick-card .fitness-log-tabs{padding:0 4px;border:0;border-bottom:1px solid var(--border);border-radius:0;background:transparent}
.fitness-quick-card .fitness-log-tabs button{min-height:44px;font-size:11px}
.fitness-quick-card .fitness-log-tabs button[aria-selected=true]{color:var(--accent);border-bottom:2px solid var(--accent)}
.fitness-quick-panel{min-width:0;padding:10px 10px 12px}
.fitness-quick-card .fitness-activity-options{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
.fitness-quick-card .fitness-activity-tile{display:flex;min-width:0;min-height:56px;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:5px 2px;text-align:center;font-size:9px;white-space:nowrap}
.fitness-quick-card .fitness-activity-tile-icon{display:grid;place-items:center;width:28px;height:28px;flex:0 0 auto}
.fitness-quick-today-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.fitness-quick-today-stats>div{display:grid;min-width:0;gap:3px;padding:8px 9px;border:1px solid var(--border);border-radius:9px;background:var(--surface-2)}
.fitness-quick-today-stats strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.fitness-quick-today-stats small{color:var(--text-dim);font-size:9px}
.fitness-activity-summary,.fitness-activity-summary>div{min-width:0;flex-wrap:wrap}
.fitness-progress-tabs button,.fitness-period-toggle button,.fitness-range-toggle button{white-space:nowrap}
.fitness-wellness-card{grid-template-columns:minmax(0,.7fr) minmax(190px,1fr) minmax(0,1.3fr)}
@media(max-width:1199px){
  .fitness-wellness-card{grid-template-columns:minmax(0,1fr) minmax(190px,1fr)}
  .fitness-wellness-card .fitness-wellness-empty{grid-column:1/-1}
}
@media(max-width:899px){
  .fitness-page{gap:12px}
  .fitness-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
  .fitness-wellness-card{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
@media(max-width:767px){
  .fitness-page{padding:16px 18px 24px}
  .fitness-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:699px){.fitness-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:619px){
  .fitness-page{padding:14px 16px calc(24px + env(safe-area-inset-bottom))}
  .fitness-wellness-card{grid-template-columns:minmax(0,1fr);gap:10px}
  .fitness-wellness-card .fitness-wellness-empty{grid-column:auto}
}

/* Keep wide desktop at the same compact card density as the approved half-window layout. */
@media(min-width:1201px){
  .fitness-kpi{min-height:106px}
  .fitness-progress-panel{overflow-y:auto;overscroll-behavior:contain}
}

/* ─── Fitness main dashboard grid (Claude review - matches the approved Figma
   composition exactly; see FitnessPage.tsx .fitness-main-grid/.fitness-right-rail in the
   Figma export) ──────────────────────────────────────────────────────────────────────
   Weekly Activity and Progress are two equal-height rows (1fr/1fr) in the left column.
   The right rail (Quick Log/Today, Recent Workouts, Your Goals, Health Source) spans BOTH
   rows as one flex column - its total height always equals the left column's combined
   height because it's the same grid row-span, never a guessed or fixed number. Recent
   Workouts is the ONE flexible rail child (flex:1, its list scrolls internally) that
   absorbs whatever space Quick Log/Goals/Health don't use - this is what prevents the
   empty gap: there is always exactly one element sized to fill the leftover space, not
   four fixed-height cards stacked with slack beneath them. Nutrition & Habits is a
   separate full-width section below this grid entirely (.fitness-nutrition-row), exactly
   as in the Figma reference - never part of this grid, never sharing a row with anything. */
.fitness-dashboard-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 296px;
  grid-template-rows:1fr 1fr;
  grid-template-areas:"activity rail" "progress rail";
  gap:14px;
  min-height:0;
}
.fitness-dashboard-grid>.fitness-activity-card{grid-area:activity;min-height:0}
.fitness-dashboard-grid>.fitness-progress-card{grid-area:progress;min-height:0}
.fitness-rail{grid-area:rail;display:flex;flex-direction:column;gap:8px;min-height:0;min-width:0}
.fitness-rail>.fitness-quick-card{flex-shrink:0}
.fitness-rail>.fitness-recent-card{flex:1;min-height:0;display:flex;flex-direction:column}
.fitness-rail>.fitness-recent-card .fitness-recent-list{flex:1;min-height:0;max-height:none}
.fitness-rail>.fitness-goals-card{flex-shrink:0}
.fitness-rail>.fitness-health-card{flex-shrink:0}
.fitness-nutrition-row{min-width:0}
@media(max-width:899px){
  .fitness-dashboard-grid{display:flex;flex-direction:column;grid-template-columns:none;gap:12px}
  .fitness-activity-card,.fitness-progress-card{min-height:0}
  .fitness-rail{gap:12px}
  .fitness-rail>.fitness-recent-card{flex:none}
  .fitness-rail>.fitness-recent-card .fitness-recent-list{max-height:300px}
}

/* Desktop Fitness reaches the bottom of the shell exactly like Mail's own workspace does
   (see mail-v2.css's ".shell:has(.mail-page)" block, same breakpoint, same mechanism) -
   the sidebar is always 100dvh tall, so a shorter page previously left a bare gap between
   the shared footer and the sidebar's own bottom edge. Locking the shell height and letting
   the plain, borderless .fitness-page wrapper (never a card) grow to fill it removes that
   gap without resizing, stretching, or reflowing a single Fitness card. */
@media(min-width:1024px){
  .shell:has(.fitness-page){height:100dvh;min-height:0;overflow:hidden}
  .shell:has(.fitness-page)>.workspace{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden}
  .shell:has(.fitness-page)>.workspace>.topbar{flex:0 0 72px}
  .shell:has(.fitness-page) .content{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;overflow-y:auto}
  .shell:has(.fitness-page) .content>.footer{display:none}
  .shell:has(.fitness-page) .fitness-page{flex:1 0 auto;min-height:100%}
}

/* Investing V2 reuses the same Mail/Fitness locked-shell bottom-gap fix (see the Fitness block above
   for the full mechanism) so a shorter Investing page never leaves a bare gap between the shared
   footer and the sidebar's own bottom edge - scoped to .investing-page, same breakpoint, same
   flex-shrink:0 divergence from Mail (Investing's cards have no internal-pane scrolling either). */
@media(min-width:1024px){
  .shell:has(.investing-page){height:100dvh;min-height:0;overflow:hidden}
  .shell:has(.investing-page)>.workspace{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden}
  .shell:has(.investing-page)>.workspace>.topbar{flex:0 0 72px}
  .shell:has(.investing-page) .content{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;overflow-y:auto}
  .shell:has(.investing-page) .content>.footer{display:none}
  .shell:has(.investing-page) .investing-page{flex:1 0 auto;min-height:100%}
}

/* UI Standard V3: Planner reuses the same locked-shell bottom-spacing pattern already applied to
   Mail/Fitness/Investing (Budget keeps document scrolling) - scoped to .planner-page, same breakpoint. Planner's own max-width/
   padding/background (already set on .content:has(.planner-page) above) are untouched by this block. */
@media(min-width:1024px){
  .shell:has(.planner-page){height:100dvh;min-height:0;overflow:hidden}
  .shell:has(.planner-page)>.workspace{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden}
  .shell:has(.planner-page)>.workspace>.topbar{flex:0 0 72px}
  .shell:has(.planner-page) .content{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;overflow-y:auto}
  .shell:has(.planner-page) .content>.footer{display:none}
  .shell:has(.planner-page) .planner-page{flex:1 0 auto;min-height:100%}
}

/* Responsive V3 C5: move the one-tap workout shortcuts ahead of long-form charts on phones.
   Keep tablet and desktop geometry unchanged; this is an information-order change only. */
@media(max-width:479px){
  .fitness-dashboard-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:repeat(6,auto);
    grid-template-areas:"quick" "activity" "progress" "recent" "goals" "health";
    align-content:start;
    align-items:start;
    gap:12px;
  }
  .fitness-rail{display:contents}
  .fitness-quick-card{grid-area:quick;align-self:start;min-height:0;height:auto}
  .fitness-activity-card{grid-area:activity}
  .fitness-progress-card{grid-area:progress}
  .fitness-recent-card{grid-area:recent}
  .fitness-goals-card{grid-area:goals}
  .fitness-health-card{grid-area:health}
}


/* UI Standard V3.1: the page-specific content areas share one outer horizontal grid.
   Investing keeps its Figma layout padding vertical-only; Budget retains document scrolling. */
.content:has(.planner-page),
.content:has(.budget-v4-page),
.content:has(.investing-page){max-width:none;padding-left:24px;padding-right:24px}
@media(max-width:619px){
  .content:has(.planner-page),
  .content:has(.budget-v4-page),
  .content:has(.investing-page){padding-left:16px;padding-right:16px}
}

/* Fitness keeps its approved geometry while using Today's deeper Midnight Aurora surfaces. */
.fitness-card{
  border-color:rgba(160,180,240,.14);
  background:
    radial-gradient(ellipse at 0% 0%,rgba(124,92,252,.085),transparent 60%),
    radial-gradient(ellipse at 100% 0%,rgba(34,211,238,.03),transparent 44%),
    linear-gradient(145deg,#10162A,#0B1020 78%);
  box-shadow:inset 0 1px 0 rgba(180,160,255,.045),0 10px 28px rgba(2,5,14,.14)
}
.fitness-kpi:not(.good):not(.warning){
  border-color:rgba(160,180,240,.14);
  background:
    radial-gradient(ellipse at 0% 0%,rgba(124,92,252,.11),transparent 64%),
    linear-gradient(145deg,rgba(21,27,51,.97),rgba(11,16,32,.98));
  box-shadow:inset 0 1px 0 rgba(180,160,255,.05)
}

/* Family Hub V3: scenic household identity, vivid but restrained Aurora surfaces, and real-data modules. */
.family-hub-page{display:grid;gap:13px;min-width:0}
.family-hub-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 1px;min-width:0}
.family-hub-heading-title{display:flex;align-items:center;gap:13px;min-width:0}
.family-hub-heading-icon{display:grid;place-items:center;width:52px;height:52px;flex:0 0 auto;border:1px solid rgba(169,149,255,.28);border-radius:16px;background:linear-gradient(145deg,rgba(124,92,252,.23),rgba(34,211,238,.08));color:#c3b4ff;box-shadow:0 8px 26px rgba(74,55,180,.14)}
.family-hub-heading-icon svg{width:26px;height:26px}
.family-hub-heading-title .eyebrow{display:block;margin-bottom:2px;color:#a995ff;font-size:9px;letter-spacing:.16em}
.family-hub-heading-title h1{margin:0;font-size:clamp(26px,2.5vw,34px);font-weight:720;letter-spacing:-.035em;line-height:1.12}
.family-hub-heading-title p{margin:4px 0 0;color:var(--text-dim);font-size:12px;line-height:1.45}
.family-hub-private-card{display:flex;align-items:center;gap:10px;flex:0 0 auto;padding:10px 14px;border:1px solid rgba(34,211,238,.22);border-radius:13px;background:linear-gradient(130deg,rgba(13,36,50,.72),rgba(15,22,39,.88));box-shadow:inset 0 1px 0 rgba(200,240,255,.04)}
.family-hub-private-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:rgba(52,211,153,.12);color:#6ee7b7}.family-hub-private-icon svg{width:17px;height:17px}
.family-hub-private-card strong,.family-hub-private-card small{display:block}.family-hub-private-card strong{font-size:11px}.family-hub-private-card small{margin-top:3px;color:var(--text-dim);font-size:9px}
.family-hub{display:grid;gap:12px;min-width:0}
.family-hub-identity{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(330px,.8fr);align-items:center;gap:24px;min-width:0;min-height:174px;padding:19px 22px;overflow:hidden;border:1px solid rgba(150,161,255,.28);border-radius:18px;background:radial-gradient(ellipse at 10% 110%,rgba(81,66,197,.3),transparent 48%),linear-gradient(110deg,#111a36 0%,#252858 46%,#211c43 100%);box-shadow:inset 0 1px 0 rgba(230,223,255,.09),0 14px 36px rgba(5,8,24,.18)}
.family-hub-banner-art{position:absolute;z-index:-1;inset:0;overflow:hidden;pointer-events:none}.family-hub-landscape{width:100%;height:100%;display:block;opacity:.74}.family-hub-banner-art:after{position:absolute;inset:0;content:"";background:linear-gradient(90deg,rgba(12,17,37,.2),rgba(16,20,42,.05) 48%,rgba(12,17,32,.36)),linear-gradient(0deg,rgba(11,15,30,.46),transparent 52%)}
.family-hub-banner-copy{position:relative;z-index:1;align-self:center;max-width:500px}.family-hub-banner-kicker{display:inline-flex;align-items:center;gap:7px;color:#ded2ff;font-size:9px;font-weight:750;letter-spacing:.17em;text-shadow:0 1px 8px rgba(10,12,32,.6)}.family-hub-banner-kicker:before{width:20px;height:1px;content:"";background:linear-gradient(90deg,#a78bfa,#67e8f9)}
.family-hub-banner-copy h2{margin:9px 0 4px;color:#fff;font-size:clamp(20px,2vw,27px);letter-spacing:-.025em;line-height:1.15;text-shadow:0 2px 14px rgba(4,7,22,.45)}.family-hub-banner-copy p{margin:0;color:#e0e4ff;font-size:11px;line-height:1.45;text-shadow:0 1px 8px rgba(4,7,22,.5)}
.family-hub-member-panel{position:relative;z-index:1;padding:12px 13px;border:1px solid rgba(220,224,255,.19);border-radius:14px;background:rgba(12,17,36,.69);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);backdrop-filter:blur(9px)}
.family-hub-member-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px;color:#d9dbf6}.family-hub-member-panel-heading>span{display:flex;align-items:center;gap:6px;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.family-hub-member-panel-heading svg{width:14px;height:14px;color:#c4b5fd}.family-hub-member-panel-heading strong{color:#bfc7e7;font-size:9px;font-weight:550}
.family-hub-identity-members{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.family-hub-identity-member{display:flex;align-items:center;gap:8px;min-width:0;padding:5px;border:1px solid rgba(185,190,255,.1);border-radius:11px;background:rgba(255,255,255,.035)}
.family-hub-identity-avatar{display:grid;place-items:center;width:36px;height:36px;flex:0 0 auto;border:1px solid rgba(255,255,255,.32);border-radius:50%;background:linear-gradient(145deg,#6958da,#314c87);color:#fff;font-size:11px;font-weight:750;box-shadow:0 0 0 3px rgba(145,126,255,.1)}
.family-hub-identity-avatar[data-member-color="1"]{background:linear-gradient(145deg,#43a8b8,#326b88)}.family-hub-identity-avatar[data-member-color="2"]{background:linear-gradient(145deg,#ba6eae,#7551a0)}.family-hub-identity-avatar[data-member-color="3"]{background:linear-gradient(145deg,#d19560,#87639f)}
.family-hub-identity-copy{display:grid;gap:3px;min-width:0}.family-hub-identity-name{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#f2f3ff;font-size:10px;font-weight:650}.family-hub-identity-copy small{color:#b8c0dc;font-size:9px}.family-hub-identity-more{align-self:center;color:#c8c2f4;font-size:9px;font-weight:650}.family-hub-no-members{margin:0;color:#c0c5df;font-size:10px}
.family-hub-banner-orb{position:absolute;z-index:-1;right:36%;top:-90px;width:200px;height:200px;border:1px solid rgba(200,184,255,.12);border-radius:50%;box-shadow:0 0 0 24px rgba(200,184,255,.035),0 0 0 50px rgba(200,184,255,.025);pointer-events:none}
.family-hub-tabs{display:flex;gap:6px;min-width:0;overflow-x:auto;padding:4px;border:1px solid rgba(140,160,220,.15);border-radius:13px;background:linear-gradient(115deg,rgba(11,15,28,.94),rgba(15,21,38,.9));scrollbar-width:thin;overscroll-behavior-inline:contain}
.family-hub-tabs button{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:1 0 auto;min-width:112px;min-height:48px;padding:7px 12px;border:1px solid transparent;border-radius:10px;background:transparent;color:#aeb6d0;font-size:11px;font-weight:650;white-space:nowrap;transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease}
.family-hub-tab-icon{display:grid;place-items:center;width:25px;height:25px;border:1px solid rgba(165,170,220,.13);border-radius:8px;background:rgba(255,255,255,.035);color:#c6c9eb}.family-hub-tab-icon svg{width:15px;height:15px}
.family-hub-tabs button:hover{background:rgba(255,255,255,.05);color:#fff}.family-hub-tabs button[aria-selected=true]{border-color:rgba(169,149,255,.35);background:linear-gradient(115deg,rgba(92,67,211,.75),rgba(37,73,151,.76));color:#fff;box-shadow:0 6px 20px rgba(65,53,176,.22),inset 0 1px 0 rgba(255,255,255,.12)}.family-hub-tabs button[aria-selected=true] .family-hub-tab-icon{border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.1);color:#fff}
.family-hub-panel{min-width:0;outline:none}.family-hub-overview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;align-items:start}
.family-hub-module{position:relative;min-width:0;align-self:start;padding:15px 16px;border:1px solid rgba(140,160,220,.16);border-radius:16px;background:radial-gradient(ellipse at 0% 0%,rgba(124,92,252,.09),transparent 60%),linear-gradient(150deg,rgba(24,31,52,.97),rgba(14,19,33,.99));box-shadow:inset 0 1px 0 rgba(190,190,255,.05),0 10px 26px rgba(1,4,14,.16)}
.family-hub-module:before{position:absolute;top:0;left:16px;right:16px;height:1px;content:"";background:linear-gradient(90deg,rgba(167,139,250,.5),rgba(34,211,238,.12),transparent 75%)}
.family-hub-module-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;min-width:0}.family-hub-module-heading h2{display:flex;align-items:center;gap:9px;margin:0;font-size:14px;font-weight:680;letter-spacing:-.015em}.family-hub-module-heading h2>svg{width:18px;height:18px;color:#c4b5fd}
.family-hub-heading-glyph{display:grid;place-items:center;width:30px;height:30px;flex:0 0 auto;border:1px solid rgba(169,149,255,.16);border-radius:9px;background:rgba(124,92,252,.12);color:#c4b5fd}.family-hub-heading-glyph svg{width:16px;height:16px}.family-hub-glyph-cyan{border-color:rgba(34,211,238,.17);background:rgba(34,211,238,.09);color:#67e8f9}.family-hub-glyph-pink{border-color:rgba(244,114,182,.18);background:rgba(244,114,182,.09);color:#f0abfc}.family-hub-glyph-teal{border-color:rgba(52,211,153,.16);background:rgba(52,211,153,.08);color:#6ee7b7}.family-hub-section-kicker{color:#7f8dab;font-size:8px;font-weight:700;letter-spacing:.12em}
.family-hub-module-heading .pill{flex:0 0 auto;font-size:9px}.family-hub-list{display:grid;max-height:250px;overflow:auto;overscroll-behavior:contain}.family-hub-row,.family-hub-goal{display:flex;align-items:center;gap:10px;min-width:0;min-height:56px;padding:8px 2px;border-bottom:1px solid rgba(140,160,220,.09)}.family-hub-row:last-child,.family-hub-goal:last-child{border-bottom:0}
.family-hub-row-action{width:100%;text-align:left;color:inherit;background:transparent;border-top:0;border-right:0;border-left:0;font:inherit;cursor:pointer;transition:background .15s ease,transform .15s ease}.family-hub-row-action:hover{background:rgba(124,92,252,.07)}.family-hub-row-action:active{transform:scale(.996)}.family-hub-row-open{display:grid;place-items:center;flex:0 0 20px;color:#a995ff}.family-hub-row-open svg{width:14px;height:14px}
.family-hub-date-block{display:grid;align-content:center;justify-items:center;gap:1px;width:46px;height:49px;flex:0 0 auto;border:1px solid rgba(165,173,245,.24);border-radius:11px;background:linear-gradient(150deg,rgba(45,56,102,.78),rgba(27,33,67,.88));box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}.family-hub-date-block small{color:#b9bce7;font-size:8px;font-weight:750;letter-spacing:.1em;text-transform:uppercase}.family-hub-date-block strong{color:#fff;font-size:18px;line-height:1}.family-hub-date-empty{color:#b7a8ff}.family-hub-date-empty svg{width:18px;height:18px}
.family-hub-row-copy{display:grid;gap:4px;min-width:0;flex:1}.family-hub-row-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:650}.family-hub-row-copy small{display:block;overflow:hidden;text-overflow:ellipsis;color:#aab3cf;font-size:9.5px;line-height:1.4}.family-hub-status{flex:0 0 auto;padding:5px 8px;border:1px solid rgba(110,231,183,.17);border-radius:999px;background:rgba(16,110,91,.12);color:#91e7c3;font-size:8px;font-weight:650;white-space:nowrap}
.family-hub-goal{display:grid;grid-template-columns:52px minmax(0,1fr) 20px;gap:11px;min-height:74px}.family-hub-goal-ring{display:grid;place-items:center;width:48px;height:48px;flex:0 0 auto;border-radius:50%;background:conic-gradient(from -90deg,#b794ff 0 calc(var(--goal-progress)*1%),rgba(100,114,160,.19) calc(var(--goal-progress)*1%) 100%);box-shadow:0 0 18px rgba(138,110,255,.15)}.family-hub-goal-ring>span{display:grid;place-items:center;width:39px;height:39px;border:1px solid rgba(192,182,255,.2);border-radius:50%;background:#151a31;color:#f1edff;font-size:10px;font-weight:750;font-variant-numeric:tabular-nums}.family-hub-goal .family-hub-row-copy{gap:4px}.family-hub-goal .family-hub-row-copy strong{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.family-hub-goal .family-hub-row-copy small{white-space:nowrap}.family-hub-milestone-copy{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#8f9dbd;font-size:8.5px;line-height:1.35}
.family-hub-activity-list{max-height:268px}.family-hub-activity-row{position:relative;display:flex;align-items:center;gap:10px;min-width:0;min-height:52px;padding:7px 2px;border-bottom:1px solid rgba(140,160,220,.08)}.family-hub-activity-row:last-child{border-bottom:0}.family-hub-activity-row .family-hub-row-icon{display:grid;place-items:center;width:32px;height:32px;flex:0 0 auto;border:1px solid rgba(34,211,238,.14);border-radius:10px;background:rgba(34,211,238,.08);color:#7dd3fc}.family-hub-activity-row[data-activity-kind=goal] .family-hub-row-icon{border-color:rgba(232,121,249,.16);background:rgba(192,76,223,.09);color:#e879f9}.family-hub-activity-row[data-activity-kind=reminder] .family-hub-row-icon{border-color:rgba(251,191,36,.15);background:rgba(251,191,36,.08);color:#fcd34d}.family-hub-activity-row[data-activity-kind=note] .family-hub-row-icon{border-color:rgba(167,139,250,.17);background:rgba(124,92,252,.1);color:#c4b5fd}.family-hub-activity-row .family-hub-row-icon svg{width:16px;height:16px}.family-hub-activity-row .family-hub-row-copy{gap:3px}.family-hub-activity-row .family-hub-row-copy strong{font-size:10.5px}.family-hub-activity-row .family-hub-row-copy small{font-size:9px}.family-hub-activity-avatar{display:grid;place-items:center;width:29px;height:29px;flex:0 0 auto;border:1px solid rgba(225,210,255,.26);border-radius:50%;background:linear-gradient(145deg,#6958da,#314c87);color:#fff;font-size:8px;font-weight:750}
.family-hub-empty{display:flex;align-items:center;gap:11px;min-height:70px;padding:9px 3px;color:var(--text-dim)}.family-hub-empty-icon{display:grid;place-items:center;width:38px;height:38px;flex:0 0 auto;border:1px solid rgba(169,149,255,.17);border-radius:12px;background:linear-gradient(145deg,rgba(124,92,252,.14),rgba(34,211,238,.06));color:#c4b5fd}.family-hub-empty-icon svg{width:18px;height:18px}.family-hub-empty>span:last-child{display:grid;gap:4px}.family-hub-empty strong{color:#e8e9fb;font-size:10px;font-weight:650}.family-hub-empty p{max-width:42ch;margin:0;color:#9ca8c5;font-size:9px;line-height:1.45}
.family-hub-message-preview{display:flex;align-items:center;gap:12px;min-height:74px;padding:6px 2px}.family-hub-message-illustration{display:grid;place-items:center;width:50px;height:45px;flex:0 0 auto;border:1px solid rgba(192,132,252,.19);border-radius:13px;background:linear-gradient(145deg,rgba(124,92,252,.2),rgba(34,211,238,.08));color:#d8b4fe;box-shadow:0 8px 22px rgba(89,61,180,.12)}.family-hub-message-illustration svg{width:22px;height:22px}.family-hub-message-preview>span:last-child{display:grid;gap:5px;min-width:0}.family-hub-message-preview strong{color:#e8e9fb;font-size:10px;font-weight:650}.family-hub-message-preview small{color:#9ca8c5;font-size:9px;line-height:1.45}.family-hub-placeholder .family-hub-empty{min-height:110px}.family-hub-single-view{padding-bottom:18px}
.family-hub-note{margin:0 0 10px;color:var(--text-dim);font-size:11px;line-height:1.55}.family-hub-action{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:7px 11px;font-size:11px;white-space:nowrap}.family-hub-action svg,.family-hub-inline-link svg{width:14px;height:14px}
.family-hub-inline-link{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:6px 4px;border:0;background:transparent;color:#c3b2ff;font-size:10px;font-weight:600;white-space:nowrap}.family-hub-inline-link:hover{text-decoration:underline;color:#fff}
.family-hub-panel:focus-visible,.family-hub-tabs button:focus-visible,.family-hub-inline-link:focus-visible,.family-hub-row-action:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
@media(max-width:900px){.family-hub-heading{gap:12px}.family-hub-private-card{padding:8px 10px}.family-hub-identity{grid-template-columns:minmax(0,1fr) minmax(280px,.9fr);gap:16px;padding:16px}.family-hub-identity-members{grid-template-columns:1fr}.family-hub-identity-member:nth-child(n+4){display:none}}
@media(max-width:760px){.family-hub-overview-grid{grid-template-columns:minmax(0,1fr)}.family-hub-identity{grid-template-columns:minmax(0,1fr) minmax(0,.95fr)}.family-hub-identity-members{grid-template-columns:1fr 1fr}.family-hub-identity-member:nth-child(n+4){display:flex}}
@media(max-width:620px){.family-hub-page{gap:11px}.family-hub-heading{align-items:flex-start;flex-direction:column;gap:8px}.family-hub-heading-title{gap:10px}.family-hub-heading-icon{width:43px;height:43px;border-radius:13px}.family-hub-heading-icon svg{width:22px;height:22px}.family-hub-heading-title h1{font-size:25px}.family-hub-heading-title p{max-width:42ch;font-size:10.5px}.family-hub-private-card{align-self:stretch;padding:0 9px}.family-hub-private-icon{width:27px;height:27px}.family-hub-private-card small{font-size:8px}.family-hub{gap:10px}.family-hub-identity{grid-template-columns:minmax(0,1fr);gap:13px;min-height:0;padding:15px}.family-hub-banner-art{opacity:.8}.family-hub-banner-copy h2{font-size:21px}.family-hub-banner-copy p{font-size:10px}.family-hub-member-panel{padding:10px}.family-hub-identity-members{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.family-hub-identity-member{gap:7px;padding:5px}.family-hub-identity-avatar{width:31px;height:31px;font-size:9px}.family-hub-identity-name{max-width:110px;font-size:9px}.family-hub-identity-copy small{font-size:8px}.family-hub-tabs{gap:3px;padding:3px}.family-hub-tabs button{flex:1 1 0;min-width:0;min-height:46px;gap:3px;padding:5px 3px;font-size:8.5px}.family-hub-tabs button>span:last-child{white-space:nowrap}.family-hub-tab-icon{width:21px;height:21px;border:0;background:transparent}.family-hub-tab-icon svg{width:14px;height:14px}.family-hub-overview-grid{gap:10px}.family-hub-module{padding:13px;border-radius:14px}.family-hub-module-heading{margin-bottom:8px}.family-hub-module-heading h2{gap:7px;font-size:13px}.family-hub-heading-glyph{width:27px;height:27px}.family-hub-row{gap:8px;min-height:54px}.family-hub-date-block{width:40px;height:45px}.family-hub-date-block strong{font-size:16px}.family-hub-row-copy strong{font-size:10px}.family-hub-row-copy small{font-size:8.5px;white-space:normal}.family-hub-status{padding:4px 6px;font-size:7px}.family-hub-row-open{flex-basis:16px}.family-hub-goal{grid-template-columns:47px minmax(0,1fr) 17px;gap:8px;min-height:70px}.family-hub-goal-ring{width:44px;height:44px}.family-hub-goal-ring>span{width:36px;height:36px;font-size:9px}.family-hub-goal .family-hub-row-copy small{white-space:normal}.family-hub-milestone-copy{white-space:normal;font-size:8px}.family-hub-activity-row{gap:8px;min-height:49px}.family-hub-empty{min-height:64px}.family-hub-message-preview{min-height:68px}.family-hub-inline-link{min-height:40px;font-size:9px}.family-hub-action{padding-inline:8px;font-size:10px}}
@media(max-width:370px){.family-hub-identity-members{grid-template-columns:minmax(0,1fr)}.family-hub-identity-member:nth-child(n+4){display:none}.family-hub-identity-name{display:block;max-width:180px}.family-hub-tabs button{flex:1 1 0;padding-inline:2px}.family-hub-tabs button>span:last-child{font-size:8px}.family-hub-date-block{width:36px}.family-hub-status{display:none}.family-hub-module-heading h2{font-size:12px}}
/* Family Hub V3: keep supporting information legible at normal desktop zoom. */
.family-hub-heading-title p{font-size:13px}
.family-hub-private-card strong{font-size:12px}.family-hub-private-card small{font-size:10px}
.family-hub-banner-copy p{font-size:12px}
.family-hub-member-panel-heading>span{font-size:10px}.family-hub-member-panel-heading strong{font-size:10px}
.family-hub-identity-name{font-size:12px}.family-hub-identity-copy small{font-size:10px}
.family-hub-tabs button{font-size:12px}
.family-hub-row-copy strong{font-size:13px}.family-hub-row-copy small{font-size:11px}
.family-hub-status{font-size:9px}
.family-hub-date-block small{font-size:9px}
.family-hub-goal-ring>span{font-size:11px}.family-hub-milestone-copy{font-size:9.5px}
.family-hub-activity-row .family-hub-row-copy strong{font-size:12px}.family-hub-activity-row .family-hub-row-copy small{font-size:10px}
.family-hub-empty strong{font-size:12px}.family-hub-empty p{font-size:10px}
.family-hub-message-preview strong{font-size:12px}.family-hub-message-preview small{font-size:10px}
.family-hub-module-heading .pill{font-size:10px}
@media(max-width:620px){
  .family-hub-heading-title p{font-size:11px}.family-hub-private-card strong{font-size:11px}.family-hub-private-card small{font-size:9px}
  .family-hub-banner-copy p{font-size:11px}.family-hub-identity-name{font-size:10px}.family-hub-identity-copy small{font-size:9px}
  .family-hub-tabs button{font-size:9px}.family-hub-row-copy strong{font-size:11px}.family-hub-row-copy small{font-size:9.5px}
  .family-hub-status{font-size:8px}.family-hub-milestone-copy{font-size:9px}
  .family-hub-activity-row .family-hub-row-copy strong{font-size:11px}.family-hub-activity-row .family-hub-row-copy small{font-size:9.5px}
  .family-hub-empty strong{font-size:11px}.family-hub-empty p,.family-hub-message-preview small{font-size:9.5px}.family-hub-message-preview strong{font-size:11px}
}
.family-hub-activity-row[data-activity-kind=project] .family-hub-row-icon,.family-hub-activity-row[data-activity-kind=task] .family-hub-row-icon{border-color:rgba(167,139,250,.18);background:rgba(124,92,252,.1);color:#c4b5fd}.family-hub-activity-row[data-activity-kind=milestone] .family-hub-row-icon{border-color:rgba(232,121,249,.16);background:rgba(192,76,223,.09);color:#e879f9}

/* Family Hub V3C messages: one bounded conversation with its own history scroll. */
.family-hub-messages-workspace{display:flex;flex-direction:column;gap:0;height:min(calc(100dvh - 460px),1000px);min-height:320px;overflow:hidden}
.family-message-heading{flex:0 0 auto}.family-message-heading h2{gap:9px}.family-message-heading h2 svg{width:18px;height:18px;color:#c4b5fd}
.family-message-heading-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:0}.family-message-unread-count{padding:5px 9px;border:1px solid rgba(167,139,250,.22);border-radius:999px;background:rgba(124,92,252,.1);color:#d8ccff;font-size:10px;font-weight:650;white-space:nowrap}.family-message-refresh{min-height:40px;padding:6px 10px;font-size:10px}.family-message-refresh svg{width:14px;height:14px}
.family-message-status{flex:0 0 auto;min-height:0;color:#aeb8d2;font-size:11px}.family-message-status:not(:empty){min-height:26px;padding:3px 0 8px}.family-message-status [role=alert]{color:#fda4af}.family-message-spinner{display:inline-block;width:12px;height:12px;margin-right:7px;border:2px solid rgba(196,181,253,.28);border-top-color:#c4b5fd;border-radius:50%;vertical-align:-2px;animation:family-message-spin .8s linear infinite}@keyframes family-message-spin{to{transform:rotate(360deg)}}
.family-message-history{display:flex;flex:1 1 auto;flex-direction:column;align-items:stretch;gap:12px;min-height:0;overflow-y:auto;padding:18px clamp(12px,3vw,32px);border:1px solid rgba(140,160,220,.11);border-radius:14px;background:radial-gradient(ellipse at 50% 0%,rgba(124,92,252,.08),transparent 55%),rgba(8,12,25,.32);overscroll-behavior:contain;scrollbar-color:rgba(155,139,255,.28) transparent;scrollbar-width:thin}.family-message-history:focus-visible,.family-message-composer textarea:focus-visible,.family-message-edit-form textarea:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.family-message-load-older{align-self:center;min-height:40px;padding:6px 12px;font-size:10px}.family-message-load-older[aria-disabled=true]{opacity:.65;pointer-events:none}
.family-message-row{display:flex;align-items:flex-start;align-self:flex-start;gap:9px;width:min(86%,760px);min-width:0}.family-message-row.is-own{align-self:flex-end;flex-direction:row-reverse}.family-message-row.is-deleted{opacity:.82}.family-message-avatar{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border:1px solid rgba(186,168,255,.27);border-radius:50%;background:linear-gradient(145deg,#5546a8,#263c69);color:#f4efff;font-size:10px;font-weight:750}.family-message-row.is-own .family-message-avatar{border-color:rgba(108,208,238,.27);background:linear-gradient(145deg,#24677f,#32477a)}.family-message-content{display:grid;gap:5px;min-width:0;max-width:100%}.family-message-meta{display:flex;align-items:center;gap:8px;min-width:0;color:#9da9c7;font-size:10px}.family-message-meta strong{overflow:hidden;max-width:40%;color:#e7e9fb;font-size:11px;font-weight:650;text-overflow:ellipsis;white-space:nowrap}.family-message-meta time{font-size:9px;white-space:nowrap}.family-message-edited{color:#8e9bb9;font-size:9px}.family-message-unread{padding:2px 6px;border:1px solid rgba(111,231,190,.19);border-radius:999px;background:rgba(16,110,91,.1);color:#92e4c0;font-size:8px;font-weight:700}.family-message-row.is-own .family-message-meta{justify-content:flex-end}.family-message-bubble{max-width:100%;margin:0;padding:11px 13px;border:1px solid rgba(147,160,205,.17);border-radius:4px 14px 14px 14px;background:linear-gradient(145deg,rgba(35,43,70,.94),rgba(22,29,49,.98));box-shadow:0 5px 15px rgba(1,4,15,.13);color:#edf0ff;font-size:13px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}.family-message-row.is-own .family-message-bubble{border-color:rgba(148,128,255,.28);border-radius:14px 4px 14px 14px;background:linear-gradient(145deg,rgba(76,62,157,.72),rgba(39,54,103,.94))}.family-message-row.is-deleted .family-message-bubble{border-style:dashed;background:rgba(21,27,45,.7);color:#9aa6c1;font-style:italic}.family-message-actions{display:flex;justify-content:flex-start;gap:5px}.family-message-row.is-own .family-message-actions{justify-content:flex-end}.family-message-action{min-width:44px;min-height:36px;padding:5px 8px;border:1px solid transparent;border-radius:8px;background:transparent;color:#b9c2dc;font-size:10px}.family-message-action:hover,.family-message-action:focus-visible{border-color:rgba(167,139,250,.2);background:rgba(124,92,252,.11);color:#fff}.family-message-delete{color:#f0a4ae}.family-message-edit-form{display:grid;gap:8px;min-width:min(100%,480px)}.family-message-edit-form textarea{width:100%;min-height:76px;padding:10px 12px;border:1px solid rgba(153,143,222,.28);border-radius:11px;background:rgba(8,12,25,.75);color:#f4f3ff;font:inherit;resize:vertical}.family-message-edit-form>div{display:flex;flex-wrap:wrap;gap:7px}.family-message-edit-form .button{min-height:40px;padding:6px 10px;font-size:10px}.family-message-history>.family-hub-empty{margin:auto 0;min-height:150px;padding:20px;border:1px dashed rgba(140,160,220,.14);border-radius:13px;background:rgba(255,255,255,.018)}.family-message-history>.family-hub-empty strong{font-size:14px}.family-message-history>.family-hub-empty p{max-width:48ch;font-size:11px}.family-message-loading{display:grid;gap:14px;width:min(72%,540px);margin:auto}.family-message-loading span{height:52px;border:1px solid rgba(140,160,220,.1);border-radius:15px;background:linear-gradient(90deg,rgba(31,39,62,.65),rgba(56,59,100,.38),rgba(31,39,62,.65));background-size:200% 100%;animation:family-message-shimmer 1.6s ease-in-out infinite}.family-message-loading span:nth-child(2){justify-self:end;width:75%}.family-message-loading span:nth-child(3){width:84%}@keyframes family-message-shimmer{to{background-position:-200% 0}}
.family-message-composer{display:grid;flex:0 0 auto;gap:8px;margin-top:12px;padding:11px 12px;border:1px solid rgba(140,160,220,.14);border-radius:14px;background:linear-gradient(140deg,rgba(20,27,47,.94),rgba(12,18,32,.98));box-shadow:inset 0 1px 0 rgba(190,190,255,.04)}.family-message-composer textarea{width:100%;min-height:52px;max-height:140px;resize:vertical;padding:11px 12px;border:1px solid rgba(140,160,220,.12);border-radius:10px;background:rgba(5,9,20,.45);color:#f1f3ff;font:inherit;font-size:13px;line-height:1.45}.family-message-composer textarea::placeholder{color:#7e8aa8}.family-message-composer-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.family-message-composer-footer>span{color:#8997b5;font-size:10px;line-height:1.4}.family-message-composer-footer .button{min-height:44px;min-width:94px;padding:7px 13px;font-size:11px}.family-message-composer-footer .button svg{width:14px;height:14px}.family-message-preview-live{width:100%;min-width:0;border:1px solid transparent;border-radius:12px;background:transparent;text-align:left;font:inherit;cursor:pointer;transition:background .16s ease,border-color .16s ease}.family-message-preview-live:hover{border-color:rgba(167,139,250,.16);background:rgba(124,92,252,.055)}.family-message-preview-live:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.family-message-preview-list{display:grid;flex:1;gap:5px;min-width:0}.family-message-preview-row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:2px 7px;min-width:0}.family-message-preview-row strong{overflow:hidden;max-width:120px;color:#e8e9fb;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.family-message-preview-row>span{overflow:hidden;color:#aab4cf;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.family-message-preview-row time{grid-column:1/-1;color:#7785a3;font-size:9px}.family-message-preview-empty{display:grid;flex:1;gap:4px;min-width:0}.family-message-preview-empty strong{color:#e8e9fb;font-size:12px}.family-message-preview-empty small{color:#9ca8c5;font-size:10px;line-height:1.4}.family-message-preview-count{display:flex;align-items:center;gap:5px;flex:0 0 auto;color:#c8b8ff;font-size:9px;font-weight:650;white-space:nowrap}.family-message-preview-count svg{width:12px;height:12px}
@media(max-width:760px){.family-hub-messages-workspace{height:min(66dvh,680px);min-height:360px;padding:13px}.family-message-history{padding:13px 9px;gap:10px}.family-message-row{width:min(93%,680px);gap:7px}.family-message-avatar{flex-basis:30px;width:30px;height:30px;font-size:9px}.family-message-bubble{padding:10px 11px;font-size:13px}.family-message-meta{gap:6px}.family-message-meta strong{max-width:42%;font-size:10px}.family-message-meta time{font-size:8px}.family-message-composer{margin-top:9px;padding:9px}.family-message-composer textarea{min-height:48px;font-size:16px}.family-message-composer-footer>span{font-size:9px}.family-message-preview-live{gap:8px;padding:6px 2px}.family-message-preview-count{font-size:8px}}
@media(max-width:430px){.family-hub-messages-workspace{height:min(64dvh,620px);min-height:330px;padding:11px}.family-message-heading{align-items:flex-start}.family-message-heading-actions{gap:5px}.family-message-unread-count{padding:4px 6px;font-size:9px}.family-message-refresh{min-width:40px;width:40px;height:40px;padding:0}.family-message-refresh span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.family-message-row{width:96%}.family-message-composer-footer{align-items:flex-end}.family-message-composer-footer>span{max-width:25ch}.family-message-composer-footer .button{min-width:76px;padding-inline:9px}.family-hub-message-preview-live .family-message-preview-row{grid-template-columns:minmax(0,1fr)}.family-message-preview-row>span{font-size:9px}}
@media(max-width:760px){.family-hub:has(.family-hub-tabs [data-family-tab=messages][aria-selected=true])>.family-hub-identity{display:none}}
@media(prefers-reduced-motion:reduce){.family-message-spinner,.family-message-loading span{animation:none}}
.family-hub-message-preview-live>.family-message-preview-count{display:flex;align-items:center;gap:5px;min-width:fit-content}
@media(max-width:760px) and (max-height:700px){.family-hub-messages-workspace{height:min(calc(100dvh - 300px),620px);min-height:220px}}

/* Family Photos V1 interface foundation: real empty states until approved storage exists. */
.family-hub-heading-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:0}
.family-hub-private-card .family-hub-personal-briefing{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:32px;flex:0 0 auto;padding:5px 9px;border:1px solid rgba(140,160,220,.13);border-radius:10px;background:rgba(255,255,255,.025);color:#c6c9eb;font-size:9px;text-decoration:none;white-space:nowrap}
.family-hub-personal-briefing svg{width:14px;height:14px;color:#b5a6ff}.family-hub-personal-briefing:hover{border-color:rgba(167,139,250,.27);background:rgba(124,92,252,.08);color:#fff}.family-hub-personal-briefing:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.family-photos-page{display:grid;gap:13px;min-width:0;color:#eef0ff}
.family-photos-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;min-width:0;padding:2px 2px 4px}
.family-photos-heading h2{margin:4px 0;color:#f5f4ff;font-size:clamp(20px,2vw,26px);letter-spacing:-.025em}
.family-photos-heading p{margin:0;color:#aab4cf;font-size:12px;line-height:1.5}
.family-photos-storage{display:flex;align-items:center;gap:10px;min-width:240px;padding:9px 12px;border:1px solid rgba(140,160,220,.16);border-radius:12px;background:linear-gradient(135deg,rgba(22,31,53,.9),rgba(14,20,35,.96))}
.family-photos-storage-icon{display:grid;place-items:center;width:33px;height:33px;flex:0 0 auto;border:1px solid rgba(164,148,255,.2);border-radius:10px;background:rgba(125,103,235,.12);color:#c2b5ff}.family-photos-storage-icon svg{width:17px;height:17px}
.family-photos-storage>span:nth-child(2){display:grid;gap:3px;min-width:0;flex:1}.family-photos-storage strong{font-size:11px}.family-photos-storage small{color:#99a5c2;font-size:9px;white-space:nowrap}
.family-photos-storage-state{padding:5px 8px;border:1px solid rgba(247,190,105,.18);border-radius:999px;background:rgba(180,117,38,.08);color:#e8c28e;font-size:9px;white-space:nowrap}
.family-photos-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;padding:5px;border:1px solid rgba(140,160,220,.14);border-radius:14px;background:linear-gradient(120deg,rgba(11,15,28,.92),rgba(16,22,39,.9))}
.family-photos-tabs{display:flex;align-items:center;gap:5px;min-width:0;overflow-x:auto;scrollbar-width:thin;overscroll-behavior-inline:contain}
.family-photos-tabs button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:126px;min-height:44px;padding:8px 12px;border:1px solid transparent;border-radius:10px;background:transparent;color:#aab5d1;font:inherit;font-size:11px;font-weight:650;white-space:nowrap;cursor:pointer}
.family-photos-tabs button svg{width:16px;height:16px;color:#c3b8ff}.family-photos-tabs button:hover{background:rgba(255,255,255,.05);color:#fff}
.family-photos-tabs button[aria-selected=true]{border-color:rgba(169,149,255,.32);background:linear-gradient(115deg,rgba(92,67,211,.7),rgba(37,73,151,.65));color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}
.family-photos-tabs button:focus-visible,.family-photos-actions button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.family-photos-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex:0 0 auto}.family-photos-actions .button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:8px 12px;font-size:10px;white-space:nowrap}.family-photos-actions .button svg{width:15px;height:15px}
.family-photos-actions .button:disabled{opacity:.55;cursor:not-allowed;filter:saturate(.65)}
.family-photos-storage-note{margin:-5px 2px 0;color:#929fbd;font-size:10px;line-height:1.5}
.family-photos-panel{display:grid;gap:16px;min-width:0;min-height:360px;align-content:start;padding:18px;background:radial-gradient(ellipse at 2% 0%,rgba(124,92,252,.1),transparent 55%),linear-gradient(150deg,rgba(24,31,52,.97),rgba(14,19,33,.99))}
.family-photos-panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding-bottom:13px;border-bottom:1px solid rgba(140,160,220,.1)}
.family-photos-panel-heading h3{margin:4px 0;color:#f2f3ff;font-size:17px;letter-spacing:-.015em}.family-photos-panel-heading p{max-width:70ch;margin:0;color:#9eabc9;font-size:11px;line-height:1.5}
.family-photos-empty{display:grid;justify-items:center;align-content:center;min-height:248px;padding:22px;text-align:center}
.family-photos-empty-glyph{display:grid;place-items:center;width:54px;height:54px;margin-bottom:12px;border:1px solid rgba(167,139,250,.2);border-radius:17px;background:linear-gradient(145deg,rgba(118,89,230,.19),rgba(38,62,117,.2));color:#c6b5ff;box-shadow:0 0 36px rgba(124,92,252,.09)}.family-photos-empty-glyph svg{width:25px;height:25px}
.family-photos-empty>strong{color:#f0efff;font-size:14px}.family-photos-empty p{max-width:56ch;margin:7px 0;color:#aab5d1;font-size:11px;line-height:1.55}.family-photos-empty-note{color:#7f8da9;font-size:9px}
.family-photos-panel:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
@media(max-width:900px){.family-hub-heading-actions{gap:7px}.family-hub-private-card .family-hub-personal-briefing{padding-inline:8px}.family-photos-toolbar{align-items:stretch;flex-direction:column}.family-photos-actions{justify-content:flex-start}}
@media(max-width:620px){.family-hub-heading-actions{align-items:stretch;flex-direction:column;width:100%}.family-hub-private-card .family-hub-personal-briefing{justify-content:flex-start;min-width:44px;min-height:44px;padding-block:8px}.family-photos-page{gap:10px}.family-photos-heading{align-items:stretch;flex-direction:column;gap:10px}.family-photos-heading p{font-size:11px}.family-photos-storage{min-width:0}.family-photos-toolbar{gap:6px;padding:4px}.family-photos-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;overflow:visible}.family-photos-tabs button{flex-direction:column;gap:3px;min-width:0;min-height:48px;padding:5px 3px;font-size:9px}.family-photos-tabs button svg{width:15px;height:15px}.family-photos-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.family-photos-actions .button{min-width:0;padding-inline:7px;font-size:9px}.family-photos-storage-note{font-size:9px}.family-photos-panel{gap:12px;min-height:290px;padding:13px;border-radius:14px}.family-photos-panel-heading h3{font-size:15px}.family-photos-panel-heading p{font-size:10px}.family-photos-empty{min-height:196px;padding:14px}.family-photos-empty p{font-size:10px}}
@media(max-width:370px){.family-photos-storage{gap:7px;padding:8px}.family-photos-storage-state{padding:4px 6px;font-size:8px}.family-photos-tabs button{font-size:8px}.family-photos-actions .button{font-size:8px}.family-photos-panel{padding:11px}}

/* Family Photos V1 metadata-only album management and mobile density. */
.family-photos-status{display:flex;align-items:center;justify-content:center;gap:8px;min-height:160px;padding:18px;color:#aab5d1;font-size:12px;text-align:center}
.family-photos-error{color:#efb4bd}.family-photos-error .text-button{min-height:44px;padding:8px;color:#c9bdff}
.family-photo-album-list{display:grid;gap:8px;min-width:0}
.family-photo-album-row{display:flex;align-items:center;gap:12px;min-width:0;padding:11px 12px;border:1px solid rgba(140,160,220,.11);border-radius:12px;background:linear-gradient(120deg,rgba(255,255,255,.025),rgba(97,91,173,.035))}
.family-photo-album-icon{display:grid;place-items:center;width:38px;height:38px;flex:0 0 auto;border:1px solid rgba(167,139,250,.18);border-radius:11px;background:rgba(124,92,252,.09);color:#c7b8ff}.family-photo-album-icon svg{width:18px;height:18px}
.family-photo-album-copy{display:grid;gap:4px;min-width:0;flex:1}.family-photo-album-copy strong{overflow:hidden;color:#edf0ff;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.family-photo-album-copy small{color:#929fbd;font-size:10px;line-height:1.4}
.family-photo-album-actions{display:flex;align-items:center;gap:6px;flex:0 0 auto}.family-photo-album-actions .button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:7px 10px;font-size:10px}.family-photo-album-actions .button svg{width:14px;height:14px}.family-photo-delete{color:#efb4bd}
.family-photo-album-form{display:grid;gap:9px;padding:8px 2px 2px}.family-photo-album-form>label{color:#dfe3f7;font-size:12px;font-weight:650}.family-photo-album-form input,.family-photo-album-form select{width:100%;min-height:46px;padding:10px 12px;border:1px solid rgba(140,160,220,.2);border-radius:10px;background:#151c2c;color:#eef0ff;font:inherit;font-size:13px}.family-photo-album-form .hint{margin:0;color:#98a5c2;font-size:10px;line-height:1.5}.family-photo-album-form .form-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:5px}.family-photo-album-form .form-actions .button{min-height:44px}
.family-photo-album-form :focus-visible{outline:2px solid var(--focus);outline-offset:2px}
@media(max-width:620px){.family-photos-actions:not(.has-album-create) .button{grid-column:1/-1}.family-photos-panel{min-height:235px}.family-photos-empty{min-height:134px;padding:12px}.family-photos-empty-glyph{width:46px;height:46px;margin-bottom:8px;border-radius:14px}.family-photo-album-row{align-items:flex-start;gap:9px;padding:10px}.family-photo-album-icon{width:34px;height:34px}.family-photo-album-copy{padding-top:2px}.family-photo-album-copy strong{white-space:normal;overflow-wrap:anywhere}.family-photo-album-copy small{font-size:9px}.family-photo-album-actions{flex-direction:column;gap:4px}.family-photo-album-actions .button{width:44px;height:44px;padding:0}.family-photo-album-actions .button span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.family-photo-album-form .form-actions{display:grid;grid-template-columns:1fr 1fr}.family-photo-album-form .form-actions .button{min-width:0;padding-inline:8px;font-size:10px}}
@media(max-width:370px){.family-photos-panel{min-height:220px}.family-photos-empty{min-height:120px}.family-photo-album-row{gap:7px;padding:8px}.family-photo-album-copy strong{font-size:11px}.family-photo-album-copy small{font-size:8px}}

/* Family Photos V2 responsive library */
.family-photos-actions{flex-wrap:wrap;align-items:center;gap:8px}
.family-photo-visibility-control{display:flex;align-items:center;gap:7px;color:#9eabc9;font-size:10px}
.family-photo-visibility-control select{min-height:44px;max-width:190px;padding:7px 10px;border:1px solid rgba(140,160,220,.18);border-radius:10px;background:#111a2c;color:#e9edff;font:inherit}
.family-photo-upload-progress{display:flex;align-items:center;gap:9px;color:#c6bcff;font-size:11px}
.family-photo-upload-progress progress{width:min(360px,55vw);height:8px;accent-color:#8b70ff}
.family-photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;align-items:start;min-width:0}
.family-photo-tile{min-width:0;overflow:hidden;border:1px solid rgba(140,160,220,.15);border-radius:14px;background:linear-gradient(150deg,rgba(22,30,49,.96),rgba(12,18,31,.98));box-shadow:0 8px 24px rgba(0,0,0,.16)}
.family-photo-image-button{position:relative;display:block;width:100%;aspect-ratio:4/3;min-height:130px;overflow:hidden;padding:0;border:0;background:linear-gradient(135deg,#20294a,#342857);cursor:zoom-in}
.family-photo-image-button img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .18s ease}
.family-photo-image-button:hover img{transform:scale(1.025)}
.family-photo-privacy{position:absolute;right:8px;bottom:8px;display:flex;align-items:center;gap:5px;min-height:25px;padding:4px 8px;border:1px solid rgba(200,210,255,.19);border-radius:999px;background:rgba(8,14,27,.84);color:#e8eaff;font-size:10px;backdrop-filter:blur(8px)}
.family-photo-privacy svg{width:13px;height:13px;color:#bba7ff}
.family-photo-tile-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 8px;padding:9px 11px}
.family-photo-tile-copy strong,.family-photo-tile-copy small{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.family-photo-tile-copy strong{color:#f0f2ff;font-size:12px}.family-photo-tile-copy small{color:#99a7c8;font-size:10px}
.family-photo-tile-copy button{grid-column:2;grid-row:1/3;min-width:44px;min-height:44px;padding:7px;border:0;border-radius:9px;background:rgba(124,92,252,.1);color:#cfc4ff;font:inherit;font-size:10px;cursor:pointer}
.family-photo-tile button:focus-visible,.family-photo-album-actions button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.family-photo-album-actions{display:flex;align-items:center;gap:6px}.family-photo-album-actions .button{min-height:44px}
.family-photo-album-open-heading{display:flex;align-items:center;gap:12px;margin-bottom:12px;color:#eef0ff}
.family-photo-album-open-heading strong{font-size:14px}
.family-photo-viewer{display:grid;gap:12px;max-height:min(88dvh,900px);min-width:min(900px,calc(100vw - 36px));overflow:hidden}
.family-photo-viewer>.dialog-heading{margin:0}
.family-photo-viewer-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,310px);gap:16px;min-height:0;overflow:auto}
.family-photo-original{display:block;max-width:100%;max-height:calc(88dvh - 100px);margin:auto;object-fit:contain;border-radius:12px;background:#080d18}
.family-photo-details{min-width:0;padding:12px;border:1px solid rgba(140,160,220,.14);border-radius:12px;background:rgba(255,255,255,.025)}
.family-photo-details>p{margin:4px 0 8px;color:#9eabc9;font-size:11px}
.family-photo-details form{display:grid;gap:8px;margin-top:10px}
.family-photo-details label,.family-photo-album-checks legend{color:#cbd4ec;font-size:11px;font-weight:650}
.family-photo-details input:not([type=checkbox]),.family-photo-details select{width:100%;min-height:44px;padding:8px 10px;border:1px solid rgba(140,160,220,.18);border-radius:9px;background:#111a2c;color:#eef0ff;font:inherit;font-size:12px}
.family-photo-album-checks{display:grid;gap:6px;max-height:150px;overflow:auto;margin:2px 0;padding:8px;border:1px solid rgba(140,160,220,.13);border-radius:9px}
.family-photo-album-checks label{display:flex;align-items:center;gap:8px;min-height:40px}.family-photo-album-checks input{width:18px;height:18px;accent-color:#8b70ff}
.family-photo-details .form-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:5px}.family-photo-details .form-actions .button{min-height:44px}
.family-photo-delete{color:#ffabb5}
@media(max-width:700px){.family-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.family-photo-image-button{min-height:96px}.family-photo-tile-copy{padding:7px}.family-photo-tile-copy strong{font-size:10px}.family-photo-tile-copy small{font-size:9px}.family-photos-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:100%}.family-photos-actions .family-photo-visibility-control{grid-column:1/-1;justify-content:space-between}.family-photo-visibility-control select{max-width:60%}.family-photo-album-actions{flex-wrap:wrap}.family-photo-album-actions .button{min-width:44px;padding:6px}.family-photo-viewer{min-width:min(440px,calc(100vw - 28px));max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 20px)}.family-photo-viewer-body{grid-template-columns:minmax(0,1fr);gap:8px}.family-photo-original{max-height:42dvh}.family-photo-details{padding:10px}.family-photo-details .form-actions{display:grid;grid-template-columns:1fr 1fr}.family-photo-album-open-heading{flex-wrap:wrap}}
@media(max-width:370px){.family-photo-grid{gap:7px}.family-photo-tile-copy{gap:3px;padding:6px}.family-photo-tile-copy strong{font-size:9px}.family-photo-tile-copy button{min-width:40px;min-height:40px}}

/* Family Photos visual refinement: follow the approved gallery hierarchy while keeping every
   storage/media affordance honest until a persistent provider exists. */
.family-hub-identity-photos{grid-template-columns:minmax(0,1fr) minmax(300px,.62fr);min-height:132px;padding-block:14px;gap:18px}
.family-hub-identity-photos .family-hub-banner-copy h2{margin-top:6px}
.family-hub-nas-summary{display:grid;grid-template-columns:minmax(0,1fr);gap:5px;padding:11px 14px}
.family-hub-nas-summary .family-hub-member-panel-heading{margin:0}
.family-hub-nas-summary .family-hub-member-panel-heading>span{font-size:10px}
.family-hub-nas-summary .family-hub-member-panel-heading>strong{color:#e8c28e;font-size:10px}
.family-hub-nas-summary p,.family-hub-nas-summary small{margin:0;color:#adb8d2;font-size:10px;line-height:1.4}
.family-hub-nas-summary small{color:#8492ae;font-size:9px}
.family-photos-heading{align-items:center}
.family-photos-private-badge{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:6px 10px;border:1px solid rgba(167,139,250,.17);border-radius:10px;background:rgba(124,92,252,.08);color:#c9bcff;font-size:10px;font-weight:650;white-space:nowrap}
.family-photos-private-badge svg{width:15px;height:15px}
.family-photos-tabs{justify-content:center;width:min(100%,620px);margin-inline:auto;padding:4px;border:1px solid rgba(140,160,220,.14);border-radius:13px;background:linear-gradient(120deg,rgba(11,15,28,.92),rgba(16,22,39,.9))}
.family-photos-tabs button{flex:1 1 0;min-width:0}
.family-photos-toolbar{align-items:center;justify-content:flex-start;padding:0;border:0;background:none}
.family-photos-actions{justify-content:flex-start}
.family-photos-storage-note{margin:0 0 0 3px}
.family-photos-panel{min-height:300px}
.family-photos-album-preview{display:grid;gap:10px;min-width:0;padding:13px 15px;background:linear-gradient(145deg,rgba(20,28,47,.96),rgba(13,19,32,.98))}
.family-photos-album-preview-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.family-photos-album-preview-heading h3{display:flex;align-items:center;gap:8px;margin:0;color:#eef0ff;font-size:13px}
.family-photos-album-preview-heading h3 svg{width:17px;height:17px;color:#b9a8ff}
.family-photos-see-all{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:40px;padding:6px 8px;border:0;background:transparent;color:#c6baff;font:inherit;font-size:10px;font-weight:650;cursor:pointer}
.family-photos-see-all svg{width:13px;height:13px}
.family-photos-see-all:hover{color:#fff}.family-photos-see-all:focus-visible,.family-photos-album-tile:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.family-photos-album-preview-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;min-width:0}
.family-photos-album-tile{display:grid;grid-template-columns:30px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:9px;min-width:0;min-height:58px;padding:8px 10px;border:1px solid rgba(140,160,220,.13);border-radius:11px;background:rgba(255,255,255,.025);color:#e9edff;text-align:left;cursor:pointer}
.family-photos-album-tile:hover{border-color:rgba(167,139,250,.28);background:rgba(124,92,252,.07)}
.family-photos-album-tile-icon{display:grid;grid-row:1/3;place-items:center;width:30px;height:30px;border:1px solid rgba(167,139,250,.16);border-radius:9px;background:rgba(124,92,252,.09);color:#c6b5ff}
.family-photos-album-tile-icon svg{width:15px;height:15px}
.family-photos-album-tile strong,.family-photos-album-tile small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.family-photos-album-tile strong{font-size:10px}.family-photos-album-tile small{color:#94a1bf;font-size:9px}
.family-photos-album-preview-empty{margin:0;padding:4px 2px;color:#9eabc9;font-size:10px;line-height:1.5}
@media(max-width:900px){.family-hub-identity-photos{grid-template-columns:minmax(0,1fr) minmax(260px,.8fr);gap:12px}.family-photos-tabs{width:min(100%,560px)}}
@media(max-width:760px){.family-hub-identity-photos{grid-template-columns:minmax(0,1fr) minmax(0,.95fr)}}
@media(max-width:620px){.family-hub-identity-photos{grid-template-columns:minmax(0,1fr);gap:10px;padding:13px}.family-hub-nas-summary{padding:9px 11px}.family-hub-nas-summary p{font-size:9px}.family-photos-heading{align-items:flex-start;flex-direction:row;gap:8px}.family-photos-heading h2{font-size:20px}.family-photos-heading p{max-width:38ch}.family-photos-private-badge{min-height:32px;padding:5px 7px;font-size:8px}.family-photos-private-badge svg{width:13px;height:13px}.family-photos-tabs{width:100%;margin:0;padding:3px}.family-photos-tabs button{flex-direction:column;gap:3px;min-height:49px;padding:5px 3px;font-size:9px}.family-photos-tabs button svg{width:15px;height:15px}.family-photos-toolbar{align-items:stretch;flex-direction:column;gap:4px}.family-photos-actions{display:flex;justify-content:flex-start}.family-photos-actions .button{min-height:44px}.family-photos-actions:not(.has-album-create) .button{width:100%}.family-photos-storage-note{font-size:9px}.family-photos-panel{min-height:220px;padding:12px}.family-photos-empty{min-height:122px;padding:10px}.family-photos-album-preview{padding:11px}.family-photos-album-preview-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.family-photos-album-tile{grid-template-columns:25px minmax(0,1fr);column-gap:7px;min-height:54px;padding:7px}.family-photos-album-tile-icon{width:25px;height:25px}.family-photos-album-tile strong{font-size:9px}.family-photos-album-tile small{font-size:8px}}
@media(max-width:370px){.family-photos-heading{align-items:flex-start;flex-direction:column}.family-photos-private-badge{min-height:30px}.family-photos-album-preview-list{grid-template-columns:minmax(0,1fr)}}

/* Family Messages V3C final polish: keep chronology top-packed, cap the conversation
   measure on ultrawide screens, and keep action menus attached and inside the scroll flow. */
.family-message-history{align-items:stretch;justify-content:flex-start;gap:0;scrollbar-gutter:stable both-edges}
.family-message-feed{display:flex;flex:0 0 auto;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:8px;width:min(100%,1200px);min-height:100%;margin-inline:auto}
.family-message-row{flex:0 0 auto;margin-block:0}
.family-message-composer{align-self:center;width:min(100%,1200px)}
.family-message-actions{position:relative;display:flex;flex:0 0 auto;flex-direction:column;align-self:center;width:max-content;max-width:100%;margin-left:2px;gap:4px}
.family-message-row.is-own .family-message-actions{align-self:center}
.family-message-menu-trigger{display:grid;place-items:center;align-self:center;width:44px;height:44px;list-style:none;border:1px solid transparent;border-radius:10px;background:transparent;color:#b9c2dc;cursor:pointer}
.family-message-row.is-own .family-message-menu-trigger{align-self:center}
.family-message-menu-trigger::-webkit-details-marker{display:none}
.family-message-menu-trigger::marker{content:""}
.family-message-menu-trigger svg{width:18px;height:18px}
.family-message-menu-trigger:hover,.family-message-menu-trigger:focus-visible,.family-message-actions[open]>.family-message-menu-trigger{border-color:rgba(167,139,250,.24);background:rgba(124,92,252,.12);color:#fff}
.family-message-menu-trigger:focus-visible,.family-message-menu [role=menuitem]:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.family-message-menu{display:grid;gap:3px;min-width:152px;max-width:min(220px,calc(100vw - 48px));padding:5px;border:1px solid rgba(150,161,255,.22);border-radius:12px;background:linear-gradient(145deg,#1a2034,#111827);box-shadow:0 12px 28px rgba(2,5,16,.46)}
.family-message-menu [role=menuitem]{display:flex;align-items:center;width:100%;min-height:44px;padding:8px 11px;border:1px solid transparent;border-radius:8px;background:transparent;color:#dce2f5;text-align:left;font:inherit;font-size:12px;cursor:pointer}
.family-message-menu [role=menuitem]:hover,.family-message-menu [role=menuitem]:focus-visible{border-color:rgba(167,139,250,.18);background:rgba(124,92,252,.12);color:#fff}
.family-message-menu [role=menuitem].family-message-delete{color:#f0a4ae}
@media(min-width:761px){.family-hub:has(.family-hub-tabs [data-family-tab=messages][aria-selected=true])>.family-hub-identity{min-height:126px;padding-block:12px;gap:16px}}
@media(min-width:761px) and (max-width:900px){.family-hub:has(.family-hub-tabs [data-family-tab=messages][aria-selected=true])>.family-hub-identity{grid-template-columns:minmax(0,1fr) minmax(0,.82fr);gap:10px;padding-inline:13px}.family-hub:has(.family-hub-tabs [data-family-tab=messages][aria-selected=true]) .family-hub-identity-members{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.family-hub:has(.family-hub-tabs [data-family-tab=messages][aria-selected=true]) .family-hub-identity-member{gap:5px;padding:4px}.family-hub:has(.family-hub-tabs [data-family-tab=messages][aria-selected=true]) .family-hub-identity-avatar{width:28px;height:28px;font-size:9px}.family-hub:has(.family-hub-tabs [data-family-tab=messages][aria-selected=true]) .family-hub-identity-name{max-width:76px;font-size:9px}}

/* Responsive V3 C7 Family Hub: retain the household/privacy context while
   making mobile navigation and conversation controls fit the usable viewport. */
@media(max-width:620px){
  .family-hub-page,.family-hub{gap:6px}
  .family-hub-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}
  .family-hub-heading-title{gap:8px;min-width:0}
  .family-hub-heading-icon{width:36px;height:36px;flex:0 0 auto}
  .family-hub-heading-title h1{font-size:22px;line-height:1.1}
  .family-hub-heading-title p{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
  .family-hub-private-card{align-self:center;gap:6px;padding:0 8px}
  .family-hub-private-icon{width:24px;height:24px;flex:0 0 auto}
  .family-hub-private-card strong{font-size:10px;white-space:nowrap}
  .family-hub-private-card small{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
  .family-hub-identity{grid-template-columns:minmax(0,1fr);gap:8px;min-height:0;padding:10px 12px;border-radius:14px}
  .family-hub-banner-kicker{display:none}
  .family-hub-banner-copy h2{margin:0 0 3px;font-size:18px}
  .family-hub-banner-copy p{font-size:10px;line-height:1.35}
  .family-hub-member-panel{padding:8px}
  .family-hub-member-panel-heading{margin-bottom:5px}
  .family-hub-identity-members{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
  .family-hub-identity-member{gap:5px;min-width:0;padding:4px}
  .family-hub-identity-avatar{width:29px;height:29px}
  .family-hub-identity-name{max-width:100%;font-size:9px}
  .family-hub-identity-copy small{font-size:8px}
  .family-hub-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;overflow:visible;padding:3px;scrollbar-width:none}
  .family-hub-tabs button{display:flex;flex-direction:column;gap:2px;width:100%;min-width:0;min-height:52px;padding:3px 1px;font-size:9px;line-height:1.1;white-space:normal}
  .family-hub-tabs button>span:last-child{display:block;max-width:100%;font-size:9px;line-height:1.05;text-align:center;white-space:nowrap}
  .family-hub-tab-icon{width:18px;height:18px;flex:0 0 auto}
  .family-hub-tab-icon svg{width:13px;height:13px}
  .family-hub-inline-link{min-height:44px;padding-block:5px}
  .family-hub-action{min-height:44px}
  .family-hub-messages-workspace{height:min(calc(100dvh - 300px),620px);min-height:330px}
  .family-message-refresh{min-width:44px;min-height:44px}
  .family-message-load-older{min-height:44px}
  .family-message-edit-form .button{min-height:44px}
}
@media(max-width:370px){
  .family-hub-heading{grid-template-columns:minmax(0,1fr);justify-items:start;gap:5px}.family-hub-heading-title .eyebrow{display:none}
  .family-hub-private-card{grid-column:1;padding:0 7px}
  .family-hub-identity-name{max-width:100%;font-size:9px}
  .family-hub-identity-members{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px) and (max-height:700px){
  .family-hub-messages-workspace{height:min(calc(100dvh - 300px),620px);min-height:220px}
}
@media(max-height:500px) and (orientation:landscape){
  .family-hub-page,.family-hub{gap:6px}
  .family-hub-heading{grid-template-columns:minmax(0,1fr) auto;gap:6px}
  .family-hub-heading-title p,.family-hub-private-card small{display:none}
  .family-hub-heading-icon{width:32px;height:32px}
  .family-hub-heading-title h1{font-size:19px}
  .family-hub-private-card{padding:3px 6px}
  .family-hub:has(.family-hub-tabs [data-family-tab=messages][aria-selected=true])>.family-hub-identity{display:none}
  .family-hub-tabs{gap:2px;padding:2px}
  .family-hub-tabs button{min-height:44px;padding-block:2px}
  .family-hub-messages-workspace{height:190px;min-height:190px;padding:7px}
  .family-message-heading{margin-bottom:5px;padding-bottom:5px}
  .family-message-history{padding:7px}
  .family-message-composer{gap:5px;margin-top:6px;padding:7px}
  .family-message-composer textarea{min-height:40px;max-height:60px;padding:7px}
}
@media(max-width:760px) and (max-height:430px){
  .family-hub-page,.family-hub{gap:4px}
  .family-hub-page .family-hub-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px}
  .family-hub-page .family-hub-heading-title{gap:5px}
  .family-hub-page .family-hub-heading-icon{width:28px;height:28px}
  .family-hub-page .family-hub-heading-title h1{font-size:17px}
  .family-hub-page .family-hub-heading-title .eyebrow{display:none}
  .family-hub-page .family-hub-private-card{grid-column:auto;gap:4px;padding:3px 5px}
  .family-hub-page .family-hub-private-icon{width:20px;height:20px}
  .family-hub-page .family-hub-private-card strong{font-size:8.5px}
  .family-hub-tabs button{min-height:44px}
  .family-hub-messages-workspace{height:190px;min-height:190px;padding:7px}
  .family-message-heading{margin-bottom:4px;padding-bottom:4px}
  .family-message-history{padding:6px}
  .family-message-composer{gap:4px;margin-top:5px;padding:6px}
  .family-message-composer textarea{min-height:38px;max-height:48px;padding:6px}
}
/* Keep a keyboard-open or short-landscape composer inside the usable visual
   viewport. The short-height Messages view drops the scenic identity banner,
   while safe-area padding leaves room for device home indicators. */
@media(max-width:760px){.content:has(.family-hub-page){padding-bottom:calc(24px + env(safe-area-inset-bottom))}}
.family-message-composer{scroll-margin-bottom:calc(16px + env(safe-area-inset-bottom))}
@media(max-width:760px){.family-message-composer textarea{scroll-margin-bottom:calc(72px + env(safe-area-inset-bottom))}}
@media(max-width:760px) and (max-height:500px){
  .family-hub:has(.family-hub-tabs [data-family-tab=messages][aria-selected=true])>.family-hub-identity{display:none}
  .family-hub-messages-workspace{height:172px;min-height:160px;padding:6px}
  .family-message-composer{margin-top:5px;padding:5px}
  .family-message-composer textarea{min-height:38px;padding:6px}
}
@media(max-height:500px) and (orientation:landscape) and (max-width:900px){
  .content:has(.family-hub-page){padding-top:4px;padding-bottom:calc(24px + env(safe-area-inset-bottom))}
  .family-hub-messages-workspace{height:190px;min-height:190px;padding:7px}
  .family-message-composer{gap:5px;margin-top:5px;padding:6px}
  .family-message-composer textarea{min-height:38px;max-height:48px;padding:6px}
}

/* Responsive V3 C8 Settings: switch dense account controls into named mobile sections. */
.settings-section-nav[hidden],.settings-panel[hidden]{display:none!important}
@media(max-width:899px){
  .settings-page .page-heading{margin-bottom:10px}
  .settings-page .page-heading h1{margin-bottom:4px}
  .settings-page .page-heading p{max-width:48ch}
  .settings-status{margin:0 0 8px}
  .settings-section-nav{position:sticky;top:8px;z-index:5;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:8px 0 12px;padding:4px;border:1px solid var(--border);border-radius:14px;background:rgba(16,20,29,.96);backdrop-filter:blur(14px)}
  .settings-section-nav button{min-width:0;min-height:48px;padding:5px 2px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--text-dim);font-size:11px;line-height:1.15;font-weight:650;text-align:center;white-space:normal}
  .settings-section-nav button[aria-selected=true]{border-color:var(--accent-line);background:var(--accent-soft);color:var(--text)}
  .settings-grid{display:block}
  .settings-grid>.settings-column{display:contents}
  .settings-panel{min-width:0}
  .settings-panel:not([hidden]){display:block}
  .settings-grid .card{margin-bottom:12px;padding:18px 16px}
  .settings-grid form{gap:14px}
  .settings-grid h2{margin-bottom:14px}
}
@media(max-width:619px){
  .settings-page .page-heading{margin-bottom:8px}
  .settings-page .page-heading h1{font-size:28px}
  .settings-page .page-heading p{font-size:12px;line-height:1.35}
  .settings-section-nav{top:4px;gap:3px;margin:6px 0 10px;padding:3px}
  .settings-section-nav button{min-height:48px;padding-inline:1px;font-size:10px;letter-spacing:-.01em}
  .settings-grid .card{padding:16px 14px;margin-bottom:10px}
  .settings-grid input:not([type=checkbox]),.settings-grid select{font-size:16px}
  .settings-grid fieldset{padding:12px}
}

/* Pass A: compact-phone Fitness corrections placed after legacy Fitness V4
   rules so the five quick-log choices remain readable at their source. */
@media(max-width:619px){
  .fitness-page-mobile .fitness-heading{flex-direction:column;align-items:stretch}
  .fitness-page-mobile .fitness-header-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch}
  .fitness-page-mobile .fitness-header-health{width:100%}
  .fitness-page-mobile .fitness-overview-quick .fitness-activity-options,
  .fitness-mobile-panel .fitness-quick-card .fitness-activity-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .fitness-page-mobile .fitness-overview-quick .fitness-activity-tile,
  .fitness-mobile-panel .fitness-quick-card .fitness-activity-tile{min-height:52px;padding:5px 3px;font-size:10px;overflow-wrap:normal}
  .fitness-page-mobile .fitness-overview-quick .fitness-activity-tile>span:last-child,
  .fitness-mobile-panel .fitness-quick-card .fitness-activity-tile>span:last-child{white-space:nowrap}
}
@media(max-width:899px){
  /* Desktop dashboard cards carry named grid areas. In a mobile tab panel
     those names have no meaning, so explicitly return them to document flow. */
  .fitness-mobile-panel .fitness-quick-card,
  .fitness-mobile-panel .fitness-recent-card,
  .fitness-mobile-panel .fitness-activity-card,
  .fitness-mobile-panel .fitness-progress-card,
  .fitness-mobile-panel .fitness-goals-card,
  .fitness-mobile-panel .fitness-nutrition-planned{grid-area:auto!important}
}

/* NerdSnap is a status-only pointer to a separate application. Keep the two
   honest connection details together so mobile users do not scroll through
   separate, non-actionable placeholder cards. */
.nerdsnap-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:start;gap:16px}
.nerdsnap-status-heading{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.nerdsnap-status-heading .integration-icon{display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;margin:0;padding:10px}
.nerdsnap-status-heading .integration-icon svg{width:28px;height:28px}
.nerdsnap-status-title{min-width:0;flex:1}
.nerdsnap-status-title .card-header{flex-wrap:wrap;margin:0}
.nerdsnap-status-card>p{margin:0 0 12px;line-height:1.55}
.nerdsnap-status-card .info-note{padding:12px;font-size:12px}
.nerdsnap-connection-list{margin:10px 0 0}
.nerdsnap-connection-list>div{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:8px 0;border-top:1px solid var(--border)}
.nerdsnap-connection-list dt{font-size:12px;color:var(--text-dim)}
.nerdsnap-connection-list dd{margin:0}
@media(max-width:899px){.nerdsnap-grid{grid-template-columns:minmax(0,1fr);gap:12px}}
@media(max-width:619px){.nerdsnap-grid{gap:10px}.nerdsnap-grid>.card{padding:14px}.nerdsnap-status-heading{gap:10px;margin-bottom:10px}.nerdsnap-status-heading .integration-icon{flex-basis:44px;width:44px;height:44px;padding:8px}.nerdsnap-status-heading .integration-icon svg{width:26px;height:26px}.nerdsnap-status-title .card-header{gap:8px}.nerdsnap-status-title h2{font-size:15px}.nerdsnap-status-card .info-note{gap:8px;padding:10px;font-size:11px}.nerdsnap-connection-list>div{min-height:44px;padding:6px 0}}

/* Keep the Family Hub title on its own readable row on phones. The security
   and personal-briefing controls form a compact second row instead of
   squeezing the title into the same grid column. */
@media(max-width:620px){
  .family-hub-page .family-hub-heading{display:flex;flex-direction:column;align-items:stretch;gap:7px}
  .family-hub-page .family-hub-heading-title{width:100%;align-items:center;gap:8px}
  .family-hub-page .family-hub-heading-title>div{flex:1 1 auto;min-width:0}
  .family-hub-page .family-hub-heading-title .eyebrow{display:block;margin-bottom:2px}
  .family-hub-page .family-hub-heading-title h1{white-space:nowrap;overflow-wrap:normal}
  .family-hub-page .family-hub-heading-actions{display:flex;width:100%;min-width:0}
  .family-hub-page .family-hub-private-card{display:grid;grid-template-columns:24px minmax(0,1fr) minmax(0,auto);align-self:stretch;align-items:center;width:100%;min-width:0;box-sizing:border-box;gap:6px;padding:5px 8px}
  .family-hub-page .family-hub-private-card>span:nth-child(2){min-width:0}
  .family-hub-page .family-hub-private-card strong{white-space:normal}
  .family-hub-page .family-hub-private-card .family-hub-personal-briefing{min-width:0;min-height:44px;justify-content:center;gap:4px;padding:5px 6px;font-size:8px;line-height:1.15;text-align:center;white-space:normal}
  .family-hub-page .family-hub-private-card .family-hub-personal-briefing>span{min-width:0;overflow-wrap:anywhere}
}
@media(max-height:500px) and (orientation:landscape) and (max-width:900px){
  .family-hub-page .family-hub-heading-actions{min-width:0}
  .family-hub-page .family-hub-private-card .family-hub-personal-briefing{min-height:44px}
}


/* Family Photos V2 viewer: image-first layout with a compact, independently scrolling details panel. */
html.family-photo-viewer-open, html.family-photo-viewer-open body { overflow: hidden; overscroll-behavior: none; }
dialog#editor.family-photo-viewer-dialog {
  position: fixed;
  inset-block-start: calc(env(safe-area-inset-top, 0px) + (100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) / 2);
  inset-inline-start: 50%; inset-inline-end: auto; inset-block-end: auto;
  translate: -50% -50%; margin: 0;
  width: min(1120px, calc(100vw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px) - 24px));
  max-width: calc(100vw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px) - 24px);
  max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 24px);
  overflow: hidden; padding: 12px;
}
dialog#editor.family-photo-viewer-dialog .family-photo-viewer { display: flex; flex-direction: column; gap: 10px; min-width: 0; max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 48px); overflow: hidden; }
dialog#editor.family-photo-viewer-dialog .family-photo-viewer>.dialog-heading { flex: 0 0 auto; min-width: 0; gap: 10px; margin: 0; }
.family-photo-viewer-title { flex: 1 1 auto; min-width: 0; }
.family-photo-viewer-title h2 { display: -webkit-box; min-width: 0; max-width: 100%; overflow: hidden; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; font-size: clamp(16px, 2.5vw, 20px); line-height: 1.25; }
.family-photo-viewer-close { flex: 0 0 44px; width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 0; display: grid; place-items: center; }
.family-photo-viewer-close svg { width: 20px; height: 20px; }
dialog#editor.family-photo-viewer-dialog .family-photo-viewer-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 300px); align-items: start; gap: 12px; flex: 1 1 auto; min-width: 0; min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.family-photo-image-stage { display: grid; place-items: center; min-width: 0; min-height: 0; height: min(66dvh, 700px); max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 132px); overflow: hidden; border: 1px solid rgba(140,160,220,.12); border-radius: 12px; background: #080d18; }
.family-photo-original { display: block; width: 100%; height: 100%; max-width: 100%; max-height: 100%; margin: auto; object-fit: contain; border-radius: 10px; background: transparent; }
dialog#editor.family-photo-viewer-dialog .family-photo-details { align-self: start; min-width: 0; max-width: 100%; padding: 0; overflow: hidden; }
.family-photo-details>summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 48px; padding: 8px 11px; color: #e9edff; font-size: 13px; font-weight: 700; cursor: pointer; list-style: none; }
.family-photo-details>summary::-webkit-details-marker { display: none; }
.family-photo-details>summary:after { content: '+'; flex: 0 0 auto; color: #c9b7ff; font-size: 18px; }
.family-photo-details[open]>summary:after { content: '−'; }
.family-photo-details-hint { min-width: 0; color: #9eabc9; font-size: 10px; font-weight: 500; text-align: right; }
.family-photo-details-content { min-width: 0; max-width: 100%; max-height: min(62dvh, 620px); overflow: auto; overscroll-behavior: contain; padding: 0 10px 10px; }
.family-photo-metadata { margin: 2px 0 10px; color: #9eabc9; font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.family-photo-details form { min-width: 0; max-width: 100%; }
.family-photo-details label { min-width: 0; }
.family-photo-details input:not([type=checkbox]), .family-photo-details select, .family-photo-details textarea { box-sizing: border-box; min-width: 0; max-width: 100%; }
.family-photo-details textarea { min-height: 72px; max-height: 160px; resize: vertical; overflow-wrap: anywhere; }
.family-photo-album-checks { min-width: 0; max-width: 100%; }
.family-photo-album-checks label { min-width: 0; }
.family-photo-album-checks label span { min-width: 0; overflow-wrap: anywhere; }
.family-photo-details .form-actions { display: grid; grid-template-columns: minmax(0,1fr); gap: 8px; margin-top: 10px; }
.family-photo-details .form-actions .button { box-sizing: border-box; width: 100%; min-width: 0; min-height: 44px; white-space: normal; overflow-wrap: anywhere; }
.family-photo-viewer-dialog [data-close]:focus-visible, .family-photo-details summary:focus-visible, .family-photo-details .button:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
@media (max-width: 700px) {
  dialog#editor.family-photo-viewer-dialog { padding: 10px; }
  dialog#editor.family-photo-viewer-dialog .family-photo-viewer { gap: 8px; max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 44px); }
  dialog#editor.family-photo-viewer-dialog .family-photo-viewer-body { grid-template-columns: minmax(0,1fr); gap: 8px; }
  .family-photo-image-stage { width: 100%; height: min(48dvh, 480px); max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 160px); min-height: 150px; }
  .family-photo-details { width: 100%; }
  .family-photo-details-content { max-height: min(48dvh, 420px); padding-inline: 9px; }
  .family-photo-viewer-title h2 { -webkit-line-clamp: 2; line-clamp: 2; }
}
@media (max-height: 520px) {
  dialog#editor.family-photo-viewer-dialog { padding: 8px; }
  dialog#editor.family-photo-viewer-dialog .family-photo-viewer { gap: 6px; max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 40px); }
  .family-photo-image-stage { height: min(40dvh, 280px); max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 136px); min-height: 118px; }
  .family-photo-details>summary { min-height: 44px; }
}


.family-hub-page .family-hub-private-card .family-hub-personal-briefing{min-height:44px}