/* Portal layout only. The brand palette, typefaces and shared primitives are
   supplied by cadelsette-theme.css, copied from the corporate site. */
:root {
  --prata: "Prata", "Prata Fallback";
  --source-serif: "Source Serif 4", "Source Serif 4 Fallback";
  --plex-sans: "IBM Plex Sans", "IBM Plex Sans Fallback";
  --ink: var(--crema);
  --muted: var(--crema-dim);
  --line: #c89b5e40;
  --paper: var(--nero);
  --brand: var(--granata);
}
body { background:var(--nero); color:var(--crema); font-family:var(--font-body); font-size:17px; line-height:1.72; }
button,input,textarea,select { font:inherit; }
button,.download { display:inline-flex; align-items:center; justify-content:center; gap:12px; padding:12px 20px; border:1px solid var(--oro); border-radius:0; background:transparent; color:var(--crema); font-family:var(--font-ui); font-size:12.5px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; cursor:pointer; transition:background .25s,color .25s,border-color .25s; }
button:hover,.download:hover { background:var(--oro); color:var(--nero); }
button:disabled { opacity:.5; cursor:wait; }
.primary,.download { background:var(--granata); border-color:var(--granata); }
.primary:hover,.download:hover { background:var(--granata-bright); border-color:var(--granata-bright); color:var(--crema); }
.danger { color:#f5a5af; }
a { color:var(--oro); }
input,textarea,select { width:100%; padding:12px 14px; color:var(--crema); background:var(--nero); border:1px solid #c89b5e70; border-radius:0; font-family:var(--font-ui); font-size:14px; line-height:1.5; color-scheme:dark; }
input::placeholder,textarea::placeholder { color:#b3a38b; }
input:focus,textarea:focus,select:focus { border-color:var(--oro); }
input[type=checkbox] { width:auto; accent-color:var(--granata); }
textarea { resize:vertical; min-height:80px; }
label { display:grid; gap:8px; color:var(--crema); font-family:var(--font-ui); font-size:12.5px; font-weight:500; letter-spacing:.04em; }
form { display:grid; gap:20px; }
h1 { font-size:clamp(30px,3.8vw,44px); }
h2 { font-size:28px; }
h3 { font-size:21px; }
p { line-height:1.72; }
.muted { color:var(--muted); }
.small { font-family:var(--font-ui); font-size:12px; line-height:1.65; }
.error { color:#ffb8bf; font-family:var(--font-ui); font-size:13px; line-height:1.5; }
.error:empty { display:none; }
.portal-brand img { width:100%; height:auto; }
.portal-brand>span { display:block; margin-top:22px; color:var(--oro); font-family:var(--font-ui); font-size:10px; letter-spacing:.28em; text-transform:uppercase; text-align:center; }
.portal-header { position:relative; display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:var(--header-h); padding:18px var(--pad-x); border-bottom:1px solid var(--line); background:#171310e6; }
.portal-wordmark { font-family:var(--font-display); font-size:21px; letter-spacing:.1em; line-height:1.2; }
.portal-wordmark span { display:block; text-align:center; color:var(--oro); font-family:var(--font-ui); font-size:9px; letter-spacing:.42em; margin-top:6px; }
.portal-header-label { font-family:var(--font-ui); font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--crema-dim); }
.auth { min-height:100svh; display:flex; flex-direction:column; position:relative; isolation:isolate; background:var(--nero); }
.auth::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#17131040,#171310e8),linear-gradient(0deg,#171310e6,transparent 38%,#17131030),url('/media/hero-poster.jpg') center/cover no-repeat; }
.auth-body { flex:1; width:100%; max-width:1320px; margin:auto; padding:60px var(--pad-x); display:grid; grid-template-columns:minmax(0,1.15fr) minmax(350px,1fr); align-items:center; gap:clamp(40px,6vw,100px); }
.auth-aside { text-align:center; padding:20px 0; }
.auth-aside .portal-brand { max-width:500px; margin:auto; }
.auth-aside .portal-brand>span { display:none; }
.portal-rule { display:block; width:220px; height:20px; margin:32px auto; color:var(--oro); }
.auth-aside h1 { font-family:var(--font-body); font-size:clamp(22px,2.4vw,30px); font-style:italic; letter-spacing:.04em; line-height:1.5; }
.auth-aside p { color:var(--crema-dim); font-size:17px; margin-top:18px; }
.auth-main { min-width:0; }
.auth-card { background:#171310ee; border:1px solid var(--line); padding:clamp(28px,3.2vw,44px); max-width:480px; margin-left:auto; }
.auth-card .eyebrow { font-size:10px; letter-spacing:.24em; }
.auth-card h2 { font-size:clamp(28px,3vw,36px); margin:20px 0 14px; }
.auth-card form { margin-top:28px; }
.auth-card form>button { min-height:52px; width:100%; letter-spacing:.16em; }
.auth-card>.small { margin-top:18px; color:var(--crema-dim); }
.auth-footer { display:flex; justify-content:space-between; gap:20px; padding:20px var(--pad-x); font-family:var(--font-ui); font-size:10px; letter-spacing:.12em; color:var(--crema-dim); border-top:1px solid var(--line); }
.shell { display:grid; grid-template-columns:245px minmax(0,1fr); min-height:100vh; }
.sidebar { position:sticky; top:0; height:100vh; background:var(--nero); border-right:1px solid var(--line); padding:36px 22px 24px; display:flex; flex-direction:column; }
.sidebar .portal-brand { padding:0 8px 34px; }
.sidebar .portal-brand>span { font-size:9px; letter-spacing:.16em; }
.nav { display:grid; gap:6px; }
.nav button { justify-content:flex-start; padding:13px 12px; border:0; border-left:2px solid transparent; background:transparent; color:var(--crema-dim); text-transform:none; font-size:13px; font-weight:400; letter-spacing:.06em; }
.nav button:hover { color:var(--crema); background:var(--botte); }
.nav button.active { color:var(--oro); background:var(--botte); border-left-color:var(--oro); }
.nav-icon { display:none; }
.sidebar-foot { margin-top:auto; border-top:1px solid var(--line); padding-top:24px; }
.user-row { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.sidebar-foot button { padding:7px 10px; }
.workspace { min-width:0; background:var(--botte); }
.topbar { min-height:76px; border-bottom:1px solid var(--line); padding:18px 36px; display:flex; align-items:center; justify-content:space-between; gap:16px; background:var(--nero); }
.topbar .eyebrow { font-size:10px; letter-spacing:.18em; }
.connection { display:flex; align-items:center; gap:8px; font-family:var(--font-ui); font-size:11px; color:var(--crema-dim); }
.dot { width:6px; height:6px; background:var(--oro); border-radius:50%; }
.content { padding:40px 36px 60px; max-width:1500px; margin:auto; }
.page-head { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:34px; }
.page-head p { margin-top:12px; color:var(--muted); font-size:17px; }
.panel { background:var(--nero); border:1px solid var(--line); padding:28px; margin-bottom:24px; }
.panel-head { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-bottom:24px; }
.stats { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-bottom:28px; }
.stat { padding:24px; background:var(--nero); border:1px solid var(--line); }
.stat strong { display:block; font-family:var(--font-display); font-size:36px; font-weight:400; color:var(--oro); margin-top:14px; }
.stat span { font-family:var(--font-ui); font-size:11px; letter-spacing:.08em; color:var(--crema-dim); }
.empty { padding:50px 20px; text-align:center; max-width:550px; margin:auto; }
.empty-symbol { display:none; }
.empty h2 { margin-bottom:16px; }
.empty p { color:var(--muted); margin-bottom:24px; }
.account-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:20px; }
.account-card { background:var(--nero); border:1px solid var(--line); padding:26px; }
.account-top { display:flex; gap:16px; align-items:center; margin-bottom:26px; }
.avatar { width:46px; height:46px; border:1px solid var(--oro-dim); display:grid; place-items:center; font-family:var(--font-display); color:var(--oro); }
.account-card h3 { margin-bottom:6px; }
.account-details { display:flex; justify-content:space-between; align-items:center; border-top:1px solid var(--line); padding-top:20px; margin-bottom:22px; gap:12px; }
.badge { display:inline-flex; align-items:center; gap:6px; font-family:var(--font-ui); font-size:10px; letter-spacing:.05em; padding:4px 8px; border:1px solid var(--oro-dim); color:var(--oro); }
.badge.pending { color:var(--crema-dim); border-color:var(--line); }
.actions { display:flex; gap:8px; flex-wrap:wrap; }
.actions button { font-size:10px; padding:10px 14px; }
.notice { padding:16px 20px; border-left:2px solid var(--oro); background:var(--nero); color:var(--crema-dim); font-family:var(--font-ui); font-size:12px; line-height:1.75; margin:22px 0; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; font-family:var(--font-ui); font-size:13px; }
th { text-align:left; color:var(--oro); font-size:10px; letter-spacing:.12em; font-weight:500; padding:14px 10px; border-bottom:1px solid var(--line); }
td { padding:18px 10px; border-bottom:1px solid var(--line); }
td button { padding:7px 10px; font-size:10px; }
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.chat-layout { display:grid; grid-template-columns:280px minmax(0,1fr); height:calc(100vh - 210px); min-height:450px; border:1px solid var(--line); overflow:hidden; background:var(--nero); }
.chat-list { border-right:1px solid var(--line); overflow:auto; }
.chat-tools { padding:18px; border-bottom:1px solid var(--line); display:grid; gap:12px; }
.chat-item { display:grid; width:100%; text-align:left; justify-content:stretch; border:0; border-bottom:1px solid var(--line); padding:18px; gap:7px; text-transform:none; letter-spacing:0; }
.chat-item:hover,.chat-item.active { background:var(--botte-soft); color:var(--crema); }
.chat-main { display:flex; flex-direction:column; min-width:0; min-height:0; }
.chat-heading { padding:18px 24px; border-bottom:1px solid var(--line); }
.messages { padding:24px; overflow:auto; flex:1; display:flex; flex-direction:column; gap:13px; background:var(--botte); }
.bubble { max-width:80%; align-self:flex-start; background:var(--nero); border:1px solid var(--line); padding:12px 16px; white-space:pre-wrap; overflow-wrap:anywhere; font-family:var(--font-ui); font-size:14px; }
.bubble.out { align-self:flex-end; background:var(--botte-soft); border-color:var(--oro-dim); }
.bubble .meta { font-size:10px; color:var(--muted); margin-top:7px; text-align:right; }
.bubble a { display:block; margin-top:8px; }
.composer { padding:16px 20px; border-top:1px solid var(--line); display:grid; grid-template-columns:1fr auto; gap:10px; }
.composer textarea { min-height:48px; max-height:160px; grid-column:1/-1; }
.composer input { font-size:12px; border:0; padding:0; }
.composer button { justify-self:end; }
.no-chat { margin:auto; padding:30px; text-align:center; color:var(--muted); }
#modal { border:1px solid var(--oro-dim); padding:32px; width:min(560px,calc(100vw - 32px)); max-height:90vh; overflow:auto; margin:auto; background:var(--nero); color:var(--crema); }
#modal::backdrop { background:#171310cc; backdrop-filter:blur(3px); }
.modal-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:28px; gap:18px; }
.modal-head button { border:0; padding:4px 10px; font-size:24px; }
.modal-body form { gap:18px; }
.modal-body hr { border:0; border-top:1px solid var(--line); margin:28px 0; }
.modal-body details { font-family:var(--font-ui); font-size:13px; }
.qr { display:block; width:200px; max-width:100%; margin:20px auto; background:white; }
.secret { font:13px monospace; overflow-wrap:anywhere; background:var(--botte); padding:12px; }
.loading { min-height:100vh; display:grid; place-content:center; gap:15px; font:30px var(--font-display); text-align:center; }
.loading span { font:14px var(--font-ui); color:var(--muted); }
#toast { position:fixed; bottom:24px; right:24px; max-width:min(420px,calc(100vw - 32px)); background:var(--crema); color:var(--nero); padding:16px 22px; border:1px solid var(--oro); z-index:10; font-family:var(--font-ui); font-size:14px; }
.check { display:flex; align-items:flex-start; gap:10px; font-weight:400; line-height:1.6; }
.check input { margin-top:4px; flex-shrink:0; }
.download { margin-top:12px; }
[hidden] { display:none!important; }
.sr-label { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
@media(max-width:1050px) {
  .auth-body { gap:36px; grid-template-columns:1fr 1fr; padding-block:40px; }
  .auth-card { padding:28px; }
  .shell { grid-template-columns:210px minmax(0,1fr); }
  .sidebar { padding-inline:16px; }
  .content { padding:28px 24px; }
  .topbar { padding-inline:24px; }
  .chat-layout { grid-template-columns:230px minmax(0,1fr); }
  .two-col { grid-template-columns:1fr; }
}
@media(max-width:760px) {
  .portal-header { min-height:70px; }
  .portal-wordmark { font-size:17px; }
  .portal-header-label { font-size:9px; letter-spacing:.1em; max-width:100px; text-align:right; }
  .auth::before { background:linear-gradient(#17131066,#171310 70%),url('/media/hero-poster.jpg') top center/auto 550px no-repeat; }
  .auth-body { grid-template-columns:1fr; gap:28px; padding:32px 20px; }
  .auth-aside { padding:0; }
  .auth-aside .portal-brand { max-width:290px; }
  .portal-rule { margin:18px auto; width:160px; }
  .auth-aside h1 { font-size:23px; }
  .auth-aside p { font-size:15px; margin-top:10px; }
  .auth-card { width:100%; max-width:480px; margin:auto; padding:28px 24px; }
  .auth-footer { flex-wrap:wrap; gap:6px; font-size:9px; }
  .shell { display:block; }
  .sidebar { height:auto; position:static; padding:18px 16px 0; border-right:0; border-bottom:1px solid var(--line); }
  .sidebar .portal-brand { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 0 16px; }
  .sidebar .portal-brand img { width:140px; }
  .sidebar .portal-brand>span { margin:0; }
  .nav { display:flex; overflow:auto; padding-bottom:12px; }
  .nav button { white-space:nowrap; padding:10px; font-size:12px; }
  .sidebar-foot { display:none; }
  .topbar { min-height:56px; padding:14px 18px; }
  .topbar .eyebrow { font-size:9px; letter-spacing:.06em; }
  .topbar .eyebrow::before { display:none; }
  .connection { font-size:10px; }
  .content { padding:26px 16px; }
  .page-head { align-items:flex-start; flex-wrap:wrap; gap:16px; }
  .page-head h1 { font-size:30px; }
  .page-head p { font-size:16px; }
  .stats { gap:8px; }
  .stat { padding:16px 12px; }
  .stat strong { font-size:28px; }
  .stat span { font-size:10px; letter-spacing:0; }
  .chat-layout { grid-template-columns:1fr; height:auto; }
  .chat-list { border-right:0; max-height:220px; border-bottom:1px solid var(--line); }
  .chat-main { height:500px; }
  .bubble { max-width:92%; }
  .panel { padding:20px; }
  .two-col { gap:0; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; animation:none!important; scroll-behavior:auto!important; } }
