/* ==========================================================================
   PSA Leadership Ledger — shared stylesheet (student + admin apps)
   Visual system ported from the prototype (PSA_Leadership_Ledger.html).
   ========================================================================== */
:root{
  --navy:#1A1A2E; --navy2:#16213E; --teal:#1B7A8C; --teal-d:#155F6E;
  --teal-l:#E4F0F2; --lilac:#EFF1FB; --ink:#1A1A2E; --grey:#5A5A6E;
  --line:#D9D9E0; --gold:#C79A3B; --paper:#FBFBFD; --white:#FFFFFF;
  /* stock band colours */
  --critical:#B4453A; --strained:#C97F3B; --stable:#4E8FA0; --strong:#2E8B6F;
  --font: "Calibri","Segoe UI",system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--font); color:var(--ink); background:var(--lilac);
  line-height:1.5; font-size:16px; padding:0 0 60px;
}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}

/* ---------- MASTHEAD ---------- */
header.top{background:var(--navy);color:var(--white);padding:22px 0 20px;border-bottom:4px solid var(--teal)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.brand .eyebrow{font-size:12px;letter-spacing:.14em;font-weight:700;color:#9FB8C8;text-transform:uppercase}
.brand h1{font-size:26px;font-weight:700;letter-spacing:.01em;margin-top:2px}
.brand .sub{font-size:13px;color:#C7CBDA;font-style:italic;margin-top:2px}
.team-tag{text-align:right;font-size:13px;color:#C7CBDA}
.team-tag strong{display:block;color:var(--white);font-size:18px;font-weight:700}
.team-tag button{margin-top:6px}

/* ---------- BUTTONS ---------- */
button{font-family:var(--font);cursor:pointer;border:none;border-radius:6px;font-size:14px;font-weight:600;transition:background .15s,opacity .15s,transform .05s}
button:active{transform:translateY(1px)}
button:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.btn-teal{background:var(--teal);color:var(--white);padding:11px 20px}
.btn-teal:hover{background:var(--teal-d)}
.btn-ghost{background:transparent;color:#C7CBDA;border:1px solid #3A4A63;padding:7px 14px}
.btn-ghost:hover{background:#22314d;color:var(--white)}
.btn-outline{background:var(--white);color:var(--teal);border:1.5px solid var(--teal);padding:10px 18px}
.btn-outline:hover{background:var(--teal-l)}
.btn-gold{background:var(--gold);color:#3a2c07;padding:12px 22px;font-weight:700}
.btn-gold:hover{background:#b98d31}
.btn-danger{background:transparent;color:var(--critical);border:1px solid var(--critical);padding:8px 14px}
.btn-danger:hover{background:#f6e9e7}
button[disabled]{opacity:.4;cursor:not-allowed}
.btn-sm{font-size:12.5px;padding:6px 11px}

/* ---------- SETUP CARD ---------- */
.setup{max-width:520px;margin:60px auto;background:var(--white);border-radius:12px;padding:36px 34px;box-shadow:0 8px 30px rgba(26,26,46,.10)}
.setup h2{font-size:22px;color:var(--navy);margin-bottom:6px}
.setup p.lede{color:var(--grey);font-size:14px;margin-bottom:22px}
.field{margin-bottom:18px}
.field label{display:block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--teal);margin-bottom:6px}
.field input, .field select{width:100%;font-family:var(--font);font-size:16px;padding:11px 13px;border:1.5px solid var(--line);border-radius:7px;background:var(--paper);color:var(--ink)}
.field input:focus, .field select:focus{outline:none;border-color:var(--teal)}
.field-error{color:var(--critical);font-size:13px;margin-top:8px;display:none}
.field-error.on{display:block}

/* ---------- SECTION SHELL ---------- */
main{padding-top:26px}
.panel{background:var(--white);border-radius:12px;padding:24px 26px;box-shadow:0 3px 14px rgba(26,26,46,.06);margin-bottom:22px}
.panel > h2.sec{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin-bottom:16px;display:flex;align-items:center;gap:10px}
.panel > h2.sec::after{content:"";flex:1;height:1px;background:var(--line)}

/* ---------- STOCK DASHBOARD ---------- */
.stock-row{display:grid;grid-template-columns:200px 1fr;gap:16px;align-items:center;padding:12px 0;border-bottom:1px solid var(--lilac)}
.stock-row:last-child{border-bottom:none}
@media(max-width:620px){.stock-row{grid-template-columns:1fr;gap:6px}}
.stock-name{font-weight:700;font-size:15px;color:var(--navy)}
.stock-name span{display:block;font-weight:400;font-size:11.5px;color:var(--grey);margin-top:1px}
.meter{position:relative}
.meter-track{display:flex;height:34px;border-radius:7px;overflow:hidden;border:1px solid var(--line)}
.seg{flex:1;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;letter-spacing:.03em;color:rgba(255,255,255,.55);position:relative;transition:color .2s}
.seg.s0{background:#e7d3d1}.seg.s1{background:#eaddcf}.seg.s2{background:#d5e4e8}.seg.s3{background:#d3e8df}
.seg.active.s0{background:var(--critical);color:#fff}
.seg.active.s1{background:var(--strained);color:#fff}
.seg.active.s2{background:var(--stable);color:#fff}
.seg.active.s3{background:var(--strong);color:#fff}
.seg .arrow{position:absolute;top:-1px;bottom:-1px;width:100%;border:2px solid rgba(255,255,255,.9);border-radius:5px;pointer-events:none;opacity:0;box-shadow:0 0 0 2px rgba(26,26,46,.15)}
.seg.active .arrow{opacity:1}
.delta-flash{animation:flash 1.4s ease-out}
@keyframes flash{0%{box-shadow:0 0 0 0 rgba(199,154,59,.7)}100%{box-shadow:0 0 0 8px rgba(199,154,59,0)}}

/* ---------- WORKSHOP TIMELINE ---------- */
.timeline{display:flex;gap:0;flex-wrap:wrap}
.wk{flex:1;min-width:112px;text-align:center;padding:14px 8px;border-radius:9px;margin:4px;border:1.5px solid var(--line);background:var(--paper);position:relative}
.wk.done{background:var(--teal-l);border-color:var(--teal)}
.wk.current{background:var(--navy);border-color:var(--navy)}
.wk.locked{opacity:.5}
.wk .wknum{font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--grey)}
.wk.current .wknum{color:#9FB8C8}
.wk .aa{font-size:15px;font-weight:700;color:var(--navy);margin:3px 0}
.wk.current .aa{color:var(--white)}
.wk.done .aa{color:var(--teal-d)}
.wk .thm{font-size:11px;color:var(--grey);line-height:1.3}
.wk.current .thm{color:#C7CBDA}
.wk .tick{position:absolute;top:6px;right:8px;font-size:12px;color:var(--teal-d);font-weight:700}
.wk .opens{font-size:10.5px;color:var(--gold);font-weight:700;margin-top:3px}

/* ---------- CURRENT DECISION ---------- */
.decision-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:4px}
.decision-head .aa-badge{background:var(--teal);color:#fff;font-size:12px;font-weight:700;padding:3px 10px;border-radius:5px;letter-spacing:.04em}
.decision-head h3{font-size:21px;color:var(--navy);font-weight:700}
.decision-theme{font-size:13px;color:var(--grey);font-style:italic;margin-bottom:14px}
.prompt{background:var(--lilac);border-left:4px solid var(--teal);padding:14px 16px;border-radius:0 8px 8px 0;font-size:14.5px;color:var(--navy);margin-bottom:18px}
.prompt.warn{background:#f6efe0;border-left-color:var(--gold);margin-top:12px;font-size:13.5px;margin-bottom:0}
.decision-label{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--teal);margin:16px 0 8px}
.opt{display:block;width:100%;text-align:left;background:var(--paper);border:1.5px solid var(--line);border-radius:8px;padding:13px 15px;margin-bottom:9px;font-size:14.5px;color:var(--navy);font-weight:600}
.opt:hover{border-color:var(--teal);background:var(--teal-l)}
.opt.sel{border-color:var(--teal);background:var(--teal-l);box-shadow:inset 0 0 0 1px var(--teal)}
.opt .opt-sub{display:block;font-weight:400;font-size:12.5px;color:var(--grey);margin-top:3px}
textarea.just{width:100%;font-family:var(--font);font-size:14.5px;padding:12px 13px;border:1.5px solid var(--line);border-radius:8px;background:var(--paper);min-height:74px;resize:vertical;color:var(--ink)}
textarea.just:focus{outline:none;border-color:var(--teal)}
.commit-bar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:18px;flex-wrap:wrap}
.commit-note{font-size:12.5px;color:var(--grey);max-width:440px}

/* ---------- RECAP ("Since your last sitting") ---------- */
.recap{border-left:5px solid var(--gold);position:relative}
.recap h2.sec{color:var(--gold) !important}
.recap .recap-item{display:flex;gap:9px;align-items:baseline;flex-wrap:wrap;padding:6px 0;font-size:14px}
.recap .recap-wk{font-size:11px;font-weight:700;letter-spacing:.05em;color:var(--teal);text-transform:uppercase;white-space:nowrap}
.recap .recap-what{font-weight:600;color:var(--navy)}
.recap .recap-next{margin-top:12px;padding:12px 14px;background:var(--lilac);border-radius:8px;font-size:14px;color:var(--navy)}
.recap .recap-dismiss{position:absolute;top:16px;right:18px}
.recap .recap-tutor{color:var(--critical);font-weight:600;font-size:14px;padding:6px 0}

/* ---------- LOG ---------- */
.logitem{border-left:3px solid var(--teal);padding:10px 0 10px 15px;margin-bottom:14px}
.logitem .lg-head{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.logitem .lg-wk{font-size:11px;font-weight:700;letter-spacing:.05em;color:var(--teal);text-transform:uppercase}
.logitem .lg-choice{font-weight:700;font-size:15px;color:var(--navy)}
.logitem .lg-just{font-size:13.5px;color:var(--grey);font-style:italic;margin-top:3px}
.logitem .lg-note{font-size:13px;color:var(--gold);font-weight:600;margin-top:3px}
.logitem .lg-deltas{margin-top:6px;display:flex;gap:6px;flex-wrap:wrap}
.chip{font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px}
.chip.up{background:#dcefe6;color:var(--strong)}
.chip.down{background:#f3ded9;color:var(--critical)}
.chip.flat{background:var(--lilac);color:var(--grey)}
.empty{color:var(--grey);font-size:14px;font-style:italic;padding:8px 0}

/* ---------- FOOTER TOOLS ---------- */
.toolbar{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:8px}

/* ---------- MODAL ---------- */
.modal-bg{position:fixed;inset:0;background:rgba(26,26,46,.55);display:none;align-items:center;justify-content:center;padding:20px;z-index:50}
.modal-bg.on{display:flex}
.modal{background:var(--white);border-radius:12px;max-width:560px;width:100%;padding:28px 30px;max-height:86vh;overflow:auto}
.modal.wide{max-width:880px}
.modal h3{font-size:19px;color:var(--navy);margin-bottom:12px}
.modal p{font-size:14px;color:var(--grey);margin-bottom:14px}
.modal .modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:8px;flex-wrap:wrap}
.code-box{width:100%;font-family:"Consolas",monospace;font-size:12px;padding:12px;border:1.5px solid var(--line);border-radius:8px;background:var(--paper);min-height:120px;resize:vertical}

.tutor-only{font-size:11px;color:var(--gold);font-weight:700;letter-spacing:.04em}
.hidden{display:none !important}
.sr-note{font-size:12.5px;color:var(--grey);margin-top:10px}

/* ==========================================================================
   ADMIN DASHBOARD
   ========================================================================== */
.admin-nav{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0 4px}
.admin-nav button{background:var(--white);color:var(--grey);border:1.5px solid var(--line);padding:9px 18px;border-radius:8px}
.admin-nav button.on{background:var(--navy);color:var(--white);border-color:var(--navy)}
.admin-meta{font-size:12.5px;color:var(--grey);margin:6px 0 14px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}

.stream-block h3{font-size:15px;color:var(--navy);margin:18px 0 8px}
table.matrix{width:100%;border-collapse:collapse;font-size:13px}
table.matrix th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--grey);text-align:left;padding:6px 8px;border-bottom:1.5px solid var(--line)}
table.matrix td{padding:7px 8px;border-bottom:1px solid var(--lilac);vertical-align:middle}
table.matrix tr.clickable{cursor:pointer}
table.matrix tr.clickable:hover td{background:var(--teal-l)}
.mono{font-family:"Consolas",monospace;font-size:12.5px}
.band-cells{display:flex;gap:3px}
.band-cell{width:26px;height:20px;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:#fff}
.band-cell.b0{background:var(--critical)}
.band-cell.b1{background:var(--strained)}
.band-cell.b2{background:var(--stable)}
.band-cell.b3{background:var(--strong)}
.band-cell.bx{background:var(--line);color:var(--grey)}
.tick-cells{display:flex;gap:3px}
.tick-cell{width:18px;height:18px;border-radius:4px;background:var(--lilac);display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--teal-d);font-weight:700}
.tick-cell.done{background:var(--teal-l)}
.badge-behind{background:#f3ded9;color:var(--critical);font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px}
.badge-ok{background:#dcefe6;color:var(--strong);font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px}

.sched-row{display:grid;grid-template-columns:70px 60px 1fr 220px 120px;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--lilac);font-size:14px}
@media(max-width:720px){.sched-row{grid-template-columns:1fr 1fr;row-gap:6px}}
.sched-row input[type=datetime-local]{font-family:var(--font);font-size:13.5px;padding:7px 9px;border:1.5px solid var(--line);border-radius:6px;background:var(--paper)}
.pub-pill{font-size:11px;font-weight:700;padding:2px 9px;border-radius:20px}
.pub-pill.pub{background:#dcefe6;color:var(--strong)}
.pub-pill.unpub{background:var(--lilac);color:var(--grey)}

.detail-actions{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}
.kv{display:flex;gap:10px;flex-wrap:wrap;font-size:13.5px;color:var(--grey);margin-bottom:10px}
.kv strong{color:var(--navy)}
