/* Phone mockup: the in-app screens shown on the homepage "How it works" carousel and the
   /ai-mock-oral-boards hero. ONE definition (visual-consistency rule); both pages link this file. */
/* phone frame (shared) */
.phone{position:relative;width:288px;background:#0a0e14;border-radius:44px;padding:12px;box-shadow:0 40px 90px rgba(8,22,38,.42),inset 0 0 0 1px rgba(255,255,255,.06)}
.phone-notch{position:absolute;top:23px;left:50%;transform:translateX(-50%);width:94px;height:24px;background:#0a0e14;border-radius:16px;z-index:6}
.phone-screen{position:relative;border-radius:32px;overflow:hidden;background:#f6f8f8;height:560px}
.app-screen{padding:44px 14px 18px;color:#13302c;height:100%;display:flex;flex-direction:column}
.as-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 12px}
.as-eyebrow{font-size:9px;letter-spacing:1.3px;text-transform:uppercase;font-weight:700;color:#2a8c82}
.as-chip{display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:600;border-radius:999px;padding:3px 10px;white-space:nowrap}
.as-chip.blue{color:#1f6feb;border:1px solid rgba(31,111,235,.4);background:rgba(31,111,235,.10)}
.as-chip.gold{color:#b07d10;border:1px solid rgba(210,153,34,.42);background:rgba(210,153,34,.12)}
/* screen 1 - upload */
.up-drop{border:1.6px dashed #c4d0ce;border-radius:14px;background:#fff;padding:22px 16px;text-align:center;margin-bottom:16px}
.up-ico{width:38px;height:38px;margin:0 auto 10px;color:#2a8c82}
.up-t{font-family:var(--serif);font-size:15px;color:#13302c;line-height:1.3}
.up-s{font-size:10.5px;color:#7c8b88;margin-top:5px;letter-spacing:.2px}
.up-note{font-size:10px;letter-spacing:.8px;text-transform:uppercase;font-weight:700;color:#7c8b88;margin:2px 2px 10px}
.up-row{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid #e7edec;border-radius:11px;padding:11px 13px;margin-bottom:9px;box-shadow:0 1px 2px rgba(19,48,44,.04)}
.up-dot{width:9px;height:9px;border-radius:50%;flex:none}
.up-dot.ob{background:#1f6feb}.up-dot.gyn{background:#9b7be8}.up-dot.off{background:#2a8c82}
.up-name{font-size:12.5px;font-weight:600;color:#13302c}
.up-n{margin-left:auto;font-size:11.5px;color:#5c6b68}
.up-ck{width:16px;height:16px;color:#2a8c82;flex:none}
/* screen 2 - your case */
.as-title{font-family:var(--serif);font-size:15px;color:#13302c;line-height:1.28;margin-bottom:9px}
.as-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;grid-auto-rows:1fr}
.as-box{background:#fff;border:1px solid #e7edec;border-radius:12px;padding:10px 11px;box-shadow:0 1px 2px rgba(19,48,44,.05),0 9px 20px rgba(19,48,44,.10)}
.as-ph{font-size:8px;letter-spacing:.4px;text-transform:uppercase;font-weight:700;margin-bottom:6px;line-height:1.3}
.as-ph.teal{color:#2a8c82}.as-ph.gold{color:#d29922}
.as-box ul{list-style:none;margin:0;padding:0}.as-box li{font-size:11px;color:#13302c;line-height:1.5;margin:0}
.as-bottom{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}
.as-status{text-align:center;font-size:10.5px;color:#3c504c;margin:0 0 10px}
.as-orb{position:relative;margin:0 auto;width:104px;height:104px;display:grid;place-items:center;background:radial-gradient(circle,rgba(47,168,155,.15),transparent 60%)}
.as-orb::before,.as-orb::after{content:"";position:absolute;width:86px;height:86px;border-radius:50%;border:2px solid rgba(47,168,155,.6);animation:ping 2.4s ease-out infinite}
.as-orb::after{animation-delay:1.2s}
.orb-seal{width:82px;height:82px;position:relative;z-index:2}
@keyframes ping{0%{transform:scale(.96);opacity:.75}70%{opacity:0}100%{transform:scale(1.5);opacity:0}}
.as-speaking{text-align:center;font-size:10.5px;font-weight:600;color:#2a8c82;margin-top:11px}
/* screen 3 - scorecard */
.sc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:4px}
.sc-case{font-size:9px;color:#5c6b68;line-height:1.35;flex:1}
.sc-score{font-family:var(--serif);font-size:20px;font-weight:600;color:#1f8a5b;line-height:1;flex:none}
.sc-score small{font-size:10px;color:#9aa6a3;font-family:var(--sans);font-weight:500}
.sc-radar{width:142px;height:auto;display:block;margin:2px auto 3px}
.sc-lbl{font-size:7.5px;letter-spacing:.7px;text-transform:uppercase;font-weight:700;color:#7c8b88;margin:9px 0 4px}
.sc-fr a{display:flex;align-items:center;gap:4px;font-size:9.5px;font-weight:600;color:#1f7a70;line-height:1.3;margin-bottom:3px}
.sc-topics{display:flex;flex-wrap:wrap;gap:5px}
.sc-topic{font-size:8.5px;font-weight:600;color:#3c504c;border:1px solid #dbe4e2;border-radius:999px;padding:3px 8px}
.sc-topic b{color:#1f8a5b;margin-left:2px}
.sc-body{font-size:9px;color:#41514e;line-height:1.5}
.sc-body.clamp{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.sc-liab{margin-top:9px;padding-top:8px;border-top:1px solid #e2e9e7;font-size:8px;color:#859390;line-height:1.5}
.sc-liab b{color:#5c6b68}
@media(prefers-reduced-motion:reduce){.as-orb::before,.as-orb::after{animation:none}}