:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:#17333d;background:#f3f6f4;font-size:16px}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:default}.hidden{display:none!important}.shell{display:flex;min-height:100vh}.sidebar{width:264px;flex:none;background:#15313a;color:#ecf5f1;display:flex;flex-direction:column;padding:31px 18px 21px;position:sticky;top:0;height:100vh;z-index:15}.brand{display:flex;align-items:center;gap:12px;padding:0 14px 42px;font-size:14px;line-height:1.15;letter-spacing:.14em;font-weight:600}.brand strong{font-size:21px;letter-spacing:.09em}.brand-mark{display:grid;place-items:center;width:43px;height:43px;border:1px solid #7caa9e;border-radius:14px;color:#a8d0bb;font-size:32px;line-height:1}.sidebar-nav{display:grid;gap:6px}.nav{color:#ccdbd7;background:transparent;border:0;text-align:left;padding:13px 15px;border-radius:12px;display:flex;gap:15px;align-items:center;font-size:17px;width:100%}.nav span{font-size:15px}.nav:hover,.nav.active{background:#2c5058;color:#fff}.sidebar-bottom{margin-top:auto}.storage{padding:20px 14px;border-bottom:1px solid #45616a}.storage-row{display:flex;justify-content:space-between;gap:5px;font-size:13px;color:#c5d8d2}.storage small{color:#a4bcb7;font-size:12px}.meter{height:6px;background:#3c5860;border-radius:50px;margin:13px 0 8px;overflow:hidden}.meter span{display:block;background:#a5d4b5;height:100%;width:0}.account{display:flex;gap:12px;align-items:center;padding:20px 12px 7px}.account-icon{width:38px;height:38px;border-radius:13px;background:#37655f;display:grid;place-items:center;font-size:24px;color:#d9eee2}.account strong,.account small{display:block}.account strong{font-size:14px}.account small{font-size:12px;color:#a7c3bd;margin-top:4px}.sidebar-logout{margin:0 11px;color:#afc8c0;background:none;border:none;padding:9px 0}.main-wrap{min-width:0;flex:1}.topbar{height:80px;border-bottom:1px solid #dce5e2;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(22px,4vw,64px);background:#fff}.topbar-label{font-size:14px;font-weight:650;color:#32515a}.topbar-right{font-size:13px;color:#6d8585;display:flex;align-items:center;gap:10px}.private-dot{width:7px;height:7px;background:#7ba98d;border-radius:50%}.menu-btn{display:none;background:transparent;border:0;font-size:23px;color:#24424a}main{padding:45px clamp(22px,4vw,64px) 90px;max-width:1580px;margin:auto}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:12px;color:#578b77;font-weight:750;margin:0 0 13px}h1{font-family:Georgia,serif;font-size:clamp(34px,4vw,54px);font-weight:400;letter-spacing:-.035em;line-height:1.1;margin:0}h2{font-family:Georgia,serif;font-size:27px;font-weight:400;letter-spacing:-.02em;margin:0}p{line-height:1.55}.welcome{background:#e6efeb;border:1px solid #d6e5dd;border-radius:28px;padding:clamp(28px,6vw,72px);max-width:850px;margin:30px auto}.welcome>p:not(.eyebrow){max-width:500px;color:#526e6e}.login-form{display:grid;gap:13px;max-width:380px;margin-top:28px}label{display:grid;gap:7px;color:#38545a;font-weight:600;font-size:14px}input,select{width:100%;padding:12px 14px;border:1px solid #cbd9d4;border-radius:10px;background:#fff;color:#18343d;outline:0;min-height:46px}input:focus,select:focus{border-color:#307d71;box-shadow:0 0 0 3px #bce0d1}.primary,.secondary,.danger{border:0;border-radius:11px;min-height:46px;padding:11px 18px;font-weight:650}.primary{background:#1b6257;color:white}.primary:hover{background:#145145}.secondary{color:#23574f;background:#e5f0e9;border:1px solid #cfe1d8}.danger{background:#f9e8e4;color:#a23e32}.form-error{color:#b43c30;min-height:18px;font-size:14px}.heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:32px}.heading p{color:#738889;margin:11px 0 0;font-size:15px}.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.folders,.files{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}.folder-card{position:relative;background:#fff;border:1px solid #e0e8e5;border-radius:18px;overflow:hidden;transition:transform .15s,box-shadow .15s;cursor:pointer}.folder-card:hover,.file-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px #152b3212}.folder-cover{height:165px;background:linear-gradient(135deg,#dcebe2,#b4d1c4);display:flex;align-items:center;justify-content:center;color:#5c8e7b;font-family:Georgia,serif;font-size:80px;overflow:hidden}.folder-cover img{width:100%;height:100%;object-fit:cover}.folder-info{padding:18px 19px}.folder-info h2{font-family:inherit;font-size:18px;font-weight:680;overflow-wrap:anywhere}.folder-meta{display:flex;justify-content:space-between;color:#78908f;font-size:13px;margin-top:10px}.empty{background:#fff;border:1px dashed #b8ceca;border-radius:18px;padding:50px 28px;text-align:center;color:#587370}.empty-icon{font-size:48px;color:#78a599;margin-bottom:12px}.back{border:0;background:transparent;padding:0;color:#438777;font-size:14px;font-weight:700;margin-bottom:22px}.file-card{background:#fff;border:1px solid #e0e8e5;border-radius:16px;overflow:hidden;transition:transform .15s,box-shadow .15s}.file-preview{height:190px;background:#dce8e4;display:grid;place-items:center;cursor:pointer;overflow:hidden;position:relative}.file-preview img{width:100%;height:100%;object-fit:cover}.play{font-size:40px;color:#fff;background:#17333d9c;width:66px;height:66px;border-radius:50%;display:grid;place-items:center;padding-left:5px}.file-name{padding:14px 15px 0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-weight:650;font-size:14px}.file-footer{padding:8px 15px 15px;display:flex;justify-content:space-between;align-items:center;color:#738988;font-size:13px}.icon-btn{border:0;background:transparent;color:#8a6d6b;font-size:22px;padding:0 5px}.actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.access-box,.upload-box,.admin-box{background:#fff;border:1px solid #dfebe5;border-radius:18px;padding:23px;margin-top:26px}.access-box h2,.upload-box h2,.admin-box h2{font-family:inherit;font-size:18px;font-weight:700}.access-row,.admin-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #e8efed}.access-row:last-child,.admin-row:last-child{border:0}.access-row small,.admin-row small{color:#738b89}.checkbox{width:20px;height:20px;min-height:20px;accent-color:#1b6257}.upload-box{border:1.5px dashed #8bbbaa;background:#f8fbf8;text-align:center}.upload-box.drag{background:#e3f3e8}.upload-box p{color:#69817e}.upload-box input{display:none}.progress{margin-top:12px;color:#2b6d5f;font-size:14px}.modal-shade{position:fixed;inset:0;background:#10272c9c;z-index:30;display:grid;place-items:center;padding:20px}.modal{background:#fff;border-radius:18px;padding:27px;width:min(100%,440px);display:grid;gap:15px;box-shadow:0 22px 90px #10272c48}.modal h2{font-size:26px}.modal .toolbar{justify-content:flex-end}.overlay{position:fixed;inset:0;background:#10191deb;z-index:40;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:65px 18px 25px;color:white}.overlay img,.overlay video{max-width:100%;max-height:76vh;object-fit:contain}.overlay #viewerCaption{margin-top:15px;max-width:100%;overflow-wrap:anywhere;text-align:center}.viewer-close{position:absolute;top:10px;right:25px;background:none;border:0;color:white;font-size:42px}.toast{position:fixed;bottom:20px;right:20px;z-index:60;background:#183a3c;color:#fff;border-radius:10px;padding:12px 18px;max-width:350px;display:none}.toast.show{display:block}@media(max-width:850px){.sidebar{position:fixed;transform:translateX(-100%);transition:transform .2s;box-shadow:10px 0 30px #102b2c22}.sidebar.open{transform:none}.menu-btn{display:block}.topbar{height:65px;padding:0 20px}.topbar-label{margin-right:auto;margin-left:15px}main{padding:30px 20px 65px}.heading{align-items:start;flex-direction:column}.folder-cover{height:130px}}@media(max-width:520px){.topbar-right{font-size:0}.topbar-right .private-dot{width:8px;height:8px}.folders,.files{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.folder-cover{height:112px}.folder-info{padding:13px}.folder-info h2{font-size:15px}.folder-meta{font-size:12px;gap:5px}.file-preview{height:140px}.file-footer{font-size:12px}.welcome{margin:8px auto}.actions{width:100%}.actions button{flex:1}}
.sidebar{overflow-y:auto}.sidebar-login{display:grid;gap:12px;padding:18px 13px 21px;border:1px solid #496b6d;border-radius:15px;background:#22444a;margin-bottom:14px}.sidebar-login strong{font-size:15px}.sidebar-login label{color:#d6e9e2}.sidebar-login input{min-height:40px;padding:9px 11px;border-color:#71938d}.sidebar-login .primary{background:#9dcfb2;color:#173c35;min-height:42px}.sidebar-login .form-error{color:#ffb9aa}.mobile-login{display:none}@media(max-width:850px){.mobile-login{display:inline-flex;align-items:center;margin-top:14px}.sidebar-bottom{margin-top:30px}.sidebar{width:min(85vw,310px)}}
/* Nested folders, video thumbnails, and media navigation */
.breadcrumbs{display:flex;align-items:center;flex-wrap:wrap;gap:9px;color:#648079;margin:-12px 0 27px;font-size:14px}.breadcrumbs button{background:none;border:0;padding:4px;color:#307565}.breadcrumbs strong{color:#26484c;overflow-wrap:anywhere}.subfolders{margin:0 0 30px}.subfolders>h2{margin-bottom:16px}.file-section{margin-top:30px}.file-preview>.play{position:absolute;z-index:1;font-size:30px;width:55px;height:55px;pointer-events:none}.file-preview:has(img)>img{position:absolute;inset:0}.viewer-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2;border:0;border-radius:50%;background:#fff3;color:#fff;font-size:52px;line-height:1;width:58px;height:58px;display:grid;place-items:center}.viewer-arrow:hover{background:#fff6}.viewer-arrow:disabled{opacity:.25;cursor:default}.viewer-prev{left:20px}.viewer-next{right:20px}#viewerContent{max-width:calc(100% - 140px);display:grid;place-items:center}#viewerContent video{max-width:100%;max-height:76vh}@media(max-width:520px){.viewer-arrow{top:auto;bottom:8px;transform:none;width:48px;height:48px;font-size:42px}.viewer-prev{left:15px}.viewer-next{right:15px}#viewerContent{max-width:100%}.overlay{padding-bottom:84px}.overlay #viewerCaption{padding:0 45px}}
/* Folder stories and personal reactions */
textarea{font:inherit;width:100%;padding:12px 14px;border:1px solid #cbd9d4;border-radius:10px;background:#fff;color:#18343d;resize:vertical;min-height:150px}textarea:focus{outline:2px solid #8ebca9;outline-offset:2px}.description-box{background:#fff;border:1px solid #dfe8e3;border-radius:18px;padding:22px;margin:0 0 28px}.description-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.description-heading h2{font-family:inherit;font-size:18px;font-weight:650}.folder-description{white-space:pre-wrap;overflow-wrap:anywhere;color:#4c6967;margin-bottom:0}.folder-summary{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;color:#65807a;font-size:13px;margin:10px 0 0}.like-btn{display:inline-flex;gap:7px;align-items:center;justify-content:center;min-width:64px;min-height:44px;padding:6px 12px;background:#f5f8f6;border:1px solid #d7e3dc;border-radius:24px;color:#526e68;font-size:14px;white-space:nowrap}.like-btn>span:first-child{font-size:25px;line-height:1}.like-btn.liked{background:#fff0f2;color:#b52d56;border-color:#edbecb}.like-btn:hover{border-color:#b52d56}.like-btn:focus-visible,.file-preview:focus-visible{outline:3px solid #619e87;outline-offset:2px}.file-footer{gap:8px}.feed-list{max-width:800px;margin:0 auto;display:grid;gap:28px}.feed-list .file-preview{display:block;height:auto;background:#e8eeea}.feed-list .file-preview img{display:block;position:static;inset:auto;width:100%;height:auto;max-height:none;object-fit:contain}.feed-list .file-name{font-size:16px}.feed-source{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:14px 17px;color:#698078;font-size:13px}.folder-source{border:0;background:transparent;padding:4px 0;color:#326f60;text-align:left;font-weight:650;overflow-wrap:anywhere;min-width:0}.feed-source>span{overflow-wrap:anywhere}.collection-controls{display:flex;justify-content:center;padding:30px 0}.collection-controls button{min-width:180px}#viewerReaction{margin-top:10px}.overlay #viewerContent img,.overlay #viewerContent video{max-height:calc(100dvh - 230px)}.file-preview.preview-unavailable:after{content:'Превью недоступно';font-size:13px;color:#587370}.file-preview.preview-unavailable:has(.play):after{position:absolute;bottom:12px}.modal{max-height:90dvh;overflow-y:auto}@media(max-width:520px){.description-heading{align-items:start;flex-direction:column}.description-box{padding:17px}.feed-list{gap:18px}.feed-source{padding:12px;gap:9px}.like-btn{padding:5px 9px;min-width:57px}.overlay #viewerContent img,.overlay #viewerContent video{max-height:calc(100dvh - 260px)}.file-footer{flex-wrap:wrap}}
/* Mobile gestures, folder access, and family chat */
#viewerContent{touch-action:pan-y pinch-zoom}#viewerContent img{user-select:none;-webkit-user-select:none;-webkit-user-drag:none}.viewer-actions{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:10px}.viewer-actions #viewerReaction{margin-top:0}.access-modal{width:min(100%,540px)}.access-modal>p{color:#59746d;font-size:14px;margin:0}.access-list{max-height:45dvh;overflow-y:auto}.access-role{display:block;font-weight:400;margin-top:5px}.sidebar{overflow-y:auto}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.chat-heading{margin-bottom:20px}.chat-heading h1{font-size:42px}.chat-layout{height:calc(100dvh - 280px);min-height:430px;max-height:900px;display:flex;flex-direction:column;background:#fff;border:1px solid #dbe6df;border-radius:20px;overflow:hidden;max-width:960px;margin:auto}.chat-earlier{margin:10px auto 0;flex:none;min-height:36px;font-size:13px;padding:7px 15px}.chat-messages{flex:1;min-height:160px;overflow-y:auto;padding:20px;overscroll-behavior:contain;overflow-anchor:none;display:flex;flex-direction:column;gap:14px}.chat-message{align-self:flex-start;background:#f0f5f2;border:1px solid #e0e9e3;border-radius:15px;padding:13px 16px;width:fit-content;max-width:85%;overflow-wrap:anywhere;flex:none}.chat-message.mine{align-self:flex-end;background:#e2f1e8;border-color:#cce2d5}.chat-message header{display:flex;align-items:center;gap:12px;font-size:13px}.chat-message header time{font-size:11px;color:#70837c}.chat-delete{border:0;background:transparent;color:#8c6f69;margin-left:auto;font-size:22px;min-width:32px;min-height:32px}.chat-text{white-space:pre-wrap;margin:7px 0 0;font-size:15px}.chat-removed,.chat-missing{font-size:13px;color:#6f827a;font-style:italic}.chat-attachments{display:flex;gap:9px;flex-wrap:wrap;margin-top:10px}.chat-photo{display:flex;flex-direction:column;align-items:center;position:relative;border:1px solid #d1ded5;background:#fff;border-radius:10px;overflow:hidden;padding:0;max-width:230px;min-width:100px}.chat-photo img{display:block;width:100%;height:170px;object-fit:contain}.chat-photo small{padding:6px 9px;color:#5b796d;font-size:11px}.chat-play{position:absolute;top:60px;color:#fff;background:#15313aaa;border-radius:50%;padding:13px}.chat-composer{flex:none;padding:14px 18px;border-top:1px solid #e0e9e3;background:#fafcfb}.chat-composer textarea{min-height:62px;max-height:140px;resize:vertical}.chat-composer-actions{display:flex;align-items:center;gap:10px;margin-top:9px;flex-wrap:wrap}.chat-composer-actions small{font-size:11px;color:#71857c;flex:1}.chat-composer .form-error{min-height:0;margin-top:7px}.chat-draft-files{display:flex;gap:8px;flex-wrap:wrap}.chat-draft-item{display:flex;align-items:center;gap:7px;background:#e7f0e9;border-radius:9px;padding:6px 9px;margin-bottom:8px;font-size:12px;max-width:100%}.chat-draft-item img{width:38px;height:38px;object-fit:cover;border-radius:5px}.chat-draft-item span{overflow-wrap:anywhere;min-width:0}.chat-draft-item button{border:0;background:none;font-size:22px;min-width:32px}.chat-empty{text-align:center;padding:25px;color:#638173;font-size:14px;margin:auto}.chat-photo:focus-visible{outline:3px solid #42846a;outline-offset:2px}@media(max-width:520px){.chat-heading h1{font-size:34px}.chat-layout{min-height:400px;height:calc(100dvh - 230px);border-radius:14px}.chat-messages{padding:12px;gap:11px}.chat-message{max-width:95%;padding:10px 12px}.chat-message header{gap:8px}.chat-photo{max-width:100%}.chat-photo img{height:155px}.chat-composer{padding:11px}.chat-composer-actions small{order:3;flex-basis:100%}.chat-composer-actions #chatSend{margin-left:auto}.chat-composer-actions button{padding:9px 12px;font-size:14px}.viewer-actions{gap:8px}.viewer-actions button{font-size:13px}.overlay #viewerContent img,.overlay #viewerContent video{max-height:calc(100dvh - 280px)}}

/* Reserve space until a feed preview is decoded, keeping portraits uncropped. */
.feed-list img[data-src]:not(.preview-loaded){min-height:240px;background:#e7eeea}
img.preview-failed{min-height:100px;background:#e7eeea;color:#526e6e;font-size:13px}
.file-card{content-visibility:auto;contain-intrinsic-size:auto 320px}
.feed-list .file-card{contain-intrinsic-size:auto 650px}

.feed-filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.feed-filters button{white-space:nowrap}
