:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#20323c;background:#edf3f5;font-size:14px;line-height:1.45}*{box-sizing:border-box}body{margin:0;min-height:100dvh;display:flex;flex-direction:column}header{display:flex;align-items:center;gap:8px;padding:14px 18px;background:#f8fbfc;border-bottom:1px solid #dbe5e9}header strong{font-size:17px;color:#336d80}header span{margin-left:auto;font-size:11px;color:#546b76}.guide{margin:12px 14px 0;padding:13px 15px;background:#dff1eb;border:1px solid #c5e3d9;border-radius:14px}.guide small{font-size:10px;letter-spacing:.1em;font-weight:800;color:#326c66}.guide p{font-size:13px;margin:5px 0 9px;color:#214c48}.steps{display:flex;gap:5px}.steps i{height:3px;border-radius:3px;background:#bcd9d3;flex:1}.steps i.active{background:#326e83}main{padding:17px 16px;flex:1}h1{font-size:25px;line-height:1.2;letter-spacing:-.04em;margin:0 0 7px}h2{font-size:16px;margin:0 0 10px}p{margin:8px 0}.muted{color:#5b707c;font-size:12px}.card{padding:15px;background:#fff;border:1px solid #dbe5e9;border-radius:18px;margin:13px 0;box-shadow:0 4px 12px #1b3b4b05}.card p{margin:4px 0}.row{display:flex;align-items:center;justify-content:space-between;gap:10px}.row>div{min-width:0}.row strong{overflow-wrap:anywhere}.badge{font-size:11px;color:#276a60;background:#e0f2ea;padding:4px 8px;border-radius:20px;display:inline-block}.quantity{font-weight:700;color:#326e83;font-size:17px}.primary{background:#326e83;color:white;border:1px solid #326e83}.secondary{background:#e1eaee;color:#214b5b;border:1px solid #d6e2e8}button{font:inherit;font-weight:650;cursor:pointer;min-height:44px;border-radius:12px;padding:10px 14px}button:disabled{opacity:.6;cursor:default}.full{width:100%;margin-top:10px}.small-button{font-size:12px;min-width:55px}.back{padding:0;border:0;background:transparent;color:#326e83;margin-bottom:10px;font-size:12px;min-height:30px}label{display:block;font-weight:650;font-size:12px;margin:14px 0 6px}select,input{width:100%;min-height:44px;border:1px solid #c4d5de;border-radius:11px;background:white;padding:10px;font:inherit;color:#20323c}input[readonly]{background:#f8fafb}.form-note{font-size:11px;color:#607581;margin-top:7px}nav{display:flex;background:#f8fbfc;border-top:1px solid #dbe5e9;padding:6px 10px;gap:6px}nav button{flex:1;border:0;background:transparent;color:#536e7b;font-size:12px;padding:8px}nav button[aria-current=page]{background:#dfeeea;color:#205c59}footer{display:flex;align-items:center;justify-content:space-between;background:#f8fbfc;padding:0 14px 10px;font-size:10px;color:#607581}footer button{font-size:11px;border:0;background:none;color:#326e83;padding:4px 0;min-height:30px}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #cb694f;outline-offset:3px}h1:focus{outline:none}.empty{padding:22px 15px;text-align:center}.success{color:#236c5f;background:#e1f2eb;border-radius:13px;padding:12px;margin:0 0 15px}.success strong{display:block}.history-entry{padding:11px 0;border-top:1px solid #e6edef}.history-entry:first-of-type{border:0}.stat{font-size:27px;font-weight:750;color:#326e83}.hint{font-size:12px;line-height:1.5}.inventory-line{display:flex;align-items:baseline;gap:6px}.sample-date{font-size:11px;color:#607581}@media(max-width:300px){main{padding:13px 10px}.guide{margin:10px}.row{flex-wrap:wrap}}
/* Keep the app navigation available while forms scroll inside the phone. */
html,body{height:100%;min-height:0;overflow:hidden}header,.guide,nav,footer{flex-shrink:0}main{min-height:0;overflow-y:auto;overscroll-behavior:contain}nav{position:relative}button{touch-action:manipulation}
details{margin:14px 0;padding:12px;background:#e8f0f2;border-radius:12px}summary{cursor:pointer;font-weight:700;font-size:13px;min-height:24px}.quick-grid{display:flex;gap:6px;margin-top:10px}.quick-grid button{flex:1;background:white;border:1px solid #c4d5de;color:#326e83;padding:7px;font-size:12px}.actions{justify-content:flex-start;margin-top:10px}.actions button{flex:1}.low{display:inline-block;color:#90422c;background:#fff0df;font-weight:700;border-radius:8px;padding:5px 8px;font-size:11px}.reminder-preview{border:0;background:none;color:#326e83;padding:6px 0;font-size:12px}.error{color:#963c2b;font-size:12px}.sample-map{height:240px;width:220px;max-width:100%;margin:12px auto;position:relative;background:#e0ebee;border-radius:20px}.sample-map svg{height:100%;width:100%;fill:#f8fbfc;stroke:#9fb8c1;stroke-width:2}.map-point{position:absolute;width:34px;height:34px;min-height:34px;padding:0;border:2px solid white;border-radius:50%;background:#326e83;color:white;transform:translate(-50%,-50%);font-size:17px}.map-point[aria-pressed=true]{background:#a64b32}.body .p0{left:76%;top:32%}.body .p1{left:24%;top:32%}.body .p2{left:60%;top:48%}.body .p3{left:40%;top:48%}.body .p4{left:60%;top:73%}.body .p5{left:40%;top:73%}.face .p0{left:50%;top:24%}.face .p1{left:50%;top:39%}.face .p2{left:74%;top:53%}.face .p3{left:26%;top:53%}.face .p4{left:50%;top:78%}.map-status{color:#276a60;font-size:12px;min-height:18px}
header .view-label{margin:0 0 0 auto;font-size:9px;line-height:1.2;color:#546b76}header .view-label select{display:block;min-height:32px;width:100px;font-size:12px;padding:4px 7px;margin-top:3px;border-radius:8px}

button{transition:background .16s,box-shadow .16s,transform .16s}button:active{transform:scale(.97)}button:focus-visible{outline:3px solid #e97557;outline-offset:3px}.saved-feedback .success{animation:saved .5s ease-out}.saved-feedback .quantity{display:inline-block;animation:quantity .4s ease-out}.saved-feedback .low{animation:saved .5s ease-out}@keyframes saved{from{box-shadow:0 0 0 4px #126a8640}to{box-shadow:0 0 0 0 transparent}}@keyframes quantity{from{transform:scale(1.12);color:#126a86}to{transform:scale(1)}}@media(hover:hover){button:hover{box-shadow:0 3px 9px #126a8625}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}button:active{transform:none}}
@media(max-height:500px){header{padding:8px 12px}.guide{padding:10px 12px;margin:6px 10px}.guide p{margin:4px 0;font-size:12px}.guide .steps{margin-top:7px}main{padding:12px}main h1{font-size:23px;margin:0 0 6px}.card{padding:12px;margin:10px 0}footer{padding:6px 10px}nav button{min-height:40px}header .view-label{font-size:10px}}

/* A calm first step; optional examples remain available on demand. */
.first-item{padding:20px;text-align:center}.first-item h2{font-size:21px;letter-spacing:-.03em;margin:12px 0 6px}.first-item .muted{max-width:235px;margin:0 auto 8px}.sample-symbol{display:grid;place-items:center;margin:auto;width:40px;height:40px;background:#dff1eb;border-radius:13px;color:#326e83;font-size:25px}.record-count{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin:2px 0;font-size:12px;color:#5b707c}.inline-action{border:0;background:none;color:#326e83;text-decoration:underline;text-underline-offset:3px;font-size:12px;padding:4px;min-height:44px}.form-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.form-pair>*{min-width:0}.form-pair input,.form-pair select{min-width:0}.quick-samples summary{min-height:44px;display:flex;align-items:center;gap:8px}.quick-samples summary:before{content:'+';color:#326e83;font-size:20px}.quick-samples[open] summary:before{content:'−'}.quick-samples{padding:0 12px}.quick-samples[open]{padding-bottom:12px}summary:focus-visible{outline:3px solid #cb694f;outline-offset:3px;border-radius:4px}@media(max-height:500px){.first-item{padding:14px}.sample-symbol{display:none}.first-item h2{font-size:19px;margin-top:0}.first-item .muted{font-size:12px}.first-item .full{margin-top:8px}}