/* Myria Design System adaptation for the Boss Decision Desk. */
:root {
  --primary-950: #0a291d;
  --primary-900: #103426;
  --primary-800: #193f31;
  --primary-700: #29583f;
  --primary-600: #35654c;
  --accent: #29583f;
  --accent-600: #193f31;
  --accent-pale: #f3f5e7;
  --accent-mist: #f8faf3;
  --gold: #756238;
  --gold-bright: #ddcea4;
  --ink: #103426;
  --ink-2: #496359;
  --ink-3: #74867e;
  --paper: #ffffff;
  --mist: #f8faf3;
  --line: #d9e2d5;
  --line-2: #c4d2bf;
  --card: #ffffff;
  --red: #ab4b3e;
  --shadow-sm: 0 1px 2px rgba(3, 28, 18, .06);
  --shadow: 0 8px 24px rgba(3, 28, 18, .08);
  --shadow-lg: 0 18px 46px rgba(3, 28, 18, .13);
  --brand-gradient: radial-gradient(ellipse at 90% 10%, #35654c 0%, transparent 60%), linear-gradient(120deg, #103426, #193f31);
}

body {
  background: #fff;
}

aside {
  width: 272px;
  padding: 28px 24px 24px;
  background: var(--brand-gradient);
  box-shadow: 10px 0 36px rgba(3, 28, 18, .1);
}

.myria-lockup {
  gap: 12px;
  padding: 0 2px 23px;
  margin-bottom: 22px;
  border-bottom-color: rgba(221, 206, 164, .28);
}

.myria-lockup img {
  width: 33px;
  height: 33px;
}

.myria-lockup b {
  font-family: var(--serif);
  font-size: 18px;
  color: #f3f5e7;
}

.myria-lockup small {
  color: #bad7bd;
  font-size: 10px;
  letter-spacing: .3em;
}

.brand {
  gap: 12px;
  font-family: var(--serif);
  font-size: 19px;
  color: #f3f5e7;
}

.brand-logo {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  border-color: rgba(221, 206, 164, .45);
  box-shadow: 0 10px 26px rgba(3, 28, 18, .3);
}

.brand small,
.nav-label,
nav button i,
nav button small,
.side-foot,
.side-foot > button {
  color: #bad7bd;
}

.nav-label {
  margin-top: 34px;
  letter-spacing: .2em;
}

nav {
  gap: 4px;
}

nav button {
  padding: 11px 12px;
  border-radius: 4px;
  color: rgba(243, 245, 231, .76);
}

nav button.active,
nav button:hover {
  background: rgba(186, 215, 189, .09);
  color: #f3f5e7;
}

nav button.active::before {
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 0;
  background: #ddcea4;
}

nav button.active i,
nav button.active small {
  color: #ecdfb4;
}

.admin-nav {
  border-top-color: rgba(221, 206, 164, .22) !important;
}

#roleDot {
  background: #ddcea4;
  box-shadow: 0 0 0 4px rgba(221, 206, 164, .12);
}

main {
  margin-left: 272px;
  width: calc(100% - 272px);
  padding: 40px clamp(28px, 4vw, 64px) 56px;
  max-width: 1660px;
}

header {
  align-items: center;
  margin-bottom: 30px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--line);
}

h1 {
  font-size: 32px;
  color: var(--ink);
}

.eyebrow {
  color: var(--accent);
  font-size: 11px;
  letter-spacing: .2em;
}

.eyebrow::before {
  width: 15px;
  height: 15px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M66 88 H28 Q12 88 12 72 V28 Q12 12 28 12 H72 Q88 12 88 28 V64' fill='none' stroke='%2329583F' stroke-width='13' stroke-linecap='round'/%3E%3Ccircle cx='50' cy='50' r='11' fill='%2329583F'/%3E%3Ccircle cx='84' cy='83' r='8' fill='%23DDCEA4'/%3E%3C/svg%3E");
}

.date {
  color: var(--ink-3);
  font-size: 13px;
}

.hero {
  min-height: 320px;
  align-items: center;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .85fr);
  gap: 36px;
  padding: clamp(34px, 4vw, 54px);
  border: 0;
  border-radius: 10px;
  color: #f3f5e7;
  background: var(--brand-gradient);
  box-shadow: var(--shadow);
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(105deg, rgba(221, 206, 164, .035) 0 1px, transparent 1px 22px);
}

.hero::after {
  right: -70px;
  top: -90px;
  width: 270px;
  height: 270px;
  border: 34px solid rgba(221, 206, 164, .055);
  border-radius: 54px;
  transform: rotate(8deg);
}

