/* Диск ProPeptides — вид «как почта» (макет «А»). Собирается build.py из disk.tpl.css: размеры в px умножаются на --s (как в теме почты), значки подставляются из ic/. Сам File Browser не правится: файл подключает nginx (sub_filter в disk.conf). */ @font-face{font-family:"Onest";font-style:normal;font-weight:100 900;font-display:swap;src:url("/_pp/fonts/Onest-cyrillic-ext.woff2") format("woff2");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F} @font-face{font-family:"Onest";font-style:normal;font-weight:100 900;font-display:swap;src:url("/_pp/fonts/Onest-cyrillic.woff2") format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116} @font-face{font-family:"Onest";font-style:normal;font-weight:100 900;font-display:swap;src:url("/_pp/fonts/Onest-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+20B8,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} :root{ color-scheme:light; --a-green:#36605a;--a-deep:#23443f;--a-press:#2b4f4a;--a-tint:#e7efec;--a-wash:#f3f5f4;--a-ink:#14201d;--a-text:#2a3633; --a-muted:#5b6965;--a-faint:#606c69;--a-line:#e3e9e6;--a-line2:#cdd6d2;--a-edge:#84908c;--a-red:#a3372b;--a-red-wash:#fbeeec; --a-shadow:0 1px 2px rgba(35,68,63,.06),0 calc(12px*var(--s)) calc(32px*var(--s)) rgba(35,68,63,.12); --font:"Onest",ui-sans-serif,system-ui,-apple-system,"Segoe UI","Helvetica Neue",Arial,sans-serif; /* переменные самого File Browser — в наши цвета */ --blue:var(--a-green);--dark-blue:var(--a-deep);--red:var(--a-red);--dark-red:var(--a-red); --action:var(--a-muted);--background:#fff;--surfacePrimary:#fff;--surfaceSecondary:var(--a-wash); --divider:var(--a-line);--iconPrimary:var(--a-green);--iconSecondary:#fff;--iconTertiary:var(--a-line2); --textPrimary:var(--a-muted);--textSecondary:var(--a-ink);--hover:rgba(35,68,63,.07); --borderPrimary:var(--a-line);--borderSecondary:var(--a-line2);--item-selected:var(--a-tint); --input-red:var(--a-red-wash);--input-green:var(--a-tint); --i-arrow-down:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14' /%3E %3Cpath d='m19 12-7 7-7-7' /%3E%3C/svg%3E"); --i-arrow-left:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 19-7-7 7-7' /%3E %3Cpath d='M19 12H5' /%3E%3C/svg%3E"); --i-arrow-up:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 7-7 7 7' /%3E %3Cpath d='M12 19V5' /%3E%3C/svg%3E"); --i-arrow-up-right:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7h10v10' /%3E %3Cpath d='M7 17 17 7' /%3E%3C/svg%3E"); --i-check:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5' /%3E%3C/svg%3E"); --i-chevron-down:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6' /%3E%3C/svg%3E"); --i-chevron-left:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m15 18-6-6 6-6' /%3E%3C/svg%3E"); --i-chevron-right:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6' /%3E%3C/svg%3E"); --i-circle-alert:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10' /%3E %3Cline x1='12' x2='12' y1='8' y2='12' /%3E %3Cline x1='12' x2='12.01' y1='16' y2='16' /%3E%3C/svg%3E"); --i-clipboard-copy:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='8' height='4' x='8' y='2' rx='1' ry='1' /%3E %3Cpath d='M8 4H6a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2' /%3E %3Cpath d='M16 4h2a2 2 0 0 1 2 2v4' /%3E %3Cpath d='M21 14H11' /%3E %3Cpath d='m15 10-4 4 4 4' /%3E%3C/svg%3E"); --i-copy:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2' ry='2' /%3E %3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2' /%3E%3C/svg%3E"); --i-download:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4' /%3E %3Cpolyline points='7 10 12 15 17 10' /%3E %3Cline x1='12' x2='12' y1='15' y2='3' /%3E%3C/svg%3E"); --i-ellipsis-vertical:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='1' /%3E %3Ccircle cx='12' cy='5' r='1' /%3E %3Ccircle cx='12' cy='19' r='1' /%3E%3C/svg%3E"); --i-external-link:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6' /%3E %3Cpath d='M10 14 21 3' /%3E %3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6' /%3E%3C/svg%3E"); --i-eye:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0' /%3E %3Ccircle cx='12' cy='12' r='3' /%3E%3C/svg%3E"); --i-file:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z' /%3E %3Cpath d='M14 2v4a2 2 0 0 0 2 2h4' /%3E%3C/svg%3E"); --i-file-archive:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 12v-1' /%3E %3Cpath d='M10 18v-2' /%3E %3Cpath d='M10 7V6' /%3E %3Cpath d='M14 2v4a2 2 0 0 0 2 2h4' /%3E %3Cpath d='M15.5 22H18a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v16a2 2 0 0 0 .274 1.01' /%3E %3Ccircle cx='10' cy='20' r='2' /%3E%3C/svg%3E"); --i-file-code:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 12.5 8 15l2 2.5' /%3E %3Cpath d='m14 12.5 2 2.5-2 2.5' /%3E %3Cpath d='M14 2v4a2 2 0 0 0 2 2h4' /%3E %3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7z' /%3E%3C/svg%3E"); --i-file-plus:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z' /%3E %3Cpath d='M14 2v4a2 2 0 0 0 2 2h4' /%3E %3Cpath d='M9 15h6' /%3E %3Cpath d='M12 18v-6' /%3E%3C/svg%3E"); --i-file-spreadsheet:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z' /%3E %3Cpath d='M14 2v4a2 2 0 0 0 2 2h4' /%3E %3Cpath d='M8 13h2' /%3E %3Cpath d='M14 13h2' /%3E %3Cpath d='M8 17h2' /%3E %3Cpath d='M14 17h2' /%3E%3C/svg%3E"); --i-file-text:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z' /%3E %3Cpath d='M14 2v4a2 2 0 0 0 2 2h4' /%3E %3Cpath d='M10 9H8' /%3E %3Cpath d='M16 13H8' /%3E %3Cpath d='M16 17H8' /%3E%3C/svg%3E"); --i-film:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='3' rx='2' /%3E %3Cpath d='M7 3v18' /%3E %3Cpath d='M3 7.5h4' /%3E %3Cpath d='M3 12h18' /%3E %3Cpath d='M3 16.5h4' /%3E %3Cpath d='M17 3v18' /%3E %3Cpath d='M17 7.5h4' /%3E %3Cpath d='M17 16.5h4' /%3E%3C/svg%3E"); --i-folder:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z' /%3E%3C/svg%3E"); --i-folder-input:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 9V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H20a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2v-1' /%3E %3Cpath d='M2 13h10' /%3E %3Cpath d='m9 16 3-3-3-3' /%3E%3C/svg%3E"); --i-folder-open:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 14 1.5-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.54 6a2 2 0 0 1-1.95 1.5H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H18a2 2 0 0 1 2 2v2' /%3E%3C/svg%3E"); --i-folder-plus:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 10v6' /%3E %3Cpath d='M9 13h6' /%3E %3Cpath d='M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z' /%3E%3C/svg%3E"); --i-house:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8' /%3E %3Cpath d='M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z' /%3E%3C/svg%3E"); --i-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='3' rx='2' ry='2' /%3E %3Ccircle cx='9' cy='9' r='2' /%3E %3Cpath d='m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21' /%3E%3C/svg%3E"); --i-images:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 22H4a2 2 0 0 1-2-2V6' /%3E %3Cpath d='m22 13-1.296-1.296a2.41 2.41 0 0 0-3.408 0L11 18' /%3E %3Ccircle cx='12' cy='8' r='2' /%3E %3Crect width='16' height='16' x='6' y='2' rx='2' /%3E%3C/svg%3E"); --i-info:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10' /%3E %3Cpath d='M12 16v-4' /%3E %3Cpath d='M12 8h.01' /%3E%3C/svg%3E"); --i-layout-grid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='7' height='7' x='3' y='3' rx='1' /%3E %3Crect width='7' height='7' x='14' y='3' rx='1' /%3E %3Crect width='7' height='7' x='14' y='14' rx='1' /%3E %3Crect width='7' height='7' x='3' y='14' rx='1' /%3E%3C/svg%3E"); --i-link:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71' /%3E %3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71' /%3E%3C/svg%3E"); --i-list:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h.01' /%3E %3Cpath d='M3 18h.01' /%3E %3Cpath d='M3 6h.01' /%3E %3Cpath d='M8 12h13' /%3E %3Cpath d='M8 18h13' /%3E %3Cpath d='M8 6h13' /%3E%3C/svg%3E"); --i-lock:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='11' x='3' y='11' rx='2' ry='2' /%3E %3Cpath d='M7 11V7a5 5 0 0 1 10 0v4' /%3E%3C/svg%3E"); --i-log-out:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4' /%3E %3Cpolyline points='16 17 21 12 16 7' /%3E %3Cline x1='21' x2='9' y1='12' y2='12' /%3E%3C/svg%3E"); --i-mail:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='16' x='2' y='4' rx='2' /%3E %3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7' /%3E%3C/svg%3E"); --i-maximize:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3H5a2 2 0 0 0-2 2v3' /%3E %3Cpath d='M21 8V5a2 2 0 0 0-2-2h-3' /%3E %3Cpath d='M3 16v3a2 2 0 0 0 2 2h3' /%3E %3Cpath d='M16 21h3a2 2 0 0 0 2-2v-3' /%3E%3C/svg%3E"); --i-menu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='4' x2='20' y1='12' y2='12' /%3E %3Cline x1='4' x2='20' y1='6' y2='6' /%3E %3Cline x1='4' x2='20' y1='18' y2='18' /%3E%3C/svg%3E"); --i-minus:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14' /%3E%3C/svg%3E"); --i-music:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18V5l12-2v13' /%3E %3Ccircle cx='6' cy='18' r='3' /%3E %3Ccircle cx='18' cy='16' r='3' /%3E%3C/svg%3E"); --i-pencil:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z' /%3E %3Cpath d='m15 5 4 4' /%3E%3C/svg%3E"); --i-plus:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14' /%3E %3Cpath d='M12 5v14' /%3E%3C/svg%3E"); --i-presentation:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 3h20' /%3E %3Cpath d='M21 3v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V3' /%3E %3Cpath d='m7 21 5-5 5 5' /%3E%3C/svg%3E"); --i-refresh-cw:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8' /%3E %3Cpath d='M21 3v5h-5' /%3E %3Cpath d='M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16' /%3E %3Cpath d='M8 16H3v5' /%3E%3C/svg%3E"); --i-save:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15.2 3a2 2 0 0 1 1.4.6l3.8 3.8a2 2 0 0 1 .6 1.4V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z' /%3E %3Cpath d='M17 21v-7a1 1 0 0 0-1-1H8a1 1 0 0 0-1 1v7' /%3E %3Cpath d='M7 3v4a1 1 0 0 0 1 1h7' /%3E%3C/svg%3E"); --i-search:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8' /%3E %3Cpath d='m21 21-4.3-4.3' /%3E%3C/svg%3E"); --i-settings:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z' /%3E %3Ccircle cx='12' cy='12' r='3' /%3E%3C/svg%3E"); --i-share-2:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='18' cy='5' r='3' /%3E %3Ccircle cx='6' cy='12' r='3' /%3E %3Ccircle cx='18' cy='19' r='3' /%3E %3Cline x1='8.59' x2='15.42' y1='13.51' y2='17.49' /%3E %3Cline x1='15.41' x2='8.59' y1='6.51' y2='10.49' /%3E%3C/svg%3E"); --i-square-check-big:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10.5V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h12.5' /%3E %3Cpath d='m9 11 3 3L22 4' /%3E%3C/svg%3E"); --i-trash-2:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18' /%3E %3Cpath d='M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6' /%3E %3Cpath d='M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2' /%3E %3Cline x1='10' x2='10' y1='11' y2='17' /%3E %3Cline x1='14' x2='14' y1='11' y2='17' /%3E%3C/svg%3E"); --i-unlink:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m18.84 12.25 1.72-1.71h-.02a5.004 5.004 0 0 0-.12-7.07 5.006 5.006 0 0 0-6.95 0l-1.72 1.71' /%3E %3Cpath d='m5.17 11.75-1.71 1.71a5.004 5.004 0 0 0 .12 7.07 5.006 5.006 0 0 0 6.95 0l1.71-1.71' /%3E %3Cline x1='8' x2='8' y1='2' y2='5' /%3E %3Cline x1='2' x2='5' y1='8' y2='8' /%3E %3Cline x1='16' x2='16' y1='19' y2='22' /%3E %3Cline x1='19' x2='22' y1='16' y2='16' /%3E%3C/svg%3E"); --i-upload:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4' /%3E %3Cpolyline points='17 8 12 3 7 8' /%3E %3Cline x1='12' x2='12' y1='3' y2='15' /%3E%3C/svg%3E"); --i-user:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2' /%3E %3Ccircle cx='12' cy='7' r='4' /%3E%3C/svg%3E"); --i-users:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2' /%3E %3Ccircle cx='9' cy='7' r='4' /%3E %3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87' /%3E %3Cpath d='M16 3.13a4 4 0 0 1 0 7.75' /%3E%3C/svg%3E"); --i-x:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18' /%3E %3Cpath d='m6 6 12 12' /%3E%3C/svg%3E"); --i-chevron-g:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23606c69' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6' /%3E%3C/svg%3E"); --i-check-w:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5' /%3E%3C/svg%3E"); --pp-rings:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 720 900' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='560' cy='330' r='90' fill='none' stroke='%233b6861' stroke-width='1.5'/%3E%3Ccircle cx='560' cy='330' r='170' fill='none' stroke='%233b6861' stroke-width='1.5'/%3E%3Ccircle cx='560' cy='330' r='250' fill='none' stroke='%233b6861' stroke-width='1.5'/%3E%3Ccircle cx='560' cy='330' r='330' fill='none' stroke='%233b6861' stroke-width='1.5'/%3E%3Ccircle cx='560' cy='330' r='410' fill='none' stroke='%233b6861' stroke-width='1.5'/%3E%3Ccircle cx='560' cy='330' r='490' fill='none' stroke='%233b6861' stroke-width='1.5'/%3E%3Ccircle cx='560' cy='330' r='570' fill='none' stroke='%233b6861' stroke-width='1.5'/%3E%3Ccircle cx='560' cy='330' r='34' fill='%233b6861' stroke='none'/%3E%3C/svg%3E"); } :root{--s:1} @media (min-width:800PX){:root{--s:.7111}} @media (min-width:1040PX){:root{--s:0.7222}} @media (min-width:1056PX){:root{--s:0.7333}} @media (min-width:1072PX){:root{--s:0.7444}} @media (min-width:1088PX){:root{--s:0.7556}} @media (min-width:1104PX){:root{--s:0.7667}} @media (min-width:1120PX){:root{--s:0.7778}} @media (min-width:1136PX){:root{--s:0.7889}} @media (min-width:1152PX){:root{--s:0.8000}} @media (min-width:1168PX){:root{--s:0.8111}} @media (min-width:1184PX){:root{--s:0.8222}} @media (min-width:1200PX){:root{--s:0.8333}} @media (min-width:1216PX){:root{--s:0.8444}} @media (min-width:1232PX){:root{--s:0.8556}} @media (min-width:1248PX){:root{--s:0.8667}} @media (min-width:1264PX){:root{--s:0.8778}} @media (min-width:1280PX){:root{--s:0.8889}} @media (min-width:1296PX){:root{--s:0.9000}} @media (min-width:1312PX){:root{--s:0.9111}} @media (min-width:1328PX){:root{--s:0.9222}} @media (min-width:1344PX){:root{--s:0.9333}} @media (min-width:1360PX){:root{--s:0.9444}} @media (min-width:1376PX){:root{--s:0.9556}} @media (min-width:1392PX){:root{--s:0.9667}} @media (min-width:1408PX){:root{--s:0.9778}} @media (min-width:1424PX){:root{--s:0.9889}} @media (min-width:1440PX){:root{--s:1.0000}} @media (min-width:1464PX){:root{--s:1.0167}} @media (min-width:1488PX){:root{--s:1.0333}} @media (min-width:1512PX){:root{--s:1.0500}} @media (min-width:1536PX){:root{--s:1.0667}} @media (min-width:1560PX){:root{--s:1.0833}} @media (min-width:1584PX){:root{--s:1.1000}} @media (min-width:1608PX){:root{--s:1.1167}} @media (min-width:1632PX){:root{--s:1.1333}} @media (min-width:1656PX){:root{--s:1.1500}} :root{ --nav:calc(272px*var(--s));--shapka:calc(76px*var(--s));--pole:calc(40px*var(--s)); --f-ui:max(calc(15px*var(--s)),12PX);--f-nav:max(calc(15.5px*var(--s)),12PX);--f-meta:max(calc(13.5px*var(--s)),11PX);--f-melko:max(calc(12.5px*var(--s)),10.5PX); } @media (max-width:736px){:root{--shapka:calc(56px*var(--s));--pole:calc(16px*var(--s));--f-ui:16PX;--f-nav:16PX;--f-meta:14PX;--f-melko:13PX}} html{-webkit-text-size-adjust:100%;text-size-adjust:100%} body{font-family:var(--font);font-size:var(--f-ui);line-height:1.4;color:var(--a-ink);background:#fff;padding-top:var(--shapka);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-synthesis:none;font-feature-settings:"tnum" 0} button,input,select,textarea{font-family:var(--font)} ::selection{background:#cfe0db} :focus-visible{outline:2px solid var(--a-green)!important;outline-offset:2px} input:focus-visible,select:focus-visible,textarea:focus-visible{outline:0!important} a{-webkit-tap-highlight-color:transparent}button{-webkit-tap-highlight-color:transparent} .pp-skryt{display:none!important} #loading{background:#fff} #loading .spinner>div,main .spinner>div{background:var(--a-green)!important} /* ---------- значки ---------- */ i.material-icons[data-i],.pp-zn{display:inline-block;flex:none;width:calc(20px*var(--s));height:calc(20px*var(--s));padding:0!important;border-radius:0!important;font-size:0!important;line-height:0;background:currentColor;text-shadow:none!important;vertical-align:middle;-webkit-mask:var(--i) center/contain no-repeat;mask:var(--i) center/contain no-repeat;overflow:hidden} i.material-icons[data-i="arrow-down"]{--i:var(--i-arrow-down)} i.material-icons[data-i="arrow-left"]{--i:var(--i-arrow-left)} i.material-icons[data-i="arrow-up"]{--i:var(--i-arrow-up)} i.material-icons[data-i="check"]{--i:var(--i-check)} i.material-icons[data-i="chevron-down"]{--i:var(--i-chevron-down)} i.material-icons[data-i="chevron-left"]{--i:var(--i-chevron-left)} i.material-icons[data-i="chevron-right"]{--i:var(--i-chevron-right)} i.material-icons[data-i="circle-alert"]{--i:var(--i-circle-alert)} i.material-icons[data-i="clipboard-copy"]{--i:var(--i-clipboard-copy)} i.material-icons[data-i="copy"]{--i:var(--i-copy)} i.material-icons[data-i="download"]{--i:var(--i-download)} i.material-icons[data-i="ellipsis-vertical"]{--i:var(--i-ellipsis-vertical)} i.material-icons[data-i="external-link"]{--i:var(--i-external-link)} i.material-icons[data-i="eye"]{--i:var(--i-eye)} i.material-icons[data-i="file"]{--i:var(--i-file)} i.material-icons[data-i="file-code"]{--i:var(--i-file-code)} i.material-icons[data-i="file-plus"]{--i:var(--i-file-plus)} i.material-icons[data-i="file-text"]{--i:var(--i-file-text)} i.material-icons[data-i="film"]{--i:var(--i-film)} i.material-icons[data-i="folder"]{--i:var(--i-folder)} i.material-icons[data-i="folder-input"]{--i:var(--i-folder-input)} i.material-icons[data-i="folder-open"]{--i:var(--i-folder-open)} i.material-icons[data-i="folder-plus"]{--i:var(--i-folder-plus)} i.material-icons[data-i="house"]{--i:var(--i-house)} i.material-icons[data-i="image"]{--i:var(--i-image)} i.material-icons[data-i="images"]{--i:var(--i-images)} i.material-icons[data-i="info"]{--i:var(--i-info)} i.material-icons[data-i="layout-grid"]{--i:var(--i-layout-grid)} i.material-icons[data-i="link"]{--i:var(--i-link)} i.material-icons[data-i="list"]{--i:var(--i-list)} i.material-icons[data-i="lock"]{--i:var(--i-lock)} i.material-icons[data-i="log-out"]{--i:var(--i-log-out)} i.material-icons[data-i="mail"]{--i:var(--i-mail)} i.material-icons[data-i="maximize"]{--i:var(--i-maximize)} i.material-icons[data-i="menu"]{--i:var(--i-menu)} i.material-icons[data-i="minus"]{--i:var(--i-minus)} i.material-icons[data-i="music"]{--i:var(--i-music)} i.material-icons[data-i="pencil"]{--i:var(--i-pencil)} i.material-icons[data-i="plus"]{--i:var(--i-plus)} i.material-icons[data-i="refresh-cw"]{--i:var(--i-refresh-cw)} i.material-icons[data-i="save"]{--i:var(--i-save)} i.material-icons[data-i="search"]{--i:var(--i-search)} i.material-icons[data-i="settings"]{--i:var(--i-settings)} i.material-icons[data-i="share-2"]{--i:var(--i-share-2)} i.material-icons[data-i="square-check-big"]{--i:var(--i-square-check-big)} i.material-icons[data-i="trash-2"]{--i:var(--i-trash-2)} i.material-icons[data-i="unlink"]{--i:var(--i-unlink)} i.material-icons[data-i="upload"]{--i:var(--i-upload)} i.material-icons[data-i="user"]{--i:var(--i-user)} i.material-icons[data-i="users"]{--i:var(--i-users)} i.material-icons[data-i="x"]{--i:var(--i-x)} i.material-icons.spin[data-i]{animation:1s linear infinite spin} /* ---------- кнопки-значки ---------- */ .action{color:var(--a-muted);border-radius:calc(10px*var(--s));transition:background-color .12s,color .12s} .action:hover{background-color:rgba(35,68,63,.07)} header .action,#previewer header .action,#file-selection .action{display:inline-grid;place-items:center;width:calc(40px*var(--s));height:calc(40px*var(--s));border-radius:calc(10px*var(--s));margin:0 1px} header .action:hover{color:var(--a-ink)} .action .counter{right:2px;bottom:2px;width:calc(16px*var(--s));height:calc(16px*var(--s));line-height:calc(16px*var(--s));font-size:max(calc(10.5px*var(--s)),9.5PX);font-weight:600;border:0;background:var(--a-green);color:#fff;border-radius:50%} .action.disabled,.action[disabled]{opacity:.35} /* ---------- боковая панель ---------- */ nav{background:var(--a-wash);display:flex;flex-direction:column;padding:0 calc(16px*var(--s)) calc(14px*var(--s));scrollbar-width:thin;scrollbar-color:var(--a-line2) transparent} nav>*{flex:none} nav>div{border:0} nav .pp-shapka{order:0;display:flex;align-items:center;gap:calc(12px*var(--s));height:calc(76px*var(--s));padding:0 calc(4px*var(--s));color:var(--a-ink);font-size:max(calc(19px*var(--s)),15PX);font-weight:650;letter-spacing:-.01em;text-decoration:none} nav .pp-shapka img{width:calc(40px*var(--s));height:calc(40px*var(--s));border-radius:50%;display:block;flex:none} nav .pp-zagruzit{order:1;display:none;align-items:center;justify-content:center;gap:calc(10px*var(--s));width:100%;height:calc(48px*var(--s));margin:0 0 calc(20px*var(--s));border:0;border-radius:calc(12px*var(--s));background:var(--a-green);color:#fff;font-size:var(--f-nav);font-weight:600;cursor:pointer;transition:background-color .12s} nav .pp-zagruzit:hover{background:var(--a-press)} nav .pp-zagruzit:active{background:var(--a-deep)} .pp-zagruzit .pp-zn,.pp-plav .pp-zn{--i:var(--i-upload)} html.pp-pravo-zagruzki nav .pp-zagruzit{display:flex} html:not(.pp-pravo-zagruzki) nav .pp-shapka{margin-bottom:calc(8px*var(--s))} nav .action{display:flex;align-items:center;gap:calc(14px*var(--s));width:100%;height:calc(44px*var(--s));padding:0 calc(12px*var(--s));margin:0 0 2px;border-radius:calc(12px*var(--s));font-size:var(--f-nav);font-weight:400;line-height:1.2;color:var(--a-text);white-space:nowrap;overflow:hidden;text-decoration:none;box-sizing:border-box} nav .action>span{min-width:0;overflow:hidden;text-overflow:ellipsis} nav .action>i{color:var(--a-muted)} nav .action:hover{background:rgba(35,68,63,.05)} nav .action.pp-tut{background:#fff;color:var(--a-deep);font-weight:600;box-shadow:0 1px 2px rgba(35,68,63,.08)} nav .action.pp-tut>i{color:var(--a-green)} nav .pp-fayly{order:2} nav .pp-sozdat{order:3} nav .pp-pochta{order:4;margin-top:calc(25px*var(--s));position:relative;overflow:visible} nav .pp-pochta::before{content:"";position:absolute;left:calc(12px*var(--s));right:calc(12px*var(--s));top:calc(-13px*var(--s));border-top:1px solid var(--a-line2)} nav .pp-pochta::after{content:"";width:calc(16px*var(--s));height:calc(16px*var(--s));margin-left:auto;flex:none;background:var(--a-faint);-webkit-mask:var(--i-arrow-up-right) center/contain no-repeat;mask:var(--i-arrow-up-right) center/contain no-repeat} nav .pp-nastr{order:6;margin-top:auto;padding-top:calc(24px*var(--s))} nav #logout{order:7} nav .pp-mesto{order:8} nav .pp-kto{order:9} nav .credits.pp-mesto,nav div.credits{width:auto!important;margin:calc(14px*var(--s)) calc(12px*var(--s)) calc(4px*var(--s))!important;padding:0;font-size:var(--f-melko);line-height:1.4;color:var(--a-muted);display:flex;flex-direction:column;gap:calc(8px*var(--s))} nav .credits br{display:none} nav div.credits>div{margin:0!important;padding:0!important;width:100%!important} nav .credits .vue-simple-progress{height:calc(4px*var(--s))!important;border-radius:2px!important;background:var(--a-line2)!important;overflow:hidden} nav .credits .vue-simple-progress-bar{height:calc(4px*var(--s))!important;border-radius:2px!important;background:var(--a-green)!important} nav p.credits{display:none} nav .pp-kto{height:calc(52px*var(--s));margin:calc(6px*var(--s)) 0 0;padding:0 calc(8px*var(--s));gap:calc(12px*var(--s));font-size:var(--f-melko);font-weight:500;color:var(--a-muted)} nav .pp-kto>i{display:none!important} nav .pp-kto::before{content:attr(data-ini);flex:none;width:calc(36px*var(--s));height:calc(36px*var(--s));border-radius:50%;display:grid;place-items:center;background:var(--a-green);color:#fff;font-size:max(calc(13px*var(--s)),10.5PX);font-weight:600;letter-spacing:.01em} /* ---------- шапка: поиск и действия ---------- */ header{height:var(--shapka);padding:calc(16px*var(--s)) calc(32px*var(--s)) calc(16px*var(--s)) var(--pole);background:#fff;border:0;box-shadow:none;gap:0} header>img{display:none} header title{font-size:max(calc(16px*var(--s)),13PX);font-weight:600;color:var(--a-ink);white-space:nowrap} #search{max-width:calc(420px*var(--s));height:calc(44px*var(--s))} #search #input{height:calc(44px*var(--s));padding:0 calc(14px*var(--s));gap:calc(10px*var(--s));border-radius:calc(12px*var(--s));background:var(--a-wash);border:0;transition:box-shadow .12s,background-color .12s} #search #input>i{margin:0;color:var(--a-faint);width:calc(18px*var(--s));height:calc(18px*var(--s))} #search #input>span{font-size:var(--f-melko);color:var(--a-muted)} #search:not(.ongoing) #input>i.spin,#search:not(.ongoing) #input>i.spin+span{display:none} #search input{font-size:var(--f-ui);color:var(--a-ink);height:100%;-webkit-appearance:none;appearance:none;border-radius:0} #search input::placeholder{color:var(--a-faint);opacity:1} #search:not(.active) #input:focus-within{background:#fff;box-shadow:0 0 0 1px var(--a-green),0 0 0 calc(4px*var(--s)) rgba(54,96,90,.16)} #search.active #input{height:var(--shapka);padding:0 var(--pole);border-radius:0;background:#fff;border-bottom:1px solid var(--a-line);box-shadow:none} #search.active #input>i{width:calc(20px*var(--s));height:calc(20px*var(--s));color:var(--a-ink)} #search.active #result{height:calc(100% - var(--shapka));padding:calc(24px*var(--s)) var(--pole);background:#fff;color:var(--a-text)} #search #result>div{max-width:calc(720px*var(--s));margin:0} #search #result>div>p{font-size:var(--f-meta);color:var(--a-muted);margin:0 0 calc(20px*var(--s))} #search .boxes{border:0;box-shadow:none;background:none;margin:0 0 calc(24px*var(--s));display:flex;flex-wrap:wrap;align-items:center;gap:calc(8px*var(--s)) calc(12px*var(--s))} #search .boxes h3{padding:0;font-size:var(--f-meta);font-weight:500;color:var(--a-muted)} #search .boxes>div{margin:0;gap:calc(8px*var(--s));justify-content:flex-start} #search .boxes>div>div{display:flex;align-items:center;gap:calc(8px*var(--s));flex:none;width:auto;height:calc(36px*var(--s));margin:0;padding:0 calc(14px*var(--s)) 0 calc(12px*var(--s));border:1px solid var(--a-line2);border-radius:calc(18px*var(--s));background:#fff;color:var(--a-text)} #search .boxes>div>div:hover{background:var(--a-wash)} #search .boxes p{margin:0;font-size:var(--f-meta);font-weight:500} #search .boxes i,#search.active #result .boxes i{width:calc(16px*var(--s));height:calc(16px*var(--s));color:var(--a-muted)!important} #search.active #result ul li{margin:0} #search.active #result ul li a{gap:calc(12px*var(--s));min-height:calc(44px*var(--s));padding:calc(6px*var(--s)) calc(12px*var(--s));border-radius:calc(12px*var(--s));font-size:var(--f-ui);color:var(--a-ink);overflow-wrap:anywhere} #search.active #result ul li a:hover{background:var(--a-wash)} #search.active #result ul li a i{margin:0;color:var(--a-muted)} /* ---------- заголовок папки и путь ---------- */ main>div>.breadcrumbs{position:static;height:auto;min-height:0;flex-wrap:wrap;align-items:center;gap:2px calc(4px*var(--s));padding:calc(8px*var(--s)) 0 0;margin:0 0 calc(18px*var(--s));background:none;border:0;font-size:var(--f-meta);line-height:calc(20px*var(--s));color:var(--a-muted)} main>div>.breadcrumbs span{color:var(--a-muted)} main>div>.breadcrumbs a{padding:2px calc(6px*var(--s));margin:0 calc(-6px*var(--s));border-radius:calc(6px*var(--s));color:var(--a-muted);transition:none} main>div>.breadcrumbs>span>a{margin:0 calc(-4px*var(--s))} main>div>.breadcrumbs a:hover{background:var(--a-wash);color:var(--a-ink)} main>div>.breadcrumbs>a:first-child>i{display:none} main>div>.breadcrumbs>a:first-child::after{content:"Диск"} main>div>.breadcrumbs .chevron{margin:0 calc(4px*var(--s))} main>div>.breadcrumbs .chevron i{width:calc(14px*var(--s));height:calc(14px*var(--s));color:var(--a-line2);background:var(--a-edge)} main>div>.breadcrumbs>span:last-child{flex:0 0 100%;min-width:0;margin-top:2px} main>div>.breadcrumbs>span:last-child>.chevron{display:none} main>div>.breadcrumbs>a:first-child:last-child,main>div>.breadcrumbs>span:last-child>a{display:block;max-width:100%;margin:0;padding:0;font-size:calc(28px*var(--s));line-height:calc(34px*var(--s));font-weight:650;letter-spacing:-.02em;color:var(--a-ink);background:none;pointer-events:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} main>div>.breadcrumbs>a:first-child:last-child::after{content:"Файлы"} /* ---------- список ---------- */ #listing h2{margin:calc(20px*var(--s)) 0 calc(8px*var(--s));padding:0;font-size:var(--f-meta);line-height:calc(18px*var(--s));font-weight:600;color:var(--a-muted)} #listing>h2:first-of-type{margin-top:calc(4px*var(--s))} #listing .item{background:none;border:0;color:var(--a-text);transition:background-color .1s} #listing .item p{font-size:var(--f-ui)} #listing .item .name{font-weight:400;color:var(--a-ink)} #listing .item[data-dir=true] .name{font-weight:500} #listing .item .size,#listing .item .modified{font-size:var(--f-meta);color:var(--a-faint);font-variant-numeric:tabular-nums} #listing .item>div:first-of-type{flex:none} #listing .item>div:first-of-type>i{display:grid;place-items:center;width:calc(36px*var(--s));height:calc(36px*var(--s));margin:0;border-radius:calc(10px*var(--s));font-size:0!important;background:var(--a-wash);color:var(--a-muted)} #listing .item>div:first-of-type>i::before{content:""!important;width:calc(20px*var(--s));height:calc(20px*var(--s));background:currentColor;-webkit-mask:var(--i,var(--i-file)) center/contain no-repeat;mask:var(--i,var(--i-file)) center/contain no-repeat} #listing .item>div:first-of-type>img{width:calc(36px*var(--s));height:calc(36px*var(--s));margin:0;border-radius:calc(10px*var(--s));background:var(--a-wash);display:block} #listing .item[data-dir=true]>div:first-of-type>i{--i:var(--i-folder);background:var(--a-tint);color:var(--a-green)} #listing .item[data-type=image]>div:first-of-type>i{--i:var(--i-image);background:#eee2e0;color:#63362f} #listing .item[data-type=video]>div:first-of-type>i{--i:var(--i-film);background:#e1e6ee;color:#2f3f5c} #listing .item[data-type=audio]>div:first-of-type>i{--i:var(--i-music);background:#ece6da;color:#57482a} #listing .item[data-type=text]>div:first-of-type>i,#listing .item[data-type=textImmutable]>div:first-of-type>i{--i:var(--i-file-text)} #listing .item[data-type=pdf]>div:first-of-type>i,#listing .item[data-ext=".pdf"]>div:first-of-type>i{--i:var(--i-file-text);background:#eee2e0;color:#63362f} #listing .item[data-ext=".doc"]>div:first-of-type>i,#listing .item[data-ext=".docx"]>div:first-of-type>i,#listing .item[data-ext=".odt"]>div:first-of-type>i,#listing .item[data-ext=".rtf"]>div:first-of-type>i{--i:var(--i-file-text);background:#e1e6ee;color:#2f3f5c} #listing .item[data-ext=".xls"]>div:first-of-type>i,#listing .item[data-ext=".xlsx"]>div:first-of-type>i,#listing .item[data-ext=".ods"]>div:first-of-type>i,#listing .item[data-ext=".csv"]>div:first-of-type>i{--i:var(--i-file-spreadsheet);background:#dfe9e5;color:#23443f} #listing .item[data-ext=".ppt"]>div:first-of-type>i,#listing .item[data-ext=".pptx"]>div:first-of-type>i,#listing .item[data-ext=".odp"]>div:first-of-type>i,#listing .item[data-ext=".key"]>div:first-of-type>i{--i:var(--i-presentation);background:#ece6da;color:#57482a} #listing .item[data-ext=".zip"]>div:first-of-type>i,#listing .item[data-ext=".rar"]>div:first-of-type>i,#listing .item[data-ext=".7z"]>div:first-of-type>i,#listing .item[data-ext=".gz"]>div:first-of-type>i,#listing .item[data-ext=".tar"]>div:first-of-type>i{--i:var(--i-file-archive);background:#e6e8e2;color:#3d4433} #listing .item[data-type=invalid_link]>div:first-of-type>i{--i:var(--i-unlink)} .file-icons [aria-label^="."],.file-icons [data-ext=".bak"]{opacity:.55} #listing .item[aria-selected=true]{background:var(--a-tint)!important;color:var(--a-ink)!important} #listing .item[aria-selected=true] .size,#listing .item[aria-selected=true] .modified{color:var(--a-text)} @media (hover:hover){#listing .item:not(.header):not([aria-selected=true]):hover{background:var(--a-wash)}} /* списком */ #listing.list{margin:0 calc(-12px*var(--s));width:auto;max-width:none} #listing.list .item{width:100%;min-height:calc(56px*var(--s));margin:0;padding:calc(8px*var(--s)) calc(12px*var(--s));gap:calc(16px*var(--s));border:0;border-radius:calc(12px*var(--s));position:relative} #listing.list .item:not(.header)::after{content:"";position:absolute;left:calc(64px*var(--s));right:calc(12px*var(--s));bottom:0;border-bottom:1px solid var(--a-line)} #listing.list .item[aria-selected=true]::after,#listing.list .item:hover::after{border-color:transparent} #listing.list .item>div:first-of-type{width:calc(36px*var(--s))} #listing.list .item>div:last-of-type{flex:1;width:auto;min-width:0;gap:calc(24px*var(--s))} #listing.list .item .name{flex:1;width:auto;min-width:0;white-space:normal;word-break:normal;overflow-wrap:anywhere;line-height:1.35;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden} #listing.list .item .size{flex:none;width:calc(96px*var(--s));text-align:right} #listing.list .item .modified{flex:none;width:calc(150px*var(--s));text-align:right} #listing.list .item.header{min-height:0;height:calc(36px*var(--s));padding:0 calc(12px*var(--s)) 0 calc(64px*var(--s));background:none;border:0;border-bottom:1px solid var(--a-line);border-radius:0;position:static} #listing.list .item.header>div{display:flex;align-items:center;gap:calc(24px*var(--s));width:100%} #listing.list .item.header p{font-size:var(--f-melko);font-weight:500;color:var(--a-muted);display:flex;align-items:center;gap:calc(4px*var(--s));white-space:nowrap;cursor:pointer} #listing.list .item.header .name{margin:0;display:flex;-webkit-line-clamp:none} #listing.list .item.header .size,#listing.list .item.header .modified{flex-direction:row-reverse;justify-content:flex-start} #listing.list .item.header .active{font-weight:600;color:var(--a-ink)} #listing.list .header i{width:calc(14px*var(--s));height:calc(14px*var(--s));margin:0} /* плиткой */ #listing.mosaic{margin:0;padding:0} #listing.mosaic>div{display:grid;grid-template-columns:repeat(auto-fill,minmax(calc(248px*var(--s)),1fr));gap:calc(12px*var(--s))} #listing.mosaic .item{width:auto!important;margin:0;padding:calc(12px*var(--s)) calc(14px*var(--s));gap:calc(12px*var(--s));border:1px solid var(--a-line);border-radius:calc(14px*var(--s));box-shadow:none!important;min-width:0} #listing.mosaic .item:hover{box-shadow:none!important;border-color:var(--a-line2)} #listing.mosaic .item[aria-selected=true]{border-color:var(--a-green)} #listing.mosaic .item>div:first-of-type{width:auto} #listing.mosaic .item>div:first-of-type>i,#listing.mosaic .item>div:first-of-type>img{width:calc(44px*var(--s));height:calc(44px*var(--s));border-radius:calc(12px*var(--s))} #listing.mosaic .item>div:first-of-type>i::before{width:calc(22px*var(--s));height:calc(22px*var(--s))} #listing.mosaic .item>div:last-of-type{flex:1;width:auto;min-width:0} #listing.mosaic .item .name{font-weight:500;font-size:var(--f-ui);line-height:1.35;overflow:hidden;text-overflow:ellipsis} #listing.mosaic .item .size,#listing.mosaic .item .modified{font-size:var(--f-melko);line-height:1.45} /* крупные картинки */ #listing.mosaic.gallery>div{grid-template-columns:repeat(auto-fill,minmax(calc(210px*var(--s)),1fr))} #listing.mosaic.gallery .item{display:block;padding:0;overflow:hidden;height:auto} #listing.mosaic.gallery .item>div:first-of-type{width:100%;height:calc(148px*var(--s));display:grid;place-items:center;background:var(--a-wash)} #listing.mosaic.gallery .item>div:first-of-type>i{width:calc(56px*var(--s));height:calc(56px*var(--s));border-radius:calc(16px*var(--s));background:none} #listing.mosaic.gallery .item>div:first-of-type>i::before{width:calc(32px*var(--s));height:calc(32px*var(--s))} #listing.mosaic.gallery .item>div:first-of-type>img{width:100%;height:100%;border-radius:0} #listing.mosaic.gallery .item>div:last-of-type,#listing.mosaic.gallery .item[data-type=image]>div:last-of-type{position:static!important;width:100%!important;padding:calc(10px*var(--s)) calc(14px*var(--s)) calc(12px*var(--s))!important;text-align:left!important;background:#fff!important;color:var(--a-ink)!important;border-top:1px solid var(--a-line)} #listing.mosaic.gallery .item[aria-selected=true]>div:last-of-type{background:var(--a-tint)} #file-selection:empty{display:none!important} #listing #multiple-selection{background:var(--a-ink);height:calc(60px*var(--s));padding:0 calc(8px*var(--s)) 0 calc(20px*var(--s));align-items:center;font-size:var(--f-ui)} #listing #multiple-selection p{margin:0;color:#fff} #listing #multiple-selection .action,#listing #multiple-selection i{color:#fff} /* пусто, ошибка */ .message{width:auto;max-width:calc(520px*var(--s));margin:calc(72px*var(--s)) auto 0;font-size:calc(20px*var(--s));line-height:calc(28px*var(--s));font-weight:650;letter-spacing:-.01em;color:var(--a-ink)} .message i{display:block!important;width:calc(56px*var(--s))!important;height:calc(56px*var(--s))!important;margin:0 auto calc(20px*var(--s))!important;border-radius:0!important;color:var(--a-green);font-size:0} .message span{display:block} html.pp-mozhno-zagruzit .message:has(i[data-i="folder-open"])::after{content:"Перетащите файлы сюда или нажмите «Загрузить».";display:block;margin-top:calc(8px*var(--s));font-size:var(--f-ui);line-height:1.5;font-weight:400;letter-spacing:0;color:var(--a-muted)} /* ---------- окна ---------- */ #modal-background{background-color:rgba(20,32,29,.42)!important} .overlay{background-color:rgba(20,32,29,.42)} .card{border-radius:calc(16px*var(--s));box-shadow:none;border:1px solid var(--a-line);color:var(--a-ink);overflow:auto} .card.floating{width:calc(100% - calc(32px*var(--s)));max-width:calc(440px*var(--s));max-height:calc(100% - calc(32px*var(--s)));border:0;border-radius:calc(18px*var(--s));box-shadow:0 2px calc(6px*var(--s)) rgba(20,32,29,.08),0 calc(24px*var(--s)) calc(64px*var(--s)) rgba(20,32,29,.24)} .card>div{padding:calc(12px*var(--s)) calc(28px*var(--s))} .card>div:first-child,.card .card-title{padding:calc(26px*var(--s)) calc(28px*var(--s)) calc(6px*var(--s))} .card>div:last-child{padding-bottom:calc(26px*var(--s))} .card h2{font-size:calc(20px*var(--s));line-height:calc(28px*var(--s));font-weight:650;letter-spacing:-.01em;color:var(--a-ink)} .card h3{margin:calc(20px*var(--s)) 0 calc(8px*var(--s));font-size:var(--f-meta);font-weight:500;color:var(--a-text)} .card .card-content{font-size:var(--f-ui);line-height:1.5;color:var(--a-text)} .card .card-content p{margin:0 0 calc(8px*var(--s))} .card .card-content p+.input,.card .card-content p+input{margin-top:0} .card .card-content strong{font-weight:600;color:var(--a-ink)} .card code,li code,p code{background:var(--a-wash);border-radius:calc(6px*var(--s));padding:2px calc(6px*var(--s));font-family:var(--font);font-size:.95em;color:var(--a-ink);overflow-wrap:anywhere} .card .card-action{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:calc(10px*var(--s));padding-top:calc(16px*var(--s))} .card .card-action.full{padding:calc(6px*var(--s)) calc(28px*var(--s)) calc(28px*var(--s));gap:calc(12px*var(--s))} .card .card-action:not(.full)>div{display:flex;flex-wrap:wrap;gap:calc(10px*var(--s));padding:0} .card .card-action:not(.full):has(>div){justify-content:space-between} .button{height:calc(44px*var(--s));padding:0 calc(18px*var(--s));border-radius:calc(12px*var(--s));border:1px solid transparent;box-shadow:none;background:var(--a-green);color:#fff;font-size:var(--f-ui);font-weight:600;line-height:1;text-transform:none;letter-spacing:0;transition:background-color .12s,border-color .12s;-webkit-appearance:none;appearance:none} .button:hover{background:var(--a-press)} .button--flat{background:var(--a-green);color:#fff;text-transform:none} .button--flat:hover{background:var(--a-press)} .button--flat.button--grey{background:#fff;color:var(--a-text);border-color:var(--a-line2)} .button--flat.button--grey:hover{background:var(--a-wash)} .card .card-action .button--flat:not(:last-child){background:#fff;color:var(--a-text);border-color:var(--a-line2)} .card .card-action .button--flat:not(:last-child):hover{background:var(--a-wash)} .button--flat.button--red,.button--red,.card .card-action .button--flat.button--red{background:var(--a-red);color:#fff} .button--flat.button--red:hover,.button--red:hover{background:#8a2c22} .button[disabled]{opacity:.45} #modal-background .button:focus{outline:0} .input,.card#share input,.card#share select,select.input{height:calc(44px*var(--s));padding:0 calc(14px*var(--s));border:1px solid var(--a-edge);border-radius:calc(12px*var(--s));background:#fff;color:var(--a-ink);font-size:var(--f-ui);box-shadow:none;-webkit-appearance:none;appearance:none;transition:border-color .12s,box-shadow .12s} .input:hover{border-color:var(--a-edge)} .input:focus,.card#share input:focus,.card#share select:focus{border-color:var(--a-green);box-shadow:0 0 0 calc(3px*var(--s)) rgba(54,96,90,.18)} .input--block{margin-bottom:calc(12px*var(--s))} .input--textarea,textarea.input{height:auto;min-height:calc(160px*var(--s));padding:calc(12px*var(--s)) calc(14px*var(--s));line-height:1.5;font-family:var(--font)} select.input,.card#share select,select{background-image:var(--i-chevron-g);background-repeat:no-repeat;background-position:right calc(12px*var(--s)) center;background-size:calc(16px*var(--s));padding-right:calc(38px*var(--s))} input[type=checkbox]{-webkit-appearance:none;appearance:none;width:calc(20px*var(--s));height:calc(20px*var(--s));margin:0 calc(10px*var(--s)) 0 0;border:1.5px solid var(--a-edge);border-radius:calc(6px*var(--s));background:#fff center/calc(14px*var(--s)) no-repeat;vertical-align:calc(-4px*var(--s));cursor:pointer;flex:none} input[type=checkbox]:checked{background-color:var(--a-green);border-color:var(--a-green);background-image:var(--i-check-w)} .card .path-container{display:none!important} /* «Поделиться» */ .card#share .input-group{display:flex;gap:calc(10px*var(--s));margin-bottom:calc(16px*var(--s));border:0;padding:0;height:auto;background:none} .card#share .input-group *{border:1px solid var(--a-edge)} .card#share .input-group .vue-number-input{flex:1;border:0;display:flex;height:auto!important;min-width:0;padding:0} .card#share .input-group .vue-number-input input{width:100%;height:calc(44px*var(--s))!important;min-height:calc(44px*var(--s));text-align:left;padding:0 calc(14px*var(--s));border:1px solid var(--a-edge)!important;border-radius:calc(12px*var(--s))!important;background:#fff;-moz-appearance:textfield} .card#share .input-group .vue-number-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0} .card#share .input-group .vue-number-input__button{display:none} .card#share .input-group select{flex:none;width:calc(140px*var(--s));margin:0} .card#share ul li{gap:calc(8px*var(--s));min-height:calc(44px*var(--s));border-bottom:1px solid var(--a-line)} .card#share ul li a{color:var(--a-green);font-weight:500} .card#share table{width:100%;margin:0;font-size:var(--f-meta)} .card#share .action.copy-clipboard::after{content:"Скопировано";background:var(--a-ink);border-radius:calc(8px*var(--s));font-size:max(calc(12px*var(--s)),10.5PX);width:auto;white-space:nowrap;padding:calc(6px*var(--s)) calc(10px*var(--s));left:50%;transform:translateX(-50%);top:calc(-34px*var(--s))} /* «Загрузить»: файл или папка */ .card .card-action.full .action{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(10px*var(--s));height:calc(112px*var(--s));margin:0;padding:0;border:1px solid var(--a-line2);border-radius:calc(14px*var(--s));color:var(--a-ink);text-align:center} .card .card-action.full .action:hover{background:var(--a-wash);border-color:var(--a-edge)} .card .card-action.full .action i{width:calc(28px*var(--s));height:calc(28px*var(--s));margin:0;color:var(--a-green)} .card .card-action.full .action .title{font-size:var(--f-ui);font-weight:600} /* выбор папки при переносе и копировании */ .file-list{max-height:40vh;margin:calc(4px*var(--s)) 0 calc(8px*var(--s));border:1px solid var(--a-line);border-radius:calc(12px*var(--s));padding:calc(6px*var(--s))} .file-list li{display:flex;align-items:center;gap:calc(10px*var(--s));min-height:calc(40px*var(--s));padding:0 calc(10px*var(--s));border-radius:calc(8px*var(--s));font-size:var(--f-ui);color:var(--a-ink)} .file-list li::before{content:"";flex:none;width:calc(18px*var(--s));height:calc(18px*var(--s));margin:0;background:var(--a-green);-webkit-mask:var(--i-folder) center/contain no-repeat;mask:var(--i-folder) center/contain no-repeat} .file-list li:hover{background:var(--a-wash)} .file-list li[aria-selected=true]{background:var(--a-tint)!important;color:var(--a-ink)!important} .file-list li[aria-selected=true]::before{background:var(--a-green)} /* ход загрузки */ .upload-files .card.floating{right:calc(20px*var(--s));bottom:calc(20px*var(--s));width:calc(360px*var(--s));border-radius:calc(16px*var(--s))} .upload-files .card .card-title{padding:calc(16px*var(--s)) calc(20px*var(--s)) calc(8px*var(--s));font-size:var(--f-meta)} .upload-files .card .card-title h2{font-size:var(--f-ui);line-height:1.4} .upload-files .card-content{padding:calc(4px*var(--s)) calc(20px*var(--s)) calc(16px*var(--s))} .upload-files .file .file-name{font-size:var(--f-meta);gap:calc(8px*var(--s));color:var(--a-ink);overflow-wrap:anywhere} .upload-files .file .file-progress{height:calc(4px*var(--s));border-radius:2px;background:var(--a-line);margin-top:calc(6px*var(--s))} .upload-files .file .file-progress div{background:var(--a-green)} .progress div{background-color:var(--a-green)} /* меню по правой кнопке */ .context-menu{min-width:calc(220px*var(--s));max-width:calc(280px*var(--s));padding:calc(6px*var(--s));border:0;border-radius:calc(14px*var(--s));background:#fff;box-shadow:0 2px calc(6px*var(--s)) rgba(20,32,29,.08),0 calc(16px*var(--s)) calc(40px*var(--s)) rgba(20,32,29,.2)} .context-menu .action{display:flex;align-items:center;gap:calc(12px*var(--s));width:100%;height:calc(40px*var(--s));padding:0 calc(12px*var(--s));border-radius:calc(8px*var(--s));font-size:var(--f-ui);color:var(--a-ink)} .context-menu .action i{color:var(--a-muted)} .context-menu .action span{display:inline} .context-menu .action .counter{position:static;margin-left:auto} /* всплывающие сообщения */ .Vue-Toastification__toast{font-family:var(--font)!important;border-radius:calc(14px*var(--s))!important;box-shadow:0 2px calc(6px*var(--s)) rgba(20,32,29,.08),0 calc(16px*var(--s)) calc(40px*var(--s)) rgba(20,32,29,.2)!important;font-size:var(--f-ui)!important;min-height:0!important;padding:calc(14px*var(--s)) calc(18px*var(--s))!important} .Vue-Toastification__toast--success,.Vue-Toastification__toast--default,.Vue-Toastification__toast--info{background:var(--a-ink)!important;color:#fff!important} .Vue-Toastification__toast--error{background:var(--a-red)!important;color:#fff!important} /* ---------- просмотр и редактор ---------- */ #previewer{background-color:#0f1715} #previewer header,#editor-container header{left:0;width:100%;padding:0 calc(16px*var(--s));gap:calc(4px*var(--s))} #previewer header{background:linear-gradient(rgba(15,23,21,.9),rgba(15,23,21,0))} #previewer header>title{font-size:max(calc(15px*var(--s)),13PX);font-weight:500;color:#fff;text-shadow:none;padding:0 calc(12px*var(--s))} #previewer header .action,#previewer header #dropdown .action{color:#fff} #previewer header .action i,#previewer header>.action i{color:#fff;text-shadow:none} #previewer header .action:hover{background-color:rgba(255,255,255,.14)} #previewer>button{width:calc(44px*var(--s));height:calc(44px*var(--s));display:grid;place-items:center;background:rgba(255,255,255,.12)} #previewer>button:hover{background:rgba(255,255,255,.22)} #previewer>button>i{color:#fff} #previewer .preview .info{font-size:calc(18px*var(--s));line-height:1.5;color:#fff;max-width:calc(480px*var(--s));width:calc(100% - calc(48px*var(--s)))} #previewer .preview .info .title i{width:calc(48px*var(--s));height:calc(48px*var(--s));margin:0 auto calc(16px*var(--s));display:block} #previewer .preview .info .button{display:inline-flex;align-items:center;gap:calc(8px*var(--s));margin:calc(4px*var(--s));background:#fff;color:var(--a-ink);text-decoration:none} #previewer .preview .info .button i{width:calc(18px*var(--s));height:calc(18px*var(--s));margin:0;display:inline-block} #editor-container{background:#fff;padding-top:var(--shapka)} #editor-container header{border-bottom:1px solid var(--a-line)} #editor-container .breadcrumbs{height:calc(36px*var(--s));padding:0 var(--pole);border-bottom:1px solid var(--a-line);background:var(--a-wash);font-size:var(--f-melko)} #editor-container .breadcrumbs span{font-size:var(--f-melko)} #editor-container .breadcrumbs i{width:calc(14px*var(--s));height:calc(14px*var(--s))} .editor-font-size{font-size:var(--f-melko);color:var(--a-muted);margin:0 calc(4px*var(--s))} /* ---------- настройки ---------- */ .dashboard{margin:0;max-width:calc(1080px*var(--s))} .dashboard::before{content:"Настройки";display:block;margin:calc(8px*var(--s)) 0 calc(12px*var(--s));font-size:calc(28px*var(--s));line-height:calc(34px*var(--s));font-weight:650;letter-spacing:-.02em;color:var(--a-ink)} .dashboard #nav{padding:0 0 calc(24px*var(--s))} .dashboard #nav .wrapper{border-bottom:1px solid var(--a-line)} .dashboard #nav ul{gap:calc(24px*var(--s));margin:0 0 -1px;font-size:var(--f-ui);font-weight:500;color:var(--a-muted)} .dashboard #nav ul li{padding:calc(10px*var(--s)) 2px;border-bottom:2px solid transparent} .dashboard #nav ul li:hover{background:none;color:var(--a-ink)} .dashboard #nav ul li.active{color:var(--a-ink);border-color:var(--a-green);font-weight:600} .dashboard #nav ul li.active::before{display:none} .dashboard .row{margin:0 calc(-8px*var(--s))} .dashboard .row .column{padding:0 calc(8px*var(--s))} .dashboard .card{margin:0 0 calc(16px*var(--s))} .dashboard .card .card-content p{display:flex;align-items:center;margin:0 0 calc(14px*var(--s))} .dashboard p label{font-size:var(--f-meta);color:var(--a-text);margin-bottom:calc(6px*var(--s))} .dashboard .card .card-action input.button{cursor:pointer} table{font-size:var(--f-ui)} table tr{border-bottom:1px solid var(--a-line)} table th{font-size:var(--f-melko);font-weight:500;color:var(--a-muted)} table th,table td{padding:calc(12px*var(--s)) calc(8px*var(--s))} table tr>:first-child{padding-left:calc(28px*var(--s))} table tr>:last-child{padding-right:calc(28px*var(--s))} .card-content table{width:calc(100% + calc(56px*var(--s)));margin:0 calc(-28px*var(--s))} .card .collapsible{width:calc(100% + calc(56px*var(--s)));margin:0 calc(-28px*var(--s))} .card .collapsible>label,.card .collapsible .collapse{padding-left:calc(28px*var(--s));padding-right:calc(28px*var(--s))} /* ---------- вход ---------- */ #login{background:#fff;overflow:auto} #login form{position:static;transform:none;width:100%;max-width:calc(440px*var(--s));margin:0 auto;padding:calc(56px*var(--s)) calc(24px*var(--s)) calc(40px*var(--s));text-align:left} #login img,html.pp-js #login img{width:calc(52px*var(--s));height:calc(52px*var(--s));margin:0 0 calc(24px*var(--s));border-radius:50%} #login h1{margin:0;text-align:left;font-size:calc(30px*var(--s));line-height:calc(36px*var(--s));font-weight:650;letter-spacing:-.02em;color:var(--a-ink)} #login .pp-podskazka{margin:calc(8px*var(--s)) 0 calc(8px*var(--s));font-size:calc(15px*var(--s));line-height:calc(22px*var(--s));color:var(--a-muted)} #login .pp-podpis{display:block;margin:calc(20px*var(--s)) 0 calc(6px*var(--s));font-size:calc(14px*var(--s));line-height:calc(20px*var(--s));font-weight:500;color:var(--a-text)} #login form .input,#login form input[type=text],#login form input[type=password]{display:block;width:100%;height:calc(52px*var(--s));margin:0;padding:0 calc(16px*var(--s));border:1px solid var(--a-edge);border-radius:calc(12px*var(--s));background:#fff;font-size:calc(16px*var(--s));color:var(--a-ink);box-shadow:none} #login form input::placeholder{color:var(--a-faint);opacity:.85} #login form input[type=text]:focus,#login form input[type=password]:focus{border-color:var(--a-green);box-shadow:0 0 0 calc(3px*var(--s)) rgba(54,96,90,.18)} #login form .button,#login form input[type=submit]{display:block;width:100%;height:calc(52px*var(--s));margin:calc(28px*var(--s)) 0 0;border:0;border-radius:calc(12px*var(--s));background:var(--a-green);color:#fff;font-size:calc(16px*var(--s));font-weight:600;cursor:pointer} #login form input[type=submit]:hover{background:var(--a-press)} #login .wrong,#login .logout-message{margin:calc(20px*var(--s)) 0 0;padding:calc(12px*var(--s)) calc(16px*var(--s));border-radius:calc(12px*var(--s));background:var(--a-red-wash);color:#7e2a20;text-align:left;font-size:calc(14px*var(--s));line-height:calc(20px*var(--s));font-weight:500} #login .logout-message{background:var(--a-wash);color:var(--a-text)} #login .pp-pomoshch{margin-top:calc(24px*var(--s));font-size:calc(14px*var(--s));line-height:calc(20px*var(--s));color:var(--a-muted)} #login .pp-pomoshch a{color:var(--a-muted);white-space:nowrap} #login form>p{display:none} @media (min-width:900px){ #login{display:grid;grid-template-columns:1fr 1fr;align-items:center} #login form{grid-column:1;width:calc(400px*var(--s));max-width:calc(100% - calc(96px*var(--s)));padding:0 0 calc(40px*var(--s))} #login img,html.pp-js #login img{width:calc(56px*var(--s));height:calc(56px*var(--s));margin:0 0 calc(32px*var(--s))} #login h1{font-size:calc(40px*var(--s));line-height:calc(46px*var(--s));letter-spacing:-.025em} #login .pp-podskazka{margin-top:calc(10px*var(--s));font-size:calc(16px*var(--s));line-height:calc(24px*var(--s))} #login::after{box-sizing:border-box;content:"Рабочая почта и общий диск компании";grid-column:2;grid-row:1;align-self:stretch;min-height:100vh;display:flex;align-items:flex-end;background:#23443f var(--pp-rings) center/cover no-repeat;color:#fff;font-size:calc(30px*var(--s));line-height:calc(38px*var(--s));font-weight:600;letter-spacing:-.02em;padding:0 max(calc(64px*var(--s)),calc(100% - calc(484px*var(--s)))) calc(98px*var(--s)) calc(64px*var(--s))} #login::before{content:"Один адрес и один пароль для писем и файлов.";position:fixed;left:calc(50% + calc(64px*var(--s)));bottom:calc(64px*var(--s));z-index:2;color:#c3d3ce;font-size:calc(15px*var(--s));line-height:calc(22px*var(--s))} } /* ---------- компьютер ---------- */ @media (min-width:737px){ nav{top:0;left:0;width:var(--nav);height:100vh;height:100dvh;z-index:1001} main{width:auto;margin:0 0 0 var(--nav);padding:0 var(--pole) calc(40px*var(--s))} header{left:var(--nav);width:calc(100% - var(--nav))} #search.active{left:var(--nav);width:calc(100% - var(--nav));right:auto} #dropdown{display:flex;align-items:center} header .menu-button,header .search-button,#more{display:none!important} html.pp-nastroyki body{padding-top:calc(24px*var(--s))} html.pp-nastroyki .dashboard>header{display:none} .pp-plav{display:none!important} #file-selection{display:none} } @media (min-width:737px) and (max-width:1100px){ #listing.list .item .modified{width:calc(124px*var(--s))} #listing.list .item .size{width:calc(80px*var(--s))} } /* ---------- телефон ---------- */ @media (max-width:736px){ body{padding-bottom:0} main{width:auto;margin:0;padding:0 var(--pole) calc(24px*var(--s))} header{padding:0 calc(6px*var(--s));height:var(--shapka)} header .action,header .menu-button,header .search-button,#more{width:calc(44px*var(--s));height:calc(44px*var(--s));color:var(--a-ink)} header .menu-button{margin-right:auto!important} header .menu-button i,header .search-button i,#more i{width:calc(22px*var(--s));height:calc(22px*var(--s))} header .overlay{background-color:rgba(20,32,29,.28)} nav{width:min(86vw,calc(320px*var(--s)));left:calc(-1 * min(86vw,calc(320px*var(--s))) - calc(12px*var(--s)));height:100vh;height:100dvh;box-shadow:none;background:var(--a-wash);padding:0 calc(16px*var(--s)) calc(calc(14px*var(--s)) + env(safe-area-inset-bottom));transition:left .18s ease-out} nav.active{left:0;box-shadow:0 0 calc(48px*var(--s)) rgba(20,32,29,.24)} nav .pp-shapka{height:calc(72px*var(--s))} nav .action{height:calc(48px*var(--s))} nav .pp-zagruzit{height:calc(52px*var(--s))} #search.active #input{padding:0 calc(12px*var(--s))} #search.active #result{padding:calc(20px*var(--s)) var(--pole)} main>div>.breadcrumbs{padding-top:calc(4px*var(--s));margin-bottom:calc(12px*var(--s))} main>div>.breadcrumbs>a:first-child:last-child,main>div>.breadcrumbs>span:last-child>a{font-size:calc(30px*var(--s));line-height:calc(36px*var(--s));letter-spacing:-.025em;white-space:normal;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2} #listing{margin-bottom:calc(112px*var(--s))} #listing.list{margin:0 calc(-8px*var(--s))} #listing.list .item{min-height:calc(64px*var(--s));padding:calc(10px*var(--s)) calc(8px*var(--s));gap:calc(14px*var(--s))} #listing.list .item>div:first-of-type,#listing.list .item>div:first-of-type>i,#listing.list .item>div:first-of-type>img{width:calc(40px*var(--s));height:calc(40px*var(--s))} #listing.list .item:not(.header)::after{left:calc(62px*var(--s));right:calc(8px*var(--s))} #listing.list .item>div:last-of-type{display:grid;grid-template-columns:1fr auto;gap:2px calc(12px*var(--s));align-items:center} #listing.list .item:not(.header) .name{grid-column:1/-1;width:auto} #listing.list .item:not(.header) .modified{display:block;grid-column:1;grid-row:2;width:auto;text-align:left} #listing.list .item:not(.header) .size{display:block;grid-column:2;grid-row:2;width:auto} #listing.list .item[data-dir=true]:not(.header) .size{display:none} #listing.list .item.header{height:calc(40px*var(--s));padding:0 calc(8px*var(--s))} #listing.list .item.header>div{display:flex;gap:calc(16px*var(--s))} #listing.list .item.header .name{flex:1;width:auto} #listing.list .item.header .size,#listing.list .item.header .modified{flex:none;width:auto} #listing.mosaic>div{grid-template-columns:1fr} #listing.mosaic.gallery>div{grid-template-columns:1fr 1fr} #listing.mosaic.gallery .item>div:first-of-type{height:calc(112px*var(--s))} .message{margin-top:calc(56px*var(--s))} #dropdown{top:calc(8px*var(--s));right:calc(8px*var(--s));min-width:calc(232px*var(--s));padding:calc(6px*var(--s));border-radius:calc(14px*var(--s));background:#fff;box-shadow:0 2px calc(6px*var(--s)) rgba(20,32,29,.08),0 calc(16px*var(--s)) calc(40px*var(--s)) rgba(20,32,29,.22)} #dropdown .action{display:flex;align-items:center;gap:calc(12px*var(--s));width:100%;height:calc(46px*var(--s));margin:0;padding:0 calc(12px*var(--s));border-radius:calc(8px*var(--s));color:var(--a-ink);font-size:16PX} #dropdown .action i{color:var(--a-muted);width:calc(20px*var(--s));height:calc(20px*var(--s))} #dropdown .action span:not(.counter){padding:0;display:inline} #dropdown .counter{position:static;margin-left:auto} #previewer header #dropdown .action,#previewer header #dropdown .action i{color:var(--a-ink)} #previewer header #dropdown .action i{color:var(--a-muted)} #file-selection{left:calc(12px*var(--s));right:calc(12px*var(--s));bottom:calc(calc(12px*var(--s)) + env(safe-area-inset-bottom));width:auto;max-width:none;transform:none;height:calc(56px*var(--s));padding:0 calc(6px*var(--s)) 0 calc(16px*var(--s));border-radius:calc(16px*var(--s));background:#fff;box-shadow:0 2px calc(6px*var(--s)) rgba(20,32,29,.08),0 calc(16px*var(--s)) calc(40px*var(--s)) rgba(20,32,29,.24);z-index:1000} #file-selection>span{margin:0 auto 0 0;font-size:15PX;font-weight:500;color:var(--a-ink)} #file-selection .action{width:calc(44px*var(--s));height:calc(44px*var(--s));border-radius:calc(10px*var(--s))} .pp-plav{position:fixed;right:calc(20px*var(--s));bottom:calc(calc(24px*var(--s)) + env(safe-area-inset-bottom));z-index:900;display:none;align-items:center;gap:calc(10px*var(--s));height:calc(56px*var(--s));padding:0 calc(22px*var(--s)) 0 calc(18px*var(--s));border:0;border-radius:calc(28px*var(--s));background:var(--a-green);color:#fff;font-size:16PX;font-weight:600;box-shadow:0 2px calc(4px*var(--s)) rgba(35,68,63,.2),0 calc(10px*var(--s)) calc(24px*var(--s)) rgba(35,68,63,.28);cursor:pointer} html.pp-mozhno-zagruzit:not(.pp-vybrano):not(.pp-poverh) .pp-plav{display:flex} .card.floating{max-width:none} .card>div{padding-left:calc(22px*var(--s));padding-right:calc(22px*var(--s))} .card>div:first-child,.card .card-title{padding:calc(22px*var(--s)) calc(22px*var(--s)) calc(6px*var(--s))} .card .card-action.full{padding:calc(6px*var(--s)) calc(22px*var(--s)) calc(22px*var(--s))} .button{height:calc(48px*var(--s))} .input,.card#share input,.card#share select,select.input,#search input{font-size:16PX} .dashboard{margin:0} .dashboard::before{font-size:calc(30px*var(--s));line-height:calc(36px*var(--s));margin-top:calc(4px*var(--s))} .dashboard #nav{overflow-x:auto;scrollbar-width:none} .upload-files .card.floating{left:calc(12px*var(--s));right:calc(12px*var(--s));bottom:calc(12px*var(--s));width:auto} .Vue-Toastification__toast{border-radius:0!important} } @media (max-width:450px){ #listing.list .item:not(.header) .modified{display:block} #listing.list .item.header{padding:0 calc(8px*var(--s))} #listing.list .item.header .name,#listing.list .item.header .size,#listing.list .item.header .modified{width:auto} } @media (prefers-reduced-motion:reduce){*{transition:none!important;animation-duration:.01s!important}} /* pp-pereezd: полоса «Диск переехал» (12.10.2026) */ #pp-pereezd{position:fixed;top:0;left:0;right:0;z-index:100000;height:38px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:.4em;padding:0 16px;background:#2b5851;color:#fff;font:500 14px/1.2 Onest,system-ui,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #pp-pereezd a{color:#fff;font-weight:700;text-decoration:underline} #pp-pereezd b{font-weight:700} html.pp-pereezd #app{position:fixed;top:38px;left:0;right:0;bottom:0;overflow:auto;transform:translateZ(0)} @media(max-width:700px){#pp-pereezd{height:auto;min-height:38px;white-space:normal;display:block;padding:6px 12px;text-align:center;font-size:12.5px}html.pp-pereezd #app{top:52px}}