:root{--font: "Shantell Sans", system-ui, sans-serif;--p-teal: #4ECDC4;--p-blue: #45B7D1;--p-purple: #5B6DB5;--p-violet: #7B52AB;--p-warm: #DDCAB1;--p-cream: #F5EDD3;--c1: #4ECDC4;--c2: #45C4D0;--c3: #45B7D1;--c4: #5B8DC8;--c5: #5B6DB5;--c6: #7B52AB;--c7: #6B3F96;--shell-gradient: linear-gradient(to right, #63539E, #595386);--header-color: #44D0CD;--header-gradient: linear-gradient(to right, #44D0CD, #40C9C5);--card-bg: linear-gradient(to right, #53B2D4, #4C98CF);--input-bg: #4B81BC;--btn-text-on-dark: #53B2D4;--btn-3d-shadow: #2e85b0;--btn-primary-hover: #339bbf;--bg: #f8f9ff;--surface: #ffffff;--surface-2: #f0f2fa;--text: #252840;--text-mid: #5c6395;--border: rgba(126,135,191, .18);--border-strong: rgba(126,135,191, .35);--success: #27ae60;--success-shadow: #1e8449;--danger: #c0392b;--danger-shadow: #922b21;--warn: #d4900a;--warn-shadow: #a06a00;--badge-teal: #2aabad;--badge-teal-shadow: #1e8083;--badge-purple-shadow: #3d4f9e;--login-gradient: linear-gradient(135deg, #3B4A8A 0%, #5B6BBF 40%, #44C4C0 100%);--login-btn-gradient: linear-gradient(to right, #44C4C0, #7AB2DD);--shadow-shell: 0 0 40px rgba(37,40,64,.12);--shadow-header: 0 4px 16px rgba(37,40,64,.28);--error-bg: #fff5f5;--error-border: rgba(192,57,43,.25);--table-row-hover: rgba(69,183,209,.07);--drawer-bg: rgba(255,255,255,.75);--drawer-border: rgba(68,208,205,.3);--drawer-accent-faint: rgba(68,208,205,.08);--drawer-accent-mid: rgba(68,208,205,.15);--drawer-text-accent: rgba(68,208,205,.7);--backdrop: rgba(0,0,0,.35);--dcard-separator: rgba(125,178,221,.2);--scrollbar-track: rgba(75, 52, 120, .25);--radius-sm: 10px;--radius-md: 14px;--radius-lg: 18px;--shadow-card: 0 4px 24px rgba(37,40,64, .13);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px}*{box-sizing:border-box;font-family:var(--font)}html,body,#root{min-height:100%}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--scrollbar-track);border-radius:8px}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--p-teal),var(--p-purple));border-radius:8px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--p-blue),var(--p-violet))}*{scrollbar-width:thin;scrollbar-color:var(--p-purple) var(--scrollbar-track)}body{margin:0;background:var(--p-cream);color:var(--text);font-size:15px;line-height:1.5}a{color:var(--p-blue)}.app-shell{min-height:100dvh;background:var(--shell-gradient);max-width:960px;margin:0 auto;box-shadow:var(--shadow-shell);border-radius:8px;overflow:hidden}.app-shell__container{width:100%;padding:var(--space-4)}.app-main{padding-bottom:calc(60px + env(safe-area-inset-bottom,0px));color:#fff}.app-main p,.app-main h1,.app-main h2,.app-main h3,.app-main .page__title,.app-main .page__subtitle,.app-main .label,.app-main span:not(.badge){color:#fff}.app-main .btn{background:#fff;color:var(--btn-text-on-dark)!important;border-color:#fff}.app-main .btn:hover:not(:disabled){background:#ffffffe0}.app-main .btn--3d,.app-main .btn--3d-auto,.app-main .btn--3d-red{background:#fff;color:var(--btn-text-on-dark)!important;box-shadow:0 4px #0000002e}.app-main .btn--3d-red{color:var(--btn-text-on-dark)!important}header.app-shell__container{background:var(--header-gradient);border-bottom:none;box-shadow:var(--shadow-header)}header.app-shell__container .page__title,header.app-shell__container h1,header.app-shell__container .label,header.app-shell__container p{color:#fff}header.app-shell__container .label{font-size:1rem;letter-spacing:.04em}header.app-shell__container p{font-size:1rem}header.app-shell__container .btn{background:#fff;color:var(--p-teal);border-color:#fff}header.app-shell__container .btn:hover:not(:disabled){background:#ffffffe0}header.app-shell__container .btn--3d,header.app-shell__container .btn--3d-red,header.app-shell__container .btn--3d-auto{background:#fff;color:var(--p-teal);box-shadow:0 4px #00000026}header.app-shell__container .badge{background:#fff;color:var(--p-teal);box-shadow:0 3px #0000001f}.page{display:grid;gap:var(--space-5)}.page__header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-4);flex-wrap:wrap}.page__title{margin:0;font-size:clamp(1.3rem,3vw,1.8rem);font-weight:700;color:var(--text)}.page__subtitle{margin:var(--space-2) 0 0;color:var(--text-mid);font-size:.9rem}.page__actions{display:flex;gap:var(--space-2);flex-wrap:wrap}.card{border:1px solid rgba(255,255,255,.15);background:var(--card-bg);border-radius:8px;box-shadow:var(--shadow-card);color:#fff}.card *{color:#fff!important}.card .tg-avatar{color:var(--header-color)!important;background:#fff!important}.card .btn--3d-red{background:#fff;color:var(--btn-text-on-dark)!important;box-shadow:0 4px #0000002e}.card .btn--3d-red *{color:var(--btn-text-on-dark)!important;background:transparent}.card__header{padding:var(--space-2) var(--space-4) var(--space-3)}.card__title{margin:0;font-size:1rem;font-weight:700;color:var(--text)}.card__body{padding:var(--space-4)}.btn{border-radius:var(--radius-md);padding:9px 16px;font-weight:600;font-size:.88rem;border:1.5px solid transparent;background:transparent;color:var(--text);cursor:pointer;min-height:40px;transition:background .15s,border-color .15s,box-shadow .15s}.btn:focus-visible{outline:2px solid rgba(255,255,255,.8);outline-offset:2px}.btn:disabled{opacity:.45;cursor:not-allowed}.btn--primary{background:var(--p-blue);color:#fff;border-color:var(--p-blue)}.btn--primary:hover:not(:disabled){background:var(--btn-primary-hover);border-color:var(--btn-primary-hover)}.btn--3d{border-radius:9px;border:none;background:var(--p-blue);color:#fff;box-shadow:0 4px 0 var(--btn-3d-shadow);transition:transform .1s,box-shadow .1s}.btn--3d:hover:not(:disabled){transform:translateY(2px);box-shadow:0 2px 0 var(--btn-3d-shadow)}.btn--3d:active:not(:disabled){transform:translateY(4px);box-shadow:0 0 0 var(--btn-3d-shadow)}.btn--3d:disabled{opacity:.45}.btn--3d-auto{border-radius:9px;box-shadow:0 4px #00000038;transition:transform .1s,box-shadow .1s}.btn--3d-auto:hover:not(:disabled){transform:translateY(2px);box-shadow:0 2px #00000038}.btn--3d-auto:active:not(:disabled){transform:translateY(4px);box-shadow:0 0 #00000038}.btn--3d-auto:disabled{opacity:.45}.btn--3d--active,.btn--3d--active:hover{transform:translateY(3px);box-shadow:0 1px 0 var(--btn-3d-shadow)}.btn--3d-red{border-radius:9px;border:none;background:var(--danger);color:#fff;box-shadow:0 4px 0 var(--danger-shadow);transition:transform .1s,box-shadow .1s}.btn--3d-red:hover:not(:disabled){transform:translateY(2px);box-shadow:0 2px 0 var(--danger-shadow)}.btn--3d-red:active:not(:disabled){transform:translateY(4px);box-shadow:0 0 0 var(--danger-shadow)}.btn--3d-red:disabled{opacity:.45}.btn--secondary{background:#ffffff2e;border-color:#ffffff73;color:#fff}.btn--secondary:hover:not(:disabled){background:#ffffff47;border-color:#ffffffb3}.card .btn--secondary{background:var(--surface-2);border-color:var(--border-strong);color:var(--text-mid)}.card .btn--secondary:hover:not(:disabled){border-color:var(--p-purple);color:var(--text)}.btn--ghost{border-color:#fff6;color:#fff}.btn--ghost:hover:not(:disabled){border-color:#fffc}.card .btn--ghost{border-color:var(--border-strong);color:var(--text-mid)}.card .btn--ghost:hover:not(:disabled){border-color:var(--p-blue);color:var(--text)}.input,.select,.textarea{width:100%;border-radius:var(--radius-md);border:1.5px solid rgba(255,255,255,.3);background:var(--input-bg);color:#fff;padding:9px 12px;height:40px;font-size:.9rem;box-sizing:border-box}.textarea{height:auto;min-height:100px}.input::placeholder,.textarea::placeholder,.login-input::placeholder{color:#fff9}input[placeholder="Ім'я / назва"]::placeholder,input[placeholder=Посада]::placeholder{color:#ffffff8c}.input:-webkit-autofill,.input:-webkit-autofill:hover,.input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 1000px var(--input-bg) inset!important;-webkit-text-fill-color:#fff!important;caret-color:#fff}.select{background:var(--input-bg)}.select option{background:var(--input-bg);color:#fff}.select option:hover,.select option:focus,.select option:checked{background:#fff!important;color:var(--btn-text-on-dark)!important}.input:focus,.select:focus,.textarea:focus{outline:none;border-color:#ffffffb3;box-shadow:0 0 0 3px #ffffff26}.textarea{min-height:100px}.label{display:block;margin-bottom:5px;font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;color:var(--text-mid);font-weight:700}.hint{font-size:.76rem;color:var(--text-mid);margin-top:5px}.formRow{display:grid;gap:var(--space-2)}.formGrid{display:grid;gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}.table{width:100%;border-collapse:collapse;font-size:.88rem}.table th,.table td{border-bottom:1px solid var(--border);padding:10px 12px;text-align:left;vertical-align:top}.table th{color:#fff;font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;font-weight:700;background:var(--input-bg)}.table tr:last-child td{border-bottom:none}.table tbody tr:hover td{background:var(--table-row-hover)}.table-scroll-wrap{overflow-x:auto}.table-scroll-wrap .table--dialogs{width:calc(100% + 130px)}@media (min-width: 768px){.table-scroll-wrap{overflow-x:visible}.table-scroll-wrap .table--dialogs{width:100%}}.badge{display:inline-flex;align-items:center;border-radius:3px;padding:2px 8px;font-size:.73rem;font-weight:700;border:none;color:#fff;box-shadow:0 3px #00000038}.badge{background:var(--p-purple);box-shadow:0 3px 0 var(--badge-purple-shadow)}.badge--role{background:var(--p-purple);box-shadow:0 3px 0 var(--badge-purple-shadow);font-size:.7rem}.badge--ok{background:var(--success);box-shadow:0 3px 0 var(--success-shadow)}.badge--warn{background:var(--warn);box-shadow:0 3px 0 var(--warn-shadow)}.badge--bad{background:var(--danger);box-shadow:0 3px 0 var(--danger-shadow)}.badge--teal{background:var(--badge-teal);box-shadow:0 3px 0 var(--badge-teal-shadow)}.error,.loading{border-radius:var(--radius-lg);padding:var(--space-5);border:1.5px dashed var(--border-strong);text-align:center;background:var(--surface);color:var(--text-mid)}.empty{text-align:center;color:var(--text-mid);padding:var(--space-5)}.error{border-style:solid;border-color:var(--error-border);background:var(--error-bg);color:var(--danger-shadow)}.loading{border-style:solid}.skeleton{display:block;width:100%;height:64px;border-radius:var(--radius-md);background:linear-gradient(90deg,var(--surface-2),var(--surface),var(--surface-2));background-size:400px 100%;animation:shimmer 1.4s linear infinite}.nav{display:flex;align-items:flex-start;gap:var(--space-2);overflow-x:auto;padding-bottom:var(--space-3)}.nav__item{border-radius:9px;border:none;background:#fff;color:var(--p-teal);font-size:.88rem;font-weight:600;text-decoration:none;padding:8px 16px;white-space:nowrap;cursor:pointer;box-shadow:0 4px #00000026;transition:transform .1s,box-shadow .1s,filter .1s;display:inline-block;-webkit-user-select:none;user-select:none}.nav__item:not(.nav__item--active):hover{filter:brightness(1.1);transform:translateY(2px);box-shadow:0 2px #00000038}.nav__item:not(.nav__item--active):active{filter:brightness(.95);transform:translateY(4px);box-shadow:0 0 #00000038}.nav__item:focus-visible{outline:2px solid rgba(255,255,255,.8);outline-offset:2px}.nav__item--active{background:#ffffffd9;color:var(--p-teal);transform:translateY(3px);box-shadow:0 1px #00000026}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}input[type=date]::-webkit-datetime-edit,input[type=week]::-webkit-datetime-edit,input[type=month]::-webkit-datetime-edit,input[type=date]::-webkit-datetime-edit-fields-wrapper,input[type=week]::-webkit-datetime-edit-fields-wrapper,input[type=month]::-webkit-datetime-edit-fields-wrapper{user-select:none;-webkit-user-select:none}.m-card{display:flex;align-items:center;gap:14px}.m-card__fields{display:flex;gap:28px;flex-wrap:wrap;align-items:flex-start;flex:1;margin-left:4px}@media (max-width: 768px){.m-card{flex-direction:column;align-items:stretch;gap:10px}.m-card__fields{width:100%;flex:0 0 100%;margin-left:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 16px}.m-card__fields>div p{word-break:break-word}}.app-shell__mobile-actions{display:none;align-items:center;gap:6px}.app-shell__burger{display:none;position:relative;background:#fff;border:none;border-radius:8px;width:38px;height:38px;font-size:1.3rem;color:var(--p-teal);cursor:pointer;align-items:center;justify-content:center;box-shadow:0 3px #0000002e;flex-shrink:0}.app-shell__drawer-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--backdrop);z-index:100}.app-shell__drawer{position:fixed;top:0;left:0;height:100dvh;width:75vw;max-width:320px;background:var(--drawer-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:101;display:flex;flex-direction:column;padding:28px 20px 32px;transform:translate(-100%);transition:transform .25s ease;box-shadow:4px 0 24px #0000002e}.app-shell__drawer--open{transform:translate(0)}.app-shell__drawer-title{margin-bottom:24px;padding-bottom:14px;border-bottom:1px solid var(--drawer-border)}.app-shell__drawer-title span{display:block;font-size:.78rem;font-weight:600;color:var(--drawer-text-accent);letter-spacing:.06em;text-transform:uppercase;margin-bottom:2px}.app-shell__drawer-title strong{display:block;font-size:1.25rem;font-weight:700;color:var(--header-color);letter-spacing:.03em}.app-shell__drawer-nav{display:flex;flex-direction:column;gap:6px;flex:1}.app-shell__drawer-nav .nav__item{background:transparent;color:var(--header-color);box-shadow:none;border-radius:8px;padding:11px 14px;font-size:1.2rem;font-weight:600;text-align:left;width:100%}.app-shell__drawer-nav .nav__item--active{background:var(--drawer-accent-mid);color:var(--header-color);box-shadow:none}.app-shell__drawer-nav .nav__item:hover:not(.nav__item--active){background:var(--drawer-accent-faint);transform:none;box-shadow:none;filter:none}.app-shell__drawer-logout{background:transparent;border:none;border-radius:8px;color:var(--header-color);font-size:1.2rem;font-weight:600;padding:11px 14px;cursor:pointer;width:100%;text-align:left;margin-top:2px}.app-shell__drawer-logout:hover{background:var(--drawer-accent-faint)}@media (max-width: 768px){.d-card{flex-wrap:wrap!important;align-items:flex-start!important;padding:12px 14px!important;gap:10px!important;min-height:unset!important}.d-card__info{flex:1!important;width:auto!important;min-width:0!important;display:flex!important;flex-direction:column!important;gap:3px!important}.d-card__info-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px}.d-card__info-top p,.d-card__info-activity{margin:0!important}.d-card__metrics{width:100%!important;flex:0 0 100%!important;display:grid!important;grid-template-columns:1fr 1fr 1fr!important;gap:10px 8px!important;justify-items:center;padding-top:8px;border-top:1px solid var(--dcard-separator)}}@media (max-width: 768px){.error-page__wrap{align-items:flex-start!important;padding-top:10vh!important}}@media (max-width: 768px){.app-shell__container{padding:12px}.input,.select,.textarea{font-size:16px}.btn,.page__actions{width:100%}.m-card__actions .btn{width:auto}.card,.card__body,.m-card{max-width:100%;overflow:hidden;box-sizing:border-box}.card *,.m-card *{min-width:0;word-break:break-word}.card input,.m-card input{max-width:100%;box-sizing:border-box}.app-shell__nav-desktop{display:none}.app-shell__logout-desktop{display:none!important}.app-shell__mobile-actions{display:flex}.app-shell__burger{display:inline-flex}header.app-shell__container{padding:14px 14px 10px!important}header.app-shell__container .label{font-size:1.2rem}header.app-shell__container p{font-size:1.2rem}header.app-shell__container .page__title{font-size:1.44rem}.app-shell__burger{width:44px;height:44px;font-size:1.5rem;border-radius:10px}}@tailwind base;@tailwind components;@tailwind utilities;html,body,*{font-family:var(--font)}