:root{--bg:#f3f7fd;--surface:#fff;--surface2:#edf4ff;--text:#102848;--muted:#71839e;--line:#d8e5f5;--primary:#1769e0;--primary2:#55a7ff;--danger:#d83a3a;--shadow:0 14px 38px rgba(30,75,130,.10)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}.app-shell{max-width:1320px;margin:auto;padding:18px 22px 110px}.card{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow)}.topbar{position:sticky;top:12px;z-index:25;min-height:88px;border-radius:24px;padding:14px 16px;display:grid;grid-template-columns:minmax(250px,1fr) auto auto;align-items:center;gap:18px}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-mark{width:52px;height:52px;border-radius:17px;background:linear-gradient(145deg,var(--primary),#3186f2);display:grid;place-items:center;color:#fff;font-size:24px;font-weight:850;box-shadow:0 10px 24px rgba(23,105,224,.25);overflow:hidden}.brand-mark.has-photo{background-size:cover;background-position:center;color:transparent}.avatar-picker{cursor:pointer}.brand-copy h1{margin:0;font-size:21px}.brand-copy p{margin:3px 0 0;color:var(--muted);font-size:12px}.header-filters{display:flex;align-items:center;gap:8px}.segmented{display:flex;background:var(--surface2);border-radius:13px;padding:4px}.segmented button,.text-btn{border:0;background:transparent;padding:9px 13px;border-radius:10px;color:var(--muted);cursor:pointer;font-weight:650}.segmented button.active,.text-btn.active{background:var(--surface);color:var(--primary);box-shadow:0 3px 12px rgba(23,105,224,.12)}select,input[type=search]{height:42px;border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:0 12px;color:var(--text);font:inherit}.header-filters select{max-width:170px}.top-actions{display:flex;align-items:center;gap:7px}.icon-btn{border:1px solid var(--line);background:var(--surface);width:42px;height:42px;border-radius:13px;color:var(--text);cursor:pointer}.role-badge{padding:8px 10px;border-radius:11px;background:var(--surface2);color:var(--primary);font-size:11px;font-weight:800;white-space:nowrap}.collection-head{display:flex;align-items:end;justify-content:space-between;gap:18px;padding:34px 4px 18px}.collection-head h2{font-size:34px;letter-spacing:-.03em;margin:0}.collection-head p{margin:5px 0 0;color:var(--muted)}.collection-head input{width:min(390px,100%)}.timeline{display:grid;gap:32px}.age-group{display:grid;gap:15px}.age-header{display:flex;align-items:center;justify-content:space-between;padding:0 4px}.age-header h2{font-size:29px;margin:0}.age-header-actions{display:flex;align-items:center;gap:9px}.age-header span{color:var(--muted)}.season-group{display:grid;gap:12px}.season-cover{background:linear-gradient(120deg,#e8f2ff,#f9fcff);border:1px solid var(--line);padding:16px 18px;border-radius:18px;display:flex;align-items:center;justify-content:space-between}.season-cover h3{margin:0;font-size:22px}.season-actions{display:flex;align-items:center;gap:10px}.season-cover span{color:var(--muted);font-size:13px}.album-delete{border:0;background:#ffe8e8;color:#a52b2b;border-radius:10px;padding:8px 10px;cursor:pointer;font-weight:700}.day-group{display:grid;gap:9px}.day-title{font-size:14px;color:var(--muted);font-weight:700;padding-left:3px}.media-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:215px;gap:10px}.media-card{position:relative;border:0;border-radius:18px;overflow:hidden;padding:0;background:#dce7f4;cursor:pointer}.media-card:nth-child(8n+1){grid-column:span 2;grid-row:span 2}.media-card img,.media-card video{width:100%;height:100%;object-fit:cover;display:block}.media-overlay{position:absolute;inset:auto 0 0;padding:36px 11px 10px;background:linear-gradient(transparent,rgba(6,24,49,.72));color:#fff;text-align:left;font-size:12px}.media-badge{position:absolute;top:10px;right:10px;background:rgba(7,31,64,.62);color:#fff;padding:6px 8px;border-radius:9px;font-size:12px}.favorite-dot{position:absolute;top:10px;left:10px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.92);color:#ffb000;font-size:19px}.select-check{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:50%;background:#fff;border:2px solid #bdd2ec;display:grid;place-items:center;z-index:3}.media-card.selected .select-check{background:var(--primary);border-color:var(--primary);color:#fff}.selection-bar{position:sticky;top:112px;z-index:20;margin-bottom:18px;padding:12px 14px;border-radius:16px;background:#0d315f;color:#fff;display:flex;align-items:center;justify-content:space-between;box-shadow:var(--shadow)}.selection-bar>div{display:flex;gap:8px}.empty{text-align:center;padding:64px 25px;border-radius:22px}.empty-icon{font-size:50px;color:var(--primary2)}.empty h3{font-size:27px;margin:12px 0 8px}.empty p{color:var(--muted)}.fab{position:fixed;right:28px;bottom:26px;z-index:35;width:64px;height:64px;border:0;border-radius:50%;background:linear-gradient(145deg,var(--primary),#348af2);color:#fff;font-size:38px;line-height:1;box-shadow:0 16px 36px rgba(23,105,224,.35);cursor:pointer}.upload-sheet{position:fixed;inset:0;z-index:60}.sheet-backdrop{position:absolute;inset:0;border:0;background:rgba(4,20,42,.52)}.sheet-panel{position:absolute;right:22px;bottom:22px;width:min(470px,calc(100% - 24px));background:var(--surface);border:1px solid var(--line);border-radius:27px;padding:14px;box-shadow:0 26px 70px rgba(4,26,57,.32);display:grid;gap:10px}.sheet-handle{width:42px;height:4px;border-radius:10px;background:var(--line);margin:0 auto 2px}.sheet-title{display:flex;align-items:center;justify-content:space-between;padding:3px 3px 6px}.sheet-title h3{margin:0}.action-card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:15px;display:flex;align-items:center;gap:13px;cursor:pointer}.primary-action{background:linear-gradient(145deg,var(--primary),#2d82ee);color:#fff;border-color:transparent}.action-icon{width:44px;height:44px;border-radius:14px;background:var(--surface2);color:var(--primary);display:grid;place-items:center;font-size:24px}.primary-action .action-icon{background:rgba(255,255,255,.18);color:#fff}.action-card div{display:grid;gap:3px}.action-card small{color:var(--muted);font-size:12px}.primary-action small{color:#dbeaff}.hidden{display:none!important}.primary-btn,.secondary-btn,.danger-btn{border:0;border-radius:13px;padding:12px 15px;font-weight:750;cursor:pointer}.primary-btn{background:var(--primary);color:#fff}.secondary-btn{background:var(--surface2);color:var(--text)}.danger-btn{background:#ffe9e9;color:#a52b2b;width:100%;margin-top:10px}.danger-btn.compact{width:auto;margin:0}.full{width:100%;margin-top:9px}.auth-screen{position:fixed;inset:0;z-index:100;background:linear-gradient(145deg,#dcecff,#f8fbff 52%,#cfe5ff);display:grid;place-items:center;padding:20px}.auth-card{width:min(430px,100%);background:#fff;border:1px solid #d9e7f8;border-radius:30px;padding:34px;box-shadow:0 24px 70px rgba(26,84,157,.2)}.auth-card h2{font-size:34px;margin:8px 0}.auth-card>p{color:#667892}.auth-card form{display:grid;gap:14px;margin-top:22px}.auth-card label{display:grid;gap:7px;font-size:13px;font-weight:700}.auth-card input{height:48px;border:1px solid #d9e5f6;border-radius:13px;padding:0 14px}.login-error{min-height:20px;color:#c53b3b;font-size:13px}.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:800;color:var(--primary)}.locked{filter:blur(4px);pointer-events:none;user-select:none}dialog{width:min(1100px,96vw);height:min(850px,94vh);border:0;padding:0;border-radius:24px;background:#071a34;color:#fff;overflow:hidden}dialog::backdrop{background:rgba(3,14,30,.86)}#viewerMedia{height:calc(100% - 120px);display:grid;place-items:center;background:#031025}#viewerMedia img,#viewerMedia video{max-width:100%;max-height:100%;object-fit:contain}.viewer-close{position:absolute;right:14px;top:14px;z-index:4;border:0;background:rgba(0,0,0,.5);color:#fff;width:42px;height:42px;border-radius:50%;font-size:27px}.viewer-nav{position:absolute;top:45%;z-index:3;border:0;background:rgba(0,0,0,.42);color:#fff;width:48px;height:64px;font-size:38px}.viewer-nav.prev{left:10px}.viewer-nav.next{right:10px}.viewer-info{height:120px;padding:16px 22px;display:grid;grid-template-columns:1fr auto;gap:8px 20px;align-items:center}.viewer-info div{display:flex;gap:12px}.viewer-info span{color:#a9bdd8;font-size:13px}.viewer-info p{grid-column:1;margin:0;color:#dce8f8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.viewer-info button{grid-column:2;grid-row:1/3;border:1px solid #42658d;background:transparent;color:#fff;border-radius:12px;padding:10px 14px}.confirm-dialog{width:min(560px,92vw);height:auto;background:var(--surface);color:var(--text)}.confirm-content{padding:28px}.dialog-title{display:flex;align-items:center;justify-content:space-between}.dialog-title h3{margin:0;font-size:25px}.settings-section{margin-top:22px}.settings-section h4{margin:0 0 10px}.sync-card{padding:15px;border:1px solid var(--line);border-radius:16px;display:grid;grid-template-columns:1fr auto;gap:10px}.sync-card p{margin:4px 0 0;color:var(--muted);font-size:13px}.sync-badge{background:#e5f1ff;color:var(--primary);padding:7px 10px;border-radius:10px;font-size:12px;font-weight:750}.progress{grid-column:1/-1;height:7px;background:#e9f0f9;border-radius:20px;overflow:hidden}.progress div{height:100%;width:0;background:linear-gradient(90deg,var(--primary),var(--primary2))}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.stat{padding:13px;border:1px solid var(--line);border-radius:14px;display:grid;gap:3px}.stat span{color:var(--muted);font-size:12px}.stat strong{font-size:24px}.access-list{display:grid;gap:8px}.access-list div{padding:12px;border:1px solid var(--line);border-radius:13px;display:grid;gap:3px}.access-list span{color:var(--muted);font-size:12px}.confirm-icon{width:58px;height:58px;border-radius:20px;background:var(--surface2);color:var(--primary);display:grid;place-items:center;margin:0 auto 16px;font-size:30px}.confirm-content>h3,.confirm-content>p{text-align:center}.confirm-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}body.dark{--bg:#061426;--surface:#0d213b;--surface2:#142d4d;--text:#eef6ff;--muted:#9db0ca;--line:#203b5d;--shadow:0 16px 45px rgba(0,0,0,.24)}body.dark .season-cover{background:linear-gradient(120deg,#102c4e,#0d213b)}.role-viewer .fab,.role-viewer .admin-only{display:none!important}.role-member .admin-only{display:none!important}.role-viewer .viewer-info button,.role-viewer .favorite-dot{display:none}
@media(max-width:1050px){.topbar{grid-template-columns:1fr auto}.header-filters{grid-column:1/-1;order:3}.header-filters select{flex:1;max-width:none}.role-badge{display:none}}
@media(max-width:720px){.app-shell{padding:10px 10px 100px}.topbar{top:8px;border-radius:20px;padding:11px;gap:10px}.brand-mark{width:46px;height:46px}.brand-copy p{font-size:11px}.top-actions .text-btn{display:none}.header-filters{overflow-x:auto;padding-bottom:2px}.header-filters select{min-width:145px}.collection-head{display:grid;padding:24px 2px 14px}.collection-head h2{font-size:28px}.collection-head input{width:100%}.media-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:165px}.media-card:nth-child(8n+1){grid-column:span 2;grid-row:span 1}.fab{right:18px;bottom:18px;width:58px;height:58px}.sheet-panel{right:12px;bottom:12px}.stats-grid{grid-template-columns:repeat(2,1fr)}.selection-bar{top:155px}.age-header h2{font-size:25px}.season-cover h3{font-size:19px}}

