/* V2.8 focused desktop polish. Presentation only; no saved-data changes. */
:root{
  --v28-navy-purple:#21134f;
  --v28-deep-purple:#2b176f;
  --v28-mid-purple:#6248aa;
  --v28-active-purple:#765bc2;
  --v28-lavender:#ece6f6;
  --v28-line:#ddd6e8;
  --v28-ink:#241d2d;
  --v28-muted:#655d6e;
  --v28-paper:#ffffff;
}

/* Global visual confidence: cleaner white surfaces, crisper text. */
body{background:#f6f4f8;color:var(--v28-ink)}
#app>header{background:#fff;border-bottom:1px solid #ddd6e8;box-shadow:0 3px 16px rgba(33,19,79,.06);padding-top:14px;padding-bottom:14px}
#app>header img{max-width:360px}
#app>header button,#app>header details>summary{border-radius:11px}
#app>header #dashboard,#app>header #completeReview{background:var(--v28-mid-purple)}
#app>header .adminButton{background:var(--v28-deep-purple)!important}
#app>header .teamReflectionHeader{background:#f1edf8!important;border:1px solid #cbbde0!important;color:var(--v28-deep-purple)!important}
#app>header .teamReflectionHeader:hover{background:#e9e1f4!important}
.privacy{border-top:1px solid #ead995;border-bottom:1px solid #e7d488;color:#2f2934}

/* Desktop workspace: deliberately slim, dark navigation beside a light work area. */
@media(min-width:901px){
  #workspace{grid-template-columns:248px minmax(0,1fr);background:#fff;min-height:calc(100vh - 120px)}
  #workspace>nav.v27Sidebar{
    background:linear-gradient(180deg,#21134f 0%,#29185e 58%,#21134f 100%)!important;
    border-right:0!important;
    padding:24px 11px 28px!important;
    max-height:calc(100vh - 94px);
    box-shadow:8px 0 26px rgba(33,19,79,.09);
    scrollbar-color:#715aa9 transparent;
  }
  #workspace>nav.v27Sidebar h2{
    color:#fff!important;
    font-size:20px!important;
    line-height:1.2;
    font-weight:650!important;
    margin:2px 10px 5px!important;
    letter-spacing:-.01em;
  }
  #workspace>nav.v27Sidebar .v26NavIntro{
    color:#c8bddd!important;
    font-size:12.5px!important;
    font-weight:400!important;
    line-height:1.45;
    margin:0 10px 17px!important;
  }
  #workspace>nav.v27Sidebar #steps{display:grid;gap:3px}
  #workspace>nav.v27Sidebar .step.v27Step{
    display:grid!important;
    grid-template-columns:28px minmax(0,1fr);
    gap:9px;
    align-items:center;
    min-height:51px!important;
    margin:0!important;
    padding:8px 9px!important;
    border:1px solid transparent!important;
    border-radius:12px!important;
    background:transparent!important;
    box-shadow:none!important;
    color:#f2edf9!important;
    transform:none!important;
  }
  #workspace>nav.v27Sidebar .step.v27Step:hover{
    background:rgba(255,255,255,.075)!important;
    border-color:rgba(255,255,255,.08)!important;
    box-shadow:none!important;
    transform:none!important;
  }
  #workspace>nav.v27Sidebar .step.v27Step.active{
    background:linear-gradient(135deg,#775cc1 0%,#6950ae 100%)!important;
    border-color:rgba(255,255,255,.12)!important;
    color:#fff!important;
    box-shadow:0 7px 16px rgba(9,3,35,.22)!important;
  }
  #workspace>nav.v27Sidebar .step.v27Step.active:before{display:none!important}
  #workspace>nav.v27Sidebar .v26StepNo{
    width:27px!important;
    height:27px!important;
    min-width:27px!important;
    flex:0 0 27px!important;
    display:grid!important;
    place-items:center!important;
    background:transparent!important;
    color:#cfc3e4!important;
    border-radius:8px!important;
    font-size:0!important;
    font-weight:400!important;
  }
  #workspace>nav.v27Sidebar .v26StepNo::after{display:none!important;content:none!important}
  #workspace>nav.v27Sidebar .step.active .v26StepNo{background:rgba(255,255,255,.12)!important;color:#fff!important}
  #workspace>nav.v27Sidebar .step.done:not(.active) .v26StepNo{background:transparent!important;color:#bfb3d8!important}
  #workspace>nav.v27Sidebar .v28NavIcon{width:18px;height:18px;display:block;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
  #workspace>nav.v27Sidebar .v26StepText{gap:3px!important}
  #workspace>nav.v27Sidebar .v26StepLabel{
    color:#f7f4fb!important;
    font-size:15px!important;
    font-weight:450!important;
    line-height:1.25!important;
    letter-spacing:0!important;
  }
  #workspace>nav.v27Sidebar .v26StepText small{
    color:#bfb4d3!important;
    font-size:12px!important;
    font-weight:400!important;
    line-height:1.15!important;
  }
  #workspace>nav.v27Sidebar .step.active .v26StepText small{color:#efe9fa!important}
  #workspace>nav.v27Sidebar .step.done:not(.active){opacity:.88}

  #workspace>main{
    max-width:1180px!important;
    padding:30px clamp(28px,4vw,60px) 46px!important;
    background:#fff!important;
  }
  #workspace .title{border-bottom:1px solid #eee9f2;padding-bottom:13px;margin-bottom:14px}
  #workspace .title h1{font-size:clamp(31px,3vw,42px)!important;line-height:1.1;color:var(--v28-deep-purple)!important;font-weight:760!important}
  #workspace .crumb{color:#655d70;font-size:13px}
  #workspace .reviewProgress{border-radius:15px;background:#faf9fc;border:1px solid var(--v28-line);box-shadow:none}
  #workspace .card.prompt{border:1px solid #ddd6e7!important;border-radius:16px!important;box-shadow:0 5px 16px rgba(33,19,79,.05)!important;padding:20px!important}
  #workspace .card.prompt .ph>b{font-size:17px;line-height:1.35;color:#272030}
  #workspace textarea{border-radius:10px;min-height:96px}
  #workspace footer button{border-radius:10px;min-width:106px}
}

