:root{--teal:#03a995;--deep:#007f77;--ink:#26343c;--muted:#738088;--line:#e9eeee;--mint:#e1f8f1;--peach:#fff2eb;--lav:#f2eeff}
*{box-sizing:border-box}
body{margin:0;background:#f6f9f9;color:var(--ink);font:14px/1.45 ui-rounded,"Nunito",Arial,sans-serif}
.app-shell{max-width:1060px;margin:auto}
.sidebar{height:75px;padding:18px 29px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:6px;color:var(--teal);font-size:31px;font-weight:950;letter-spacing:-2px;text-decoration:none}
.brand-mark{display:grid;place-items:center;width:31px;height:31px;background:var(--teal);color:#fff;border-radius:12px;font-size:17px}
.sidebar nav{display:flex;gap:4px}
.nav-link{padding:8px 11px;color:#718088;font-size:12px;font-weight:800;text-decoration:none;border-radius:10px}
.nav-link.active{background:var(--mint);color:var(--deep)}
/* Hover only where there is a pointer that can hover. On a touchscreen the
   state sticks to the last thing tapped until something else is tapped, and
   this rule paints exactly what `.active` paints - so the tab you came from
   stayed lit while the back button moved the view out from under it, and the
   bar showed two selected tabs or the wrong one entirely. */
@media (hover:hover){.nav-link:hover{background:var(--mint);color:var(--deep)}}
.sidebar-footer{font-size:11px}
.text-button{border:0;background:transparent;color:var(--teal);font:inherit;font-weight:850;cursor:pointer}
.content{padding:30px;max-width:850px;margin:auto}
.topbar,.panel-heading,.section-heading,.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
.topbar{padding:0 2px 20px}
.eyebrow{margin:0 0 2px;color:#91a0a3;font-size:9px;font-weight:900;letter-spacing:1px}
h1,h2,h3,p{margin-top:0}
h1{margin-bottom:1px;font-size:25px;letter-spacing:-1px}
h1 span{color:#ffc048;font-size:17px}
.topbar-actions{display:flex;align-items:center;gap:9px}
.auth-status{font-size:10px;color:var(--muted);max-width:125px}
.peppy-avatar{position:relative;width:66px;height:58px}
.avatar-ear{position:absolute;top:4px;width:25px;height:26px;background:#5cc4b7;border:2px solid #087f77;border-radius:70% 35% 70% 35%}
.avatar-ear.left{left:8px;transform:rotate(-25deg)}
.avatar-ear.right{right:8px;transform:scaleX(-1) rotate(-25deg)}
.avatar-face{position:absolute;left:9px;bottom:0;width:49px;height:46px;background:#fff7dd;border:2px solid #087f77;border-radius:50% 50% 43% 43%;z-index:1}
.avatar-face:before,.avatar-face:after{content:"";position:absolute;top:22px;width:6px;height:8px;background:#283741;border-radius:50%}
.avatar-face:before{left:13px}
.avatar-face:after{right:13px}
.avatar-face i{display:none}
.avatar-face b{position:absolute;left:19px;top:31px;width:10px;height:5px;border-bottom:2px solid #e8897b;border-radius:50%}
.primary-button{border:0;border-radius:9px;padding:11px 15px;background:var(--teal);color:#fff;font:inherit;font-weight:900;cursor:pointer;box-shadow:0 5px 10px #03a99533}
.primary-button:hover{background:var(--deep)}
.notice{display:flex;gap:8px;margin:0 0 14px;padding:9px 12px;border-radius:9px;background:#fff8e6;color:#886a3c;font-size:10px}
.notice span{font-size:12px;color:#e0a43d}
.notice p{margin:0}
.glance-card{margin-bottom:16px;padding:13px 15px;border:1px solid #9edfd6;border-radius:12px;background:linear-gradient(130deg,#effdf9,#e2f8f3)}
.dashboard-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:14px}
.panel,.compound-card{background:#fff;border:1px solid var(--line);border-radius:12px}
.panel{padding:16px}
h2{margin:0;font-size:17px;letter-spacing:-.5px}
.schedule-list{margin-top:13px}
.schedule-row{display:grid;grid-template-columns:48px 12px 1fr auto;align-items:center;gap:8px;padding:11px 0;border-top:1px solid #eff2f2}
.schedule-row:first-child{border-top:0}
.schedule-time{font-size:11px;font-weight:900}
.schedule-dot{width:8px;height:8px;background:var(--teal);border-radius:50%;box-shadow:0 0 0 4px #dff6f1}
.schedule-meta{font-size:10px;color:var(--muted)}
.schedule-dose{font-size:10px;font-weight:800;color:#5e6e73}
.insights-panel{background:#fff9ed}
.insights-list{display:grid;gap:8px;margin-top:13px}
.insight{padding:10px;border-radius:9px;font-size:10px}
.insight strong{display:block}
.insight p{margin:2px 0;color:#657177}
.insight.warning{background:#fff0e2}
.insight.info{background:#eaf8ff}
.insight.neutral{background:#f1efff}
.finding-label{font-size:8px;font-weight:900;color:#8d9699}
.calendar-panel{margin-top:14px}
.calendar-key{margin:0;font-size:10px;color:var(--muted)}
.calendar-key span{display:inline-block;width:7px;height:7px;background:var(--teal);border-radius:50%}
.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-top:12px}
.calendar-day{min-height:95px;padding:8px;border:1px solid #edf1f1;border-radius:8px}
.calendar-day.is-today{background:#ecfbf7;border-color:#9ddfd5}
.calendar-date{display:flex;justify-content:space-between;margin-bottom:7px;color:#77878d;font-size:9px;font-weight:900}
.calendar-date strong{display:grid;place-items:center;width:19px;height:19px;background:#f0f5f5;border-radius:50%;font-size:10px}
.is-today .calendar-date strong{background:var(--teal);color:#fff}
.calendar-events{display:grid;gap:5px}
.calendar-event{display:grid;padding-left:5px;border-left:2px solid var(--teal);font-size:9px}
.calendar-event time{font-weight:800;color:#77878d}
.calendar-event span{font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.calendar-event small{font-size:8px;color:#859196}
.calendar-empty{color:#bac5c7}
.library-section{margin-top:23px}
.section-heading{margin-bottom:12px}
.search{display:flex;align-items:center;gap:7px;width:220px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;color:#849095}
.search input{width:100%;border:0;outline:0;font:inherit;font-size:11px}
.compound-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}
.badge,.status{display:inline-block;margin:9px 0 7px;padding:3px 6px;background:var(--mint);border-radius:999px;color:#198176;font-size:9px;font-weight:900}
.history-list{margin-top:10px}
.history-item{display:flex;justify-content:space-between;padding:9px 0;border-top:1px solid var(--line);font-size:11px}
.history-item p{margin:0}
.history-item time{color:var(--muted);font-size:10px}
.curation-note,.empty-curation{font-size:11px;color:var(--muted)}
.curation-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-top:1px solid var(--line);font-size:11px}
.curation-row p{margin:1px 0;color:var(--muted);font-size:10px}
.curation-actions{display:flex;align-items:center;gap:8px}
.status-under-review{background:#fff0d2;color:#a16e1c}
.status-published{background:#ddf5ea;color:#17805e}
.interaction-heading{display:flex;justify-content:space-between;margin-top:18px}
dialog{width:min(510px,calc(100% - 28px));border:0;border-radius:16px;box-shadow:0 24px 80px #183d3c3d;padding:0}
dialog::backdrop{background:#183d3c66}
dialog form,.compound-dialog-content,.analysis-dialog-content{padding:22px;display:grid;gap:12px}
label{display:grid;gap:5px;color:#627277;font-size:11px;font-weight:800}
input,select,textarea{border:1px solid #dce7e5;border-radius:8px;padding:9px;font:inherit}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form-disclaimer{margin:0;padding:9px;border-radius:8px;background:#f6f9f9;color:#748185;font-size:10px}
.secondary-button{border:1px solid #dce7e5;border-radius:8px;padding:10px;background:#fff;font:inherit;font-weight:800}
.auth-divider{display:flex;gap:10px;align-items:center;color:var(--muted);font-size:10px}
.auth-divider:before,.auth-divider:after{content:"";height:1px;flex:1;background:var(--line)}
.analysis-list{display:grid;gap:9px}
.analysis-finding{padding:11px;border:1px solid var(--line);border-radius:9px}
.analysis-finding p{font-size:11px}
.analysis-finding a{color:var(--teal)}
@media(max-width:650px){
  body{background:#fff}
  .sidebar{height:58px;padding:11px 16px;border:0}
  .sidebar nav,.sidebar-footer{display:none}
  .brand{font-size:25px}
  .content{padding:12px 16px 89px}
  .topbar{padding:5px 1px 13px}
  .topbar-actions{gap:5px}
  .auth-status{display:none}
  .peppy-avatar{width:58px;height:51px}
  .primary-button{padding:9px 12px}
  .notice{display:none}
  .dashboard-grid{grid-template-columns:1fr}
  .insights-panel{display:none}
  .calendar-panel{display:none}
  .compound-cards{grid-template-columns:1fr 1fr}
  .library-section{margin-top:18px}
  .section-heading{align-items:flex-start;flex-direction:column;gap:8px}
  .search{width:100%}
  .add-orb{width:43px;height:43px;margin-top:-20px;border:3px solid #fff;border-radius:50%;background:var(--teal);color:#fff;font-size:23px;box-shadow:0 5px 10px #03a99555}
  h1{font-size:22px}
  .schedule-row{grid-template-columns:44px 10px 1fr auto}
  .schedule-dose{font-size:9px}
}
.brand{display:flex!important;align-items:center!important;text-decoration:none!important}
.brand img{display:block!important;width:145px!important;height:auto!important}
.peppy-avatar{display:block!important;width:71px!important;height:71px!important;object-fit:contain!important}
@media(max-width:650px){
  .brand img{width:121px!important}
  .peppy-avatar{width:61px!important;height:61px!important}
  /* Width only. The background belonged to the theme (--p-canvas) and the
     min-height fought the theme's fixed 100dvh frame, pushing the floating tab
     bar under the fold whenever browser chrome was showing. */
  .app-shell{max-width:430px!important}
  .sidebar{height:60px!important;padding:13px 19px!important;display:flex!important;background:#fff!important}
  .brand img{width:128px!important}
  .content{padding:11px 17px 89px!important;margin:0!important}
  .topbar{position:relative!important;display:block!important;height:91px!important;padding:5px 0 0!important}
  .topbar h1{font-size:21px!important;line-height:1.2!important;letter-spacing:-.7px!important}
  .topbar-actions{position:absolute!important;top:0!important;right:0!important;display:block!important}
  .topbar-actions .peppy-avatar{position:absolute!important;top:-4px!important;right:23px!important;width:100px!important;height:100px!important;object-fit:contain!important;z-index:2!important}
  .topbar-actions .auth-status,.topbar-actions .text-button{display:none!important}
  .topbar-actions .primary-button{position:absolute!important;top:3px!important;right:0!important;width:20px!important;height:20px!important;padding:0!important;border-radius:50%!important;font-size:0!important;background:#fff!important;box-shadow:none!important}
  .topbar-actions .primary-button:after{content:'+'!important;display:block!important;color:#03a995!important;font-size:21px!important;line-height:18px!important}
  .notice{display:none!important}
  .glance-card{margin-bottom:14px;position:relative!important;margin:0 0 14px!important;padding:12px 13px!important;min-height:91px!important;border:1.5px solid #94dcd1!important;border-radius:11px!important;background:linear-gradient(110deg,#effcf9,#e7f9f5)!important;overflow:hidden!important}
  .glance-card:after{content:''!important;position:absolute!important;right:-14px!important;top:-24px!important;width:104px!important;height:104px!important;background:url('assets/peppy-mascot-v2.png') center/contain no-repeat!important;opacity:.98!important}
  .dashboard-grid{display:block!important}
  .schedule-panel{border:0!important;box-shadow:none!important;border-radius:0!important;padding:4px 0 0!important;background:#fff!important}
  .schedule-panel .panel-heading{padding:0 0 8px!important}
  .schedule-panel h2{font-size:14px!important}
  .schedule-list{position:relative!important;margin:0!important;padding-left:0!important}
  .schedule-list:before{content:''!important;position:absolute!important;left:55px!important;top:17px!important;bottom:17px!important;width:1px!important;background:#c9ece6!important}
  .schedule-row{position:relative!important;grid-template-columns:42px 16px 1fr 20px!important;gap:5px!important;min-height:55px!important;padding:9px 0!important;border:0!important}
  .schedule-time{font-size:10px!important;color:#4f5d63!important}
  .schedule-dot{position:relative!important;z-index:1!important;width:9px!important;height:9px!important;box-shadow:0 0 0 3px #e1f8f3!important}
  .schedule-row:nth-child(2) .schedule-dot{background:#f0a24c!important;box-shadow:0 0 0 3px #fff3e6!important}
  .schedule-row:nth-child(3) .schedule-dot{background:#8875cf!important;box-shadow:0 0 0 3px #f0edff!important}
  .schedule-meta{font-size:9px!important}
  .schedule-dose{display:none!important}
  .schedule-row:after{content:'✓'!important;display:grid!important;place-items:center!important;width:17px!important;height:17px!important;border:1px solid #72cfc1!important;border-radius:50%!important;color:#00a58f!important;font-size:10px!important}
  .schedule-row:nth-child(2):after,.schedule-row:nth-child(3):after{content:'◷'!important;border-color:#d7c972!important;color:#ce9c53!important}
  .insights-panel,.calendar-panel,.history-panel,.curation-panel{display:none!important}
  .library-section{margin-top:17px!important;padding-top:13px!important;border-top:1px solid #eef2f2!important}
  .section-heading{display:flex!important;align-items:center!important;flex-direction:row!important;margin-bottom:9px!important}
  .section-heading h2{font-size:14px!important}
  .section-heading .eyebrow{display:none!important}
  .search{width:135px!important;padding:6px 8px!important;border-radius:7px!important;box-shadow:none!important}
  .search input{font-size:9px!important}
  .compound-cards{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:7px!important}
  .badge{margin:6px 0 4px!important;padding:2px 4px!important;font-size:7px!important}
  .add-orb{width:43px!important;height:43px!important;margin-top:-25px!important;background:#03a995!important;border:4px solid #fff!important}
  .sidebar nav,.sidebar-footer{display:none!important}
}
body{font-family:var(--p-font)!important}
.brand img{font-family:"Nunito",ui-rounded,sans-serif}
/* Tracking removed: the theme sets -.8px on large titles and -.5px on card
   headings, and this flattened all of them to one value. */
h1,h2,h3{font-family:var(--p-font)!important;font-weight:900!important}
/* The open dropdown list is painted from each <option>'s own computed style,
   not the <select>'s, so the `font:inherit` on the control above never reaches
   it - the popup falls back to the system UI font while the closed box shows
   Nunito. Setting the family on the option itself is what carries it across.
   700 rather than the control's 800: a whole list of ExtraBold rows reads as
   noise, and 700 is one of the weights actually loaded, so it is not synthesised. */
select,option,optgroup{font-family:"Nunito",ui-rounded,system-ui,sans-serif!important}
option,optgroup{font-weight:700}
.compound-card-top,.compound-signals,.compound-card .card-footer,.open-record-hint{position:relative!important;z-index:1!important}
.compound-signals{display:grid!important;gap:7px!important}
.signal-known{background:#edfcf6!important}
.signal-known span{color:#248d75!important}
.signal-known span::before{width:7px!important;height:7px!important;border-radius:50%!important;background:#28b18d!important;box-shadow:0 0 0 3px #cef6e8!important;content:""!important}
.signal-caution{background:#fffaf0!important}
.signal-caution span{color:#b37b26!important}
.signal-caution span::before{width:0!important;height:0!important;border-right:4px solid transparent!important;border-bottom:7px solid #f2b746!important;border-left:4px solid transparent!important;content:""!important}
.evidence-potential::before{background:#ddf2ff!important}
.evidence-theoretical::before{background:#eee4ff!important}
.evidence-limited::before{background:#fff0c2!important}
@media(max-width:650px){
  .compound-cards{grid-template-columns:1fr!important;gap:11px!important}
  .brand img{width:132px!important;height:42px!important;object-fit:contain!important;object-position:left center!important}
  .add-orb{display:none!important}
}
.protocols-panel{margin-top:16px}
.protocol-list{margin-top:12px}
.protocol-card{display:flex;justify-content:space-between;gap:16px;padding:13px;border-radius:12px;background:linear-gradient(110deg,#effbf8,#f8fffd)}
.protocol-card h3{margin:4px 0 2px;font-size:15px}
.protocol-card p{margin:0;color:#6f8184;font-size:11px}
.protocol-items{display:grid;gap:4px;align-content:center;color:#267d73;font-size:10px;font-weight:800}
@media(max-width:650px){
  .protocols-panel{display:block!important;margin-top:13px!important;padding:12px!important;border:1px solid #e4f1ee!important;border-radius:10px!important;box-shadow:none!important}
  .protocols-panel .panel-heading{padding:0 0 7px!important}
  .protocols-panel h2{font-size:13px!important}
  .protocol-card{padding:10px!important;border-radius:8px!important}
  .protocol-card h3{font-size:12px!important}
  .protocol-card p,.protocol-items{font-size:8px!important}
  .protocol-items{max-width:135px!important}
  .protocols-panel .status{margin:0!important;font-size:7px!important}
}
.panel-actions{display:flex;gap:10px}
.calculation-result{display:grid;gap:2px;padding:14px;border:1px solid #8fded2;border-radius:12px;background:#effbf8;color:#49716d;font-size:11px}
.calculation-result strong{color:#079b8b;font-size:25px;line-height:1.1}
.calculation-result small{color:#718689;font-size:10px}
@media(max-width:650px){
  .panel-actions{gap:7px}
  .calculation-result{padding:12px!important}
  .calculation-result strong{font-size:22px!important}
}
.product-path{display:flex;align-items:center;justify-content:center;gap:6px;margin:0 0 15px;color:#6e8c89;font-size:9px;font-weight:800}
.product-path span{padding:3px 6px;border-radius:99px;background:#f0faf8}
.product-path b{color:#82bdb5;font-weight:700}
@media(max-width:360px){
  .product-path{gap:3px;font-size:7px}
  .product-path span{padding:2px 3px}
}
.status-mark{display:grid;place-items:center;width:23px;height:23px;border:1px solid #82d5c9;border-radius:50%;background:#fff;color:#06a590;font:inherit;font-size:14px;cursor:pointer}
.schedule-row.is-taken .status-mark{background:#06a590;color:#fff}
.schedule-row.is-skipped .status-mark,.schedule-row.is-missed .status-mark{border-color:#e6b07b;color:#d58942}
.schedule-row.is-rescheduled .status-mark{border-color:#aea1df;color:#7965c5}
@media(max-width:650px){
  .status-mark{width:18px!important;height:18px!important;font-size:11px!important}
}
.compound-tabs{display:flex;gap:4px;padding-bottom:9px;border-bottom:1px solid var(--line)}
.compound-tab{border:0;background:transparent;padding:6px 7px;color:#7b898c;font:inherit;font-size:11px;font-weight:800;cursor:pointer}
.compound-tab.active{border-bottom:2px solid #03a995;color:#008f80}
.compound-view{display:none}
.compound-view.active{display:block}
@media(max-width:650px){
  .compound-tabs{overflow-x:auto}
  .compound-tab{flex:none;font-size:10px}
}
.analysis-stack{padding:12px;border-radius:11px;background:#eefaf7}
.analysis-stack-list{display:flex;flex-wrap:wrap;gap:6px}
.analysis-stack-list span{padding:4px 8px;border-radius:99px;background:#fff;color:#197d72;font-size:10px;font-weight:800}
.analysis-intro{margin:9px 0 0;color:#5f7776;font-size:11px}
@media(max-width:650px){
  .analysis-stack{padding:10px}
  .analysis-intro{font-size:10px}
}
.more-dialog-content{padding:22px}
.more-group{margin-top:16px}
.more-group .eyebrow{margin-bottom:5px}
.more-row{display:grid;grid-template-columns:25px 1fr 14px;align-items:center;gap:8px;width:100%;padding:10px 0;border:0;border-top:1px solid var(--line);background:transparent;color:var(--ink);text-align:left;cursor:pointer}
.more-row>span:first-child{display:grid;place-items:center;width:23px;height:23px;border-radius:7px;background:#e8faf5;color:#079d8c;font-size:12px}
.more-row strong,.more-row small{display:block}
.more-row strong{font-size:12px}
.more-row small{margin-top:1px;color:var(--muted);font-size:9px}
.more-row>b{color:#8fa09f;font-size:18px;font-weight:500}
@media(max-width:650px){
  .more-dialog-content{padding:18px}
  .more-row{padding:9px 0}
}