:root{font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif;line-height:1.6;font-weight:400;color:#0f1a2a;background-color:#f4f6fb;--color-background: #f4f6fb;--color-surface: #ffffff;--color-surface-muted: #eef2fb;--color-primary: #123f7a;--color-primary-strong: #0b2c55;--color-accent: #f47b20;--color-success: #1fa27d;--color-danger: #cc2f3f;--color-border: #d8deeb;--shadow-sm: 0 8px 24px rgba(15, 26, 42, .08);--radius-lg: 20px;--radius-md: 12px;--transition-base: .18s ease}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top left,#fafbff,#f0f3fb 45%,#e6ecf8);color:inherit}#root{min-height:100vh;display:flex;justify-content:center;align-items:stretch;padding:48px 24px}.app-shell{width:min(1100px,100%);display:flex;flex-direction:column;gap:24px;background:var(--color-surface);border-radius:var(--radius-lg);padding:32px;box-shadow:var(--shadow-sm)}.app-shell__header{display:flex;justify-content:space-between;align-items:center;gap:16px}.header-actions{display:flex;align-items:center;gap:12px}.brand{display:flex;flex-direction:column;gap:4px}.brand__name{font-size:1.4rem;font-weight:600;color:var(--color-primary-strong)}.brand__tagline{font-size:.9rem;color:#56627a}.nav-tabs{display:flex;gap:12px;flex-wrap:wrap}.nav-tabs__button{padding:10px 20px;border-radius:999px;border:1px solid var(--color-border);background:var(--color-surface-muted);color:#27344c;font-size:.95rem;font-weight:500;cursor:pointer;transition:background var(--transition-base),color var(--transition-base),box-shadow var(--transition-base)}.nav-tabs__button:hover{background:#dde5f7}.nav-tabs__button.is-active{background:linear-gradient(135deg,var(--color-primary) 0%,#2059a9 100%);color:#fff;border-color:transparent;box-shadow:0 10px 18px #123f7a33}.app-shell__main{display:flex;flex-direction:column;gap:32px}section{background:var(--color-surface);border-radius:var(--radius-md)}.card{background:var(--color-surface);border-radius:var(--radius-lg);padding:36px 40px;box-shadow:var(--shadow-sm);width:min(420px,100%)}.card__meta{display:flex;justify-content:flex-end;margin-bottom:12px}.auth-gate{width:100%;display:flex;justify-content:center;align-items:center}.auth-card__title{margin:0 0 8px;font-size:1.8rem;color:var(--color-primary-strong)}.auth-card__subtitle{margin:0 0 24px;color:#5f6c84}.form{display:flex;flex-direction:column;gap:18px}.form-field{display:flex;flex-direction:column;gap:8px}.form-field__label{font-size:.95rem;color:#4a5670}.form-field__input{padding:12px 14px;border-radius:10px;border:1px solid var(--color-border);font-size:1rem;transition:border var(--transition-base),box-shadow var(--transition-base)}.form-field__input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #123f7a26}.alert{padding:12px 16px;border-radius:10px;font-size:.95rem}.alert--danger{background:#cc2f3f1a;color:var(--color-danger);border:1px solid rgba(204,47,63,.2)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:999px;border:none;font-size:.95rem;font-weight:600;font-family:inherit;cursor:pointer;transition:transform var(--transition-base),box-shadow var(--transition-base),background var(--transition-base),color var(--transition-base)}.btn:disabled{opacity:.65;cursor:not-allowed;box-shadow:none}.btn--primary{background:linear-gradient(135deg,var(--color-primary) 0%,#1e5096 100%);color:#fff;box-shadow:0 12px 20px #123f7a2e}.btn--primary:hover{transform:translateY(-1px);box-shadow:0 16px 26px #123f7a33}.btn--ghost{background:transparent;color:var(--color-primary);border:1px solid var(--color-border)}.btn--ghost:hover{background:var(--color-surface-muted)}.btn--danger{background:linear-gradient(135deg,var(--color-danger) 0%,#c02035 100%);color:#fff}.btn--neutral{background:var(--color-surface-muted);color:#2f3b55}.btn--full{width:100%}.panel{padding:28px;border:1px solid var(--color-border)}.panel__title{margin:0 0 12px;font-size:1.4rem;color:var(--color-primary-strong)}.panel__subtitle{margin:0 0 24px;color:#5f6c84}.stack{display:flex;flex-direction:column;gap:20px}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}.table{width:100%;border-collapse:collapse;border-radius:12px;overflow:hidden;border:1px solid var(--color-border)}.table thead{background:var(--color-surface-muted)}.table th,.table td{text-align:left;padding:14px 16px;font-size:.95rem}.column-actions{width:220px}.table tbody tr:nth-child(2n){background:#f9fbff}.table tbody tr:hover{background:#123f7a0f}.mappings-actions{display:flex;gap:10px;flex-wrap:wrap}.media-groups{display:flex;flex-direction:column;gap:24px}.media-group{border-radius:var(--radius-md);border:1px solid var(--color-border);padding:24px;background:var(--color-surface)}.media-group__title{margin:0 0 16px;color:var(--color-primary-strong);font-size:1.2rem}.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}.media-card{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:16px;background:var(--color-surface-muted);display:flex;flex-direction:column;gap:12px;min-height:220px}.media-card__preview{width:100%;border-radius:12px;object-fit:cover;max-height:160px;background:#d8deeb}.media-card__meta{font-size:.85rem;color:#5f6c84}.media-card__status{font-size:.85rem}.media-card__status--success{color:var(--color-success)}.media-card__status--error{color:var(--color-danger)}.empty-state{padding:24px;border-radius:var(--radius-md);border:1px dashed var(--color-border);text-align:center;color:#65718a}@media(max-width:768px){#root{padding:32px 16px}.app-shell{padding:24px}.card{padding:28px 24px}}.app-shell[dir=rtl]{direction:rtl}.app-shell[dir=rtl] .app-shell__header{flex-direction:row-reverse}.app-shell[dir=rtl] .brand{align-items:flex-end;text-align:right}.app-shell[dir=rtl] .nav-tabs{flex-direction:row-reverse}.app-shell[dir=rtl] .form-field__label,.app-shell[dir=rtl] .table th,.app-shell[dir=rtl] .table td{text-align:right}.app-shell[dir=rtl] .mappings-actions{justify-content:flex-end}.auth-gate[dir=rtl]{direction:rtl}.auth-gate[dir=rtl] .card__meta{justify-content:flex-start}.auth-gate[dir=rtl] .form-field__label{text-align:right}