/* Consistent understated icon treatment for functional headings. */
.v28FunctionalIcon{width:19px;height:19px;vertical-align:-4px;margin-right:7px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* Coaching/support cards: clear and branded, without competing with the actual review question. */
.v25CoachHint,.v27CoachHint{background:#f2eef8!important;border:1px solid #d2c5e3!important;box-shadow:inset 4px 0 0 var(--v28-mid-purple)!important;border-radius:11px!important}
.v25CoachHint b,.v27CoachHint b{font-weight:700!important;color:var(--v28-deep-purple)!important}
.supportWhy,.supportPrompt{border-radius:10px!important}

/* Landing page: keep the same visual language as the app — confident purple, white surfaces, restrained decoration. */
.publicLanding{background:#f7f5f9}
.publicHeader{background:#fff}
.landingHero{border:1px solid #ddd4e9;box-shadow:0 15px 40px rgba(43,23,111,.08)}
.landingHero h1{font-weight:760!important}
.landingTagline{font-weight:700!important;color:var(--v28-mid-purple)!important}
.featureGrid article{border-radius:16px!important;box-shadow:0 7px 20px rgba(43,23,111,.06)!important}
.featureGrid h3{font-weight:700!important}
.audiencePills span{font-weight:550}

/* Team Reflection screen: readable working document on screen. */
#report.teamReflectionReport{max-width:1040px;margin:0 auto;background:#fff;color:#2b2530;padding:34px clamp(22px,5vw,62px) 55px}
#report.teamReflectionReport>img{width:min(360px,72%);margin-bottom:18px}
#report.teamReflectionReport>h1{color:var(--v28-deep-purple);font-size:38px;margin:4px 0 8px}
#report.teamReflectionReport>.conf{background:#f2eef8;border:1px solid #d4c9e2;border-left:5px solid var(--v28-mid-purple);border-radius:11px;padding:13px 15px}
#report.teamReflectionReport .teamReflectionIntro{background:#faf9fc!important;border:1px solid #ded7e8!important;border-left:5px solid var(--v28-mid-purple)!important;border-radius:12px;padding:15px 17px}
#report.teamReflectionReport .teamSection{margin-top:32px}
#report.teamReflectionReport .teamSection>h2{font-size:24px;border-bottom:2px solid #ede7f3;padding-bottom:9px;margin-bottom:13px}
#report.teamReflectionReport .teamTopic,#report.teamReflectionReport .teamStrength{border-radius:13px;background:#fff;border:1px solid #ddd6e5;padding:17px 18px;margin:14px 0;box-shadow:0 4px 12px rgba(33,19,79,.04)}
#report.teamReflectionReport .teamQuestions{background:#f7f5fa}
#report.teamReflectionReport .teamIdeas{background:#faf7ef}
#report.teamReflectionReport .teamFooter{border-top:1px solid #e5dfeb;padding-top:15px}

/* Print/PDF: purpose-built Team Reflection working document. */
@media print{
  @page{size:A4;margin:14mm 14mm 16mm}
  body{background:#fff!important;color:#111!important}
  #report.teamReflectionReport{max-width:none!important;margin:0!important;padding:0!important;font-family:Arial,Helvetica,sans-serif!important;font-size:10.5pt!important;line-height:1.38!important}
  #report.teamReflectionReport .printbar{display:none!important}
  #report.teamReflectionReport>img{display:block!important;width:66mm!important;max-height:24mm!important;object-fit:contain!important;margin:0 0 7mm!important}
  #report.teamReflectionReport>h1{font-size:22pt!important;line-height:1.1!important;color:#2b176f!important;margin:0 0 2.5mm!important}
  #report.teamReflectionReport>h1+p{font-size:10.5pt!important;margin:0 0 5mm!important;color:#3d3742!important}
  #report.teamReflectionReport>.conf,
  #report.teamReflectionReport .teamReflectionIntro{background:#f5f2f8!important;border:1px solid #cfc5dd!important;border-left:3.5mm solid #705faf!important;border-radius:2mm!important;padding:3.5mm 4mm!important;margin:0 0 5mm!important;box-shadow:none!important}
  #report.teamReflectionReport .teamSection{margin:7mm 0 0!important;break-before:auto}
  #report.teamReflectionReport .teamSection>h2{font-size:15pt!important;color:#2b176f!important;border-bottom:1px solid #cfc5dd!important;padding-bottom:2mm!important;margin:0 0 3mm!important}
  #report.teamReflectionReport .teamSection>p{margin:0 0 3mm!important;color:#4b4550!important}
  #report.teamReflectionReport .teamTopic,
  #report.teamReflectionReport .teamStrength{break-inside:avoid-page!important;page-break-inside:avoid!important;border:1px solid #cfcfcf!important;border-left-width:2.5mm!important;border-radius:2mm!important;box-shadow:none!important;padding:4mm!important;margin:0 0 5mm!important;background:#fff!important}
  #report.teamReflectionReport .teamTopicHead{gap:3mm!important}
  #report.teamReflectionReport .teamTopicHead h3{font-size:12pt!important;line-height:1.3!important;margin:0!important;color:#1f1b23!important}
  #report.teamReflectionReport .teamTopicHead small,#report.teamReflectionReport .teamStrength small{font-size:9pt!important;color:#666!important}
  #report.teamReflectionReport .ragBadge{font-size:8pt!important;padding:1mm 2mm!important;print-color-adjust:exact;-webkit-print-color-adjust:exact}
  #report.teamReflectionReport .teamQuestions,
  #report.teamReflectionReport .teamIdeas{background:#f8f8f8!important;border:1px solid #e2e2e2!important;border-radius:1.5mm!important;padding:3mm!important;margin-top:3mm!important;print-color-adjust:exact;-webkit-print-color-adjust:exact}
  #report.teamReflectionReport .teamQuestions p,
  #report.teamReflectionReport .teamIdeas p{margin:1.5mm 0!important;padding-left:4mm!important}
  #report.teamReflectionReport .teamTopic::after{
    content:'Notes';
    display:block;
    color:#666;
    font-size:8.5pt;
    font-weight:700;
    margin-top:4mm;
    padding-top:3mm;
    min-height:16mm;
    border-top:1px solid #ddd;
    background:repeating-linear-gradient(to bottom,transparent 0,transparent 6mm,#e8e8e8 6.1mm,#e8e8e8 6.3mm);
  }
  #report.teamReflectionReport .teamFooter{font-size:8.5pt!important;color:#555!important;border-top:1px solid #ccc!important;margin-top:7mm!important;padding-top:3mm!important}
}

/* Mobile protection: retain the compact layout that already works well. */
@media(max-width:900px){
  #workspace{grid-template-columns:1fr!important}
  #workspace>nav.v27Sidebar{display:none!important}
  #workspace>main{background:#fbfafc!important}
  #app>header{box-shadow:none}
  .landingHero{box-shadow:none}
}
