*{box-sizing:border-box}html,body{margin:0;min-height:100vh;min-height:100dvh;background:#eef5f8;color:#102a43;font-family:Arial,sans-serif;font-size:16px}button,input,select,textarea{font:inherit}.app-shell{max-width:620px;min-height:100vh;min-height:100dvh;margin:0 auto;background:#f8fbfc;box-shadow:0 0 22px rgba(15,55,80,.12)}.topbar{min-height:66px;padding:10px 14px;background:#075985;color:#fff;display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:5}.brand-mark{width:42px;height:42px;border:2px solid #bae6fd;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:bold}.topbar strong,.topbar small{display:block}.topbar small{font-size:12px;color:#bae6fd;margin-top:2px}.network{margin-left:auto;font-size:11px;border-radius:20px;padding:5px 8px;background:#334155}.network.online{background:#047857}.network.offline{background:#b45309}.screen{padding:18px 14px 90px}.hidden{display:none!important}.centered{text-align:center;padding-top:26vh;color:#64748b}.spinner{width:36px;height:36px;margin:auto;border:4px solid #bae6fd;border-top-color:#0284c7;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}h1,h2,p{margin-top:0}h1{font-size:23px;margin-bottom:5px}h2{font-size:16px;margin:22px 2px 10px;color:#334e68}.login-card{margin:8vh auto 0;background:#fff;border:1px solid #d9e6ed;border-radius:14px;padding:24px 18px;box-shadow:0 10px 26px rgba(30,64,80,.08)}.login-card p{color:#627d98;line-height:1.45}.login-card label{display:block;font-weight:bold;margin:16px 0 5px}.login-card input,.field input,.field select,.reason-input{display:block;width:100%;min-height:46px;margin-top:7px;padding:10px 12px;border:1px solid #bcccdc;border-radius:9px;background:#fff;color:#102a43}.button{min-height:44px;border:0;border-radius:9px;padding:10px 15px;font-weight:bold;cursor:pointer}.button:disabled{opacity:.55}.primary{background:#0369a1;color:#fff}.secondary{background:#e0f2fe;color:#075985;border:1px solid #7dd3fc}.full{width:100%;margin-top:10px}.compact{min-height:34px;padding:6px 10px;background:#fff;color:#075985}.text-button{background:transparent;color:#075985;padding:7px}.welcome{display:flex;justify-content:space-between;align-items:start;background:#e0f2fe;border-radius:12px;padding:14px}.welcome small,.form-heading small{color:#0369a1;font-weight:bold}.welcome p{margin:0;color:#486581;font-size:13px}.queue-banner{margin-top:12px;padding:10px 12px;border-radius:10px;background:#fef3c7;color:#92400e;display:flex;align-items:center;justify-content:space-between}.position-list{display:flex;flex-direction:column;gap:9px}.position-card{width:100%;text-align:left;border:1px solid #cbdde7;border-left:6px solid #0ea5e9;border-radius:12px;background:#fff;padding:13px;box-shadow:0 2px 6px rgba(30,64,80,.05)}.position-card.pda{border-left-color:#2563eb}.position-card strong,.position-card span{display:block}.position-card span{font-size:13px;color:#627d98;margin-top:4px}.position-card em{float:right;color:#0369a1;font-style:normal;font-weight:bold}.empty{border:1px dashed #bcccdc;border-radius:10px;padding:16px;color:#627d98;text-align:center}.recent-item{display:flex;justify-content:space-between;gap:8px;background:#fff;border-bottom:1px solid #e2e8f0;padding:10px}.recent-item small{color:#627d98}.recent-item .accepted{color:#047857;font-weight:bold}.back{margin:-8px 0 8px}.form-heading{border-bottom:1px solid #d9e6ed;padding-bottom:12px}.form-heading p{color:#627d98;margin:0}.info-box{background:#e0f2fe;color:#0c4a6e;border-radius:9px;padding:10px 12px;margin:12px 0;font-size:13px;line-height:1.4}.field{background:#fff;border:1px solid #d9e6ed;border-radius:11px;padding:13px;margin:10px 0}.field>label{display:block;font-weight:bold}.field .unit{color:#627d98;font-weight:normal}.measurement-row{display:flex;gap:8px}.measurement-row input{flex:1}.measurement-row select{width:46%;font-size:13px}.field-help{font-size:12px;color:#627d98;margin:7px 0 0}.reason-wrap{margin-top:8px}.reason-wrap label{font-size:12px;color:#486581}.message{padding:10px 12px;border-radius:9px;margin:12px 0;line-height:1.4}.error{background:#fee2e2;color:#991b1b}.success{background:#d1fae5;color:#065f46}.notice{background:#fef3c7;color:#92400e}.sticky-actions{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:620px;background:#fff;border-top:1px solid #d9e6ed;padding:10px 14px;display:flex;gap:9px;z-index:4}.sticky-actions .button{flex:1}.login-screen{padding:0 0 30px;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}.login-hero{background:linear-gradient(180deg,#0369a1,#075985);color:#fff;text-align:center;padding:38px 20px 44px;border-radius:0 0 12px 12px;box-shadow:0 6px 18px rgba(7,89,133,.25);flex:1 0 auto;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px}.login-logo{width:84px;height:84px;flex-shrink:0;border-radius:50%;background:#fff;border:3px solid rgba(255,255,255,.5);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(3,54,74,.35)}.login-logo img{width:56px;height:56px;object-fit:contain}.login-hero h1{font-size:21px;margin:0}.login-hero p{font-size:13px;color:#bae6fd;margin:0}.login-card{margin:-18px 16px 0;overflow:hidden;box-shadow:0 -7px 0 0 #fbbf24,0 10px 26px rgba(30,64,80,.08)}.field-label{display:flex;align-items:center;gap:7px;font-weight:bold;margin:16px 0 5px;color:#334e68}.field-icon{color:#0369a1;flex-shrink:0}.password-wrap{position:relative}.password-wrap input{padding-right:42px}.eye-toggle{position:absolute;right:4px;top:7px;background:transparent;border:0;color:#627d98;padding:8px;cursor:pointer}.eye-toggle svg.hidden{display:none}.remember-row{display:flex;align-items:center;gap:7px;margin:14px 0 2px;font-weight:normal;color:#334e68;font-size:14px;line-height:17px}.remember-row input{display:inline-block;width:17px;height:17px;min-height:auto;margin:0;padding:0;border:1px solid #bcccdc;border-radius:3px;background:#fff;flex-shrink:0}.login-submit{display:flex;align-items:center;justify-content:center;gap:8px}.login-footnote{display:flex;align-items:center;justify-content:center;gap:6px;text-align:center;color:#64748b;font-size:12px;margin:22px -18px -24px;padding:16px 18px;background:#f8fafc;border-top:1px solid #e2e8f0;border-radius:0 0 13px 13px}.login-footnote svg{flex-shrink:0}@media(max-width:360px){html,body{font-size:15px}.topbar{padding:8px}.network{font-size:10px}.screen{padding-left:10px;padding-right:10px}.measurement-row{display:block}.measurement-row select{width:100%}}
.period-bar{position:sticky;top:66px;z-index:3;margin:14px -14px 0;padding:10px 14px;background:#eef5f8;border-bottom:1px solid #d9e6ed;display:flex;align-items:center;justify-content:center;gap:22px;text-align:center}.period-bar small,.period-bar strong{display:block}.period-bar small{font-size:11px;color:#627d98;text-transform:uppercase;letter-spacing:.06em}.period-arrow{width:38px;height:38px;border:0;border-radius:50%;background:#0369a1;color:#fff;font-size:27px;line-height:1;cursor:pointer}.period-arrow:disabled{background:#d7e2e8;color:#8aa1b2;cursor:default}.status-legend{display:flex;gap:18px;justify-content:center;margin:14px 0;color:#486581;font-size:12px}.status-legend span{display:flex;align-items:center;gap:5px}.legend-dot{width:9px;height:9px;border-radius:50%}.pending-dot{background:#dc2626}.completed-dot{background:#16a34a}.observation-calendar{display:flex;flex-direction:column;gap:14px}.calendar-card{background:#fff;border:1px solid #d9e6ed;border-radius:13px;overflow:hidden;box-shadow:0 3px 10px rgba(30,64,80,.06)}.calendar-heading{padding:13px 14px;background:#f0f9ff;border-left:5px solid #0284c7;display:flex;align-items:center;justify-content:space-between;gap:10px}.calendar-heading strong,.calendar-heading small{display:block}.calendar-heading small{margin-top:3px;color:#627d98;font-size:12px}.calendar-heading>span{white-space:nowrap;font-size:11px;color:#0369a1;background:#fff;border-radius:20px;padding:5px 8px}.date-table-head,.date-row{display:grid;grid-template-columns:1fr 1fr;align-items:center}.date-table-head{padding:8px 13px;background:#f8fafc;color:#627d98;font-size:11px;font-weight:bold;text-transform:uppercase;letter-spacing:.05em}.date-table-head span:last-child{text-align:center}.date-row{min-height:58px;padding:8px 13px;border-top:1px solid #edf2f7}.date-row time{display:flex;align-items:baseline;gap:7px}.date-row time b{font-size:20px;color:#102a43}.date-row time span{font-size:12px;color:#627d98}.status-pill{justify-self:center;min-width:112px;border:0;border-radius:20px;padding:8px 10px;text-align:center;color:#fff;font-size:12px;font-weight:bold}.status-pill.pending{background:#dc2626;cursor:pointer;box-shadow:0 2px 5px rgba(220,38,38,.2)}.status-pill.completed{background:#16a34a}.status-pill.waiting{background:#d97706}.calendar-empty{margin:12px}
@media(max-width:360px){.status-pill{min-width:102px}.period-bar{margin-left:-10px;margin-right:-10px;padding-left:10px;padding-right:10px}}
.reference-date-card{background:#fff;margin:0 0 20px;padding:16px;box-shadow:0 2px 7px rgba(15,23,42,.12)}.reference-date-card span,.reference-date-card strong{display:block}.reference-date-card span{font-size:12px;color:#6b7280}.reference-date-card strong{font-size:18px;margin-top:4px;color:#111827}.reference-date-card input[type=date]{display:block;width:100%;min-height:44px;margin-top:8px;padding:8px 10px;border:1px solid #d1d5db;border-radius:6px;background:#fff;color:#111827}.reference-field-group{background:#fff;margin:0 0 20px;box-shadow:0 2px 7px rgba(15,23,42,.12)}.reference-group-title{display:block;padding:16px;background:#d1d5db;color:#111827;font-size:16px}.reference-group-body{padding:8px 16px}.reference-input{margin:10px 0 18px}.reference-input label{display:block;margin-bottom:8px;color:#374151;font-size:14px;font-weight:600}.reference-input input{display:block;width:100%;min-height:44px;padding:10px 12px;border:1px solid #d1d5db;border-radius:6px;background:#fff;color:#111827;box-shadow:0 1px 2px rgba(0,0,0,.04)}.reference-input input:focus,.reference-date-card input:focus{outline:2px solid rgba(99,102,241,.22);border-color:#a5b4fc}.sticky-actions{padding:0;gap:0}.reference-action{flex:1;min-height:56px;border:0;border-radius:0;padding:14px 10px;color:#fff;font-weight:700;cursor:pointer}.logout-action{background:#dc2626}.new-data-action,.save-action{background:#16a34a}.back-action{background:#ea7500}.home-actions{z-index:6}.form-heading{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 -14px 20px;padding:18px 16px;background:#1e40af;color:#fff;border-bottom:4px solid #fbbf24;box-shadow:0 2px 7px rgba(15,23,42,.16)}.form-heading small{color:#dbeafe}.form-heading h1{font-size:18px}.form-heading p{grid-column:1/-1;color:#dbeafe;font-size:12px}.home-heading{margin-top:-18px}
#formScreen .form-heading{position:sticky;top:0;z-index:5;margin-top:-18px}
.form-heading{min-height:142px;padding:28px 20px;background:linear-gradient(180deg,#0369a1,#075985)}.form-heading small{color:#bae6fd}.form-heading h1{font-size:20px;line-height:1.25}.home-heading{margin-left:-14px;margin-right:-14px}
.period-bar{position:static}
.home-heading{margin-bottom:0}.period-bar{margin-top:0}
.logout-action{background:#b91c1c}.logout-action:hover,.logout-action:active{background:#991b1b}.new-data-action,.save-action{background:#0369a1}.new-data-action:hover,.new-data-action:active,.save-action:hover,.save-action:active{background:#075985}.back-action{background:#0e7490}.back-action:hover,.back-action:active{background:#155e75}.status-pill.pending{background:#c2410c;box-shadow:0 2px 5px rgba(194,65,12,.22)}.status-pill.completed{background:#047857}.reference-action:focus-visible,.status-pill:focus-visible{outline:3px solid #fbbf24;outline-offset:-3px}
.status-pill{border-radius:6px}
.back-action{background:#84cc16;color:#1a2e05}.back-action:hover,.back-action:active{background:#65a30d;color:#fff}
.status-pill{min-height:42px;padding-top:11px;padding-bottom:11px}
@media(max-width:520px){.form-heading{grid-template-columns:1fr;gap:18px;min-height:auto}.form-heading h1{margin-bottom:0}}
.reference-group-date{margin:8px 0 20px;padding:12px 0;border-bottom:1px solid #e5e7eb}.reference-group-date span,.reference-group-date strong{display:block}.reference-group-date span{font-size:12px;color:#6b7280}.reference-group-date strong{margin-top:5px;color:#111827;font-size:17px}.reference-group-date input[type=date]{display:block;width:100%;min-height:44px;margin-top:8px;padding:8px 10px;border:1px solid #d1d5db;border-radius:6px;background:#fff;color:#111827}
