:root{--photo-aspect-ratio: 1.6;color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#e7ecef;color:#1f2933}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{align-items:center;background:#176b87;border:1px solid #176b87;border-radius:6px;color:#fff;cursor:pointer;display:inline-flex;font-weight:700;gap:8px;justify-content:center;min-height:42px;padding:0 14px;text-align:center}button:disabled{cursor:not-allowed;opacity:.45}button.secondary{background:#fff;color:#176b87}button.danger{background:#fff;border-color:#b93636;color:#9f2f2f}button.full-width{width:100%}.app-shell,.login-shell{min-height:100vh;padding:10px}.app-shell{display:flex;flex-direction:column;gap:0}.login-shell{align-items:center;display:flex;justify-content:center}.login-panel{background:#fff;border:1px solid #cad4dc;border-radius:6px;display:flex;flex-direction:column;gap:18px;max-width:420px;padding:18px;width:100%}.workspace{display:grid;gap:12px;grid-template-columns:minmax(0,1fr);margin:0 auto;max-width:1440px}.workspace.tab-panel{width:100%}.app-header{display:flex;flex-direction:column;gap:8px;margin:0 auto;max-width:1440px;width:100%}.sidebar{background:#fff;border:1px solid #cad4dc;border-radius:6px;display:flex;flex-direction:column;gap:14px;min-height:auto;padding:14px}.brand-line{align-items:center;background:#fff;border:1px solid #cad4dc;border-radius:6px;display:flex;justify-content:space-between;margin-bottom:10px;padding:14px}.tab-bar{display:grid;gap:0;grid-template-columns:repeat(3,minmax(0,1fr));padding:0;position:relative;z-index:2}.tab-button{background:#eef3f6;border-color:#b9c6cf;border-radius:6px 6px 0 0;color:#52616d;line-height:1.1;margin:0;min-height:48px;min-width:0;overflow-wrap:anywhere;padding:6px 8px;white-space:normal}.tab-button.active{background:#fff;border-bottom-color:#fff;border-color:#cad4dc;color:#176b87;position:relative;z-index:3}.tab-button.active:after{background:#fff;bottom:-2px;content:"";height:3px;left:0;position:absolute;right:0}.tab-panel{background:#fff;border:1px solid #cad4dc;border-radius:0 6px 6px;margin-top:-1px;padding:14px;position:relative;z-index:1}.brand-line span{font-weight:800}.brand-line strong{background:#eef7f9;border:1px solid #c7e4eb;border-radius:999px;color:#176b87;font-size:12px;padding:4px 8px}.brand-actions{align-items:center;display:flex;gap:8px}.brand-actions small{color:#60727f;font-size:12px;font-weight:800;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.patient-form,.login-form{display:flex;flex-direction:column;gap:10px}.patient-form h1,.login-form h1{font-size:19px;margin:0 0 4px}.patient-form label,.login-form label,.search-control{color:#52616d;display:flex;flex-direction:column;font-size:13px;font-weight:700;gap:6px}.optional-field{color:#7b8b96;font-size:12px;font-weight:600}.patient-form input,.login-form input{border:1px solid #b9c6cf;border-radius:6px;min-height:40px;padding:8px 10px}.patient-form input:focus,.login-form input:focus,.search-control input:focus{border-color:#176b87;outline:3px solid #d7eef3}.form-status{color:#287044;font-size:13px;font-weight:700;margin:0}.form-status.error{color:#9f2f2f}.button-row,.action-panel{display:grid;gap:10px;grid-template-columns:1fr 1fr}.button-row button,.action-panel button{min-width:0;padding:0 10px}.panel-heading{align-items:center;display:flex;justify-content:space-between}.panel-heading h2{font-size:18px;margin:0}.icon-button{min-height:34px;padding:0;width:34px}.patient-search-panel,.card-list,.selected-cell-panel,.backup-panel{border-top:1px solid #dde4e9;display:flex;flex-direction:column;gap:10px;padding-top:18px}.sidebar>.patient-search-panel:first-child{border-top:0;padding-top:0}.workspace>.backup-panel{background:#fff;border:1px solid #cad4dc;border-radius:6px;padding:14px}.patients-page,.service-page{display:flex;flex-direction:column;gap:14px;margin:0 auto;max-width:1440px;width:100%}.patients-page.tab-panel,.service-page.tab-panel{max-width:920px}.patients-toolbar{display:flex;flex-direction:column;gap:12px}.patients-toolbar h1,.service-backup-panel h1{font-size:21px;margin:0}.patients-toolbar p{color:#60727f;font-size:13px;font-weight:700;margin:4px 0 0}.patients-toolbar label{color:#52616d;display:flex;flex-direction:column;font-size:13px;font-weight:700;gap:6px}.patients-toolbar select{background:#fff;border:1px solid #b9c6cf;border-radius:6px;min-height:40px;padding:8px 10px}.patients-toolbar select:focus{border-color:#176b87;outline:3px solid #d7eef3}.patient-card-column{display:grid;gap:10px}.patient-card{align-items:flex-start;background:#fff;border:1px solid #cad4dc;color:#1f2933;display:flex;flex-direction:column;gap:4px;min-height:64px;padding:10px 12px;text-align:left;width:100%}.patient-card.active{background:#eef7f9;border-color:#176b87}.patient-card span{color:#60727f;font-size:12px;font-weight:700}.service-backup-panel{border-top:0;padding-top:0}.patient-search-results,.card-list-items{display:flex;flex-direction:column;gap:8px;max-height:210px;overflow:auto;padding-right:2px}.patient-search-result,.card-list-item{align-items:flex-start;background:#fff;border:1px solid #cad4dc;color:#1f2933;display:flex;flex-direction:column;gap:2px;min-height:54px;padding:8px 10px;text-align:left;width:100%}.patient-search-result.active,.card-list-item.active{background:#eef7f9;border-color:#176b87}.patient-search-result span,.card-list-item span{font-weight:800}.patient-search-result small,.card-list-item small,.list-status{color:#60727f;font-size:12px;font-weight:700}.list-status{margin:0}.list-status.error{color:#9f2f2f}.search-control{position:relative}.search-control svg{color:#60727f;left:10px;pointer-events:none;position:absolute;top:34px}.search-control input{border:1px solid #b9c6cf;border-radius:6px;min-height:40px;padding:8px 10px 8px 34px}.selected-cell-details{background:#eef7f9;border:1px solid #c7e4eb;border-radius:6px;display:flex;flex-direction:column;gap:4px;padding:10px}.selected-cell-details strong{font-size:13px}.selected-cell-details span{color:#60727f;font-size:12px;font-weight:700}.upload-control{align-items:center;background:#176b87;border-radius:6px;color:#fff;cursor:pointer;display:inline-flex;font-size:13px;font-weight:800;justify-content:center;min-height:38px;overflow:hidden;padding:0 12px;position:relative}.upload-control.secondary-upload{background:#fff;border:1px solid #176b87;color:#176b87}.backup-panel summary{align-items:center;color:#52616d;cursor:pointer;display:flex;font-size:13px;font-weight:800;justify-content:space-between;list-style:none;min-height:34px}.backup-panel summary::-webkit-details-marker{display:none}.backup-panel summary:after{content:"+";font-size:18px;line-height:1}.backup-panel[open] summary:after{content:"-"}.backup-panel-body{display:flex;flex-direction:column;gap:10px;padding-top:8px}.upload-control input{top:0;right:0;bottom:0;left:0;opacity:0;position:absolute}.upload-status{color:#287044}.upload-status.error{color:#9f2f2f}.stacked-actions{display:grid;gap:8px}.action-panel{border-top:1px solid #dde4e9;padding-top:18px}.card-preview{min-width:0;overflow-x:auto;padding-bottom:4px}.state{align-items:center;background:#fff;border:1px solid #cad4dc;border-radius:8px;display:flex;min-height:220px;padding:24px}.state.error{border-color:#d15353;color:#9f2f2f}.print-page{background:#fff;border:1px solid #c9d3da;box-sizing:border-box;box-shadow:0 12px 28px #1f29331f;margin:0 auto;min-height:297mm;padding:3mm;width:min(100%,210mm)}.protocol-header{text-align:center}.protocol-header h2{font-size:22px;letter-spacing:0;margin:0 0 6px}.protocol-header p{border-bottom:1px solid #30363d;font-size:15px;margin:0 auto 8px;min-height:20px;padding-bottom:2px;width:78%}.protocol-section{margin-top:8px}.protocol-section h3{font-size:15px;letter-spacing:0;margin:0 0 6px;text-align:center}.photo-grid{display:grid;gap:6px;grid-template-columns:repeat(var(--columns),minmax(0,1fr))}.section-portrait_photos{--photo-aspect-ratio: 1.3}.photo-cell{align-items:center;aspect-ratio:var(--photo-aspect-ratio);background:linear-gradient(135deg,#176b8714,#333d470a),#f8fafb;border:1px solid #9fb0bc;border-radius:4px;color:#6b7c88;min-height:0;padding:0;overflow:hidden;position:relative}.photo-cell:not(:disabled):hover,.photo-cell.active{border-color:#176b87;box-shadow:inset 0 0 0 2px #176b8742}.photo-cell:disabled{cursor:not-allowed}.photo-cell span{align-items:center;border:1px solid #c3d0d8;border-radius:999px;display:inline-flex;font-size:12px;height:24px;justify-content:center;width:24px}.photo-cell img{height:100%;top:0;right:0;bottom:0;left:0;object-fit:cover;position:absolute;width:100%}.viewer-backdrop{align-items:center;background:#111827b8;display:flex;top:0;right:0;bottom:0;left:0;justify-content:center;padding:24px;position:fixed;z-index:20}.viewer{background:#fff;border-radius:8px;display:grid;grid-template-rows:auto 1fr;height:min(92vh,900px);overflow:hidden;width:min(94vw,1200px)}.patient-create-modal{background:#fff;border-radius:8px;display:grid;grid-template-rows:auto 1fr;overflow:hidden;width:min(94vw,440px)}.patient-create-form{padding:18px}.viewer-header{align-items:center;border-bottom:1px solid #dde4e9;display:flex;gap:16px;justify-content:space-between;padding:14px 16px}.viewer-header h2{font-size:18px;margin:0}.viewer-header p{color:#60727f;font-size:12px;font-weight:700;margin:4px 0 0}.viewer-toolbar{display:flex;gap:8px}.viewer-canvas{align-items:flex-start;background:#111827;display:flex;justify-content:center;overflow:auto;padding:24px}.viewer-canvas img{max-height:100%;max-width:100%;transform-origin:top center}.crop-modal{background:#fff;border-radius:8px;display:grid;grid-template-rows:auto 1fr;overflow:hidden;width:min(94vw,920px)}.crop-modal.portrait-crop{--photo-aspect-ratio: 1.3}.crop-workspace{display:grid;gap:18px;grid-template-columns:minmax(0,1fr) 260px;padding:18px}.crop-preview{aspect-ratio:var(--photo-aspect-ratio);background:#111827;border:1px solid #9fb0bc;border-radius:6px;overflow:hidden;position:relative;touch-action:none;-webkit-user-select:none;user-select:none}.crop-base-image{display:block;height:100%;pointer-events:none;width:100%}.crop-image-layer{height:100%;position:absolute;width:100%}.crop-shade{background:#111827a3;pointer-events:none;position:absolute;z-index:1}.crop-box{border:2px solid #ffffff;box-shadow:0 0 0 1px #176b87cc,0 0 18px #00000042;cursor:move;position:absolute;z-index:2}.crop-grid-line{background:#ffffffb8;pointer-events:none;position:absolute}.crop-grid-line.vertical{bottom:0;top:0;width:1px}.crop-grid-line.horizontal{height:1px;left:0;right:0}.crop-grid-line.one{left:33.333%;top:33.333%}.crop-grid-line.two{left:66.666%;top:66.666%}.crop-grid-line.vertical.one,.crop-grid-line.vertical.two{top:0}.crop-grid-line.horizontal.one,.crop-grid-line.horizontal.two{left:0}.crop-handle{background:#fff;border:2px solid #176b87;border-radius:999px;height:14px;min-height:0;padding:0;position:absolute;width:14px}.crop-handle.nw,.crop-handle.se{cursor:nwse-resize}.crop-handle.ne,.crop-handle.sw{cursor:nesw-resize}.crop-handle.nw{left:0;top:0}.crop-handle.ne{right:0;top:0}.crop-handle.se{bottom:0;right:0}.crop-handle.sw{bottom:0;left:0}.crop-actions{display:flex;flex-direction:column;gap:14px}.crop-actions .button-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.crop-actions button{min-width:0;padding:0 10px;white-space:nowrap}@media(max-width:900px){.print-page{min-height:auto;padding:3mm}.viewer-backdrop{padding:10px}.viewer-header{align-items:flex-start;flex-direction:column}.crop-workspace{grid-template-columns:1fr}}@media(min-width:700px){.app-shell{padding:16px}.app-header{padding:0}.sidebar{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}.brand-line,.action-panel,.selected-cell-panel,.backup-panel{grid-column:1 / -1}.patients-page,.service-page{padding:18px}.patients-toolbar{align-items:center;flex-direction:row;justify-content:space-between}.patients-toolbar label{min-width:220px}}@media(min-width:1100px){.app-shell{padding:24px}.workspace{gap:24px;grid-template-columns:minmax(300px,360px) minmax(0,1fr)}.sidebar{display:flex;flex-direction:column;gap:18px;min-height:calc(100vh - 48px);padding:18px}.patient-form h1{font-size:21px}}@media print{@page{margin:3mm;size:A4 portrait}html,body{background:#fff;height:auto;width:100%}.app-shell{padding:0}.app-header,.patients-page,.service-page,.sidebar,.backup-panel{display:none}.workspace{background:transparent;border:0;display:block;margin:0;padding:0}.tab-panel{background:transparent;border:0;margin:0;padding:0}.card-preview{width:100%}.print-page{border:0;box-shadow:none;margin:0;min-height:auto;padding:0;width:100%}.protocol-section{break-inside:avoid}.photo-cell.active{border-color:#9fb0bc;box-shadow:none}}