:root{--navy:#0b3d6b;--blue:#176bd1;--blue-soft:#e8f2ff;--ink:#122b45;--muted:#667a8e;--line:#d7e1ec;--paper:#fff;--bg:#f2f6fb;--green:#16823e;--shadow:0 8px 28px #173b5a0e}*{box-sizing:border-box}html{background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",sans-serif}body{margin:0;min-height:100vh;background:var(--bg)}button,textarea{font:inherit}button{touch-action:manipulation}.app-shell{max-width:560px;min-height:100vh;margin:auto;padding:0 14px 106px;background:var(--bg)}.app-header{margin:0 -14px 18px;padding:calc(16px + env(safe-area-inset-top)) 22px 17px;min-height:89px;display:flex;align-items:center;gap:13px;color:white;background:linear-gradient(115deg,#0b3158,#0b4c80);box-shadow:0 3px 12px #12355024}.brand-mark{width:47px;height:47px;display:grid;place-items:center;position:relative;border:2px solid #cde6ff;border-radius:50%;font-size:33px;line-height:1;color:#fff}.brand-mark span{position:absolute;left:8px;top:17px;font-size:23px;font-weight:700}.series-name{font-size:11px;color:#cee3f7;letter-spacing:.06em;margin:0 0 2px}.app-header h1{font-size:25px;line-height:1.15;margin:0;letter-spacing:.02em}.screen{padding-bottom:0}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:0 2px 13px}.eyebrow{font-size:12px;letter-spacing:.08em;color:#647e98;margin:0 0 3px}.section-heading h2{font-size:23px;margin:0;line-height:1.2}.date-chip{background:#e5eef8;color:#31516f;border-radius:999px;padding:7px 11px;font-size:13px;font-weight:700;white-space:nowrap}.reading-card{border:1px solid #d8e7f6;border-radius:21px;padding:13px 14px 14px;margin-bottom:11px;background:linear-gradient(135deg,#e7f2ff,#f7fbff 70%,#fff);box-shadow:var(--shadow)}.second-reading{border-color:#dfe6ee;background:linear-gradient(135deg,#eef3f9,#fafcff 70%,#fff)}.reading-card h3{font-size:18px;margin:0 0 10px;display:flex;align-items:center;gap:7px}.reading-index{display:inline-grid;place-items:center;width:27px;height:27px;border-radius:50%;color:#fff;background:#176bd1;font-size:15px}.optional-index{background:#8998a8}.reading-card h3 em{font-size:12px;font-style:normal;font-weight:600;color:#6f7f90;background:#e6ebf0;padding:3px 8px;border-radius:99px}.reading-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.measure{display:flex;min-width:0;flex-direction:column;align-items:stretch;gap:5px;text-align:center;font-weight:750;font-size:14px}.measure>span:first-child{white-space:nowrap}.measure small{font-weight:550;color:#61768b;font-size:11px}.value-field{min-height:76px;border:2px solid #c8d6e5;border-radius:15px;background:#fff;color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3px 2px;cursor:pointer;transition:border-color .12s,background .12s,box-shadow .12s}.value-field .value{display:block;font-size:28px;font-weight:800;line-height:1.05;letter-spacing:.02em;font-variant-numeric:tabular-nums}.value-field .unit{margin-top:5px;font-weight:550;color:#536a80;font-size:11px}.value-field.selected{border-color:#1673df;box-shadow:0 0 0 2px #1673df20;background:#fafdff}.value-field.filled .value{color:#122b45}.memo-label{display:flex;align-items:center;gap:7px;margin:13px 3px 6px;font-size:16px;font-weight:750}.memo-label span{font-size:12px;color:#6c7c8c;font-weight:550}textarea{display:block;width:100%;min-height:58px;resize:vertical;border:1.5px solid #cbd7e4;border-radius:14px;padding:11px 13px;background:#fff;color:var(--ink);font-size:15px;line-height:1.5;outline:none}textarea::placeholder{color:#9aa7b4}textarea:focus{border-color:#4888d2;box-shadow:0 0 0 3px #3979be18}.saved-at{display:flex;align-items:center;gap:7px;color:#637991;margin:9px 4px 10px;font-size:12px}.saved-at strong{margin-left:auto;color:#294f73;font-weight:650}.clock-dot{width:8px;height:8px;border-radius:50%;background:#45a378}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:9px;border:1px solid #d9e2ec;border-radius:18px;background:#e7ebf0}.keypad button{min-height:54px;border:1px solid #d2d9e1;border-radius:14px;background:#fff;color:#142a40;font-size:25px;font-weight:750;box-shadow:0 1px 1px #1a34510c;cursor:pointer}.keypad button:active{transform:scale(.98);background:#edf5ff}.keypad .delete-key{font-size:26px;background:#f5f7f9}.keypad .clear-key{font-size:15px;background:#f5f7f9;color:#52677c}.save-button{display:flex;align-items:center;justify-content:center;gap:11px;width:100%;min-height:64px;margin:11px 0 0;border:0;border-radius:17px;background:linear-gradient(110deg,#18843c,#137a36);color:#fff;font-size:21px;font-weight:800;box-shadow:0 5px 13px #147c3826;cursor:pointer}.save-button span{font-size:25px}.save-button:active{transform:translateY(1px)}.input-hint{text-align:center;font-size:11px;color:#73869a;margin:8px 8px 0;line-height:1.45}.bottom-nav{position:fixed;z-index:8;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,560px);padding:9px 10px calc(8px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(3,1fr);gap:7px;border-top:1px solid #dfe6ed;background:#fffffff2;backdrop-filter:blur(12px)}.nav-button{min-height:66px;border:0;border-radius:15px;background:transparent;color:#6a7683;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:13px;font-weight:700;cursor:pointer}.nav-button.selected{background:#eaf3ff;color:#176bd1}.nav-icon{font-size:24px;line-height:1.1}.list-icon{font-size:30px}.help-icon{font-size:23px}.history-screen{padding-top:3px}.history-screen .section-heading{align-items:center;margin-bottom:12px}.print-button{border:1px solid #bfd3e7;border-radius:12px;background:#fff;color:#245b8d;padding:10px 12px;font-size:13px;font-weight:750;white-space:nowrap;cursor:pointer}.print-button span{font-size:18px;vertical-align:-1px;margin-right:4px}.month-nav{display:flex;justify-content:center;align-items:center;gap:25px;margin:14px 0 7px}.month-nav strong{min-width:136px;text-align:center;font-size:19px}.month-nav button{width:38px;height:36px;border:1px solid #d4dfeb;border-radius:11px;background:#fff;color:#2a5b89;font-size:28px;line-height:1;cursor:pointer}.month-caption{text-align:center;color:#65788b;font-size:13px;margin:4px 0 13px}.month-caption strong{color:#183c60}.record-list{display:flex;flex-direction:column;gap:9px}.record-card{background:#fff;border:1px solid #e0e7ee;border-radius:17px;padding:13px 13px 12px;box-shadow:var(--shadow)}.record-top{display:flex;align-items:center;justify-content:space-between;gap:9px;padding-bottom:8px;border-bottom:1px solid #edf1f5}.record-date{font-weight:800;font-size:15px}.record-time{font-size:12px;color:#65798d}.reading-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:9px}.summary-reading{border-radius:12px;background:#f1f7ff;padding:9px 10px}.summary-reading.second{background:#f4f6f8}.summary-caption{display:block;color:#62768a;font-size:11px;margin-bottom:3px}.summary-values{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}.summary-values small{font-size:10px;color:#607388;font-weight:550}.summary-pulse{display:inline-block;margin-left:5px;color:#455e76;font-size:12px;font-weight:650}.record-memo{white-space:pre-wrap;overflow-wrap:anywhere;margin:9px 2px 0;font-size:13px;line-height:1.45;color:#455c72}.record-actions{display:flex;justify-content:flex-end;margin-top:6px}.delete-record{border:0;background:transparent;color:#a24646;padding:6px 2px 2px 12px;font-size:12px;cursor:pointer}.empty-state{margin:18px 0;padding:34px 18px;border:1px dashed #cbd8e5;border-radius:20px;background:#fff;display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;color:#5f7387}.empty-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:#eaf3ff;color:#4386d0;font-size:34px}.empty-state strong{color:#284a6a}.empty-state span{font-size:13px}.empty-state button{margin-top:5px;border:0;border-radius:12px;padding:10px 15px;background:#176bd1;color:#fff;font-weight:700}.history-footnote{text-align:center;color:#718398;font-size:12px;margin:14px 8px}.guide-backdrop[hidden]{display:none}.guide-backdrop{position:fixed;z-index:30;inset:0;padding:14px;background:#09274491;display:flex;align-items:center;justify-content:center}.guide-dialog{width:min(100%,540px);max-height:min(91dvh,850px);overflow:auto;background:#f3f7fc;border-radius:23px;padding:20px 19px;color:var(--ink);box-shadow:0 18px 65px #061c3480}.guide-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.guide-heading h2{font-size:23px;margin:0}.guide-close{flex:none;width:40px;height:40px;border:0;border-radius:50%;background:#e1ebf7;color:#245988;font-size:26px;line-height:1;cursor:pointer}.guide-intro{margin:10px 0 15px;color:#4f667e;line-height:1.55;font-size:14px}.guide-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:12px}.guide-tabs button{min-height:48px;padding:7px 4px;border:1px solid #cbd9e8;border-radius:13px;background:#fff;color:#294867;font-size:13px;font-weight:700;cursor:pointer}.guide-tabs button[aria-selected="true"]{background:#286bb8;border-color:#286bb8;color:#fff}.guide-panel[hidden]{display:none}.guide-instructions{padding:14px;background:#fff;border:1px solid #dce5ef;border-radius:17px}.guide-instructions h3{font-size:17px;margin:0 0 4px}.guide-instructions>p{margin:0 0 8px;color:#62768a;font-size:12px}.guide-steps{list-style:none;padding:0;margin:0}.guide-steps li{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-top:1px solid #e9eef4}.guide-steps li>span{flex:none;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#e6f0ff;color:#1b68b8;font-weight:800}.guide-steps b{display:block;font-size:14px;line-height:1.4}.guide-steps small{display:block;margin-top:2px;color:#64788b;font-size:11px;line-height:1.4}.guide-instructions aside{margin-top:8px;border-radius:12px;padding:10px 11px;background:#eef5ff;color:#45607c;font-size:12px;line-height:1.5}.guide-instructions aside b{color:#173e6d}.guide-done{margin-top:11px;background:#e8f5ee;border-radius:13px;padding:11px;text-align:center;color:#16744f;font-weight:750;font-size:13px}.guide-privacy{margin:12px 2px 0;color:#60748d;font-size:11px;line-height:1.55;text-align:center}.guide-privacy strong{color:#28466a}.ad-disclosure{display:inline-block;margin-top:5px}.toast{position:fixed;z-index:40;left:50%;bottom:95px;transform:translateX(-50%);padding:11px 17px;border-radius:999px;background:#173e60;color:white;font-size:13px;box-shadow:0 4px 18px #0b263d35;white-space:nowrap}.toast[hidden]{display:none}
@media(max-width:390px){.app-shell{padding-left:10px;padding-right:10px}.app-header{margin-left:-10px;margin-right:-10px}.reading-grid{gap:6px}.reading-card{padding:12px 10px}.value-field{min-height:70px}.value-field .value{font-size:25px}.measure{font-size:13px}.measure small{font-size:10px}.keypad button{min-height:50px}.section-heading h2{font-size:21px}.guide-dialog{padding:17px 14px}}
@media print{html,body{background:#fff!important;color:#111!important}.app-shell{max-width:none;min-height:0;padding:0;margin:0}.app-header,.bottom-nav,#entryScreen,.history-screen .section-heading .print-button,.month-nav button,.history-footnote,.delete-record,.record-actions,.empty-state{display:none!important}.history-screen{display:block!important;padding:0}.history-screen[hidden]{display:block!important}.history-screen .section-heading{display:flex!important;margin:0 0 8mm!important}.history-screen .section-heading::after{content:"すごいシンプルシリーズ";font-size:10pt;color:#555}.eyebrow{display:none}.section-heading h2{font-size:22pt}.month-nav{margin:0 0 4mm}.month-nav strong{font-size:15pt}.month-caption{text-align:right;margin:0 0 3mm;font-size:10pt}.record-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3mm}.record-card{break-inside:avoid;border:1px solid #aeb8c3;box-shadow:none;padding:3mm;border-radius:3mm}.record-top{padding-bottom:2mm}.record-date{font-size:11pt}.record-time{font-size:9pt}.summary-reading{padding:2mm;background:#f4f7fa!important}.summary-values{font-size:13pt}.summary-values small{font-size:7pt}.summary-pulse{font-size:8pt}.record-memo{font-size:9pt;margin-top:2mm}.guide-backdrop,.toast{display:none!important}@page{size:A4 portrait;margin:13mm}}
.reading-summary:has(.summary-reading:only-child){grid-template-columns:1fr}
[hidden]{display:none!important}
@media(max-width:480px){
  .app-shell{padding:0 11px 84px}
  .app-header{margin:0 -11px 11px;padding:calc(9px + env(safe-area-inset-top)) 17px 10px;min-height:68px;gap:10px}
  .brand-mark{width:39px;height:39px;font-size:28px}.brand-mark span{left:6px;top:14px;font-size:19px}
  .app-header h1{font-size:22px}.series-name{font-size:10px}
  .section-heading{margin:0 1px 9px}.section-heading h2{font-size:21px}.eyebrow{font-size:10px}.date-chip{font-size:11px;padding:5px 9px}
  .reading-card{padding:10px 11px 11px;border-radius:18px;margin-bottom:8px}.reading-card h3{font-size:16px;margin-bottom:7px;gap:6px}.reading-index{width:23px;height:23px;font-size:13px}
  .reading-grid{gap:6px}.measure{font-size:12px;gap:3px}.measure small{font-size:10px}.value-field{min-height:59px;border-radius:12px}.value-field .value{font-size:23px}.value-field .unit{font-size:10px;margin-top:3px}
  .memo-row{display:flex;align-items:center;gap:8px;margin-top:7px}.memo-label{flex:none;gap:4px;font-size:14px;margin:0 0 0 2px}.memo-label span{font-size:10px}.memo-row textarea{min-height:48px;height:48px;resize:none;padding:8px 10px;border-radius:12px;font-size:13px}
  .saved-at{font-size:11px;margin:6px 4px 8px}.keypad{gap:5px;padding:7px;border-radius:15px}.keypad button{min-height:45px;border-radius:11px;font-size:22px}.keypad .delete-key{font-size:23px}.keypad .clear-key{font-size:13px}
  .save-button{min-height:55px;margin-top:8px;border-radius:14px;font-size:19px}.save-button span{font-size:22px}.input-hint{font-size:10px;margin-top:5px}
  .bottom-nav{padding:6px 8px calc(6px + env(safe-area-inset-bottom));gap:5px}.nav-button{min-height:57px;border-radius:12px;font-size:12px}.nav-icon{font-size:21px}.list-icon{font-size:25px}
}
@media(max-width:480px) and (max-height:760px){
  .app-header{margin-bottom:8px;min-height:60px;padding-top:calc(6px + env(safe-area-inset-top));padding-bottom:7px}
  .brand-mark{width:35px;height:35px;font-size:25px}.brand-mark span{top:12px;font-size:18px}
  .section-heading{margin-bottom:7px}.reading-card{padding:8px 10px 9px;margin-bottom:6px}.reading-card h3{font-size:15px;margin-bottom:5px}.reading-index{width:21px;height:21px;font-size:12px}
  .measure{font-size:11px}.measure small{font-size:9px}.value-field{min-height:49px;border-width:1.5px}.value-field .value{font-size:21px}.value-field .unit{font-size:9px;margin-top:2px}
  .memo-row{margin-top:5px}.memo-row textarea{height:42px;min-height:42px;font-size:12px;padding:6px 8px}.memo-label{font-size:13px}.saved-at{margin:4px 3px 6px;font-size:10px}
  .keypad{padding:6px;gap:4px}.keypad button{min-height:39px;border-radius:10px;font-size:20px}.keypad .delete-key{font-size:21px}.keypad .clear-key{font-size:12px}
  .save-button{min-height:48px;margin-top:6px;font-size:18px}.save-button span{font-size:20px}.input-hint{display:none}
  .bottom-nav{padding-top:4px;padding-bottom:calc(4px + env(safe-area-inset-bottom))}.nav-button{min-height:51px;font-size:11px}.nav-icon{font-size:19px}.list-icon{font-size:23px}
}
@media(max-width:480px) and (max-height:680px){
  .app-shell{padding-left:8px;padding-right:8px}.app-header{margin-left:-8px;margin-right:-8px;margin-bottom:6px;min-height:54px}
  .section-heading h2{font-size:19px}.reading-card{padding:6px 8px 7px;margin-bottom:5px}.reading-card h3{font-size:14px;margin-bottom:4px}.value-field{min-height:44px}.value-field .value{font-size:19px}
  .memo-row textarea{height:38px;min-height:38px}.keypad{padding:5px;gap:3px}.keypad button{min-height:35px}.save-button{min-height:44px}
}
@media(max-width:480px) and (max-height:760px){
  html,body{height:100%;overflow:hidden}
  .app-shell{height:100dvh;min-height:0;overflow:hidden;display:flex;flex-direction:column;padding-bottom:calc(52px + env(safe-area-inset-bottom))}
  .app-header{flex:none}
  #entryScreen{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}
  #entryScreen>.section-heading,#entryScreen>.reading-card,#entryScreen>.memo-row,#entryScreen>.saved-at,#entryScreen>.save-button{flex:none}
  #entryScreen>.keypad{flex:1 1 auto;min-height:0;grid-template-rows:repeat(4,minmax(29px,1fr));align-content:stretch}
  #entryScreen>.keypad button{min-height:29px;padding:0}
  #entryScreen>.input-hint{display:none}
  #historyScreen{flex:1;min-height:0;overflow-y:auto}
  .bottom-nav{flex:none}

  /* Browser chrome takes away much of a phone's usable height. Compress
     the surrounding content so the keypad can keep a useful tap size. */
  .app-header{margin-bottom:2px;min-height:44px;padding-top:calc(3px + env(safe-area-inset-top));padding-bottom:3px;gap:7px}
  .brand-mark{width:30px;height:30px;font-size:21px}.brand-mark span{top:9px;left:5px;font-size:15px}
  .app-header h1{font-size:18px}.series-name{font-size:8px}
  .section-heading{margin-bottom:3px}.eyebrow{display:none}.section-heading h2{font-size:17px}.date-chip{padding:3px 7px;font-size:10px}
  .reading-card{padding:4px 7px 5px;margin-bottom:3px;border-radius:13px}.reading-card h3{font-size:12px;margin-bottom:2px;gap:4px}.reading-index{width:18px;height:18px;font-size:10px}
  .reading-card h3 em{font-size:9px;padding:2px 5px}.reading-grid{gap:3px}.measure{font-size:9px;gap:1px}.measure small{font-size:8px}.value-field{min-height:34px;padding:0;border-radius:9px}.value-field .value{font-size:17px}.value-field .unit{font-size:8px;margin-top:0}
  .memo-row{margin-top:2px;gap:5px}.memo-label{font-size:11px}.memo-label span{font-size:8px}.memo-row textarea{height:30px;min-height:30px;padding:3px 6px;font-size:10px;border-radius:9px}
  .saved-at{margin:1px 3px 2px;font-size:8px;line-height:10px}.clock-dot{width:6px;height:6px}
  .keypad{padding:3px;gap:2px;border-radius:11px}.keypad button{min-height:30px;border-radius:7px;font-size:17px}.keypad .delete-key{font-size:18px}.keypad .clear-key{font-size:10px}
  .save-button{min-height:36px;margin-top:3px;border-radius:10px;font-size:15px}.save-button span{font-size:17px}
  .bottom-nav{padding:2px 6px calc(2px + env(safe-area-inset-bottom));gap:3px}.nav-button{min-height:44px;border-radius:9px;font-size:9px}.nav-icon{font-size:16px}.list-icon{font-size:19px}
}
