:root {
    --navy: #102232;
    --navy-soft: #183548;
    --gold: #b8965a;
    --paper: #f5f2eb;
    --ink: #18242d;
    --muted: #66727a;
    --line: #d9d4ca;
    --danger: #8f2d2d;
    --success: #2f674f;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: linear-gradient(145deg, #f8f6f0 0%, #ece8df 100%); color: var(--ink); }
a { color: var(--navy-soft); }
.topbar { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 14px clamp(18px, 4vw, 56px); color: white; background: rgba(16,34,50,.97); border-bottom: 1px solid rgba(184,150,90,.55); }
.brand { display: inline-flex; align-items: center; gap: 12px; color: white; text-decoration: none; }
.brand-mark { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: #f6f1e7; color: var(--navy); font: 700 24px Georgia, serif; }
.brand strong { display: block; font-family: Georgia, 'Times New Roman', serif; letter-spacing: .02em; }
.brand small { display: block; opacity: .76; margin-top: 2px; }
.topnav { display: flex; align-items: center; gap: 18px; }
.topnav a, .link-button { color: white; text-decoration: none; opacity: .88; }
.link-button { border: 0; background: transparent; font: inherit; cursor: pointer; padding: 0; }
.admin-action { color: var(--navy-soft); text-decoration: underline; }
.topnav a:hover, .link-button:hover { opacity: 1; }
.shell { width: min(1120px, calc(100% - 32px)); margin: 44px auto 72px; }
.footer { width: min(1120px, calc(100% - 32px)); margin: 0 auto 32px; display: flex; justify-content: space-between; gap: 18px; color: var(--muted); font-size: .88rem; }
.auth-wrap { width: min(520px, 100%); margin: 56px auto; }
.card { background: rgba(255,255,255,.84); border: 1px solid rgba(16,34,50,.12); border-radius: 22px; padding: clamp(22px, 4vw, 38px); box-shadow: 0 22px 65px rgba(16,34,50,.09); backdrop-filter: blur(12px); }
.card h1, .card h2, .page-heading h1 { margin-top: 0; font-family: Georgia, 'Times New Roman', serif; color: var(--navy); }
.eyebrow { margin: 0 0 8px; color: var(--gold); text-transform: uppercase; letter-spacing: .13em; font-size: .76rem; font-weight: 700; }
.muted { color: var(--muted); }
.field { margin: 18px 0; }
.field label { display: block; margin-bottom: 7px; font-weight: 650; }
.field input, .field select { width: 100%; min-height: 46px; border: 1px solid #c9c5bd; border-radius: 11px; background: white; padding: 10px 12px; font: inherit; }
.field input:focus, .field select:focus { outline: 3px solid rgba(184,150,90,.22); border-color: var(--gold); }
.button { display: inline-flex; justify-content: center; align-items: center; min-height: 44px; border: 0; border-radius: 11px; padding: 10px 18px; background: var(--navy); color: white; text-decoration: none; font: 650 1rem/1 inherit; cursor: pointer; }
.button.secondary { background: #e9e4da; color: var(--navy); }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 22px; }
.validation-summary-errors, .field-validation-error, .error { color: var(--danger); }
.validation-summary-valid, .field-validation-valid { display: none; }
.notice { padding: 13px 15px; border-radius: 11px; background: #edf4ef; color: var(--success); border: 1px solid #c9ddcf; }
.warning { padding: 13px 15px; border-radius: 11px; background: #fff7e8; border: 1px solid #ead7a9; }
.page-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 18px; margin-bottom: 24px; }
.page-heading p { margin-bottom: 0; }
.grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.stat { padding: 22px; border-radius: 17px; background: rgba(255,255,255,.76); border: 1px solid var(--line); }
.stat strong { display: block; margin-top: 8px; font: 700 1.7rem Georgia, serif; color: var(--navy); }
.table-wrap { overflow-x: auto; border-radius: 17px; border: 1px solid var(--line); background: rgba(255,255,255,.8); }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 14px 16px; text-align: left; border-bottom: 1px solid #e5e0d7; }
th { color: var(--navy); font-size: .82rem; text-transform: uppercase; letter-spacing: .06em; }
tr:last-child td { border-bottom: 0; }
.badge { display: inline-block; border-radius: 999px; padding: 5px 9px; background: #e8eee9; color: #315c48; font-size: .78rem; }
.qr-box { display: grid; place-items: center; background: white; padding: 16px; border-radius: 15px; border: 1px solid var(--line); margin: 18px 0; }
.qr-box svg { width: min(240px, 100%); height: auto; }
.secret { overflow-wrap: anywhere; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; background: #f1eee7; padding: 10px 12px; border-radius: 9px; }
.recovery-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px 18px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
@media (max-width: 760px) {
    .topbar, .page-heading, .footer { align-items: flex-start; flex-direction: column; }
    .topnav { width: 100%; flex-wrap: wrap; }
    .grid { grid-template-columns: 1fr; }
    .recovery-grid { grid-template-columns: 1fr; }
}

.admin-panel { margin-bottom: 1.5rem; padding: 1rem; border: 1px solid var(--line, #d9dee5); border-radius: 12px; background: #fff; }
.workspace-card { margin: 1rem 0; padding: 1rem; border: 1px solid var(--line, #d9dee5); border-radius: 12px; background: #fff; }
.workspace-child { margin: 1rem 0 0 1.5rem; padding: 0.9rem 1rem; border-left: 3px solid #c9d1db; background: #f8fafc; border-radius: 8px; }
.workspace-inactive { opacity: 0.72; }
.workspace-card-header { display: flex; gap: 1rem; justify-content: space-between; align-items: center; flex-wrap: wrap; }
.workspace-card-header > div { display: flex; gap: 0.65rem; align-items: center; flex-wrap: wrap; }
.workspace-form { margin-top: 0.75rem; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.8rem; margin-bottom: 0.8rem; }
.form-grid label { display: grid; gap: 0.35rem; }
.form-span, .check-row { grid-column: 1 / -1; }
.check-row { grid-template-columns: auto 1fr !important; align-items: center; }
.notice-error { border-color: #a43d3d; }
.subfolder-add { margin-top: 0.8rem; }
@media (max-width: 760px) { .form-grid { grid-template-columns: 1fr; } .workspace-child { margin-left: 0.6rem; } }


.file-field { display: grid; gap: 0.45rem; }
.file-field > label { font-weight: 650; }
.file-drop-zone {
    display: grid;
    gap: 0.45rem;
    padding: 1rem;
    border: 2px dashed #b7b1a6;
    border-radius: 12px;
    background: #fbfaf7;
    transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.file-drop-zone.is-dragover {
    border-color: var(--gold);
    background: #fffaf0;
    box-shadow: 0 0 0 3px rgba(184,150,90,.16);
}
.file-drop-zone-title { font-weight: 700; color: var(--navy); }
.file-drop-zone input[type="file"] {
    width: 100%;
    min-height: 44px;
    padding: 0.55rem;
    border: 1px solid #c9c5bd;
    border-radius: 9px;
    background: white;
    font: inherit;
}
.file-drop-zone input[type="file"]:focus-visible {
    outline: 3px solid rgba(184,150,90,.24);
    outline-offset: 2px;
    border-color: var(--gold);
}
.file-drop-zone-compact { margin-top: 0.4rem; padding: 0.8rem; }
.file-selection { font-size: .9rem; color: var(--navy-soft); overflow-wrap: anywhere; }
.file-drop-feedback { min-height: 1.25rem; margin: 0; }

.messaging-selector { margin-bottom: 1.25rem; }
.messaging-compose { margin: 1.25rem 0; }
.messaging-list { margin-top: 1.5rem; }
.page-heading.compact { margin-bottom: 0.8rem; }
.page-heading.compact h2 { margin-bottom: 0.2rem; color: var(--navy); }
.field textarea {
    width: 100%;
    border: 1px solid #c9c5bd;
    border-radius: 11px;
    background: white;
    padding: 10px 12px;
    font: inherit;
    resize: vertical;
}
.field textarea:focus {
    outline: 3px solid rgba(184,150,90,.22);
    border-color: var(--gold);
}
.attachment-picker {
    margin: 1rem 0;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfaf7;
}
.attachment-picker legend { font-weight: 700; color: var(--navy); padding: 0 .35rem; }
.attachment-option { display: flex; gap: .65rem; align-items: flex-start; margin: .65rem 0; }
.attachment-option input { margin-top: .25rem; }
.message-history { display: grid; gap: 1rem; margin: 1.25rem 0 1.5rem; }
.message-card {
    padding: 1rem 1.15rem;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: rgba(255,255,255,.86);
}
.message-card.message-own { border-left: 4px solid var(--gold); }
.message-card header { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.message-body { margin-top: .8rem; white-space: pre-wrap; overflow-wrap: anywhere; }
.message-attachments { display: grid; gap: .4rem; margin-top: .9rem; padding-top: .8rem; border-top: 1px solid #e5e0d7; }
.message-read-state { margin-top: .75rem; font-size: .86rem; }