.hero h2 {
  margin: 18px 0 14px;
  color: #f3f5e7;
  font-size: clamp(31px, 3.15vw, 43px);
  line-height: 1.18;
}

.hero p {
  color: #bad7bd;
  font-size: 16px;
}

.hero .pill,
.inspiration-hero-main .pill {
  border: 1px solid rgba(221, 206, 164, .36);
  background: rgba(221, 206, 164, .11);
  color: #ecdfb4;
}

.hero .primary {
  background: #ddcea4;
  color: #103426;
}

.hero .primary:hover {
  background: #ecdfb4;
  color: #103426;
}

.daily-flow {
  gap: 12px;
  padding: 22px;
  border: 1px solid rgba(221, 206, 164, .32);
  border-radius: 8px;
  background: rgba(186, 215, 189, .07);
}

.daily-flow > div {
  padding: 8px 0;
  border-bottom: 1px solid rgba(221, 206, 164, .18);
}

.daily-flow > div:last-child {
  border-bottom: 0;
}

.daily-flow b {
  border-radius: 4px;
  background: rgba(221, 206, 164, .15);
  color: #ecdfb4;
}

.daily-flow strong {
  color: #f3f5e7;
}

.daily-flow small {
  color: #bad7bd;
}

.panel,
.metric,
.debate article,
.verdict,
.advisor-action,
.knowledge-stream .knowledge-card,
#reviewContent .knowledge-card {
  border-color: var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow-sm);
}

.panel {
  padding: 24px;
}

.panel-title {
  padding-bottom: 15px;
  margin-bottom: 6px;
}

.panel-title h2,
.knowledge-toolbar h2,
.capture-top b {
  color: var(--ink);
}

.page-tip {
  border-left-color: var(--accent);
  border-radius: 0 4px 4px 0;
  background: #f8faf3;
}

.metric::after {
  height: 3px;
  background: var(--accent);
}

.metric strong,
.checklist button > span,
.checklist button em,
.page-tip button,
.examples button:hover,
.ghost:hover,
.knowledge-open,
.knowledge-toolbar-actions a {
  color: var(--accent);
}

.checklist button:hover {
  background: #f8faf3;
}

.primary {
  border-radius: 4px;
  background: var(--accent);
  color: #f3f5e7;
  font-weight: 700;
}

.primary:hover {
  background: var(--accent-600);
  box-shadow: 0 8px 24px rgba(41, 88, 63, .24);
}

.pill,
.tag,
.source-state,
.examples button,
.voice-button,
.knowledge-tags span,
.knowledge-toolbar-actions a,
.decision-badge {
  border-radius: 100px;
}

textarea,
.form input,
.form select,
.clarify-card input,
.clarify-card select,
.advisor-action input,
.advisor-action select {
  border-radius: 4px;
}

textarea:focus,
input:focus,
select:focus {
  outline-color: rgba(41, 88, 63, .14);
}

.advisor-stage {
  border-radius: 8px;
  background: #f8faf3;
}

.advisor-stage i,
.agent-role > i,
.advisor-action .action-no {
  background: var(--primary-800);
}

.verdict-agent {
  border-color: #ddcea4 !important;
}

.inspiration-hero-main {
  background: var(--brand-gradient);
  border-radius: 10px;
}

.inspiration-hero-main::after {
  border-color: rgba(221, 206, 164, .07);
}

.inspiration-value > p {
  color: #bad7bd;
}

.inspiration-paths span {
  border-color: rgba(221, 206, 164, .22);
  color: #f3f5e7;
}

.quick-capture {
  border-radius: 8px;
}

.knowledge-stream .knowledge-card,
#reviewContent .knowledge-card {
  border-left-color: var(--accent);
}

.login-gate {
  background: var(--brand-gradient);
}

.login-card {
  border: 1px solid rgba(221, 206, 164, .42);
  border-radius: 10px;
}

.login-card > img {
  border-radius: 8px;
}

.modal {
  background: rgba(10, 41, 29, .78);
}

.modal-card {
  border: 1px solid var(--line);
  border-radius: 10px;
}

@media (max-width: 850px) {
  aside {
    width: 100%;
    padding: 16px;
  }

  main {
    margin-left: 0;
    width: 100%;
    padding: 24px 16px 40px;
  }

  .hero {
    min-height: 0;
    grid-template-columns: 1fr;
    padding: 28px 24px;
  }

  .daily-flow {
    padding: 16px;
  }
}
