/* Home, Settings and Audit trail pages. Loaded after app-shell.css. */
.page-head.minimal { margin-bottom:6px; align-items:center; }
.page-head.minimal .page-head-main { flex:0 0 auto; }
.page-head.minimal .page-head-side { margin-left:auto; flex-direction:row; align-items:center; }
.btn.ghost { background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.3); }
.btn.ghost:hover { background:rgba(255,255,255,.2); border-color:rgba(255,255,255,.55); box-shadow:none; }
a.btn { text-decoration:none; display:inline-flex; align-items:center; gap:7px; }
.btn.primary { background:var(--green); color:#fff; border-color:var(--green); }
.btn.primary:hover { background:var(--green-dark); border-color:var(--green-dark); }

/* ---- Home ---- */
.home-hero { position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1.5fr) minmax(220px,1fr); gap:24px; align-items:center; padding:34px 38px; border-radius:20px; color:#fff; background:radial-gradient(900px 340px at 105% -10%,rgba(94,224,172,.35),transparent 60%),radial-gradient(600px 300px at -10% 120%,rgba(47,181,131,.35),transparent 60%),linear-gradient(135deg,#0b2a22 0%,#0f4a3a 55%,#0b7a58 100%); box-shadow:0 18px 40px rgba(8,60,45,.28); margin-bottom:22px; }
.home-eyebrow { display:inline-block; font-size:10.5px; letter-spacing:1.3px; text-transform:uppercase; font-weight:800; color:#a8f0d2; background:rgba(94,224,172,.14); border:1px solid rgba(94,224,172,.3); padding:5px 12px; border-radius:999px; margin-bottom:14px; }
.home-hero h2 { font:700 34px/1.15 var(--font-display); letter-spacing:-.8px; margin-bottom:12px; }
.home-hero p { color:#cfe9de; font-size:14px; line-height:1.7; max-width:600px; margin-bottom:22px; }
.home-hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:20px; }
.home-hero .btn.primary { background:#5ee0ac; color:#06382a; border-color:#5ee0ac; }
.home-hero .btn.primary:hover { background:#8ef0c8; border-color:#8ef0c8; }
.home-chips { display:flex; flex-wrap:wrap; gap:8px; }
.home-chip { display:inline-flex; align-items:center; gap:7px; font-size:11.5px; color:#d7efe5; background:rgba(0,0,0,.22); border:1px solid rgba(255,255,255,.14); border-radius:999px; padding:5px 12px; }
.home-chip i { width:8px; height:8px; border-radius:50%; background:#9bb5ac; }
.home-chip.ok i { background:#5ee0ac; box-shadow:0 0 0 3px rgba(94,224,172,.25); }
.home-chip.warn i { background:#f3a84b; }
.home-chip.bad i { background:#ef7d75; }
.home-chip b { color:#fff; font-weight:700; }
.home-hero-art { position:relative; min-height:150px; }
.home-hero-art svg { position:relative; filter:drop-shadow(0 12px 24px rgba(0,0,0,.25)); }
.home-hero-art { display:grid; place-items:center; }
.home-hero-art svg.hh-inf { max-width:300px; overflow:visible; filter:none; animation:hh-float 4s ease-in-out infinite; }
.hh-inf path { fill:none; stroke-linecap:round; stroke-linejoin:round; }
.hh-blur { stroke-width:16; opacity:.6; }
.hh-base { stroke-width:10; }
.hh-shine { stroke-width:3; transform:translateY(-2px); opacity:.7; }
.hh-run { stroke:#fff; stroke-width:3.2; stroke-dasharray:9 91; filter:drop-shadow(0 0 4px #fff) drop-shadow(0 0 8px #9cf0cd); animation:hh-run 4.5s linear infinite; }
@keyframes hh-run { from { stroke-dashoffset:100; } to { stroke-dashoffset:0; } }
@keyframes hh-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-6px); } }
@media (prefers-reduced-motion:reduce) { .home-hero-art svg.hh-inf, .hh-run { animation:none; } }
.orb { position:absolute; border-radius:50%; filter:blur(2px); }
.orb.o1 { width:90px; height:90px; right:6%; top:-14%; background:rgba(94,224,172,.22); }
.orb.o2 { width:54px; height:54px; left:2%; bottom:-6%; background:rgba(255,255,255,.12); }
.orb.o3 { width:28px; height:28px; right:30%; bottom:8%; background:rgba(94,224,172,.4); }
.home-layout { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:22px; align-items:start; }
.home-main { display:grid; gap:22px; min-width:0; }
.home-group header, .home-flow header, .home-activity header { display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.home-group h3, .home-flow h3, .home-activity h3 { font:700 16px var(--font-display); letter-spacing:-.2px; }
.home-group header p, .home-flow header p { color:var(--muted); font-size:12px; flex-basis:100%; margin-top:-6px; }
.home-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:12px; }
.home-card { display:flex; align-items:flex-start; gap:13px; padding:15px 16px; border-radius:14px; background:var(--card); border:1px solid var(--line); box-shadow:var(--shadow-sm); text-decoration:none; color:inherit; position:relative; transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
.home-card:hover { transform:translateY(-2px); box-shadow:var(--shadow); border-color:#95c7b3; }
.hc-ic { width:40px; height:40px; flex:none; border-radius:11px; display:grid; place-items:center; color:var(--green-dark); background:linear-gradient(135deg,#e3f5ec,#c9ecd9); }
.home-card:hover .hc-ic { background:linear-gradient(135deg,#087f5b,#2fb583); color:#fff; }
.hc-body { display:grid; gap:4px; min-width:0; flex:1; }
.hc-body b { font:700 13.5px var(--font-display); display:flex; align-items:center; gap:6px; }
.hc-body b em { font-style:normal; display:inline-grid; place-items:center; width:18px; height:18px; border-radius:6px; background:#fdf0dc; color:#92400e; }
.hc-body b em.ext { background:#e3edfb; color:#1e4fa0; font-size:11px; }
.hc-body > span { color:var(--muted); font-size:12px; line-height:1.5; }
.hc-go { color:#a7bbb4; align-self:center; transition:transform .16s ease, color .16s ease; }
.home-card:hover .hc-go { transform:translateX(3px); color:var(--green); }
.home-side { display:grid; gap:18px; position:sticky; top:18px; }
.home-flow, .home-activity { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:18px; box-shadow:var(--shadow-sm); }
.home-flow ol { list-style:none; margin:0; padding:0; display:grid; gap:10px; position:relative; }
.home-flow li a { display:grid; grid-template-columns:30px 1fr; column-gap:12px; row-gap:2px; padding:10px 12px; border-radius:12px; text-decoration:none; color:inherit; border:1px solid transparent; }
.home-flow li a:hover { background:#f2f9f5; border-color:var(--line); }
.fl-n { grid-row:span 2; width:30px; height:30px; border-radius:50%; display:grid; place-items:center; font:700 13px var(--font-display); background:var(--green); color:#fff; }
.home-flow li b { font:700 13px var(--font-display); }
.home-flow li a > span:last-child { color:var(--muted); font-size:11.5px; line-height:1.45; }
.home-activity header a { font-size:11.5px; font-weight:700; color:var(--green-dark); text-decoration:none; display:inline-flex; align-items:center; gap:5px; }
.home-activity ul { list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.home-activity li { display:flex; gap:11px; padding:9px 4px; border-bottom:1px dashed #e6eeea; }
.home-activity li:last-child { border-bottom:0; }
.ra-ic { width:26px; height:26px; flex:none; border-radius:8px; display:grid; place-items:center; color:var(--c); background:color-mix(in srgb,var(--c) 14%,white); }
.home-activity li div { min-width:0; display:grid; }
.home-activity li b { font-size:12.5px; line-height:1.35; overflow-wrap:anywhere; }
.home-activity li small { color:var(--muted); font-size:11px; }
@media (max-width:1100px) { .home-layout { grid-template-columns:1fr; } .home-side { position:static; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); } }
@media (max-width:760px) { .home-hero { grid-template-columns:1fr; padding:24px 20px; } .home-hero-art { display:none; } .home-hero h2 { font-size:26px; } }

/* ---- Settings ---- */
.st-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(380px,1fr)); gap:16px; align-items:start; }
.st-card { background:var(--card); border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow-sm); overflow:hidden; }
.st-card.wide { grid-column:1 / -1; }
.st-card > header { padding:16px 18px 12px; display:flex; gap:12px; align-items:flex-start; border-bottom:1px solid var(--line); background:linear-gradient(180deg,#fbfdfc,#f6faf8); }
.st-card > header .hc-ic { width:36px; height:36px; }
.st-card > header h3 { font:700 14.5px var(--font-display); }
.st-card > header p { color:var(--muted); font-size:12px; margin-top:2px; line-height:1.5; }
.st-body { padding:16px 18px 18px; display:grid; gap:14px; }
.kv { display:grid; grid-template-columns:150px 1fr; gap:6px 14px; font-size:12.5px; }
.kv dt { color:var(--muted); font-weight:600; }
.kv dd { margin:0; overflow-wrap:anywhere; }
.st-row { display:flex; align-items:center; gap:14px; justify-content:space-between; padding:10px 0; border-bottom:1px dashed #e6eeea; }
.st-row:last-child { border-bottom:0; }
.st-row b { display:block; font-size:13px; }
.st-row small { color:var(--muted); font-size:11.5px; line-height:1.45; display:block; margin-top:2px; }
.switch { position:relative; width:42px; height:24px; flex:none; }
.switch input { position:absolute; inset:0; opacity:0; cursor:pointer; margin:0; z-index:1; }
.switch span { position:absolute; inset:0; background:#cfdcd6; border-radius:999px; transition:background .16s ease; }
.switch span:after { content:""; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.25); transition:transform .16s ease; }
.switch input:checked + span { background:var(--green); }
.switch input:checked + span:after { transform:translateX(18px); }
.switch input:disabled + span { opacity:.5; }
.st-actions { display:flex; flex-wrap:wrap; gap:8px; }
.st-note { font-size:12px; color:var(--muted); line-height:1.6; background:#f6faf8; border:1px solid var(--line); border-radius:10px; padding:10px 12px; }
.st-note.warn { background:#fff7ea; border-color:#f3d9a8; color:#7a4a0c; }
.st-note.bad { background:#fdeceb; border-color:#f1bcb8; color:#8f1f18; }
.st-note.ok { background:#eaf7f0; border-color:#b8e0cb; color:#145c40; }
.st-list { width:100%; border-collapse:collapse; font-size:12.5px; }
.st-list th { text-align:left; color:var(--muted); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; padding:6px 8px; border-bottom:1px solid var(--line); }
.st-list td { padding:8px; border-bottom:1px solid #eef3f0; vertical-align:top; overflow-wrap:anywhere; }

/* ---- Home: ask for a role ---- */
.home-request { background:var(--card); border:1px solid var(--line); border-left:4px solid var(--green); border-radius:16px; padding:18px 20px; box-shadow:var(--shadow-sm); display:grid; gap:12px; scroll-margin-top:20px; margin-bottom:22px; }
.home-request.none { border-left-color:#f3a84b; background:linear-gradient(180deg,#fffaf1,#fff); }
.home-request.warn { border-left-color:#ef7d75; }
.home-request header h3 { font:700 15px var(--font-display); display:flex; align-items:center; gap:8px; }
.home-request header p { color:var(--muted); font-size:12.5px; line-height:1.6; margin-top:4px; }
.hr-form { display:grid; grid-template-columns:minmax(200px,320px) minmax(0,1fr); gap:12px 16px; align-items:start; }
.hr-form label { display:grid; gap:5px; min-width:0; font-size:11.5px; font-weight:700; color:var(--muted); }
.hr-form select, .hr-form textarea { width:100%; min-width:0; max-width:100%; box-sizing:border-box; text-overflow:ellipsis; font:inherit; font-size:13px; font-weight:400; color:var(--ink,#10241d); border:1px solid var(--line); border-radius:10px; padding:8px 10px; background:#fff; resize:vertical; }
.hr-actions { grid-column:1 / -1; display:flex; gap:8px; }
.hr-status { display:grid; gap:3px; padding:10px 12px; border-radius:10px; font-size:12.5px; background:#eaf7f0; border:1px solid #b8e0cb; color:#145c40; }
.hr-status.pending { background:#fff7ea; border-color:#f3d9a8; color:#7a4a0c; }
.hr-status.rejected { background:#fdeceb; border-color:#f1bcb8; color:#8f1f18; }
.hr-status small { opacity:.85; }
@media (max-width:900px) { .hr-form { grid-template-columns:1fr; } }

/* ---- Roles & access ---- */
.ac-pill { display:inline-block; font-size:10.5px; font-weight:700; padding:2px 8px; border-radius:999px; background:#eef3f0; color:var(--muted); vertical-align:middle; }
.ac-pill.ok { background:#eaf7f0; color:#145c40; }
.ac-pill.bad { background:#fdeceb; color:#8f1f18; }
.ac-pill .ac-x { border:0; background:none; color:inherit; cursor:pointer; font-weight:700; padding:0 0 0 4px; line-height:1; }
.ac-pill .ac-x:hover { color:#8f1f18; }
.ac-dv-grant { display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap; margin-top:10px; }
.ac-dv-grant label { display:flex; flex-direction:column; gap:4px; font-size:12px; font-weight:600; color:var(--muted); }
.ac-dv-grant select { min-width:240px; padding:7px 9px; border:1px solid var(--line, #cfdcd6); border-radius:8px; font:inherit; }
.ac-act { white-space:nowrap; text-align:right; }
#ac-root .st-body > * { min-width:0; }
#ac-root .st-list { display:block; overflow-x:auto; }
.ac-act .btn + .btn { margin-left:6px; }
.btn.danger { color:#8f1f18; border-color:#f1bcb8; }
.btn.danger:hover { background:#fdeceb; }
.st-list select, .ac-search input, .ac-fields input { font:inherit; font-size:12.5px; border:1px solid var(--line); border-radius:9px; padding:7px 10px; background:#fff; }
.ac-search { display:flex; gap:8px; }
.ac-search input { flex:1; min-width:0; }
.ac-results { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:8px; max-height:260px; overflow:auto; }
.ac-result, .ac-role { display:grid; gap:2px; text-align:left; font:inherit; background:#fff; border:1px solid var(--line); border-radius:10px; padding:9px 11px; cursor:pointer; color:inherit; }
.ac-result:hover, .ac-role:hover { border-color:#95c7b3; background:#f6faf8; }
.ac-result.on, .ac-role.on { border-color:var(--green); background:#eaf7f0; box-shadow:0 0 0 2px rgba(8,127,91,.12); }
.ac-result b, .ac-role b { font-size:12.5px; }
.ac-result small, .ac-role small { color:var(--muted); font-size:11px; overflow-wrap:anywhere; }
.ac-role.add { border-style:dashed; }
.ac-picked { display:grid; gap:10px; padding:12px 14px; border:1px solid #b8e0cb; border-radius:12px; background:#f4fbf7; }
.ac-picked > div:first-child { display:grid; }
.ac-picked small { color:var(--muted); font-size:11.5px; }
.ac-checks { display:flex; flex-wrap:wrap; gap:6px 14px; }
.ac-check { display:inline-flex; align-items:center; gap:6px; font-size:12.5px; cursor:pointer; }
.ac-roles { display:grid; grid-template-columns:240px minmax(0,1fr); gap:16px; align-items:start; }
.ac-role-list { display:grid; gap:8px; }
.ac-editor { display:grid; gap:12px; min-width:0; }
.ac-fields { display:grid; grid-template-columns:minmax(160px,1fr) 2fr; gap:10px; }
.ac-fields label { display:grid; gap:4px; font-size:11.5px; font-weight:700; color:var(--muted); }
.ac-fields input:disabled { background:#f3f6f5; color:var(--muted); }
.ac-group { border:1px solid var(--line); border-radius:12px; padding:10px 12px 12px; display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:6px 14px; margin:0; }
.ac-group legend { font:700 12px var(--font-display); padding:0 6px; color:var(--green-dark,#065f45); }
.ac-perm { display:flex; gap:8px; align-items:flex-start; font-size:12.5px; cursor:pointer; padding:4px 2px; }
.ac-perm input { margin-top:2px; }
.ac-perm span { display:grid; gap:1px; }
.ac-perm small { color:var(--muted); font-size:10.5px; }
.ac-perm.warn small { color:#b0560b; font-weight:700; }
@media (max-width:900px) { .ac-roles, .ac-fields { grid-template-columns:1fr; } }
body.compact .main { padding-top:16px; }
body.compact .ins-tile { min-height:84px; padding:12px 14px; }
body.compact .ins-card { padding:12px 14px; }
body.compact td, body.compact th { padding-top:6px !important; padding-bottom:6px !important; }

/* ---- Audit trail ---- */
.au-status { display:flex; flex-wrap:wrap; align-items:center; gap:12px; justify-content:space-between; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:12px 16px; box-shadow:var(--shadow-sm); margin-bottom:16px; }
.au-status .au-src { display:flex; align-items:center; gap:10px; font-size:12.5px; min-width:0; }
.au-status .au-src i { width:10px; height:10px; border-radius:50%; background:#c4cfcb; flex:none; }
.au-status .au-src.ok i { background:#2fb583; box-shadow:0 0 0 4px rgba(47,181,131,.2); }
.au-status .au-src.warn i { background:#f3a84b; box-shadow:0 0 0 4px rgba(243,168,75,.2); }
.au-status .au-src.bad i { background:#c85b55; box-shadow:0 0 0 4px rgba(200,91,85,.2); }
.au-status small { display:block; color:var(--muted); font-size:11.5px; }
.au-filters { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:14px 16px; box-shadow:var(--shadow-sm); margin-bottom:16px; align-items:end; }
.au-filters label { display:grid; gap:5px; font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.4px; }
.au-filters select, .au-filters input { border:1px solid var(--line); border-radius:8px; padding:8px 10px; font-size:12.5px; background:#fff; color:var(--ink); min-width:0; text-transform:none; letter-spacing:0; font-weight:500; }
.au-filters .au-grow { grid-column:span 2; }
.au-tabs { display:flex; gap:3px; border-bottom:1px solid var(--line); padding:9px 14px 0; background:#fbfdfc; overflow-x:auto; }
.au-tab { border:0; background:transparent; color:var(--muted); padding:10px 15px; font-size:12.5px; font-weight:700; border-radius:8px 8px 0 0; position:relative; white-space:nowrap; }
.au-tab:hover { color:var(--green-dark); background:rgba(8,127,91,.06); }
.au-tab.active { color:var(--green-dark); background:var(--card); }
.au-tab.active:after { content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--green); }
.au-tab .cnt { margin-left:6px; background:#e3f5ec; color:var(--green-dark); border-radius:999px; padding:1px 8px; font-size:11px; }
.au-table-wrap { overflow-x:auto; }
.au-table { width:100%; border-collapse:collapse; font-size:12.5px; }
.au-table th { text-align:left; padding:10px 14px; font-size:11px; letter-spacing:.4px; text-transform:uppercase; color:var(--muted); background:#fbfdfc; border-bottom:1px solid var(--line); white-space:nowrap; position:sticky; top:0; }
.au-table td { padding:10px 14px; border-bottom:1px solid #eef3f0; vertical-align:top; }
.au-table tbody tr { cursor:pointer; }
.au-table tbody tr:hover { background:#f6fbf8; }
.au-table .au-when { white-space:nowrap; font-variant-numeric:tabular-nums; }
.au-table .au-when small { display:block; color:var(--muted); font-size:11px; }
.au-table .au-act { max-width:520px; overflow-wrap:anywhere; }
.au-table .au-act small { display:block; color:var(--muted); font-size:11.5px; margin-top:2px; }
.au-cat { display:inline-flex; align-items:center; gap:6px; border-radius:999px; padding:2px 10px 2px 8px; font-size:11px; font-weight:700; color:var(--c); background:color-mix(in srgb,var(--c) 13%,white); white-space:nowrap; }
.au-cat:before { content:""; width:6px; height:6px; border-radius:50%; background:var(--c); }
.au-user { display:flex; align-items:center; gap:9px; min-width:0; }
.au-user .avatar { width:26px; height:26px; font-size:10.5px; }
.au-user span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:200px; }
.au-pager { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 16px; border-top:1px solid var(--line); font-size:12px; color:var(--muted); flex-wrap:wrap; }
.au-pager .btn { padding:6px 12px; }
.au-empty { padding:40px 20px; text-align:center; color:var(--muted); font-size:13px; }
.au-detail dl { display:grid; grid-template-columns:110px 1fr; gap:8px 14px; font-size:12.5px; margin:0; padding:6px 20px 20px; }
.au-detail dt { color:var(--muted); font-weight:700; }
.au-detail dd { margin:0; overflow-wrap:anywhere; }
.au-detail pre { margin:0; white-space:pre-wrap; background:#0f1f1b; color:#d5efe4; border-radius:10px; padding:10px 12px; font-size:11.5px; }
.au-bar-mini { display:inline-block; height:6px; border-radius:999px; background:var(--green); vertical-align:middle; margin-right:6px; min-width:3px; }
