/* CIA Study Coach — Modern editorial format pass v0.2
   Branch-only. Matches the approved mobile/laptop concept more closely without changing study logic. */

/* Quiet geometric atmosphere */
.workspace,.access-shell{position:relative;isolation:isolate}
.workspace::before,.access-shell::before{
  content:"";position:fixed;pointer-events:none;z-index:-1;inset:0;
  background:
    radial-gradient(circle at 84% 8%,rgba(79,138,122,.08) 0 72px,transparent 73px),
    radial-gradient(circle at 90% 19%,transparent 0 118px,rgba(203,185,143,.22) 119px 120px,transparent 121px),
    radial-gradient(circle at 11% 83%,rgba(203,185,143,.08) 0 96px,transparent 97px),
    radial-gradient(circle at 16% 88%,transparent 0 144px,rgba(79,138,122,.12) 145px 146px,transparent 147px);
}

/* Header feels like a composed study-room banner rather than a plain app bar */
.topbar{padding-inline:clamp(20px,3vw,38px)}
.topbar>div:first-child{position:relative}
.topbar>div:first-child::after{
  content:"";position:absolute;right:-92px;top:-28px;width:72px;height:72px;border-radius:50%;
  border:1px solid rgba(79,138,122,.18);box-shadow:24px 20px 0 -1px rgba(203,185,143,.08)
}

/* Welcome card: closer to approved concept */
.welcome-card{position:relative;overflow:hidden;padding:30px 30px 28px}
.welcome-card::after{
  content:"";position:absolute;pointer-events:none;right:-48px;top:-62px;width:210px;height:210px;border-radius:50%;
  border:1px solid rgba(79,138,122,.13);box-shadow:-54px 62px 0 -1px rgba(203,185,143,.055)
}
.welcome-card>*{position:relative;z-index:1}
.welcome-card h3{max-width:720px;letter-spacing:-.025em}
.welcome-card p{max-width:760px}

/* Evidence strip: first two are compact facts; priorities become intentional rows */
.evidence-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:22px}
.evidence-chip{min-height:48px;display:flex;align-items:center;gap:8px;padding:11px 15px}
.evidence-chip:nth-child(n+3){grid-column:1/-1;min-height:52px;padding:12px 17px;font-size:13px}
.evidence-chip:nth-child(n+3)::before{content:"▥";color:var(--jade-deep);font-weight:900;font-size:14px}
.evidence-chip:nth-child(n+3)::after{content:"›";margin-left:auto;color:var(--graphite-soft);font-size:22px;line-height:1}

/* Conversation has more editorial breathing room */
.chat-messages{width:min(920px,calc(100% - 48px));padding-bottom:36px}
.message-row{margin-bottom:28px}
.message-row.assistant .bubble{padding:18px 20px;border-radius:22px}
.message-row.user .bubble{padding:15px 19px;border-radius:21px 21px 6px 21px}
.bubble{font-size:15.5px;line-height:1.58}
.question-card{padding:24px;border-radius:22px}
.question-head{margin-bottom:16px}.question-stem{font-size:16px;line-height:1.58}
.option{padding:13px 14px;border-radius:14px}

/* Quick actions read as feature cards, not toolbar pills */
.quick-actions{gap:10px;padding-bottom:4px}
.quick-actions button{min-height:42px;padding:10px 14px;border-radius:16px;text-align:left}
.quick-actions button[data-mode="recommend"]{border-color:rgba(79,138,122,.42);box-shadow:inset 0 0 0 1px rgba(79,138,122,.07)}
.composer{min-height:58px;border-radius:20px;padding:10px 10px 10px 18px}
.send-button{width:42px;height:42px;border-radius:14px}

/* Progress/content cards feel like the approved dashboard panels */
.metric-card,.content-card,.authority-card,.v02-study-time-panel,.v02-status-explorer{border-radius:20px}
.cards{gap:14px}.two-col{gap:18px}
.metric-card{padding:20px}.content-card{padding:20px}

/* Access screen: clean code-entry panel */
.access-card{position:relative;overflow:hidden}
.access-card::after{
  content:"";position:absolute;right:-56px;top:-66px;width:190px;height:190px;border-radius:50%;
  border:1px solid rgba(79,138,122,.16);box-shadow:-48px 58px 0 -1px rgba(203,185,143,.07);pointer-events:none
}
.access-card>*{position:relative;z-index:1}
#otpInput{letter-spacing:.22em;font-weight:800;text-align:center;font-size:17px}

@media(max-width:760px){
  .workspace::before,.access-shell::before{
    background:
      radial-gradient(circle at 84% 5%,rgba(79,138,122,.07) 0 54px,transparent 55px),
      radial-gradient(circle at 91% 13%,transparent 0 91px,rgba(203,185,143,.2) 92px 93px,transparent 94px),
      radial-gradient(circle at 5% 76%,transparent 0 110px,rgba(79,138,122,.1) 111px 112px,transparent 113px)
  }
  .topbar{height:auto;min-height:92px;padding:19px 24px 17px}
  .topbar h2{font-size:28px;line-height:1.08;margin-top:5px}
  .topbar>div:first-child::after{right:-56px;top:-20px;width:52px;height:52px}
  .status-pill{flex:0 0 auto}

  .chat-messages{width:calc(100% - 32px);padding-top:24px}
  .welcome-card{padding:26px 22px 24px;border-radius:26px}
  .welcome-card h3{font-size:27px;line-height:1.18}
  .welcome-card p{font-size:16px;line-height:1.55}
  .welcome-card::after{right:-72px;top:-74px;width:190px;height:190px}

  .evidence-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .evidence-chip{font-size:12px;min-width:0}
  .evidence-chip:nth-child(n+3){font-size:13px;border-radius:18px}

  .message-row{gap:8px;margin-bottom:23px}
  .avatar{display:none}
  .bubble{max-width:92%;font-size:15px}
  .message-row.assistant .bubble{padding:17px 18px}
  .message-row.user .bubble{padding:14px 17px}
  .question-card{padding:20px;margin-top:10px}
  .question-stem{font-size:15.5px}

  .composer-wrap{padding:12px 16px max(16px,env(safe-area-inset-bottom))}
  .quick-actions{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(160px,1fr);overflow-x:auto;scroll-snap-type:x proximity}
  .quick-actions button{scroll-snap-align:start;min-height:46px}
  .composer{min-height:60px}

  .panel-content{width:calc(100% - 32px)}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:520px){
  .topbar{padding-inline:28px}.topbar h2{font-size:27px}
  .welcome-card h3{font-size:26px}
  .evidence-strip{grid-template-columns:1fr 1fr}
  .evidence-chip:first-child,.evidence-chip:nth-child(2){padding:10px 12px}
  .cards{grid-template-columns:1fr 1fr}
  .access-card{padding:32px 24px}
  .pin-row{flex-direction:column}
  .pin-row .primary-button{width:100%}
  #otpInput{font-size:19px;min-height:52px}
}