@import "https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,700&family=Manrope:wght@400;500;600;700&display=swap";:root{--ink-strong:#1f3241;--ink-muted:#5d7688;--bg:#eef5f9;--surface:#fff;--surface-soft:#f8fbfd;--stroke:#d8e4ec;--focus:#2f7597;--para:#1b9a86;--ibu:#e46f5a;--next:#2767a4;--warning:#8c4f52;--danger:#a94b4f;--shadow-sm:0 8px 20px #19405f12;--shadow-lg:0 20px 55px #1537501f;color:var(--ink-strong);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Manrope,Segoe UI Variable,Segoe UI,sans-serif;line-height:1.45}*{box-sizing:border-box}html,body{min-height:100svh;margin:0}body{background:radial-gradient(circle at 0 0,#fff 0,#fff0 40%),linear-gradient(165deg,#eff6fa 0%,#edf4f8 35%,#e8f0f6 100%);padding:2rem 1rem}.app-shell{background:var(--surface);border:1px solid var(--stroke);max-width:940px;box-shadow:var(--shadow-lg);border-radius:22px;margin:0 auto;overflow:hidden}.layout{gap:1rem;padding:1.4rem;display:grid}.layout>*{animation:.44s both rise-in}.layout>:first-child{animation-delay:40ms}.layout>:nth-child(2){animation-delay:.12s}.layout>:nth-child(3){animation-delay:.19s}.hero{background:linear-gradient(165deg,#ffffffc7,#f0f8fcf0),radial-gradient(circle at 14% 24%,#468aa824,#0000 48%);border:1px solid #d6e6ef;border-radius:16px;padding:1.1rem 1.15rem}.hero h1{color:#173346;letter-spacing:-.02em;text-align:center;margin:0;font-family:Fraunces,Iowan Old Style,Georgia,serif;font-size:clamp(2rem,3.8vw,2.6rem)}.hero p{color:var(--ink-muted);max-width:56ch;margin:.45rem 0 0}.panel{background:var(--surface-soft);border:1px solid var(--stroke);box-shadow:var(--shadow-sm);border-radius:14px;padding:1rem 1.05rem}.panel h2{letter-spacing:-.01em;margin:0;font-size:1.05rem;font-weight:700}.panel p{color:var(--ink-muted);margin:.55rem 0 0}.info-panel{text-align:left}.info-panel h2{margin-bottom:.35rem}.info-list{color:var(--ink-muted);margin:.45rem 0 0;padding-left:1.15rem}.info-list li+li{margin-top:.25rem}.info-warning{color:var(--warning);font-weight:600}.install-panel{background:linear-gradient(170deg,#fffffff2,#eef8ffe6),radial-gradient(circle at 14% 38%,#2f75971f,#0000 42%);grid-template-columns:1fr auto;align-items:baseline;gap:.8rem;display:grid}.panel .install-panel-copy{color:#1a3a4d;letter-spacing:-.01em;margin:0;font-weight:700}.input-row{flex-wrap:wrap;gap:.65rem;margin-top:.95rem;display:flex}.time-input{min-width:170px;font:inherit;color:var(--ink-strong);background:#fff;border:1px solid #c9d9e4;border-radius:9px;padding:.58rem .76rem;transition:border-color .18s,box-shadow .18s}.btn{appearance:none;background:var(--focus);color:#f9fcfe;font:inherit;letter-spacing:.01em;cursor:pointer;border:1px solid #0000;border-radius:9px;padding:.6rem .9rem;font-weight:600;transition:transform .16s,background-color .16s,border-color .16s,box-shadow .16s}.btn.secondary{background:#2c5e79}.btn.ghost{color:var(--focus);background:#fff;border-color:#bcd2df}.btn:hover{transform:translateY(-1px);box-shadow:0 6px 14px #2a5e792e}.btn:active{transform:translateY(0)}.btn:focus-visible,.time-input:focus-visible{outline-offset:2px;outline:2px solid #6aa7c4}.time-input:focus-visible{border-color:#8fb7ca;box-shadow:0 0 0 3px #81b1cb29}.error{color:var(--danger);margin-top:.55rem;font-weight:600}.meta{color:var(--ink-muted);flex-wrap:wrap;align-items:center;gap:.4rem;margin-top:0;display:flex}.timeline-card{border:1px solid var(--stroke);background:var(--surface);box-shadow:var(--shadow-sm);border-radius:14px;padding:1rem 1.05rem 1.2rem}.timeline-card h2{margin:0;font-size:1.05rem}.timeline-header{justify-content:space-between;align-items:center;gap:.75rem;padding:0 .5rem;display:flex}.timeline-card p{color:var(--ink-muted);margin:.35rem 0 0}.timeline-svg{width:100%;margin-top:.7rem;display:block}.timeline-svg.desktop{aspect-ratio:920/250}.timeline-svg.mobile{aspect-ratio:340/640}.svg-axis{stroke:#8fb0c4;stroke-width:3px;stroke-linecap:round}.svg-dose{opacity:1;animation:.36s both dose-in}.svg-dose.paracetamol{color:var(--para)}.svg-dose.ibuprofen{color:var(--ibu)}.svg-dose.past{opacity:.44}.svg-dose.next{filter:saturate(1.18)}.svg-branch{stroke:color-mix(in srgb, currentColor 45%, #aac0cd);stroke-width:2.2px;stroke-linecap:round}.svg-node{fill:currentColor}.svg-time,.svg-med,.svg-now text{font-family:Manrope,Segoe UI Variable,Segoe UI,sans-serif}.svg-time{fill:currentColor;letter-spacing:.01em;font-size:17px;font-weight:700}.svg-med{fill:color-mix(in srgb, currentColor 70%, #607482);text-transform:uppercase;letter-spacing:.07em;font-size:12px;font-weight:600}.svg-now line{stroke:#2f5f7d;stroke-width:3px;stroke-linecap:round}.svg-now text{fill:var(--ink-muted);font-size:13px;font-weight:600}.btn.btn-small{border-radius:8px;padding:.38rem .68rem;font-size:.84rem;line-height:1}@media (width<=768px){:root{--mobile-safe-padding:1rem}html,body{height:100dvh;min-height:100dvh}body{padding:var(--mobile-safe-padding) .55rem;overflow-y:hidden}.layout{align-content:start;gap:.9rem;height:100%;min-height:100%;padding:1rem;overflow:hidden auto}.app-shell{height:calc(100dvh - (var(--mobile-safe-padding) * 2));min-height:calc(100dvh - (var(--mobile-safe-padding) * 2));overflow:hidden}.layout.layout-with-timeline{overscroll-behavior:none;grid-template-rows:auto minmax(340px,1fr);height:100%;min-height:100%;overflow:hidden}body.timeline-active{overscroll-behavior-y:none;overflow-y:hidden}.layout.layout-with-timeline .timeline-card{flex-direction:column;min-height:340px;padding:.5rem .45rem .55rem;display:flex}.layout.layout-with-timeline .timeline-svg.mobile{aspect-ratio:auto;flex:1;height:100%;min-height:300px;margin-top:0}.time-config-panel{text-align:center;flex-direction:column;align-items:center;display:flex}.time-config-panel .input-row{justify-content:center;width:100%}.time-config-panel .error,.info-panel{text-align:center}.info-list{text-align:left;margin-top:.5rem;display:inline-block}.install-panel{grid-template-columns:minmax(0,1fr) auto;gap:.65rem;padding:.82rem .86rem}.panel .install-panel-copy{text-align:left;font-size:.95rem}.svg-time{font-size:16px}.svg-med{font-size:11px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none;animation:none}}@keyframes rise-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes dose-in{0%{opacity:0;filter:blur(1px)}to{opacity:1;filter:blur()}}