/* v5 premium interface refinements */
:root{--bg:#f5f8fc;--surface:rgba(255,255,255,.94);--surface2:#eef4fb;--line:#dbe6f2;--shadow:0 18px 48px rgba(34,72,118,.09)}
body{background:radial-gradient(circle at 20% 0,#eef5ff 0,transparent 35%),var(--bg)}
.topbar{grid-template-columns:minmax(245px,1fr) auto auto;min-height:82px;border-radius:22px;padding:12px 14px;backdrop-filter:blur(18px);box-shadow:0 12px 36px rgba(36,74,121,.08)}
.brand-mark{border-radius:15px;box-shadow:0 10px 25px rgba(23,105,224,.22)}
.header-filters{background:var(--surface2);padding:4px;border-radius:15px}
.header-filters select{background:transparent;border-color:transparent;font-weight:650}
.segmented{background:transparent;padding:0}
.segmented button.active{box-shadow:0 4px 14px rgba(23,105,224,.13)}
.top-actions{justify-content:flex-end}.top-actions .icon-btn{border-color:transparent;background:var(--surface2)}
.favorite-header-btn{font-size:23px;line-height:1;color:#7589a5}.favorite-header-btn.active{color:#e04b68;background:#fff0f4;border-color:#ffd4df}
.role-badge{background:#eaf3ff;border:1px solid #d9e9fb;font-size:11px}
.collection-head{align-items:center;padding-top:30px}.collection-head h2{font-size:32px}.collection-tools{display:flex;align-items:center;gap:10px}.collection-tools input{width:min(360px,48vw)}
.selection-trigger{white-space:nowrap;border:1px solid var(--line);background:var(--surface)}
.season-cover{background:linear-gradient(120deg,rgba(228,240,255,.95),rgba(255,255,255,.95));box-shadow:0 8px 24px rgba(47,88,137,.05)}
.media-grid{gap:12px}.media-card{border-radius:20px;box-shadow:0 8px 24px rgba(32,64,103,.08);transition:transform .2s ease,box-shadow .2s ease}.media-card:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(32,64,103,.14)}
.day-title{font-size:13px;letter-spacing:.01em;color:#657a96;padding:2px 4px 0}
.favorite-dot{color:#e04b68;background:rgba(255,255,255,.94);box-shadow:0 6px 18px rgba(26,54,89,.18)}
.setting-field{display:grid;gap:7px;font-size:13px;font-weight:750}.setting-field input{height:44px;border:1px solid var(--line);border-radius:12px;padding:0 12px;background:var(--surface);color:var(--text);font:inherit}.setting-hint{font-size:12px;color:var(--muted);margin:7px 0 0}
@media(max-width:1050px){.collection-tools{width:100%}.collection-tools input{flex:1;width:auto}}
@media(max-width:720px){.collection-head{gap:14px}.collection-tools{display:grid;grid-template-columns:1fr auto}.collection-tools input{width:100%}.selection-trigger{padding-inline:12px}.favorite-header-btn{display:inline-grid!important}.top-actions{gap:5px}.role-badge{display:none}}

/* v6 mobile and premium refinements */
.collection-head.compact-head{padding:12px 2px 10px;display:block}.collection-head .collection-titles{display:none}
.collection-tools{display:flex;justify-content:space-between;gap:10px}.collection-tools input{flex:1;min-width:0}
.topbar{grid-template-columns:minmax(220px,1fr) auto auto;gap:12px}
.top-actions{gap:8px}.top-actions .icon-btn{display:grid;place-items:center;font-size:22px}
.favorite-header-btn{font-size:28px;line-height:1;display:grid;place-items:center}
.header-filters{display:flex;align-items:center;gap:8px;background:var(--surface2);padding:4px;border-radius:16px;flex-wrap:nowrap}
.header-filters.hidden,.hidden{display:none!important}
.header-filters select{min-width:150px}
.season-cover{display:grid;grid-template-columns:88px 1fr auto;gap:14px;align-items:center}
.season-thumb{width:88px;height:88px;border-radius:18px;overflow:hidden;background:#dce7f4;box-shadow:0 10px 24px rgba(32,64,103,.08)}
.season-thumb img{width:100%;height:100%;object-fit:cover;display:block}.season-copy{display:grid;gap:4px;min-width:0}.season-copy h3{margin:0}.season-copy span{color:var(--muted);font-size:13px}
.standalone-season{gap:10px}
.fav-chip{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:12px;border:0;background:rgba(255,255,255,.94);display:grid;place-items:center;z-index:3;color:#7f91ab;font-size:20px;box-shadow:0 8px 16px rgba(18,42,78,.16)}
.fav-chip.active{color:#e1486b;background:#fff1f4}
.media-card .media-badge{right:10px;top:auto;bottom:54px}
.media-card .select-check{right:52px}
.media-card.selected{outline:3px solid rgba(23,105,224,.25)}
.fab{width:62px;height:62px;border-radius:20px;right:16px;bottom:calc(env(safe-area-inset-bottom, 0px) + 16px);line-height:1;display:grid;place-items:center;font-size:40px;box-shadow:0 18px 40px rgba(23,105,224,.34);transform:translateZ(0)}
.role-badge{display:none!important}
.session-card{padding:12px;border:1px solid var(--line);border-radius:13px;display:grid;gap:4px;background:var(--surface2)}
.photo-action-list{display:grid;gap:10px;margin-top:16px}
#deletePhotoBtn[disabled]{opacity:.55;cursor:not-allowed}
body.season-filter-hidden #seasonFilter{display:none!important}

@media(max-width:1050px){
  .topbar{grid-template-columns:1fr auto;align-items:start}
  .header-filters{grid-column:1/-1;order:3;max-width:100%;overflow-x:auto;scrollbar-width:none}
  .header-filters::-webkit-scrollbar{display:none}
  .top-actions{justify-self:end}
}

@media(max-width:720px){
  .app-shell{padding:10px 10px 96px}
  .topbar{top:8px;border-radius:22px;padding:12px;grid-template-columns:1fr auto;gap:10px}
  .brand{min-width:0;align-items:center}
  .brand-mark{width:58px;height:58px;border-radius:18px;font-size:29px;flex:none}
  .brand-copy{min-width:0}.brand-copy h1{font-size:19px;line-height:1.1}.brand-copy p{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .top-actions{gap:8px;align-self:start}
  .top-actions .icon-btn{width:46px;height:46px;border-radius:16px}
  .favorite-header-btn{font-size:30px}
  .header-filters{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:auto;gap:8px;padding:0;background:transparent}
  .header-filters .segmented{grid-column:1/-1;background:var(--surface2);padding:4px;border-radius:16px}
  .header-filters select{min-width:0;width:100%;height:44px;border-radius:14px;background:var(--surface2);border-color:transparent;font-size:16px}
  .collection-head.compact-head{padding-top:8px}
  .collection-tools{display:grid;grid-template-columns:1fr auto;gap:8px}
  .selection-trigger{padding:0 14px;height:48px;border-radius:14px}
  .collection-tools input{height:48px;border-radius:16px;font-size:16px}
  .age-header{padding-top:4px}.age-header h2{font-size:24px}
  .season-cover{grid-template-columns:74px 1fr;gap:12px;padding:14px}.season-actions{grid-column:1/-1;justify-content:flex-end}
  .season-thumb{width:74px;height:74px;border-radius:16px}
  .season-copy h3{font-size:22px}
  .day-title{font-size:13px;line-height:1.3;padding-left:1px}
  .media-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:168px;gap:10px}
  .media-card:nth-child(8n+1){grid-column:span 2;grid-row:span 1}
  .media-card{border-radius:20px}
  .media-overlay{font-size:11px;padding:32px 10px 10px}
  .fav-chip{width:36px;height:36px;border-radius:13px;font-size:21px}
  .selection-bar{top:150px;border-radius:16px;display:grid;gap:10px}
  .selection-bar>div{justify-content:flex-end}
  dialog{width:min(96vw,1100px);height:min(92vh,850px)}
}

/* v7 reference-matched gallery layout */
.app-shell{max-width:1480px;padding-top:14px}
.topbar{min-height:76px;grid-template-columns:minmax(250px,1fr) auto auto;border-radius:24px;padding:12px 16px}
.header-filters{background:transparent;padding:0;border-radius:0}
.header-filters .segmented{background:transparent}
.header-filters select{height:46px;padding:0 40px 0 16px;border:1px solid var(--line);border-radius:14px;background:var(--surface);font-weight:700}
.top-actions .icon-btn{width:46px;height:46px;border:1px solid var(--line);background:var(--surface);border-radius:15px}
.favorite-header-btn{font-family:Arial,sans-serif;font-size:27px;font-weight:400}
.gallery-toolbar{display:none}
.gallery-toolbar select{height:44px;min-width:170px;border:1px solid var(--line);border-radius:13px;padding:0 38px 0 14px;background:var(--surface);color:var(--text);font:inherit;font-weight:650}
.view-switch{display:flex;border:1px solid var(--line);border-radius:13px;overflow:hidden;background:var(--surface)}
.view-switch button{width:48px;height:42px;border:0;border-right:1px solid var(--line);background:transparent;color:var(--muted);font-size:22px;cursor:pointer}.view-switch button:last-child{border-right:0}.view-switch button.active{background:#eaf3ff;color:var(--primary)}
.timeline{display:grid;gap:22px}
.season-group{background:transparent}
.season-cover{min-height:160px;grid-template-columns:360px 1fr 34px;padding:0;overflow:hidden;border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:0 12px 34px rgba(34,72,118,.07)}
.season-thumb{width:100%;height:160px;border-radius:0;box-shadow:none}.season-thumb img{object-fit:cover}
.season-copy{padding:24px 28px;align-content:center}.season-copy h3{font-size:28px}.season-copy span{font-size:15px}
.season-actions{padding-right:18px}.album-delete{display:none}
.day-group{margin-top:14px}.day-title{font-size:14px;font-weight:650;margin-bottom:10px}
.media-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:310px;gap:16px}
.media-card:nth-child(8n+1){grid-column:span 1;grid-row:span 1}
.media-card{border-radius:20px}.media-card img,.media-card video{object-fit:cover}
.media-overlay{opacity:0;transition:opacity .2s ease}.media-card:hover .media-overlay{opacity:1}
.fab{width:44px;height:44px;border-radius:13px;font-size:28px;right:24px;bottom:24px;box-shadow:0 12px 28px rgba(23,105,224,.32)}
body.list-layout .media-grid{grid-template-columns:1fr;grid-auto-rows:180px}
body.list-layout .media-card{display:grid;grid-template-columns:260px 1fr;background:var(--surface)}
body.list-layout .media-card img,body.list-layout .media-card video{width:260px}
body.list-layout .media-overlay{position:relative;opacity:1;background:none;color:var(--text);display:flex;align-items:center;font-weight:650}

@media(max-width:720px){
  .app-shell{padding:8px 8px 86px}
  .topbar{position:sticky;top:6px;grid-template-columns:1fr auto;padding:12px;border-radius:22px;gap:12px}
  .brand-mark{width:54px;height:54px}.brand-copy h1{font-size:22px}.brand-copy p{font-size:11px}
  .top-actions .icon-btn{width:44px;height:44px;border-radius:14px}
  .header-filters{grid-column:1/-1;display:grid;grid-template-columns:1fr auto;gap:10px;overflow:visible}
  .header-filters .segmented{min-width:0;background:var(--surface2);padding:4px;border-radius:15px}
  .header-filters select{width:100%;min-width:138px;height:46px;background:var(--surface);font-size:15px}
  .gallery-toolbar{margin:12px 0 14px;padding:8px 10px;border-radius:16px}
  .gallery-toolbar select{height:42px;min-width:148px;font-size:14px}
  .view-switch button{width:44px;height:40px}
  .season-cover{min-height:0;display:grid;grid-template-columns:1fr;border-radius:20px;overflow:hidden}
  .season-thumb{height:220px;grid-row:2}.season-copy{padding:18px 18px 10px}.season-copy h3{font-size:25px}.season-actions{display:none}
  .day-title{font-size:13px;margin:10px 2px}
  .media-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:190px;gap:8px}
  .media-card:nth-child(8n+1){grid-column:span 2;grid-row:span 1}
  .media-card{border-radius:16px}.fav-chip{top:8px;right:8px;width:32px;height:32px;border-radius:11px;font-size:19px}
  .fab{position:fixed;width:42px;height:42px;border-radius:12px;right:14px;bottom:calc(env(safe-area-inset-bottom,0px) + 14px);font-size:27px}
  body.list-layout .media-grid{grid-template-columns:1fr;grid-auto-rows:120px}
  body.list-layout .media-card{grid-template-columns:130px 1fr}
  body.list-layout .media-card img,body.list-layout .media-card video{width:130px}
}
.password-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.setting-message{min-height:20px;margin:8px 0 0;font-size:13px}.setting-message.success{color:#087a45}.setting-message.error{color:#b42318}@media(max-width:640px){.password-grid{grid-template-columns:1fr}}


/* v11 header optimization and premium iconography */
body{font-family:Inter,ui-rounded,"SF Pro Display","Segoe UI",system-ui,-apple-system,sans-serif;letter-spacing:-.01em}
.avatar-picker{appearance:none;border:0;background:transparent;padding:0;cursor:pointer;display:flex;align-items:center}
.brand-copy h1{font-size:22px;font-weight:800;letter-spacing:-.03em}
.brand-copy p{font-size:12px;letter-spacing:-.01em}
.topbar{grid-template-columns:minmax(240px,1fr) auto auto;gap:14px}
.top-actions{display:flex;align-items:center;gap:10px;justify-self:end}
.icon-btn,.view-switch button{display:grid;place-items:center}
.icon-btn svg,.view-switch button svg{width:20px;height:20px;display:block;fill:currentColor}
.favorite-header-btn{color:#7a8ea9}
.favorite-header-btn.active,.favorite-header-btn[aria-pressed="true"]{color:#e1486b}
.header-view-switch{background:var(--surface);border:1px solid var(--line);border-radius:15px;overflow:hidden;box-shadow:0 8px 20px rgba(34,72,118,.05)}
.header-view-switch button{width:44px;height:44px;border:0;background:transparent;color:var(--muted);border-right:1px solid var(--line)}
.header-view-switch button:last-child{border-right:0}
.header-view-switch button.active{background:#eaf3ff;color:var(--primary)}
.gallery-toolbar{display:none!important}
.sheet-panel .action-card{width:100%;text-align:left;border:1px solid var(--line)}
.sheet-panel .action-card{border:1px solid var(--line)}
.sheet-panel button.action-card{font:inherit}
.sheet-title .icon-btn{font-size:22px}
.fab{display:grid;place-items:center;font-weight:500}
@media(max-width:1050px){
  .topbar{grid-template-columns:1fr auto;gap:10px}
  .header-filters{grid-column:1/-1;order:3}
}
@media(max-width:720px){
  .topbar{grid-template-columns:1fr auto;gap:10px;padding:12px 12px 10px}
  .brand-mark{width:52px;height:52px;border-radius:17px}
  .brand-copy h1{font-size:20px}
  .brand-copy p{font-size:11px}
  .top-actions{gap:8px;align-self:start}
  .icon-btn,.header-view-switch button{width:42px;height:42px;border-radius:14px}
  .header-filters{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .header-filters .segmented{grid-column:1/-1}
  .header-filters select{width:100%;min-width:0;max-width:none}
}


/* v12 premium header and upload reliability */
body{font-family:Manrope,Inter,ui-rounded,"SF Pro Display","Segoe UI",system-ui,-apple-system,sans-serif;letter-spacing:-.012em;background:linear-gradient(180deg,#f2f7ff 0%, #eef5ff 28%, #f5f8fd 100%)}
.topbar.card{background:linear-gradient(135deg,rgba(220,236,255,.96) 0%, rgba(237,245,255,.96) 38%, rgba(226,240,255,.98) 100%);border:1px solid rgba(183,209,241,.85);box-shadow:0 18px 44px rgba(54,102,164,.12), inset 0 1px 0 rgba(255,255,255,.6)}
.brand-mark{border-radius:18px;background:linear-gradient(145deg,#3a87ef,#1769e0 55%,#66b0ff);box-shadow:0 12px 26px rgba(23,105,224,.22)}
.brand-copy h1{font-size:22px;font-weight:800;letter-spacing:-.035em}
.brand-copy p{font-size:12px;color:#617a9b;font-weight:600}
.header-filters{display:flex;align-items:center;gap:10px;flex-wrap:nowrap;min-width:0}
.header-filters .segmented{background:rgba(255,255,255,.55);backdrop-filter:blur(10px);border:1px solid rgba(190,212,240,.75);box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
.header-filters select{background:rgba(255,255,255,.82);border:1px solid rgba(190,212,240,.9);box-shadow:0 8px 20px rgba(72,108,156,.06);font-weight:700}
.top-actions{gap:12px}
.icon-btn{background:rgba(255,255,255,.86);border:1px solid rgba(190,212,240,.9);box-shadow:0 8px 20px rgba(72,108,156,.06)}
.favorite-header-btn{order:2;color:#7e90a8;flex:none}
.favorite-header-btn.active,.favorite-header-btn[aria-pressed="true"]{color:#e1486b;background:#fff5f7;border-color:#f2c7d4}
.header-view-switch{background:rgba(255,255,255,.82);border:1px solid rgba(190,212,240,.9);box-shadow:0 8px 20px rgba(72,108,156,.06)}
.header-view-switch button.active{background:#ffffff;color:var(--primary);box-shadow:0 6px 16px rgba(44,96,162,.08) inset}
.season-thumb.empty{position:relative;display:grid;place-items:center;background:linear-gradient(145deg,#edf5ff,#d9e9ff);border-radius:24px;overflow:hidden}
.season-thumb.empty::before{content:"";width:64px;height:64px;border-radius:20px;background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(225,238,255,.9));box-shadow:0 14px 28px rgba(77,120,178,.15);position:absolute}
.season-thumb.empty::after{content:"";width:30px;height:22px;border-radius:10px;background:linear-gradient(145deg,#91b9ef,#5e96e3);position:absolute;box-shadow:0 -12px 0 -5px #cbe0fb inset}
.empty-icon{width:72px;height:72px;margin:0 auto;border-radius:22px;background:linear-gradient(145deg,#e7f1ff,#d9e9ff);display:grid;place-items:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.fab{z-index:45}
.upload-sheet.hidden{display:none!important}
.upload-sheet{z-index:80}
.sheet-panel{background:linear-gradient(180deg,#ffffff 0%,#f9fbff 100%)}
@media(max-width:1100px){
  .topbar{grid-template-columns:1fr auto;align-items:start}
  .header-filters{grid-column:1/-1;order:3;flex-wrap:wrap}
}
@media(max-width:720px){
  .topbar.card{background:linear-gradient(160deg,rgba(222,237,255,.98) 0%, rgba(239,246,255,.98) 54%, rgba(226,239,255,.98) 100%)}
  .header-filters{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px}
  .header-filters .segmented{grid-column:1 / span 2}
  .favorite-header-btn{grid-column:3;grid-row:1;justify-self:end}
  .header-filters select{min-width:0;width:100%}
  .top-actions{gap:8px}
}


/* v13 collapsed season folders */
.season-toggle{width:100%;border:0;padding:0;background:transparent;text-align:left;cursor:pointer}
.season-chevron{display:grid;place-items:center;width:34px;height:34px;border-radius:12px;background:rgba(255,255,255,.86);border:1px solid rgba(190,212,240,.9);font-size:22px;line-height:1;color:var(--primary);font-weight:700;flex:none}
.season-tiles-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:10px}
.season-tile{position:relative;border:1px solid var(--line);border-radius:24px;background:var(--surface);padding:0;overflow:hidden;display:grid;grid-template-columns:180px 1fr auto;align-items:center;min-height:132px;box-shadow:0 12px 28px rgba(34,72,118,.07);cursor:pointer;text-align:left}
.season-tile .season-thumb{width:100%;height:132px;border-radius:0;box-shadow:none}
.season-tile .season-copy{padding:20px 22px}.season-tile .season-copy h3{font-size:22px;margin:0 0 4px}.season-tile .season-copy span{font-size:14px;color:var(--muted)}
.season-tile .tile-chevron{margin-right:18px}
.season-tile.active{border-color:#aecdff;box-shadow:0 16px 34px rgba(34,72,118,.11)}
.season-expanded-panel{display:grid;gap:10px;margin-top:18px}
.season-expanded-title{font-size:24px;font-weight:800;letter-spacing:-.02em;margin:2px 2px 6px}
.standalone-season .day-group,.season-expanded-panel .day-group{margin-top:2px}
#viewerMedia video::-webkit-media-controls-panel{opacity:1}
@media(max-width:720px){
  .season-tiles-grid{grid-template-columns:1fr;gap:12px}
  .season-tile{grid-template-columns:118px 1fr auto;min-height:110px;border-radius:20px}
  .season-tile .season-thumb{height:110px}
  .season-tile .season-copy{padding:14px 14px 14px 16px}
  .season-tile .season-copy h3{font-size:19px}
  .season-tile .tile-chevron{margin-right:12px;width:30px;height:30px;border-radius:10px;font-size:20px}
  .season-expanded-title{font-size:20px}
}


/* v14 calendar years with four seasons */
.calendar-year-group{display:grid;gap:14px;margin-bottom:8px}
.calendar-year-header{display:flex;align-items:center;justify-content:space-between;padding:0 4px}
.calendar-year-header h2{margin:0;font-size:28px;font-weight:800;letter-spacing:-.03em}
.calendar-year-header span{color:var(--muted);font-size:14px;font-weight:650}
.calendar-season-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.calendar-season-tile{position:relative;min-height:190px;border:1px solid var(--line);border-radius:26px;background:var(--surface);padding:0;overflow:hidden;display:grid;grid-template-columns:46% 1fr auto;align-items:center;box-shadow:0 14px 34px rgba(34,72,118,.08);cursor:pointer;text-align:left;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.calendar-season-tile:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(34,72,118,.12);border-color:#b8d4f5}
.calendar-season-tile.active{border-color:#96bff0;box-shadow:0 18px 42px rgba(34,72,118,.14)}
.calendar-season-tile .season-thumb{width:100%;height:190px;border-radius:0;box-shadow:none}
.calendar-season-tile .season-copy{padding:22px 20px;align-content:center}
.calendar-season-tile .season-copy h3{margin:0 0 5px;font-size:23px;line-height:1.15}
.calendar-season-tile .season-copy span{font-size:14px;color:var(--muted)}
.calendar-season-tile .tile-chevron{margin-right:18px}
.calendar-season-tile.empty-tile{cursor:default;background:linear-gradient(145deg,#f8fbff,#eef5ff)}
.calendar-season-tile.empty-tile:hover{transform:none;box-shadow:0 14px 34px rgba(34,72,118,.08);border-color:var(--line)}
.calendar-season-tile.empty-tile .season-thumb.empty{background:linear-gradient(145deg,#edf5ff,#dcecff)}
@media(max-width:720px){
  .calendar-year-header h2{font-size:24px}
  .calendar-season-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .calendar-season-tile{min-height:156px;grid-template-columns:1fr;grid-template-rows:98px auto;border-radius:20px}
  .calendar-season-tile .season-thumb{height:98px;grid-row:1}
  .calendar-season-tile .season-copy{padding:12px 12px 14px}
  .calendar-season-tile .season-copy h3{font-size:17px}
  .calendar-season-tile .season-copy span{font-size:12px}
  .calendar-season-tile .tile-chevron{position:absolute;right:8px;top:8px;margin:0;width:28px;height:28px;border-radius:9px;font-size:18px}
}


/* v15 viewer optimization */
#viewerMedia{position:relative;height:calc(100% - 120px);display:grid;place-items:center;background:#031025;overflow:hidden}
#viewerMedia img,#viewerMedia video{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;display:block}
.viewer-info button#favoriteToggle{grid-column:2;grid-row:1/3;border:1px solid #42658d;background:rgba(255,255,255,.04);color:#fff;border-radius:14px;padding:0;width:54px;height:54px;display:grid;place-items:center}
.viewer-info button#favoriteToggle svg{width:24px;height:24px;fill:currentColor;display:block}
.viewer-info button#favoriteToggle.active{color:#ff5f82;background:rgba(255,95,130,.12);border-color:rgba(255,95,130,.36)}
.like-pulse{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;animation:likePulse .7s ease forwards}
.like-pulse svg{width:112px;height:112px;fill:#fff;filter:drop-shadow(0 10px 22px rgba(0,0,0,.28))}
@keyframes likePulse{0%{opacity:0;transform:scale(.45)}20%{opacity:1;transform:scale(1.1)}100%{opacity:0;transform:scale(1.35)}}
@media(max-width:720px){
  dialog{width:min(100vw,1100px);height:min(100vh,850px);border-radius:18px}
  #viewerMedia{height:calc(100% - 132px)}
  .viewer-info{height:132px;padding:14px 16px;grid-template-columns:1fr auto;gap:8px 14px}
  .viewer-info div{display:grid;gap:4px}
  .viewer-info button#favoriteToggle{width:48px;height:48px;border-radius:13px}
  .like-pulse svg{width:92px;height:92px}
}


/* v16 mobile header, full-photo viewer and direct delete */
.brand-copy h1{font-weight:720;letter-spacing:-.028em}
.brand-copy p{white-space:nowrap;overflow:visible;text-overflow:clip}
.delete-chip{position:absolute;left:10px;top:10px;width:34px;height:34px;border-radius:12px;background:rgba(255,255,255,.94);display:grid;place-items:center;z-index:4;color:#8a99ad;box-shadow:0 8px 16px rgba(18,42,78,.16)}
.delete-chip svg{width:18px;height:18px;fill:currentColor;display:block}
.delete-chip:hover{color:#c43d4f;background:#fff1f3}
.media-card .fav-chip{right:10px;top:10px}
.media-card .delete-chip{left:10px;top:10px}

#viewerMedia{display:flex;align-items:center;justify-content:center;overflow:hidden}
#viewerMedia img,#viewerMedia video{width:auto!important;height:auto!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center center!important;image-orientation:from-image;flex:none}

@media(max-width:720px){
  .app-shell{padding:8px 8px 86px}
  .topbar{grid-template-columns:minmax(0,1fr) auto;padding:10px;border-radius:21px;gap:9px}
  .brand{gap:9px;min-width:0}
  .brand-mark{width:48px;height:48px;border-radius:16px;font-size:24px}
  .brand-copy{min-width:0}
  .brand-copy h1{font-size:18px;font-weight:700;line-height:1.08;white-space:nowrap}
  .brand-copy p{font-size:10.5px;font-weight:560;line-height:1.15;white-space:nowrap;overflow:visible;text-overflow:clip}
  .top-actions{gap:6px;align-self:start}
  .icon-btn,.header-view-switch button{width:40px;height:40px;border-radius:13px}
  .header-view-switch button{width:38px}
  .header-filters{grid-column:1/-1;order:3;display:flex!important;align-items:center;gap:6px;flex-wrap:nowrap!important;overflow-x:auto;overflow-y:hidden;padding:2px 0 1px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .header-filters::-webkit-scrollbar{display:none}
  .header-filters .segmented{display:flex;flex:none;grid-column:auto;padding:3px;border-radius:14px}
  .header-filters .segmented button{padding:8px 11px;font-size:13px;white-space:nowrap}
  .favorite-header-btn{grid-column:auto;grid-row:auto;order:2;flex:0 0 40px;width:40px;height:40px;justify-self:auto}
  .header-filters select{flex:0 0 142px;width:142px;min-width:142px;max-width:142px;height:40px;padding:0 30px 0 11px;border-radius:13px;font-size:13px;white-space:nowrap}
  #seasonFilter{flex-basis:130px;width:130px;min-width:130px;max-width:130px}
  dialog#viewer{width:100dvw!important;height:100dvh!important;max-width:none!important;max-height:none!important;margin:0;border-radius:0}
  #viewerMedia{height:calc(100dvh - 132px)!important;min-height:0;padding:0 4px}
  #viewerMedia img,#viewerMedia video{max-width:100%!important;max-height:100%!important;width:auto!important;height:auto!important;object-fit:contain!important}
  .viewer-info{height:132px}
  .delete-chip{left:8px;top:8px;width:32px;height:32px;border-radius:11px}
  .delete-chip svg{width:17px;height:17px}
}


/* v17 premium 2x2 season tiles — design variant 1 */
.calendar-season-grid{gap:18px}
.calendar-season-tile.premium-season-tile{
  position:relative;
  min-height:300px;
  display:block;
  border:0;
  border-radius:28px;
  overflow:hidden;
  background:#dce8f7;
  box-shadow:0 18px 42px rgba(24,55,96,.15);
  transform:translateZ(0);
}
.calendar-season-tile.premium-season-tile:hover{transform:translateY(-3px);box-shadow:0 24px 52px rgba(24,55,96,.2);border-color:transparent}
.calendar-season-tile.premium-season-tile.active{box-shadow:0 0 0 3px rgba(23,105,224,.25),0 24px 52px rgba(24,55,96,.2)}
.calendar-season-tile.premium-season-tile .season-thumb{position:absolute;inset:0;width:100%;height:100%;border-radius:0;background:#dce8f7}
.calendar-season-tile.premium-season-tile .season-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.calendar-season-tile.premium-season-tile:hover .season-thumb img{transform:scale(1.025)}
.calendar-season-tile.premium-season-tile .season-tile-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,18,39,.03) 35%,rgba(4,20,43,.82) 100%);pointer-events:none}
.calendar-season-tile.premium-season-tile .season-copy{position:absolute;left:28px;right:92px;bottom:26px;padding:0;display:grid;gap:5px;z-index:2;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.32)}
.calendar-season-tile.premium-season-tile .season-copy h3{margin:0;font-size:31px;line-height:1.05;font-weight:780;letter-spacing:-.03em;color:#fff}
.calendar-season-tile.premium-season-tile .season-copy span{font-size:16px;font-weight:650;color:rgba(255,255,255,.9);text-transform:uppercase;letter-spacing:.02em}
.calendar-season-tile.premium-season-tile .season-arrow{position:absolute;right:24px;bottom:24px;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;z-index:3;color:#fff;background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.8);backdrop-filter:blur(10px);box-shadow:0 8px 20px rgba(0,0,0,.15)}
.calendar-season-tile.premium-season-tile .season-arrow svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.calendar-season-tile.premium-season-tile.empty-tile{cursor:default;background:linear-gradient(145deg,#eaf2fc,#d7e6fa)}
.calendar-season-tile.premium-season-tile.empty-tile:hover{transform:none;box-shadow:0 18px 42px rgba(24,55,96,.12)}
.calendar-season-tile.premium-season-tile.empty-tile .season-thumb.empty{background:radial-gradient(circle at 65% 25%,rgba(255,255,255,.72),transparent 34%),linear-gradient(145deg,#e9f2fd,#cbdcf4)}
.calendar-season-tile.premium-season-tile.empty-tile .season-thumb.empty::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(122,157,204,.03),rgba(35,72,122,.34))}
.calendar-season-tile.premium-season-tile.empty-tile .season-thumb.empty::after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:12%;top:14%;background:radial-gradient(circle,rgba(255,255,255,.55),rgba(255,255,255,0) 68%)}
.calendar-season-tile.premium-season-tile.empty-tile .season-copy h3,.calendar-season-tile.premium-season-tile.empty-tile .season-copy span{color:#fff}
@media(max-width:720px){
  .calendar-season-grid{gap:10px}
  .calendar-season-tile.premium-season-tile{min-height:170px;border-radius:20px}
  .calendar-season-tile.premium-season-tile .season-copy{left:14px;right:48px;bottom:14px;gap:3px}
  .calendar-season-tile.premium-season-tile .season-copy h3{font-size:18px}
  .calendar-season-tile.premium-season-tile .season-copy span{font-size:11px}
  .calendar-season-tile.premium-season-tile .season-arrow{right:10px;bottom:10px;width:34px;height:34px;border-width:1px}
  .calendar-season-tile.premium-season-tile .season-arrow svg{width:18px;height:18px}
}


/* v18 archive navigation and premium delete */
.archive-view{display:grid;gap:18px}
.archive-view-head{display:flex;align-items:center;gap:14px;justify-content:space-between;padding:2px 2px 4px}
.archive-view-copy{display:grid;gap:4px;justify-items:end;text-align:right}
.archive-view-copy h2{margin:0;font-size:32px;letter-spacing:-.03em}
.archive-view-copy p{margin:0;color:var(--muted);font-weight:700}
.archive-back{border:1px solid var(--line);background:linear-gradient(180deg,#fff,#f4f8ff);color:var(--text);height:46px;padding:0 16px;border-radius:14px;display:inline-flex;align-items:center;gap:10px;font:inherit;font-weight:750;cursor:pointer;box-shadow:0 10px 24px rgba(28,72,129,.08)}
.archive-back svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.media-card img,.media-card video{width:100%;height:100%;object-fit:contain;display:block;background:#dce7f4}
.delete-chip{left:10px;top:10px;width:36px;height:36px;border-radius:14px;background:rgba(255,255,255,.96);display:grid;place-items:center;z-index:4;color:#6f84a5;box-shadow:0 10px 24px rgba(18,42,78,.18);border:1px solid rgba(207,223,244,.95)}
.delete-chip svg{width:18px;height:18px;fill:currentColor;display:block}
.delete-chip:hover{color:#cc4153;background:#fff4f6;border-color:#f2c4cb}
.calendar-season-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media(max-width:720px){
  .archive-view-head{align-items:flex-start;gap:10px;flex-direction:column}
  .archive-view-copy{justify-items:start;text-align:left}
  .archive-view-copy h2{font-size:24px}
  .archive-back{height:42px;padding:0 14px;border-radius:13px}
  .delete-chip{left:8px;top:8px;width:34px;height:34px;border-radius:13px}
}


/* v19 archive grid optimization, mobile one-line filters, premium tile labels */
:root{--archive-cols:4}
.compact-select{height:44px;min-width:106px;padding:0 12px;border:1px solid rgba(190,212,240,.9);border-radius:14px;background:rgba(255,255,255,.82);box-shadow:0 8px 20px rgba(72,108,156,.06);font:inherit;font-weight:700;color:var(--text)}
.top-actions{flex-wrap:nowrap}
.archive-view{gap:14px}
.archive-view-head{position:relative;min-height:36px;padding:0 2px 6px}
.archive-back{position:fixed;left:max(14px, calc(50vw - 640px));top:104px;z-index:24;opacity:0;pointer-events:none;transform:translateY(-8px);transition:opacity .22s ease, transform .22s ease;box-shadow:0 14px 32px rgba(18,52,96,.12)}
body.show-archive-back .archive-back{opacity:1;pointer-events:auto;transform:translateY(0)}
.archive-view-copy{margin-left:auto}
.media-grid{grid-template-columns:repeat(var(--archive-cols), minmax(0,1fr)) !important;grid-auto-rows:auto !important;gap:14px !important}
.media-card:nth-child(8n+1){grid-column:auto !important;grid-row:auto !important}
.media-card{aspect-ratio:1 / 1;border-radius:22px;background:#dfe9f6}
.media-card img,.media-card video{object-fit:cover !important;background:#dfe9f6}
.media-overlay{padding:28px 10px 10px;font-size:11px}
.day-group{gap:10px}
.day-title{padding-left:2px;margin-top:2px}
.calendar-season-tile.premium-season-tile .season-tile-overlay{background:linear-gradient(180deg,rgba(4,20,43,.06) 36%,rgba(4,20,43,.44) 100%)}
.calendar-season-tile.premium-season-tile .season-copy{left:16px;right:72px;bottom:16px;padding:10px 12px 11px;border-radius:18px;background:rgba(246,250,255,.92);border:1px solid rgba(219,233,251,.92);backdrop-filter:blur(8px);box-shadow:0 12px 28px rgba(16,43,77,.12);text-shadow:none;color:var(--text)}
.calendar-season-tile.premium-season-tile .season-copy h3{font-size:18px;line-height:1.08;font-weight:780;color:var(--text)}
.calendar-season-tile.premium-season-tile .season-copy span{font-size:12px;line-height:1.1;font-weight:700;letter-spacing:0;color:#597293;text-transform:none}
.calendar-season-tile.premium-season-tile .season-arrow{right:16px;bottom:16px;width:42px;height:42px;border-radius:15px;background:rgba(246,250,255,.94);border:1px solid rgba(219,233,251,.94);color:#4e6788;box-shadow:0 12px 28px rgba(16,43,77,.12);backdrop-filter:blur(8px)}
.calendar-season-tile.premium-season-tile .season-arrow svg{width:20px;height:20px}
@media(max-width:1100px){
  .media-grid{grid-template-columns:repeat(var(--archive-cols), minmax(0,1fr)) !important}
}
@media(max-width:720px){
  .topbar{grid-template-columns:1fr auto;align-items:start}
  .brand-copy h1{font-size:18px;font-weight:700;letter-spacing:-.025em}
  .brand-copy p{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px}
  .header-filters{grid-column:1/-1;order:3;display:flex !important;align-items:center;gap:6px;flex-wrap:nowrap !important;overflow-x:auto;overflow-y:hidden;padding:2px 0 1px;background:transparent !important;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .header-filters::-webkit-scrollbar{display:none}
  .header-filters .segmented{display:flex;flex:none;grid-column:auto;padding:3px;border-radius:14px}
  .header-filters .segmented button{padding:8px 11px;font-size:13px;white-space:nowrap}
  .favorite-header-btn{flex:0 0 auto;order:unset;grid-column:auto;grid-row:auto;justify-self:auto}
  .header-filters select{flex:0 0 132px;width:132px;min-width:132px;max-width:132px;height:40px;padding:0 30px 0 11px;border-radius:13px;font-size:13px;white-space:nowrap}
  .top-actions{gap:6px}
  .compact-select{height:40px;min-width:92px;font-size:13px;padding:0 10px}
  .archive-back{left:12px;top:86px}
  .archive-view-copy h2{font-size:18px}
  .archive-view-copy p{font-size:12px}
  .media-grid{grid-template-columns:repeat(3, minmax(0,1fr)) !important;gap:8px !important}
  .media-card{border-radius:16px}
  .calendar-season-tile.premium-season-tile .season-copy{left:10px;right:48px;bottom:10px;padding:8px 10px 9px;border-radius:14px}
  .calendar-season-tile.premium-season-tile .season-copy h3{font-size:14px}
  .calendar-season-tile.premium-season-tile .season-copy span{font-size:10px}
  .calendar-season-tile.premium-season-tile .season-arrow{right:10px;bottom:10px;width:34px;height:34px;border-radius:12px}
}

body.list-layout .media-grid{grid-template-columns:1fr !important;grid-auto-rows:180px !important}
body.list-layout .media-card{aspect-ratio:auto}
@media(max-width:720px){body.list-layout .media-grid{grid-template-columns:1fr !important;grid-auto-rows:120px !important}}


/* v20 strict archive grid, archive-only count selector, adaptive season captions */
.stats-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.archive-view-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px}
.archive-view-copy{justify-items:end;text-align:right}
.archive-columns-select{display:block;min-width:112px}
.archive-media-grid{display:grid!important;grid-template-columns:repeat(var(--archive-cols),minmax(0,1fr))!important;grid-auto-flow:row dense!important;gap:12px!important}
.archive-media-grid .media-card{width:100%!important;min-width:0!important;grid-column:auto!important;grid-row:auto!important;aspect-ratio:1/1!important}
.archive-media-grid .media-card:nth-child(n){grid-column:auto!important;grid-row:auto!important}
.calendar-season-tile.premium-season-tile .season-copy{left:16px;right:16px;bottom:14px;padding:11px 13px 12px;border-radius:16px;background:linear-gradient(100deg,rgba(4,20,43,.82),rgba(4,20,43,.46) 68%,rgba(4,20,43,.18));border:1px solid rgba(255,255,255,.18);box-shadow:0 12px 30px rgba(0,0,0,.16);backdrop-filter:blur(7px);text-shadow:0 2px 10px rgba(0,0,0,.25);color:#fff}
.calendar-season-tile.premium-season-tile .season-title-row{display:flex;align-items:center;gap:9px;min-width:0}
.calendar-season-tile.premium-season-tile .season-title-row h3{min-width:0;color:#fff;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.calendar-season-tile.premium-season-tile .season-copy>span{color:rgba(255,255,255,.82);font-size:11px}
.calendar-season-tile.premium-season-tile .season-arrow{position:static;flex:0 0 auto;width:27px;height:27px;border-radius:9px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.32);box-shadow:none;color:#fff}
.calendar-season-tile.premium-season-tile .season-arrow svg{width:15px;height:15px}
@media(max-width:900px){.stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){
  .header-filters{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;gap:6px!important;width:100%;max-width:100%}
  .header-filters .segmented{flex:0 0 auto!important}
  .header-filters select{flex:0 0 126px!important;width:126px!important;min-width:126px!important}
  .favorite-header-btn{flex:0 0 40px!important}
  .archive-view-head{grid-template-columns:auto 1fr auto;gap:8px;align-items:center}
  .archive-view-copy{justify-items:start;text-align:left;min-width:0}
  .archive-view-copy h2{font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .archive-columns-select{min-width:96px;width:96px;font-size:12px;padding:0 8px}
  .archive-back{position:static;opacity:1;pointer-events:auto;transform:none;width:40px;height:40px;padding:0;display:grid;place-items:center}
  .archive-back span{display:none}
  .archive-media-grid{grid-template-columns:repeat(var(--archive-cols),minmax(0,1fr))!important;gap:6px!important}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .calendar-season-tile.premium-season-tile .season-copy{left:8px;right:8px;bottom:8px;padding:8px 9px 9px;border-radius:12px}
  .calendar-season-tile.premium-season-tile .season-title-row h3{font-size:13px}
  .calendar-season-tile.premium-season-tile .season-copy>span{font-size:9px}
  .calendar-season-tile.premium-season-tile .season-arrow{width:23px;height:23px;border-radius:8px}
}


/* v21 favorites cleanup, app title settings, list mode fix, softer FAB, seasonal placeholders */
.fab{background:linear-gradient(180deg,#5ea8ff,#3d87ee)!important;box-shadow:0 12px 28px rgba(63,132,233,.22)!important}
.calendar-season-tile.premium-season-tile .season-copy{left:16px!important;right:auto!important;bottom:14px!important;display:inline-grid!important;width:auto!important;max-width:calc(100% - 32px)!important;padding:11px 13px 12px!important}
.calendar-season-tile.premium-season-tile .season-title-row{display:inline-flex!important;align-items:center;gap:8px;max-width:100%}
.calendar-season-tile.premium-season-tile .season-title-row h3{flex:0 1 auto;max-width:100%}
.calendar-season-tile.premium-season-tile .season-copy>span{justify-self:start}
@media(max-width:720px){.calendar-season-tile.premium-season-tile .season-copy{left:8px!important;max-width:calc(100% - 16px)!important;padding:8px 10px 9px!important}}

.season-thumb.empty{position:relative;overflow:hidden;background:#dce7f4}
.season-thumb.empty::before,.season-thumb.empty::after{content:"";position:absolute;inset:0;display:block}
.season-thumb.empty.season-winter{background:linear-gradient(180deg,#dbe9f7 0%,#edf5fb 48%,#cfddeb 100%)}
.season-thumb.empty.season-winter::before{background:radial-gradient(circle at 75% 24%, rgba(255,255,255,.95) 0 12%, transparent 13%), linear-gradient(180deg, transparent 62%, #eef5fb 62% 100%), linear-gradient(155deg, transparent 56%, #c8d8e8 56% 63%, transparent 64%), linear-gradient(205deg, transparent 54%, #bfd0e0 54% 60%, transparent 61%)}
.season-thumb.empty.season-spring{background:linear-gradient(180deg,#d9ecff 0%,#eef7ff 42%,#c9e0c9 100%)}
.season-thumb.empty.season-spring::before{background:radial-gradient(circle at 76% 22%, rgba(255,248,220,.95) 0 10%, transparent 11%), linear-gradient(180deg, transparent 58%, #97c38c 58% 100%), radial-gradient(circle at 24% 68%, rgba(255,193,203,.65) 0 7%, transparent 8%), radial-gradient(circle at 36% 64%, rgba(255,205,214,.65) 0 6%, transparent 7%)}
.season-thumb.empty.season-summer{background:linear-gradient(180deg,#bfe0ff 0%,#e7f6ff 36%,#7cc57b 100%)}
.season-thumb.empty.season-summer::before{background:radial-gradient(circle at 78% 18%, rgba(255,240,170,.98) 0 11%, transparent 12%), linear-gradient(180deg, transparent 55%, #72be6f 55% 100%), linear-gradient(0deg, rgba(255,255,255,.16), rgba(255,255,255,0))}
.season-thumb.empty.season-autumn{background:linear-gradient(180deg,#d8e7f6 0%,#eef6ff 38%,#d6a66a 100%)}
.season-thumb.empty.season-autumn::before{background:radial-gradient(circle at 78% 20%, rgba(255,232,164,.95) 0 10%, transparent 11%), linear-gradient(180deg, transparent 56%, #c78d47 56% 100%), radial-gradient(circle at 30% 70%, rgba(217,112,32,.45) 0 10%, transparent 11%), radial-gradient(circle at 43% 62%, rgba(180,60,20,.35) 0 8%, transparent 9%)}

body.list-layout .archive-media-grid{grid-template-columns:1fr!important;grid-auto-rows:auto!important;gap:12px!important}
body.list-layout .archive-media-grid .media-card{aspect-ratio:auto!important;min-height:420px!important;height:auto!important;display:block!important;background:var(--surface)!important;border:1px solid var(--line)!important;overflow:hidden}
body.list-layout .archive-media-grid .media-card img,
body.list-layout .archive-media-grid .media-card video{width:100%!important;height:420px!important;object-fit:contain!important;background:#ecf3fb!important;display:block}
body.list-layout .archive-media-grid .media-overlay{opacity:1!important;position:static!important;background:none!important;color:var(--text)!important;padding:14px 16px 16px!important;display:flex!important;flex-direction:column;gap:6px;font-weight:650}
body.list-layout .archive-media-grid .fav-chip{top:10px!important;right:10px!important}
body.list-layout .archive-media-grid .delete-chip{top:10px!important;left:10px!important}
@media(max-width:720px){
  body.list-layout .archive-media-grid .media-card{min-height:280px!important}
  body.list-layout .archive-media-grid .media-card img,
  body.list-layout .archive-media-grid .media-card video{height:280px!important}
}

.archive-columns-select{min-width:108px!important;width:108px!important;justify-self:end}
@media(max-width:720px){.archive-columns-select{min-width:92px!important;width:92px!important;padding:0 8px!important}}


/* v23 home icon, settings avatar picker, season-specific caption styles, improved archive head */
.home-avatar-btn{border:0;background:transparent;padding:0;cursor:pointer}
.app-identity-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:end}
.identity-title{margin:0}
.identity-avatar-btn{border:1px solid var(--line);background:linear-gradient(180deg,#fff,#f4f8ff);border-radius:18px;padding:10px 12px;display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:10px;row-gap:2px;align-items:center;cursor:pointer;box-shadow:0 10px 24px rgba(28,72,129,.08)}
.identity-avatar-mark{grid-row:1/3;width:54px;height:54px;border-radius:16px;background:linear-gradient(145deg,var(--primary),#3186f2);display:grid;place-items:center;color:#fff;font-size:24px;font-weight:850;box-shadow:0 10px 24px rgba(23,105,224,.22);background-size:cover;background-position:center;overflow:hidden}
.identity-avatar-mark.has-photo{color:transparent}
.identity-avatar-plus{font-size:18px;font-weight:900;color:var(--primary);line-height:1}
.identity-avatar-btn small{color:var(--muted);font-size:12px;font-weight:700}
@media(max-width:720px){.app-identity-row{grid-template-columns:1fr}.identity-avatar-btn{justify-self:start}}

.archive-view-head{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;gap:12px!important;padding:2px 2px 10px!important}
.archive-head-main{display:flex;align-items:center;gap:12px;min-width:0}
.archive-view-copy{margin-left:0!important;min-width:0;justify-items:start!important;text-align:left!important}
.archive-view-copy h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.archive-columns-select{min-width:92px!important;width:92px!important;height:44px!important;padding:0 10px!important;justify-self:end;background:linear-gradient(180deg,#fff,#f4f8ff)!important}
.archive-back{position:static!important;opacity:1!important;pointer-events:auto!important;transform:none!important;left:auto!important;top:auto!important}
@media(max-width:720px){.archive-view-head{grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important}.archive-head-main{gap:8px}.archive-back{height:40px!important;padding:0 12px!important}.archive-back span{display:none}.archive-view-copy h2{font-size:18px!important}.archive-view-copy p{font-size:12px}.archive-columns-select{min-width:88px!important;width:88px!important;font-size:12px!important;padding:0 8px!important}}

.calendar-season-tile.premium-season-tile.season-theme-winter .season-copy{background:linear-gradient(100deg,rgba(15,45,88,.88),rgba(76,122,178,.64) 68%,rgba(182,214,241,.18))!important;border-color:rgba(217,236,255,.42)!important}
.calendar-season-tile.premium-season-tile.season-theme-spring .season-copy{background:linear-gradient(100deg,rgba(28,76,60,.86),rgba(108,171,129,.6) 68%,rgba(236,193,216,.18))!important;border-color:rgba(223,246,224,.38)!important}
.calendar-season-tile.premium-season-tile.season-theme-summer .season-copy{background:linear-gradient(100deg,rgba(20,78,97,.86),rgba(63,146,134,.58) 65%,rgba(246,205,101,.18))!important;border-color:rgba(221,246,242,.38)!important}
.calendar-season-tile.premium-season-tile.season-theme-autumn .season-copy{background:linear-gradient(100deg,rgba(98,54,24,.88),rgba(177,110,52,.64) 68%,rgba(244,194,112,.2))!important;border-color:rgba(255,232,195,.36)!important}
.calendar-season-tile.premium-season-tile.season-theme-winter .season-arrow{background:rgba(220,236,255,.16)!important;border-color:rgba(220,236,255,.32)!important}
.calendar-season-tile.premium-season-tile.season-theme-spring .season-arrow{background:rgba(227,255,236,.14)!important;border-color:rgba(227,255,236,.28)!important}
.calendar-season-tile.premium-season-tile.season-theme-summer .season-arrow{background:rgba(231,255,245,.14)!important;border-color:rgba(231,255,245,.3)!important}
.calendar-season-tile.premium-season-tile.season-theme-autumn .season-arrow{background:rgba(255,240,220,.16)!important;border-color:rgba(255,240,220,.32)!important}

.calendar-season-tile.premium-season-tile.empty-tile .season-thumb.empty{background:none!important}
.season-thumb.empty{position:relative;overflow:hidden}
.season-thumb.empty::before,.season-thumb.empty::after{content:"";position:absolute;inset:0;display:block}
.season-thumb.empty.season-winter{background:linear-gradient(180deg,#cfe2f5 0%,#eaf4ff 46%,#e4eff8 46%,#dbe8f4 60%,#c7d9e8 100%)!important}
.season-thumb.empty.season-winter::before{background:radial-gradient(circle at 75% 18%, rgba(255,255,255,.95) 0 10%, transparent 11%), linear-gradient(180deg, transparent 54%, rgba(255,255,255,.95) 54% 64%, transparent 65%), linear-gradient(130deg, transparent 55%, rgba(174,195,214,.95) 56% 67%, transparent 68%), linear-gradient(225deg, transparent 58%, rgba(163,186,207,.9) 59% 70%, transparent 71%)}
.season-thumb.empty.season-winter::after{background:radial-gradient(circle at 22% 70%, rgba(255,255,255,.95) 0 7%, transparent 8%), radial-gradient(circle at 33% 76%, rgba(255,255,255,.8) 0 5%, transparent 6%), linear-gradient(180deg, transparent 0 78%, rgba(234,242,250,.94) 78% 100%)}
.season-thumb.empty.season-spring{background:linear-gradient(180deg,#d7ecff 0%,#edf7ff 42%,#b6dca8 43%,#87bf7b 100%)!important}
.season-thumb.empty.season-spring::before{background:radial-gradient(circle at 76% 18%, rgba(255,246,196,.96) 0 10%, transparent 11%), linear-gradient(180deg, transparent 0 66%, rgba(122,184,104,.96) 66% 100%), radial-gradient(circle at 22% 66%, rgba(255,203,215,.78) 0 5%, transparent 6%), radial-gradient(circle at 28% 63%, rgba(255,219,227,.72) 0 4%, transparent 5%), linear-gradient(140deg, transparent 41%, rgba(125,101,70,.75) 42% 45%, transparent 46%)}
.season-thumb.empty.season-spring::after{background:linear-gradient(180deg, transparent 0 76%, rgba(82,140,74,.18) 76% 100%)}
.season-thumb.empty.season-summer{background:linear-gradient(180deg,#b8ddff 0%,#e8f8ff 35%,#90ca7c 36%,#5da85f 100%)!important}
.season-thumb.empty.season-summer::before{background:radial-gradient(circle at 78% 18%, rgba(255,231,134,.98) 0 11%, transparent 12%), linear-gradient(180deg, transparent 0 62%, rgba(104,179,92,.98) 62% 100%), linear-gradient(145deg, transparent 53%, rgba(90,126,88,.6) 54% 57%, transparent 58%)}
.season-thumb.empty.season-summer::after{background:linear-gradient(180deg, transparent 0 74%, rgba(255,255,255,.12) 74% 100%)}
.season-thumb.empty.season-autumn{background:linear-gradient(180deg,#d7e6f5 0%,#edf5ff 38%,#d3a35e 39%,#a96b2b 100%)!important}
.season-thumb.empty.season-autumn::before{background:radial-gradient(circle at 78% 18%, rgba(255,231,152,.95) 0 10%, transparent 11%), linear-gradient(180deg, transparent 0 65%, rgba(171,107,38,.97) 65% 100%), radial-gradient(circle at 20% 66%, rgba(201,96,25,.78) 0 5%, transparent 6%), radial-gradient(circle at 28% 60%, rgba(242,177,73,.65) 0 4%, transparent 5%), linear-gradient(140deg, transparent 40%, rgba(128,83,46,.72) 41% 44%, transparent 45%)}
.season-thumb.empty.season-autumn::after{background:linear-gradient(180deg, transparent 0 76%, rgba(120,64,18,.16) 76% 100%)}
.fab{background:linear-gradient(180deg,#78b7ff,#4e95f1)!important;box-shadow:0 12px 28px rgba(63,132,233,.18)!important}


/* v24 requested fixes */
body[data-season="winter"] .topbar{background:linear-gradient(135deg, rgba(235,244,255,.97) 0%, rgba(224,237,252,.96) 38%, rgba(204,224,246,.95) 100%);border-color:#c8dbf1}
body[data-season="spring"] .topbar{background:linear-gradient(135deg, rgba(239,249,243,.97) 0%, rgba(226,243,255,.96) 42%, rgba(218,237,220,.95) 100%);border-color:#cfe4d3}
body[data-season="summer"] .topbar{background:linear-gradient(135deg, rgba(235,248,255,.97) 0%, rgba(222,243,247,.96) 40%, rgba(215,237,221,.95) 100%);border-color:#c9e2db}
body[data-season="autumn"] .topbar{background:linear-gradient(135deg, rgba(255,245,231,.97) 0%, rgba(244,232,210,.96) 42%, rgba(236,218,191,.95) 100%);border-color:#e2d0b1}

.app-identity-row{display:grid;grid-template-columns:84px minmax(0,1fr);gap:14px;align-items:stretch}
.identity-avatar-btn{padding:0!important;display:grid!important;place-items:center;height:84px;border-radius:16px!important;overflow:hidden}
.identity-avatar-mark{width:100%!important;height:100%!important;border-radius:16px!important;box-shadow:none!important}
.identity-avatar-plus,.identity-avatar-btn small{display:none!important}
.identity-title input{height:84px;padding:0 14px;font-size:16px;font-weight:700}
@media(max-width:720px){.app-identity-row{grid-template-columns:72px minmax(0,1fr)}.identity-avatar-btn{height:72px}.identity-title input{height:72px}}

.stats-grid{grid-template-columns:repeat(5,1fr)!important}
@media(max-width:720px){.stats-grid{grid-template-columns:repeat(2,1fr)!important}}

.season-thumb.placeholder-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.calendar-season-tile.premium-season-tile .season-copy{backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important;overflow:hidden}
.calendar-season-tile.premium-season-tile.season-theme-winter .season-copy{background-image:radial-gradient(circle at 85% 18%, rgba(255,255,255,.25) 0 10%, transparent 11%),linear-gradient(100deg,rgba(15,45,88,.86),rgba(76,122,178,.62) 62%,rgba(185,219,246,.18))!important}
.calendar-season-tile.premium-season-tile.season-theme-spring .season-copy{background-image:radial-gradient(circle at 14% 72%, rgba(255,207,222,.24) 0 10%, transparent 11%),radial-gradient(circle at 23% 60%, rgba(241,230,191,.16) 0 8%, transparent 9%),linear-gradient(100deg,rgba(28,76,60,.84),rgba(108,171,129,.58) 64%,rgba(236,193,216,.18))!important}
.calendar-season-tile.premium-season-tile.season-theme-summer .season-copy{background-image:radial-gradient(circle at 84% 20%, rgba(255,224,122,.26) 0 9%, transparent 10%),linear-gradient(100deg,rgba(20,78,97,.84),rgba(63,146,134,.58) 64%,rgba(246,205,101,.18))!important}
.calendar-season-tile.premium-season-tile.season-theme-autumn .season-copy{background-image:radial-gradient(circle at 16% 70%, rgba(243,171,77,.23) 0 10%, transparent 11%),radial-gradient(circle at 24% 56%, rgba(164,76,28,.18) 0 7%, transparent 8%),linear-gradient(100deg,rgba(98,54,24,.86),rgba(177,110,52,.62) 64%,rgba(244,194,112,.22))!important}

.archive-view-head{grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important}
.archive-head-main{min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center}
.archive-view-copy h2{font-size:26px}
.archive-view-copy p{font-size:13px}
.archive-columns-select{width:94px!important;min-width:94px!important;justify-self:end}
@media(max-width:720px){.archive-view-head{grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important}.archive-head-main{grid-template-columns:auto minmax(0,1fr);gap:8px}.archive-view-copy h2{font-size:18px}.archive-view-copy p{font-size:11px}.archive-columns-select{width:88px!important;min-width:88px!important;font-size:12px!important;padding:0 8px!important}}


/* v25 critical initialization fix + settings identity row alignment */
.app-identity-row{display:grid!important;grid-template-columns:68px minmax(0,1fr)!important;gap:12px!important;align-items:end!important}
.identity-avatar-btn{width:68px!important;height:68px!important;min-width:68px!important;padding:0!important;border-radius:16px!important;display:block!important;overflow:hidden!important;background:transparent!important}
.identity-avatar-mark{width:68px!important;height:68px!important;border-radius:16px!important;display:grid!important;place-items:center!important;background-size:cover!important;background-position:center!important}
.identity-title{display:grid!important;gap:7px!important;margin:0!important}
.identity-title input{height:44px!important;padding:0 12px!important;font-size:14px!important;font-weight:700!important}
@media(max-width:720px){
  .app-identity-row{grid-template-columns:60px minmax(0,1fr)!important;gap:10px!important}
  .identity-avatar-btn,.identity-avatar-mark{width:60px!important;height:60px!important;min-width:60px!important;border-radius:15px!important}
  .identity-title input{height:42px!important}
}


/* v26 seasonal photo placeholders, header derived from seasonal images, settings one-row layout */
body[data-season="winter"] .topbar{background-image:linear-gradient(135deg, rgba(238,246,255,.94), rgba(229,239,251,.88)), url('assets/placeholders/winter.jpg')!important;background-size:cover, cover!important;background-position:center, center!important;border-color:#c9d9eb!important}
body[data-season="spring"] .topbar{background-image:linear-gradient(135deg, rgba(248,244,236,.86), rgba(237,246,228,.88)), url('assets/placeholders/spring.jpg')!important;background-size:cover, cover!important;background-position:center, center!important;border-color:#d7dfce!important}
body[data-season="summer"] .topbar{background-image:linear-gradient(135deg, rgba(255,238,208,.80), rgba(229,246,215,.88)), url('assets/placeholders/summer.jpg')!important;background-size:cover, cover!important;background-position:center, center!important;border-color:#d7ddc3!important}
body[data-season="autumn"] .topbar{background-image:linear-gradient(135deg, rgba(255,236,206,.88), rgba(245,223,181,.90)), url('assets/placeholders/autumn.jpg')!important;background-size:cover, cover!important;background-position:center, center!important;border-color:#e0cda9!important}
.topbar{background-repeat:no-repeat!important;background-blend-mode:soft-light,normal!important}

.app-identity-row{display:grid!important;grid-template-columns:72px minmax(240px,1.2fr) minmax(180px,.9fr)!important;gap:12px!important;align-items:end!important}
.identity-avatar-btn{height:84px!important;width:72px!important;justify-self:start!important;border-radius:18px!important;padding:0!important;overflow:hidden!important}
.identity-avatar-mark{width:72px!important;height:84px!important;border-radius:18px!important;display:block!important;background-size:cover!important;background-position:center!important}
.identity-title,.identity-date{margin:0!important}
.identity-title input,.identity-date input{height:72px!important}
.identity-date input{min-width:0}
@media(max-width:980px){.app-identity-row{grid-template-columns:64px minmax(180px,1fr) minmax(160px,.9fr)!important}.identity-avatar-btn{height:78px!important;width:64px!important}.identity-avatar-mark{width:64px!important;height:78px!important}}
@media(max-width:720px){.app-identity-row{grid-template-columns:64px 1fr!important}.identity-date{grid-column:1/-1}.identity-date input,.identity-title input{height:64px!important}.identity-avatar-btn{height:64px!important;width:64px!important}.identity-avatar-mark{width:64px!important;height:64px!important}}

.placeholder-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}
.calendar-season-tile .season-thumb img{width:100%;height:100%;object-fit:cover}

/* keep caption compact */
.calendar-season-tile.premium-season-tile .season-copy{display:inline-grid!important;width:auto!important;max-width:calc(100% - 32px)!important;right:auto!important}
@media(max-width:720px){.calendar-season-tile.premium-season-tile .season-copy{max-width:calc(100% - 16px)!important}}


/* v27 fixes: explicit seasonal placeholders, crisper seasonal header, clickable home brand, framed brand block */
.brand{padding:8px 12px!important;border-radius:18px!important;background:rgba(255,255,255,.72)!important;border:1px solid rgba(255,255,255,.62)!important;box-shadow:0 10px 24px rgba(16,43,77,.08)!important;backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important;cursor:pointer!important}
.brand-copy h1{color:#173154!important}
.brand-copy p{color:#4f6889!important}
.home-avatar-btn,.brand-copy,#brandAvatar{cursor:pointer!important}

body[data-season="winter"] .topbar{background-image:linear-gradient(135deg, rgba(244,249,255,.54), rgba(231,241,252,.48)), url('assets/placeholders/winter-real-v27.jpg')!important;background-size:cover!important;background-position:center!important;border-color:#c6d8ea!important}
body[data-season="spring"] .topbar{background-image:linear-gradient(135deg, rgba(255,248,240,.42), rgba(237,248,232,.42)), url('assets/placeholders/spring-real-v27.jpg')!important;background-size:cover!important;background-position:center!important;border-color:#d5dfcc!important}
body[data-season="summer"] .topbar{background-image:linear-gradient(135deg, rgba(255,241,212,.34), rgba(232,248,221,.36)), url('assets/placeholders/summer-real-v27.jpg')!important;background-size:cover!important;background-position:center 46%!important;border-color:#d9ddc0!important}
body[data-season="autumn"] .topbar{background-image:linear-gradient(135deg, rgba(255,238,210,.38), rgba(248,226,187,.40)), url('assets/placeholders/autumn-real-v27.jpg')!important;background-size:cover!important;background-position:center 42%!important;border-color:#dec9a4!important}
.topbar{background-repeat:no-repeat!important;background-blend-mode:normal!important;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important;overflow:hidden!important}

.calendar-season-tile.premium-season-tile .season-copy{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;color:#fff!important;text-shadow:0 2px 10px rgba(0,0,0,.28)!important;border-color:rgba(255,255,255,.22)!important;box-shadow:0 10px 24px rgba(0,0,0,.15)!important}
.calendar-season-tile.premium-season-tile .season-copy h3,.calendar-season-tile.premium-season-tile .season-copy>span{color:#fff!important}
.calendar-season-tile.premium-season-tile.season-theme-winter .season-copy{background-image:linear-gradient(110deg, rgba(19,52,92,.86), rgba(55,101,155,.60) 68%, rgba(216,233,248,.16)), url('assets/placeholders/winter-real-v27.jpg')!important}
.calendar-season-tile.premium-season-tile.season-theme-spring .season-copy{background-image:linear-gradient(110deg, rgba(37,81,63,.84), rgba(111,161,125,.58) 66%, rgba(246,216,225,.18)), url('assets/placeholders/spring-real-v27.jpg')!important}
.calendar-season-tile.premium-season-tile.season-theme-summer .season-copy{background-image:linear-gradient(110deg, rgba(35,93,87,.84), rgba(112,156,81,.56) 66%, rgba(249,214,120,.18)), url('assets/placeholders/summer-real-v27.jpg')!important}
.calendar-season-tile.premium-season-tile.season-theme-autumn .season-copy{background-image:linear-gradient(110deg, rgba(105,61,29,.88), rgba(174,109,46,.60) 68%, rgba(247,199,115,.20)), url('assets/placeholders/autumn-real-v27.jpg')!important}

/* settings one-row optimization */
.settings-dialog .app-identity-row{grid-template-columns:72px minmax(220px,1fr) minmax(170px,.85fr)!important;align-items:end!important;gap:12px!important}
.settings-dialog .identity-avatar-btn{height:72px!important;width:72px!important;border-radius:18px!important}
.settings-dialog .identity-avatar-mark{width:72px!important;height:72px!important;border-radius:18px!important}
.settings-dialog .identity-title input,.settings-dialog .identity-date input{height:58px!important}
.settings-dialog .setting-field>span{display:block;font-size:12px;font-weight:700;color:#607896;margin-bottom:6px}
@media(max-width:720px){.brand{padding:7px 9px!important}.settings-dialog .app-identity-row{grid-template-columns:64px 1fr!important}.settings-dialog .identity-date{grid-column:1/-1}.settings-dialog .identity-avatar-btn{height:64px!important;width:64px!important}.settings-dialog .identity-avatar-mark{width:64px!important;height:64px!important}}

/* v28: fuller seasonal badge backgrounds and compact brand container */
.brand{
  justify-self:start!important;
  width:max-content!important;
  max-width:min(100%, 360px)!important;
  flex:0 0 auto!important;
}
.brand-copy{
  flex:0 0 auto!important;
  width:auto!important;
  max-width:250px!important;
}

.calendar-season-tile.premium-season-tile .season-copy{
  background-size:100% 100%!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}
.calendar-season-tile.premium-season-tile.season-theme-winter .season-copy{
  background-image:linear-gradient(100deg,rgba(16,48,88,.78),rgba(45,91,143,.46) 66%,rgba(225,239,252,.14)),url('assets/placeholders/winter-real-v27.jpg')!important;
}
.calendar-season-tile.premium-season-tile.season-theme-spring .season-copy{
  background-image:linear-gradient(100deg,rgba(35,79,60,.76),rgba(91,145,105,.44) 66%,rgba(246,220,230,.14)),url('assets/placeholders/spring-real-v27.jpg')!important;
}
.calendar-season-tile.premium-season-tile.season-theme-summer .season-copy{
  background-image:linear-gradient(100deg,rgba(30,84,83,.76),rgba(95,144,79,.42) 66%,rgba(250,220,132,.14)),url('assets/placeholders/summer-real-v27.jpg')!important;
}
.calendar-season-tile.premium-season-tile.season-theme-autumn .season-copy{
  background-image:linear-gradient(100deg,rgba(103,58,27,.78),rgba(166,101,43,.44) 66%,rgba(248,204,125,.15)),url('assets/placeholders/autumn-real-v27.jpg')!important;
}

@media(max-width:720px){
  .brand{max-width:240px!important;}
  .brand-copy{max-width:165px!important;}
}


/* v30: high-quality avatar, seasonal FAB, right-aligned season badges, original-quality covers */
.brand-mark,.identity-avatar-mark{background-image:none!important}
.brand-mark>img,.identity-avatar-mark>img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
  image-rendering:auto!important;
  filter:none!important;
  transform:none!important;
  backface-visibility:hidden;
}
.brand-mark.has-photo,.identity-avatar-mark.has-photo{color:transparent!important}

.calendar-season-tile .season-thumb>img,
.season-cover .season-thumb>img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  image-rendering:auto!important;
  filter:none!important;
  transform:none!important;
}

.calendar-season-tile.premium-season-tile .season-copy{
  left:auto!important;
  right:16px!important;
  bottom:14px!important;
  width:auto!important;
  max-width:calc(100% - 32px)!important;
}
@media(max-width:720px){
  .calendar-season-tile.premium-season-tile .season-copy{
    left:auto!important;
    right:8px!important;
    bottom:8px!important;
    max-width:calc(100% - 16px)!important;
  }
}

.fab{
  color:#fff!important;
  border:1px solid rgba(255,255,255,.68)!important;
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  text-shadow:0 2px 8px rgba(0,0,0,.3)!important;
  box-shadow:0 14px 32px rgba(30,65,105,.24)!important;
}
body[data-season="winter"] .fab{
  background-image:linear-gradient(145deg,rgba(34,83,137,.70),rgba(184,214,240,.40)),url('assets/placeholders/winter-real-v27.jpg')!important;
}
body[data-season="spring"] .fab{
  background-image:linear-gradient(145deg,rgba(50,111,74,.66),rgba(223,196,210,.34)),url('assets/placeholders/spring-real-v27.jpg')!important;
}
body[data-season="summer"] .fab{
  background-image:linear-gradient(145deg,rgba(45,113,101,.66),rgba(234,192,84,.34)),url('assets/placeholders/summer-real-v27.jpg')!important;
}
body[data-season="autumn"] .fab{
  background-image:linear-gradient(145deg,rgba(116,67,27,.70),rgba(222,157,67,.38)),url('assets/placeholders/autumn-real-v27.jpg')!important;
}


/* v31 Foto-album icon, install state, home reliability, title readability */
.install-app-btn{display:block!important;width:100%;margin-top:9px;background:linear-gradient(180deg,#eaf3ff,#dcecff);color:#173154;border:1px solid #c9dcf4;box-shadow:0 8px 20px rgba(37,92,158,.08)}
.install-app-btn.installed,.install-app-btn:disabled{opacity:.72;cursor:default;background:#edf2f7;color:#71839e;border-color:#d8e2ee;box-shadow:none}
.home-avatar-btn{position:relative;z-index:3;pointer-events:auto!important;touch-action:manipulation}
#brandAvatar{pointer-events:none}
.calendar-season-tile.premium-season-tile .season-copy h3,
.calendar-season-tile.premium-season-tile .season-copy>span,
.calendar-season-tile.premium-season-tile .season-title-row h3{
  text-shadow:-1px -1px 0 rgba(0,0,0,.55),1px -1px 0 rgba(0,0,0,.55),-1px 1px 0 rgba(0,0,0,.55),1px 1px 0 rgba(0,0,0,.55),0 2px 8px rgba(0,0,0,.35)!important;
}

/* v32 home button reliability */
#homeBtn{position:relative!important;z-index:10!important;pointer-events:auto!important;touch-action:manipulation!important;cursor:pointer!important}
#homeBtn *{pointer-events:none!important}

/* v33 mobile settings, empty icon, header order, archive columns and action chips */
.empty-app-icon{width:88px!important;height:88px!important;padding:0!important;background:linear-gradient(180deg,#f8fbff,#e9f2ff)!important;border:1px solid #d9e7f8!important;box-shadow:0 14px 28px rgba(58,104,167,.10)!important;overflow:hidden!important}
.empty-app-icon img{width:100%!important;height:100%!important;display:block!important;object-fit:cover!important;border-radius:22px!important}
.settings-install-btn{margin-top:14px!important;margin-bottom:4px!important}
.settings-dialog .app-identity-row{display:grid!important;grid-template-columns:72px minmax(0,1fr) 156px!important;gap:12px!important;align-items:end!important}
.settings-dialog .identity-avatar-btn{width:72px!important;height:72px!important;align-self:stretch!important}
.settings-dialog .identity-avatar-mark{width:72px!important;height:72px!important;border-radius:18px!important;overflow:hidden!important}
.settings-dialog .identity-avatar-mark img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}
.settings-dialog .identity-title input,.settings-dialog .identity-date input{height:52px!important}
.settings-dialog .identity-title,.settings-dialog .identity-date{margin:0!important}

@media (max-width:720px){
  .topbar{grid-template-columns:minmax(0,1fr) auto!important;align-items:start!important;gap:10px!important}
  .brand{justify-self:start!important;max-width:max-content!important;width:auto!important}
  .brand-copy h1{font-size:18px!important}
  .brand-copy p{max-width:none!important}
  .header-filters{grid-column:1/-1!important;display:grid!important;grid-template-columns:minmax(0,1fr) max-content auto!important;gap:8px!important;align-items:center!important;overflow:visible!important;padding:0!important}
  .header-filters .segmented{grid-column:1/-1!important;min-width:0!important;width:100%!important}
  .header-filters .segmented button{flex:1 1 0!important;min-width:0!important;padding:8px 10px!important}
  #ageFilter{grid-column:2!important;grid-row:2!important;width:138px!important;min-width:138px!important;max-width:138px!important;justify-self:end!important}
  #favoritesBtn{grid-column:3!important;grid-row:2!important;justify-self:end!important;width:40px!important;height:40px!important}
  #seasonFilter{grid-column:1 / span 2!important;grid-row:3!important;width:100%!important;min-width:0!important;max-width:none!important}
  .favorite-header-btn{font-size:23px!important}
  .top-actions{gap:7px!important}
  .archive-view-head{grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important;align-items:center!important}
  .archive-head-main{min-width:0!important;display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;align-items:center!important;gap:10px!important}
  .archive-view-copy{min-width:0!important}
  .archive-view-copy h2{font-size:17px!important}
  .archive-view-copy p{font-size:11px!important}
  .archive-columns-select{width:92px!important;min-width:92px!important;padding:0 8px!important}
  .media-grid,.archive-media-grid{grid-template-columns:repeat(var(--archive-cols), minmax(0,1fr))!important;gap:8px!important}
  .archive-media-grid .media-card,.media-grid .media-card{aspect-ratio:1 / 1!important}
  .fav-chip,.delete-chip{width:28px!important;height:28px!important;border-radius:10px!important;top:6px!important;font-size:16px!important}
  .delete-chip{left:6px!important}
  .fav-chip{right:6px!important}
  .delete-chip svg{width:16px!important;height:16px!important}
  .settings-dialog{width:min(560px,94vw)!important}
  .settings-content{padding:24px 16px 18px!important}
  .settings-dialog .dialog-title h3{font-size:24px!important}
  .settings-install-btn{margin-top:12px!important;margin-bottom:8px!important}
  .settings-dialog .app-identity-row{grid-template-columns:64px minmax(0,1fr)!important;gap:10px!important;align-items:start!important}
  .settings-dialog .identity-avatar-btn,.settings-dialog .identity-avatar-mark{width:64px!important;height:64px!important}
  .settings-dialog .identity-title{grid-column:2!important}
  .settings-dialog .identity-date{grid-column:1/-1!important}
  .settings-dialog .identity-title input,.settings-dialog .identity-date input{height:50px!important}
  .settings-dialog .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media (max-width:420px){
  #ageFilter{width:132px!important;min-width:132px!important;max-width:132px!important}
  .settings-content{padding:22px 14px 18px!important}
}

/* v34 critical mobile upload and compact mobile layout */
@media (max-width:720px){
  /* All primary filters in one row: All / Photo / Video / All time / Heart */
  .header-filters{
    grid-column:1/-1!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 126px 40px!important;
    grid-auto-rows:40px!important;
    gap:6px!important;
    align-items:center!important;
    width:100%!important;
    overflow:visible!important;
    padding:0!important;
  }
  .header-filters .segmented{
    grid-column:1!important;
    grid-row:1!important;
    display:flex!important;
    min-width:0!important;
    width:100%!important;
    padding:3px!important;
    border-radius:13px!important;
  }
  .header-filters .segmented button{
    flex:1 1 0!important;
    min-width:0!important;
    padding:7px 5px!important;
    font-size:12px!important;
    white-space:nowrap!important;
  }
  #ageFilter{
    grid-column:2!important;
    grid-row:1!important;
    width:126px!important;
    min-width:126px!important;
    max-width:126px!important;
    height:40px!important;
    padding:0 27px 0 9px!important;
    font-size:12px!important;
  }
  #favoritesBtn{
    grid-column:3!important;
    grid-row:1!important;
    width:40px!important;
    height:40px!important;
    justify-self:end!important;
    font-size:21px!important;
  }
  #seasonFilter:not(.hidden){
    grid-column:1/-1!important;
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:40px!important;
  }

  /* Settings dialog remains fully scrollable on small screens */
  .settings-dialog{
    width:min(94vw,560px)!important;
    max-height:calc(100dvh - 28px)!important;
    height:auto!important;
    overflow:hidden!important;
    border-radius:24px!important;
  }
  .settings-dialog .settings-content{
    max-height:calc(100dvh - 28px)!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding:22px 14px 24px!important;
  }
  .settings-dialog .dialog-title{
    position:sticky!important;
    top:-22px!important;
    z-index:5!important;
    margin:-22px -14px 10px!important;
    padding:22px 14px 12px!important;
    background:rgba(255,255,255,.96)!important;
    backdrop-filter:blur(10px)!important;
  }

  /* Icon, app name and birth date in one compact row */
  .settings-dialog .app-identity-row{
    display:grid!important;
    grid-template-columns:52px minmax(0,1fr) 118px!important;
    gap:8px!important;
    align-items:end!important;
  }
  .settings-dialog .identity-avatar-btn,
  .settings-dialog .identity-avatar-mark{
    width:52px!important;
    height:52px!important;
    min-width:52px!important;
    border-radius:14px!important;
  }
  .settings-dialog .identity-title{
    grid-column:2!important;
    min-width:0!important;
  }
  .settings-dialog .identity-date{
    grid-column:3!important;
    min-width:0!important;
  }
  .settings-dialog .setting-field>span{
    margin-bottom:4px!important;
    font-size:10px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
  }
  .settings-dialog .identity-title input,
  .settings-dialog .identity-date input{
    width:100%!important;
    min-width:0!important;
    height:52px!important;
    padding:0 9px!important;
    font-size:13px!important;
    border-radius:13px!important;
  }
  .settings-dialog .identity-date input{
    font-size:12px!important;
  }
  .settings-dialog .setting-hint{
    margin-top:8px!important;
    font-size:12px!important;
  }

  /* File controls must remain interactive above the backdrop */
  .upload-sheet{z-index:90!important}
  .sheet-panel{z-index:2!important;pointer-events:auto!important}
  .sheet-backdrop{z-index:1!important}
  .action-card{position:relative!important;z-index:3!important;pointer-events:auto!important;touch-action:manipulation!important}
}

@media (max-width:390px){
  .header-filters{grid-template-columns:minmax(0,1fr) 120px 38px!important;gap:5px!important}
  #ageFilter{width:120px!important;min-width:120px!important;max-width:120px!important;font-size:11px!important}
  #favoritesBtn{width:38px!important;height:38px!important}
  .header-filters .segmented button{font-size:11px!important;padding:7px 3px!important}
  .settings-dialog .app-identity-row{grid-template-columns:48px minmax(0,1fr) 110px!important;gap:7px!important}
  .settings-dialog .identity-avatar-btn,.settings-dialog .identity-avatar-mark{width:48px!important;height:48px!important;min-width:48px!important}
  .settings-dialog .identity-title input,.settings-dialog .identity-date input{height:48px!important;font-size:12px!important;padding:0 7px!important}
}

/* v35 back navigation, working archive columns, install tile, icon outline, compact statistics */
.brand-mark{outline:1px solid rgba(0,0,0,.20)!important;outline-offset:-1px!important}

.settings-install-btn{
  min-height:92px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  border:1px solid rgba(73,112,160,.42)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.62),0 10px 24px rgba(31,79,139,.08)!important;
}
.settings-install-btn img{width:42px!important;height:42px!important;border-radius:12px!important;display:block!important;object-fit:cover!important;box-shadow:0 6px 14px rgba(26,62,107,.14)!important}
.settings-install-btn span{display:block!important;font-size:14px!important;font-weight:800!important;line-height:1.15!important}
.settings-install-btn.installed img,.settings-install-btn:disabled img{opacity:.72!important}

.settings-dialog .stat strong{font-size:13px!important;line-height:1.15!important;font-weight:800!important}
.settings-dialog .stat{min-height:62px!important;padding:9px 10px!important}

.archive-head-main{padding-left:58px!important}
.archive-back{
  position:fixed!important;
  left:max(14px,calc(50vw - 640px))!important;
  top:104px!important;
  z-index:40!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(-8px)!important;
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease!important;
}
body.show-archive-back .archive-back{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:translateY(0)!important;
}

.archive-media-grid,
body.list-layout .archive-media-grid{
  display:grid!important;
  grid-template-columns:repeat(var(--archive-cols),minmax(0,1fr))!important;
  grid-auto-flow:row!important;
  grid-auto-rows:auto!important;
  gap:12px!important;
}
.archive-media-grid .media-card,
body.list-layout .archive-media-grid .media-card{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:1/1!important;
  grid-column:auto!important;
  grid-row:auto!important;
}
body.list-layout .archive-media-grid .media-card img,
body.list-layout .archive-media-grid .media-card video,
.archive-media-grid .media-card img,
.archive-media-grid .media-card video{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
body.list-layout .archive-media-grid .media-overlay{position:absolute!important;color:#fff!important;background:linear-gradient(transparent,rgba(6,24,49,.72))!important;padding:28px 10px 10px!important}

@media(max-width:720px){
  .archive-head-main{padding-left:48px!important}
  .archive-back{left:12px!important;top:86px!important;width:40px!important;height:40px!important;padding:0!important;display:grid!important;place-items:center!important}
  .archive-back span{display:none!important}
  .archive-media-grid,body.list-layout .archive-media-grid{gap:8px!important}
  .settings-install-btn{min-height:82px!important}
  .settings-install-btn img{width:38px!important;height:38px!important;border-radius:11px!important}
  .settings-dialog .stat strong{font-size:12px!important}
  .settings-dialog .stat{min-height:56px!important;padding:8px 9px!important}
}

/* v36 immediate grid update, instant favorite and compact selection controls */
select,.compact-select,.header-filters select,.archive-columns-select{
  -webkit-appearance:none!important;
  appearance:none!important;
  height:36px!important;
  min-height:36px!important;
  padding:0 30px 0 11px!important;
  border:1px solid rgba(180,204,233,.88)!important;
  border-radius:11px!important;
  background-color:rgba(255,255,255,.88)!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%235b718e' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;
  background-position:right 10px center!important;
  background-size:11px 7px!important;
  box-shadow:0 5px 14px rgba(45,91,148,.06)!important;
  color:var(--text)!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}
.header-filters select{max-width:142px!important}
.archive-columns-select{width:88px!important;min-width:88px!important;max-width:88px!important}
.archive-media-grid,.media-grid{transition:none!important}
@media(max-width:720px){
  select,.compact-select,.header-filters select,.archive-columns-select{
    height:34px!important;
    min-height:34px!important;
    padding-left:9px!important;
    padding-right:26px!important;
    border-radius:10px!important;
    font-size:11px!important;
    background-position:right 8px center!important;
  }
  #ageFilter{width:124px!important;min-width:124px!important;max-width:124px!important}
  #seasonFilter{width:112px!important;min-width:112px!important;max-width:112px!important}
  .archive-columns-select{width:78px!important;min-width:78px!important;max-width:78px!important}
}

/* v37 closed access with guest/admin roles */
.auth-screen{position:fixed;inset:0;z-index:200;background:linear-gradient(155deg,#eaf3ff 0%,#f8fbff 48%,#dcecff 100%);display:grid;place-items:center;padding:22px}
.auth-screen.hidden{display:none!important}
.auth-card{width:min(430px,100%);padding:34px;border-radius:30px;background:rgba(255,255,255,.94);border:1px solid #d7e5f7;box-shadow:0 28px 80px rgba(29,78,142,.20);text-align:center}
.auth-app-icon{width:112px;height:112px;border-radius:28px;display:block;margin:0 auto 18px;object-fit:cover;box-shadow:0 18px 38px rgba(32,82,147,.18);border:1px solid rgba(18,43,74,.12)}
.auth-card h2{margin:0;font-size:30px;letter-spacing:-.035em}
.auth-card>p{margin:9px 0 24px;color:var(--muted);line-height:1.45}
.auth-card form{display:grid;gap:8px;text-align:left}
.auth-card form>label{font-size:13px;font-weight:750;color:#526b8c}
.auth-password-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px}
.auth-password-row input{height:50px;min-width:0;border:1px solid #cfdef1;border-radius:14px;padding:0 14px;font:inherit;color:var(--text);background:#fff;outline:none}
.auth-password-row input:focus{border-color:#6ba7ef;box-shadow:0 0 0 4px rgba(69,139,229,.12)}
.auth-password-row .primary-btn{height:50px;padding:0 19px}
.login-error{min-height:20px;margin:2px 0 0;color:#be3144;font-size:13px;text-align:left}
.app-shell.locked{filter:blur(7px);pointer-events:none;user-select:none}
.role-display{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 14px;border:1px solid var(--line);border-radius:14px;background:var(--surface2)}
.role-display span{color:var(--muted);font-size:13px}
.role-display strong{font-size:14px;color:var(--primary)}
.role-disabled{opacity:.62;cursor:not-allowed!important}
body.role-guest .fab,
body.role-guest .delete-chip,
body.role-guest .album-delete,
body.role-guest .select-check,
body.role-guest #clearArchiveBtn{display:none!important}
body.role-guest .fav-chip{display:none!important}
body.role-guest #favoriteToggle{display:none!important}
body.role-guest #settingsAvatarBtn{pointer-events:none}
@media(max-width:720px){
  .auth-card{padding:28px 20px;border-radius:26px}
  .auth-app-icon{width:96px;height:96px;border-radius:24px}
  .auth-card h2{font-size:27px}
  .auth-password-row{grid-template-columns:1fr}
  .auth-password-row .primary-btn{width:100%}
}

/* v38: viewer comments, fullscreen controls, cover action */
#viewer{display:flex!important;flex-direction:column!important;overflow:hidden!important}
#viewerMedia{flex:1 1 auto!important;height:auto!important;min-height:0!important}
.viewer-toolbar{position:absolute;top:14px;left:14px;right:14px;z-index:6;display:flex;align-items:center;gap:10px;pointer-events:none}
.viewer-toolbar-spacer{flex:1 1 auto}
.viewer-tool{pointer-events:auto;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.52);color:#fff;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 22px rgba(0,0,0,.18)}
.viewer-tool svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.viewer-close{font-size:26px;line-height:1}
.viewer-info{height:auto!important;max-height:42vh;overflow:auto;padding:18px 20px 18px!important;display:grid!important;grid-template-columns:1fr!important;gap:16px!important;align-items:start!important;background:#071a34!important}
.viewer-info-top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.viewer-meta{min-width:0;display:grid;gap:6px}
.viewer-meta-line{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.viewer-meta-line strong{font-size:15px;line-height:1.4}
.viewer-meta-line span{color:#a9bdd8;font-size:13px}
#viewerCaption{margin:0;color:#dce8f8;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
.viewer-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.viewer-action-btn,#favoriteToggle{border:1px solid #42658d!important;background:rgba(9,33,63,.66)!important;color:#fff!important;border-radius:12px!important;padding:10px 14px!important;display:inline-flex!important;align-items:center!important;gap:9px;cursor:pointer}
.viewer-action-btn svg,#favoriteToggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#favoriteToggle svg{fill:currentColor;stroke:none}
#favoriteToggle.active{background:#fff!important;color:#17365d!important;border-color:#fff!important}
.viewer-action-btn.success{background:#1f8e4b!important;border-color:#1f8e4b!important}
.viewer-comments{display:grid;gap:10px;border-top:1px solid rgba(169,189,216,.18);padding-top:14px}
.viewer-comments-head{display:flex;align-items:center;justify-content:space-between}
.viewer-comments h4{margin:0;font-size:16px}
.viewer-comments-list{display:grid;gap:10px;max-height:200px;overflow:auto;padding-right:4px}
.viewer-comments-empty{padding:10px 12px;border:1px dashed rgba(169,189,216,.25);border-radius:14px;color:#a9bdd8;font-size:13px}
.viewer-comment{display:grid;grid-template-columns:36px minmax(0,1fr);gap:10px;align-items:start}
.viewer-comment-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(145deg,#31588d,#6da7ff);display:grid;place-items:center;font-weight:800;font-size:12px;color:#fff}
.viewer-comment-body{background:rgba(255,255,255,.06);border:1px solid rgba(169,189,216,.16);border-radius:16px;padding:10px 12px;display:grid;gap:5px}
.viewer-comment-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.viewer-comment-meta strong{font-size:13px}
.viewer-comment-meta span{color:#a9bdd8;font-size:12px}
.viewer-comment-body p{margin:0;color:#eff5ff;font-size:14px;line-height:1.4;word-break:break-word}
.viewer-comment-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}
.viewer-comment-form input{height:44px;border:1px solid rgba(169,189,216,.22);border-radius:14px;background:rgba(255,255,255,.08);color:#fff;padding:0 14px;font:inherit}
.viewer-comment-form input::placeholder{color:#9cb1cf}
.viewer-comment-form .primary-btn{height:44px;padding:0 16px}
@media (max-width:720px){
  .viewer-toolbar{top:12px;left:12px;right:12px}
  .viewer-tool{width:40px;height:40px;border-radius:12px}
  .viewer-nav{width:42px!important;height:56px!important;font-size:34px!important}
  .viewer-info{padding:16px 14px 18px!important;max-height:48vh!important}
  .viewer-info-top{flex-direction:column;align-items:stretch}
  .viewer-actions{justify-content:flex-start}
  .viewer-action-btn,#favoriteToggle{width:100%;justify-content:center}
  .viewer-comment-form{grid-template-columns:1fr}
}

/* v39: stable viewer lifecycle, comments layout, location and fullscreen action */
#viewer:not([open]){display:none!important}
#viewer[open]{display:grid!important;grid-template-rows:minmax(0,1fr) auto!important;position:fixed!important;inset:0!important;margin:auto!important}
#viewerMedia{grid-row:1!important;min-height:0!important;height:auto!important;overflow:hidden!important}
.viewer-info{grid-row:2!important;height:auto!important;max-height:310px!important;overflow:hidden!important;display:grid!important;grid-template-columns:1fr!important;grid-template-rows:auto minmax(0,1fr)!important;gap:12px!important;padding:14px 18px 16px!important}
.viewer-info-top{min-height:48px!important;align-items:center!important}
.viewer-meta{gap:4px!important}
.viewer-meta-line{line-height:1.3!important}
.viewer-location{font-size:12px;color:#b9cbe1;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.viewer-actions{flex-wrap:nowrap!important;align-items:center!important}
.viewer-action-icon{border:1px solid #42658d;background:rgba(9,33,63,.66);color:#fff;width:46px;height:46px;flex:0 0 46px;border-radius:12px;display:grid;place-items:center;cursor:pointer}
.viewer-action-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
#favoriteToggle{width:46px!important;height:46px!important;flex:0 0 46px!important;padding:0!important;display:grid!important;place-items:center!important}
#favoriteToggle svg{width:21px!important;height:21px!important}
.viewer-comments{min-height:0!important;display:grid!important;grid-template-rows:auto minmax(0,1fr) auto!important;gap:8px!important;padding-top:10px!important}
.viewer-comments-list{min-height:0!important;max-height:none!important;overflow-y:auto!important;overscroll-behavior:contain;scrollbar-gutter:stable;padding-right:5px!important}
.viewer-comment-form{position:sticky;bottom:0;background:#071a34;padding-top:4px;z-index:2}
.comment-name-field{display:grid;gap:6px;margin-top:12px}
.comment-name-field>span{font-size:12px;font-weight:700;color:var(--muted)}
.comment-name-field input{height:46px;border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:0 12px;color:var(--text);font:inherit}
#viewer:fullscreen{width:100vw!important;height:100vh!important;max-width:none!important;max-height:none!important;inset:0!important;margin:0!important;border-radius:0!important;background:#031025!important;z-index:2147483647!important}
#viewer:fullscreen::backdrop{background:#031025!important}
#viewer:fullscreen .viewer-info{max-height:300px!important}

@media(max-width:720px){
  #viewer[open]{width:100vw!important;height:100dvh!important;max-width:none!important;max-height:none!important;border-radius:0!important;inset:0!important;margin:0!important}
  #viewerMedia{min-height:42dvh!important}
  .viewer-info{max-height:48dvh!important;padding:12px 12px 14px!important;gap:10px!important}
  .viewer-info-top{align-items:flex-start!important;gap:10px!important}
  .viewer-actions{width:100%!important;display:grid!important;grid-template-columns:minmax(0,1fr) 44px 44px!important;gap:8px!important}
  .viewer-action-btn{width:100%!important;min-width:0!important;height:44px!important;justify-content:center!important;padding:0 10px!important}
  #favoriteToggle,.viewer-action-icon{width:44px!important;height:44px!important;flex-basis:44px!important}
  .viewer-comments-list{max-height:none!important}
  .viewer-comment-form{grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important}
  .viewer-comment-form input{min-width:0!important;height:42px!important}
  .viewer-comment-form .primary-btn{height:42px!important;padding:0 12px!important;font-size:13px!important}
  .viewer-comment{grid-template-columns:32px minmax(0,1fr)!important;gap:8px!important}
  .viewer-comment-avatar{width:32px!important;height:32px!important}
}

/* v40: stable mobile viewer, editable comments, reliable fullscreen */
.viewer-comment-meta-right{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.viewer-comment-actions{display:flex;align-items:center;gap:4px}
.viewer-comment-action{width:28px;height:28px;border:0;border-radius:9px;background:rgba(255,255,255,.08);color:#c9d8ec;display:grid;place-items:center;cursor:pointer;padding:0}
.viewer-comment-action:hover{background:rgba(255,255,255,.14);color:#fff}
.viewer-comment-action.danger:hover{background:rgba(216,58,58,.24);color:#ffdada}
.viewer-comment-action svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

#viewer.viewer-fullscreen-mode{display:grid!important;position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;max-width:none!important;max-height:none!important;margin:0!important;border-radius:0!important;z-index:2147483646!important;background:#020d1e!important;grid-template-rows:1fr!important}
#viewer.viewer-fullscreen-mode #viewerMedia{grid-row:1!important;width:100%!important;height:100%!important;min-height:100%!important;background:#020d1e!important}
#viewer.viewer-fullscreen-mode #viewerMedia img,#viewer.viewer-fullscreen-mode #viewerMedia video{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain!important}
#viewer.viewer-fullscreen-mode .viewer-info{display:none!important}
#viewer.viewer-fullscreen-mode .viewer-toolbar{display:flex!important}
#viewer.viewer-fullscreen-mode .viewer-nav{display:block!important}

@media(max-width:720px){
  #viewer[open]:not(.viewer-fullscreen-mode){display:grid!important;grid-template-rows:minmax(280px,56dvh) minmax(0,44dvh)!important;width:100vw!important;height:100dvh!important;max-width:none!important;max-height:none!important;inset:0!important;margin:0!important;border-radius:0!important;overflow:hidden!important}
  #viewer[open]:not(.viewer-fullscreen-mode) #viewerMedia{grid-row:1!important;width:100%!important;height:100%!important;min-height:0!important;overflow:hidden!important;background:#031025!important;padding:0!important}
  #viewer[open]:not(.viewer-fullscreen-mode) #viewerMedia img,#viewer[open]:not(.viewer-fullscreen-mode) #viewerMedia video{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain!important}
  #viewer[open]:not(.viewer-fullscreen-mode) .viewer-info{grid-row:2!important;width:100%!important;height:100%!important;max-height:none!important;min-height:0!important;overflow:hidden!important;padding:12px!important;display:grid!important;grid-template-rows:auto minmax(0,1fr)!important;gap:10px!important}
  .viewer-toolbar{top:10px!important;left:10px!important;right:10px!important;gap:8px!important}
  .viewer-toolbar .viewer-tool{width:40px!important;height:40px!important;flex:0 0 40px!important}
  .viewer-info-top{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important;align-items:start!important;min-height:0!important}
  .viewer-meta{min-width:0!important;gap:3px!important}
  .viewer-meta-line{display:grid!important;gap:2px!important}
  .viewer-meta-line strong{font-size:16px!important;line-height:1.25!important}
  .viewer-meta-line span{font-size:12px!important;line-height:1.25!important}
  .viewer-location{font-size:11px!important}
  .viewer-actions{display:flex!important;width:auto!important;gap:6px!important;align-items:center!important;justify-content:flex-end!important;flex-wrap:nowrap!important}
  .viewer-action-btn,.viewer-action-icon,#favoriteToggle{width:40px!important;height:40px!important;min-width:40px!important;flex:0 0 40px!important;padding:0!important;border-radius:11px!important;display:grid!important;place-items:center!important}
  .viewer-action-btn span{display:none!important}
  .viewer-action-btn svg,.viewer-action-icon svg,#favoriteToggle svg{width:19px!important;height:19px!important}
  .viewer-comments{min-height:0!important;height:100%!important;display:grid!important;grid-template-rows:auto minmax(0,1fr) auto!important;gap:7px!important;padding-top:8px!important;overflow:hidden!important}
  .viewer-comments h4{font-size:16px!important}
  .viewer-comments-list{min-height:0!important;height:100%!important;max-height:none!important;overflow-y:auto!important;padding-right:2px!important}
  .viewer-comment{grid-template-columns:30px minmax(0,1fr)!important;gap:7px!important}
  .viewer-comment-avatar{width:30px!important;height:30px!important;font-size:10px!important}
  .viewer-comment-body{padding:8px 9px!important;border-radius:13px!important}
  .viewer-comment-meta{align-items:flex-start!important;gap:5px!important}
  .viewer-comment-meta strong{font-size:12px!important}
  .viewer-comment-meta-right{gap:4px!important}
  .viewer-comment-meta-right>span{font-size:10px!important}
  .viewer-comment-action{width:25px!important;height:25px!important;border-radius:8px!important}
  .viewer-comment-action svg{width:13px!important;height:13px!important}
  .viewer-comment-body p{font-size:13px!important;line-height:1.35!important}
  .viewer-comment-form{position:static!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:7px!important;padding:0!important;background:#071a34!important}
  .viewer-comment-form input{height:40px!important;min-width:0!important;font-size:13px!important}
  .viewer-comment-form .primary-btn{height:40px!important;padding:0 11px!important;font-size:12px!important}
  .viewer-nav{top:calc(28dvh - 28px)!important;width:40px!important;height:54px!important;font-size:32px!important}
  .viewer-nav.prev{left:6px!important}.viewer-nav.next{right:6px!important}
}

/* v42: compact inline comments, immediate grid state, red active favorites */
.viewer-comment{display:grid!important;grid-template-columns:30px minmax(0,1fr)!important;gap:8px!important;align-items:center!important}
.viewer-comment-avatar{width:30px!important;height:30px!important;font-size:10px!important}
.viewer-comment-line{min-width:0;display:flex;align-items:center;gap:7px;padding:7px 9px;border:1px solid rgba(169,189,216,.16);border-radius:12px;background:rgba(255,255,255,.055);white-space:nowrap;overflow:hidden}
.viewer-comment-author{flex:0 0 auto;font-size:12px;color:#fff}
.viewer-comment-text{min-width:0;flex:1 1 auto;margin:0!important;color:#eff5ff!important;font-size:13px!important;line-height:1.25!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.viewer-comment-time{flex:0 0 auto;color:#9fb3cf!important;font-size:10px!important}
.viewer-comment-actions{flex:0 0 auto;display:flex;align-items:center;gap:3px!important}
.viewer-comment-action{width:22px!important;height:22px!important;border-radius:7px!important;padding:0!important;background:rgba(255,255,255,.07)!important;color:#b9cbe2!important}
.viewer-comment-action svg{width:12px!important;height:12px!important}
.viewer-comment-action.danger{color:#ff5964!important;background:rgba(255,58,68,.10)!important}
.viewer-comment-action.danger:hover{color:#fff!important;background:#d83a3a!important}
@media(max-width:720px){
  .viewer-comment{grid-template-columns:28px minmax(0,1fr)!important;gap:6px!important}
  .viewer-comment-avatar{width:28px!important;height:28px!important}
  .viewer-comment-line{gap:5px!important;padding:6px 7px!important}
  .viewer-comment-author{font-size:11px!important}
  .viewer-comment-text{font-size:12px!important}
  .viewer-comment-time{font-size:9px!important}
  .viewer-comment-action{width:20px!important;height:20px!important;border-radius:6px!important}
  .viewer-comment-action svg{width:11px!important;height:11px!important}
}

.fav-chip.active{background:#fff!important;color:#e53945!important}
.fav-chip.active::first-letter{color:#e53945!important}
#favoriteToggle.active{background:rgba(229,57,69,.16)!important;color:#e53945!important;border-color:rgba(229,57,69,.55)!important}
#favoriteToggle.active svg{fill:#e53945!important;color:#e53945!important}
.favorite-header-btn.active{background:rgba(229,57,69,.14)!important;color:#e53945!important;border-color:rgba(229,57,69,.42)!important}
.favorite-header-btn.active svg{fill:#e53945!important;stroke:#e53945!important}

.archive-view[data-columns="1"] .archive-media-grid{grid-template-columns:repeat(1,minmax(0,1fr))!important}
.archive-view[data-columns="2"] .archive-media-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.archive-view[data-columns="3"] .archive-media-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.archive-view[data-columns="4"] .archive-media-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.archive-view[data-columns="5"] .archive-media-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important}

/* v44: compact comments without avatar and responsive dative age line */
.viewer-comment{display:block!important;min-width:0!important}
.viewer-comment-avatar{display:none!important}
.viewer-comment-line{width:100%!important;min-width:0!important;display:flex!important;align-items:center!important;gap:8px!important;padding:7px 9px!important;white-space:normal!important;overflow:visible!important}
.viewer-comment-content{min-width:0!important;flex:1 1 auto!important;display:flex!important;align-items:baseline!important;flex-wrap:wrap!important;column-gap:.55em!important;row-gap:2px!important}
.viewer-comment-author{flex:0 0 auto!important;font-weight:800!important;font-style:normal!important;font-family:inherit!important;color:#fff!important}
.viewer-comment-text{min-width:0!important;flex:0 1 auto!important;margin:0!important;font-family:inherit!important;font-weight:400!important;font-style:italic!important;color:#eff5ff!important;overflow-wrap:anywhere!important;white-space:normal!important;text-overflow:clip!important;overflow:visible!important}
.viewer-comment-time{flex:0 0 auto!important;white-space:nowrap!important}
.viewer-comment-actions{flex:0 0 auto!important}
@media(max-width:720px){
  .viewer-comment-line{align-items:flex-start!important;gap:6px!important;padding:7px!important;flex-wrap:wrap!important}
  .viewer-comment-content{flex:1 1 calc(100% - 92px)!important;column-gap:.5em!important}
  .viewer-comment-time{font-size:9px!important;margin-left:auto!important;padding-top:2px!important}
  .viewer-comment-actions{margin-left:auto!important}
}

/* v46: mobile comment action spacing */
@media (max-width:720px){
  .viewer-comment-actions{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    flex-wrap:nowrap!important;
    gap:7px!important;
    margin-left:auto!important;
    min-width:max-content!important;
  }
  .viewer-comment-action{
    flex:0 0 auto!important;
    position:relative!important;
    inset:auto!important;
    transform:none!important;
  }
  .viewer-comment-action.danger{
    margin-left:2px!important;
  }
}

/* v47: settings dialog scroll on every viewport */
.settings-dialog{
  width:min(720px,94vw)!important;
  height:min(92dvh,860px)!important;
  max-height:92dvh!important;
  overflow:hidden!important;
  border-radius:24px!important;
}
.settings-dialog .settings-content{
  height:100%!important;
  max-height:100%!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-gutter:stable!important;
  touch-action:pan-y!important;
}
.settings-dialog .dialog-title{
  position:sticky!important;
  top:0!important;
  z-index:8!important;
  background:rgba(255,255,255,.97)!important;
  backdrop-filter:blur(10px)!important;
  -webkit-backdrop-filter:blur(10px)!important;
}
body.dark .settings-dialog .dialog-title{
  background:rgba(13,33,59,.97)!important;
}
@media(max-width:720px){
  .settings-dialog{
    width:min(94vw,560px)!important;
    height:calc(100dvh - 28px)!important;
    max-height:calc(100dvh - 28px)!important;
  }
  .settings-dialog .settings-content{
    height:100%!important;
    max-height:100%!important;
    padding-bottom:calc(28px + env(safe-area-inset-bottom))!important;
  }
}