:root{font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;color:#202737;background:#f7f8fb;font-synthesis:none;-webkit-text-size-adjust:100%;--blue:#2859db;--muted:#656f81;--line:#dfe4ee;--soft:#edf2ff}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button,a,input,select{touch-action:manipulation}button{color:inherit}button:disabled{cursor:not-allowed;opacity:.5}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #8daaff;outline-offset:3px}h1,h2,h3,p{margin:0}a{color:var(--blue)}.shell{max-width:520px;margin:auto;min-height:100svh;background:#fff}.topbar{height:64px;padding:0 22px;display:flex;align-items:center;justify-content:space-between;gap:16px}.app-name{font-size:16px;font-weight:750;letter-spacing:-.02em}.history-button{display:flex;align-items:center;gap:5px;border:0;background:transparent;font-size:13px;color:var(--muted);min-width:60px;min-height:44px;justify-content:flex-end}.history-button svg{width:20px;height:20px}.stage-nav{display:grid;grid-template-columns:repeat(4,1fr);padding:0 22px;gap:5px}.stage{padding:8px 0 11px;font-size:11px;letter-spacing:.02em;color:#8690a0;border-bottom:3px solid #edf0f6}.stage.current{color:var(--blue);border-color:var(--blue);font-weight:750}.stage.past{border-color:#aac0fb;color:#5f78ad}#app{min-height:calc(100svh - 104px);display:flex;flex-direction:column}.screen{padding:24px 24px 0;flex:1;display:flex;flex-direction:column;animation:appear .16s ease-out}.screen-head{margin-bottom:27px}.back-button{display:flex;align-items:center;gap:7px;min-height:44px;border:0;background:transparent;padding:0;color:var(--muted);font-size:13px;margin:-8px 0 11px}.back-button svg{width:16px;height:16px}.step-label{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--blue);font-weight:700;margin-bottom:14px}.step-label::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}h1{font-size:clamp(24px,6.1vw,30px);line-height:1.55;letter-spacing:-.045em;font-weight:750;overflow-wrap:anywhere}h1:focus{outline:none}.lead{color:var(--muted);font-size:14px;line-height:1.85;margin-top:14px}.screen-body{display:flex;flex-direction:column;gap:20px;padding-bottom:28px}.screen-body>form{display:contents}.option-list{display:flex;flex-direction:column;gap:12px}.option{border:1.5px solid var(--line);border-radius:15px;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:72px;padding:17px 19px;text-align:left;font-size:16px;line-height:1.6;font-weight:650;width:100%}.option:active{background:var(--soft);border-color:var(--blue)}.option small{display:block;color:var(--muted);font-size:12px;font-weight:400;margin-top:4px}.chevron{width:17px;height:17px;flex-shrink:0;color:#7e8ba1}.option.subtle{font-size:14px;border-style:dashed;color:var(--muted);font-weight:500;min-height:60px}.dock{padding:16px 24px max(18px,env(safe-area-inset-bottom));background:rgba(255,255,255,.97);border-top:1px solid #eef0f5;position:sticky;bottom:0;z-index:4;backdrop-filter:blur(12px)}.primary{width:100%;min-height:56px;display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 16px;border:0;border-radius:14px;background:var(--blue);color:#fff;font-weight:700;font-size:16px;line-height:1.5}.primary:active{background:#1e46af}.secondary{display:block;min-height:48px;border:1px solid var(--line);border-radius:12px;padding:12px 16px;background:#fff;font-weight:600;width:100%;font-size:14px}.text-button{border:0;background:transparent;color:var(--blue);padding:12px 4px;min-height:44px;font-size:14px;line-height:1.6}.dock-note{font-size:11px;line-height:1.6;color:var(--muted);margin-bottom:10px;text-align:center}.quiet{font-size:12px;line-height:1.8;color:var(--muted)}.context{background:#f3f5f9;border-radius:12px;padding:16px 18px;font-size:13px;line-height:1.8;color:#566175}.context strong{font-weight:650;color:#33435d}.context.blue{background:var(--soft);color:#3657a4}.form-label{display:block;font-size:13px;font-weight:650;margin-bottom:10px;color:#46526a}.number-box{display:flex;align-items:center;gap:10px;border:1.5px solid #cbd6e9;border-radius:16px;padding:13px 17px;background:#fcfdff;min-height:88px}.number-box:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px var(--soft)}.number-box input{padding:4px 0;border:0;background:transparent;min-width:0;width:100%;font-size:clamp(29px,8vw,40px);font-weight:650;letter-spacing:-.045em;color:#1a2d4c;font-variant-numeric:tabular-nums;outline:0!important}.number-box input::placeholder{color:#bdc6d7;font-weight:400}.unit{font-size:16px;color:var(--muted);flex-shrink:0}.input-hint{font-size:12px;line-height:1.8;color:var(--muted);margin-top:10px}.segmented{display:flex;border:1px solid var(--line);padding:4px;border-radius:12px;background:#f5f7fb;gap:4px;margin-bottom:22px}.segmented button{flex:1;min-height:44px;border:0;background:transparent;border-radius:8px;font-size:13px;color:#69758b}.segmented button[aria-pressed="true"]{background:#fff;color:var(--blue);box-shadow:0 1px 5px #1e365414;font-weight:700}.ratio-grid{display:grid;grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr);gap:10px;align-items:end}.ratio-grid .number-box{padding:10px 14px;min-height:82px}.ratio-grid input{text-align:center;font-size:34px}.ratio-colon{text-align:center;align-self:end;padding-bottom:25px;color:#9ca9bb;font-size:28px}.ratio-translation{margin-top:17px;text-align:center;font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums}.range-grid{display:grid;grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr);gap:10px;align-items:center}.range-grid .number-box{padding:10px 12px}.range-grid input{font-size:27px}.range-grid .unit{font-size:13px}.range-mark{color:#9ca9bb;text-align:center}.error{background:#fff1ed;color:#a13622;border-radius:10px;padding:13px 15px;font-size:13px;line-height:1.75;margin-bottom:14px}.error:empty{display:none}.error:focus{outline:none}.settings-list{margin:0;padding:0;display:flex;flex-direction:column;gap:0}.settings-list>div,.data-row{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:13px 0;border-bottom:1px solid #edf0f5;font-size:13px}.settings-list dt{color:var(--muted)}.settings-list dd{margin:0;font-weight:650;font-variant-numeric:tabular-nums}.details{border-top:1px solid var(--line);padding-top:15px}.details summary{font-size:13px;color:var(--muted);cursor:pointer;min-height:44px;line-height:1.7}.details-content{padding-top:14px;font-size:12px;line-height:1.9;color:var(--muted)}.details-content p+p{margin-top:10px}.edit-fields{display:grid;gap:16px}.edit-fields label{display:block;font-size:12px;color:#5d6a80;font-weight:600}.edit-fields input,.edit-fields select{display:block;width:100%;min-height:48px;border:1px solid #d3dce9;border-radius:9px;padding:10px 12px;background:#fff;margin-top:6px;font-size:16px;color:#24344d}.pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.recipe{border:1px solid var(--line);border-radius:16px;overflow:hidden}.recipe-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:23px 18px}.recipe-row+div{border-top:1px solid var(--line)}.recipe-row span{font-size:14px}.recipe-row strong{font-size:30px;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.recipe-row strong small{font-size:13px;color:var(--muted);font-weight:500;margin-left:5px}.tare-value{font-size:17px!important;font-weight:650!important;color:#273c5f!important;font-variant-numeric:tabular-nums}.dose-card{background:var(--soft);border:1px solid #dce6ff;border-radius:20px;padding:26px 22px}.dose-card .solvent{font-size:16px;font-weight:650;color:#34548f}.dose-number{font-size:76px;font-weight:750;letter-spacing:-.06em;line-height:1.35;color:#1947b8;font-variant-numeric:tabular-nums;white-space:nowrap}.dose-number span{font-size:23px;font-weight:500;letter-spacing:0;margin-left:9px}.dose-card .sub{font-size:12px;color:#5c74a6;margin-top:8px}.compare{display:grid;grid-template-columns:1fr 1fr;gap:12px}.compare>div{padding:16px;border:1px solid var(--line);border-radius:13px}.compare small{display:block;color:var(--muted);font-size:11px;margin-bottom:7px}.compare strong{font-size:21px;font-weight:650;letter-spacing:-.04em;white-space:nowrap;font-variant-numeric:tabular-nums}.compare strong span{font-size:11px;color:var(--muted);font-weight:400}.big-check{width:56px;height:56px;display:grid;place-items:center;background:#e9f4ee;border-radius:18px;color:#26754e;margin-bottom:20px}.big-check svg{width:28px;height:28px}.result-gap{padding:21px;border-radius:16px;background:#edf6f0}.result-gap small{font-size:12px;color:#52735d}.result-gap strong{display:block;font-size:39px;font-weight:700;letter-spacing:-.04em;color:#286345;margin-top:5px;font-variant-numeric:tabular-nums}.result-gap strong span{font-size:14px;font-weight:500}.result-gap p{color:#52735d;font-size:11px;margin-top:8px}.badge{display:inline-block;background:#f0f4fb;border-radius:7px;padding:6px 9px;color:#61738f;font-size:11px}.save-status{text-align:center;font-size:11px;color:#8b95a5;padding:10px 0 16px}.sheet-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:14px}.sheet-header h2{font-size:19px;line-height:1.6}.close-button{width:44px;height:44px;flex-shrink:0;border:0;background:#f0f3f8;border-radius:50%;font-size:23px;color:#647086}.sheet-body{display:grid;gap:20px}.record-list{list-style:none;padding:0;margin:0}.record-list li{padding:16px 0;border-bottom:1px solid var(--line)}.record-heading{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--muted);margin-bottom:6px}.record-main{font-size:16px;font-weight:650;font-variant-numeric:tabular-nums}.record-sub{font-size:11px;color:var(--muted);line-height:1.8;margin-top:5px}.sheet-actions{display:grid;gap:10px}.empty-state{padding:28px 10px;text-align:center;font-size:14px;color:var(--muted)}dialog{border:0;border-radius:24px 24px 0 0;margin:auto auto 0;padding:24px 24px max(24px,env(safe-area-inset-bottom));width:min(100%,520px);max-width:100%;max-height:88svh;overflow:auto;color:inherit;box-shadow:0 -10px 50px #162b4b22}dialog::backdrop{background:#15274655;backdrop-filter:blur(2px)}.sheet-actions{display:grid;gap:10px}.warning-symbol{width:48px;height:48px;display:grid;place-items:center;color:#946127;background:#fff4e8;border-radius:15px;margin-bottom:18px;font-size:25px}.inline-total{font-size:12px;line-height:1.8;color:var(--muted);text-align:center}.inline-total strong{color:#324764}.method-note{font-size:12px;line-height:1.9;color:var(--muted)}.method-note a{overflow-wrap:anywhere}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes appear{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:600px){body{padding:24px 0}.shell{border:1px solid var(--line);border-radius:22px;overflow:clip;box-shadow:0 8px 40px #263a6410;min-height:calc(100svh - 48px)}#app{min-height:calc(100svh - 152px)}.topbar{height:70px}dialog{margin:auto;border-radius:24px;max-height:85svh}}
@media(max-width:360px){.topbar{padding:0 17px}.stage-nav{padding:0 18px}.screen{padding:21px 18px 0}.dock{padding-left:18px;padding-right:18px}.ratio-grid{gap:6px}.number-box{padding:10px 13px}.compare>div{padding:13px}.compare strong{font-size:18px}.dose-number{font-size:65px}.pair{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.screen{animation:none}*{scroll-behavior:auto!important}}
@media print{body,.shell{background:#fff;padding:0;box-shadow:none;border:0}.topbar,.stage-nav,.dock,.back-button,.history-button,.text-button{display:none}.shell{max-width:none}.screen{padding:0}dialog[open]{position:static;max-height:none;box-shadow:none;border-radius:0;width:100%;margin:0}.sheet-actions,.close-button{display:none}}