:root{--font-scale:1;
--ink:#1b2737;
--muted:#737982;
--green:#263a55;
--lime:#cad6e8;
--line:#dde1e6;
--paper:#ffffffc9;
--bg:#eff1f3;
--shadow:0 7px 30px #27344610;
--amber:#a66e27;
--red:#ab4c42;
--blue:#4b7e9c;
font:calc(14px * var(--font-scale))/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Tahoma,sans-serif;
color:var(--ink);
background:var(--bg);
font-synthesis:none;
color-scheme:light}
*{box-sizing:border-box}
body{margin:0;
background:radial-gradient(ellipse at 10% 0%,#d2dbe877,transparent 50%),radial-gradient(ellipse at 100% 70%,#dee4ed77,transparent 50%),var(--bg);
min-height:100vh}
button,input,select,textarea{font:inherit}
button,a{ -webkit-tap-highlight-color:transparent}
button{cursor:pointer}
a{color:var(--green)}
button:disabled{opacity:.5;
cursor:default}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid #8a9bb3;
outline-offset:3px}
svg{width:20px;
height:20px;
fill:none;
stroke:currentColor;
stroke-width:1.7;
stroke-linecap:round;
stroke-linejoin:round;
flex-shrink:0}
h1,h2,h3,p{margin:0}
h1{font-size:calc(30px * var(--font-scale));
font-weight:550;
letter-spacing:-1.1px;
line-height:1.3}
h2{font-size:calc(19px * var(--font-scale));
font-weight:600;
letter-spacing:-.4px}
h3{font-size:calc(15px * var(--font-scale));
font-weight:650}
.eyebrow{text-transform:uppercase;
letter-spacing:2px;
font-size:calc(10px * var(--font-scale));
font-weight:700;
color:var(--muted)}
.muted{color:var(--muted)}
.small{font-size:calc(12px * var(--font-scale))}
.caption{font-size:calc(11px * var(--font-scale));
color:var(--muted)}
.row{display:flex;
align-items:center;
gap:12px}
.between{display:flex;
align-items:center;
justify-content:space-between;
gap:14px}
.stack{display:grid;
gap:16px}
.spaced{margin-top:20px}
.spaced-sm{margin-top:10px}
.btn{border:1px solid transparent;
border-radius:11px;
padding:11px 18px;
min-height:43px;
background:var(--green);
color:white;
display:inline-flex;
align-items:center;
justify-content:center;
gap:9px;
text-decoration:none;
font-size:calc(13px * var(--font-scale));
font-weight:550;
transition:transform .16s,box-shadow .16s,background .16s}
.btn:hover{background:#1d2e45;
box-shadow:0 5px 15px #1c283a18;
transform:translateY(-1px)}
.btn.secondary{background:#fff9;
color:var(--ink);
border-color:var(--line)}
.btn.secondary:hover{background:#fff}
.btn.ghost{background:transparent;
color:var(--green);
border:0;
padding:7px 3px;
box-shadow:none}
.btn.warning{background:#f5ebda;
color:#8c601d}
.btn.danger{background:#f9eae5;
color:var(--red)}
.btn.compact{min-height:32px;
padding:6px 12px;
font-size:calc(12px * var(--font-scale))}
.icon-btn{background:#ffffffa6;
border:1px solid var(--line);
border-radius:50%;
width:40px;
height:40px;
display:grid;
place-items:center;
color:var(--green)}
.card{background:var(--paper);
border:1px solid #ffffffc9;
border-radius:22px;
box-shadow:var(--shadow);
backdrop-filter:blur(22px);
padding:24px}
.pill{display:inline-flex;
align-items:center;
gap:6px;
background:#e7eaef;
color:#4d596b;
border-radius:20px;
padding:5px 10px;
font-size:calc(10px * var(--font-scale));
font-weight:650;
letter-spacing:.3px}
.pill.amber{background:#f9efd9;
color:#99713b}
.pill.blue{background:#e8f1f7;
color:var(--blue)}
.pill.red{background:#f8e7e3;
color:var(--red)}
.dot{width:6px;
height:6px;
border-radius:50%;
background:#7f8ea3;
display:inline-block}
.divider{height:1px;
background:var(--line);
margin:20px 0}
.empty{padding:38px 20px;
text-align:center;
color:var(--muted);
display:grid;
justify-items:center;
gap:12px}
.empty svg{width:32px;
height:32px;
color:#a0a5ad}
.empty strong{color:var(--ink);
font-size:calc(15px * var(--font-scale))}
.field{display:grid;
gap:6px}
.field label{font-size:calc(12px * var(--font-scale));
color:#565e6a;
font-weight:550}
input,select,textarea{width:100%;
border:1px solid var(--line);
border-radius:10px;
padding:11px 12px;
background:#ffffffd9;
color:var(--ink);
outline:none}
input:focus,select:focus,textarea:focus{border-color:#909fb3;
background:#fff}
textarea{resize:vertical;
min-height:100px;
line-height:1.7}
.form-grid{display:grid;
grid-template-columns:1fr 1fr;
gap:15px}
.full{grid-column:1/-1}
.error{padding:11px 14px;
background:#fbece6;
border:1px solid #f2d9d0;
border-radius:10px;
color:#a14d3c;
font-size:calc(12px * var(--font-scale))}
.notice{padding:14px 17px;
background:#eaecf0;
border:1px solid #dadfe6;
border-radius:12px;
font-size:calc(12px * var(--font-scale));
color:#5e6774}
.notice.amber{background:#fbf3e5;
border-color:#f2e4c9;
color:#92733e}
.badge-count{background:#d1dae6;
border-radius:50%;
min-width:20px;
height:20px;
font-size:calc(10px * var(--font-scale));
display:grid;
place-items:center}
.initial-loader{height:100vh;
display:grid;
place-content:center;
justify-items:center;
gap:20px}
.logo-symbol{display:grid;
place-items:center;
background:var(--green);
color:#cfdaea;
width:44px;
height:44px;
border-radius:14px;
font:500 calc(39px * var(--font-scale))/1 Georgia,serif}
.brand-name{font-size:calc(24px * var(--font-scale));
font-weight:700;
letter-spacing:-1.5px}
.brand-name small{font-size:calc(10px * var(--font-scale));
display:block;
letter-spacing:1.8px;
font-weight:500;
color:var(--muted);
text-transform:uppercase;
margin-top:-4px}
/* Login */
.auth-layout{display:grid;
grid-template-columns:1.05fr 1fr;
min-height:100vh;
max-width:1600px;
margin:auto}
.auth-story{padding:48px 60px;
position:relative;
overflow:hidden;
display:flex;
flex-direction:column}
.auth-story .brand{position:relative;
z-index:1}
.auth-heading{margin-top:70px;
position:relative;
z-index:1}
.auth-heading h1{font:400 clamp(38px,3.9vw,60px)/1.14 Georgia,"Times New Roman",serif;
letter-spacing:-2px;
max-width:470px}
.auth-heading p{margin-top:18px;
font-size:calc(14px * var(--font-scale));
max-width:350px;
color:#7a828d;
line-height:1.8}
.auth-art{height:390px;
position:relative;
flex:1;
min-height:250px}
.auth-art canvas{width:100%;
height:100%}
.auth-footer{font-size:calc(11px * var(--font-scale));
color:var(--muted);
display:flex;
gap:24px;
align-items:center;
position:relative}
.auth-form-side{display:flex;
align-items:center;
justify-content:center;
padding:50px 40px}
.auth-card{width:min(450px,100%);
padding:34px;
background:#ffffffbc;
border:1px solid #fff;
border-radius:26px;
box-shadow:0 25px 70px #3a46570b;
backdrop-filter:blur(25px)}
.auth-card h2{font-size:calc(26px * var(--font-scale));
letter-spacing:-.8px}
.auth-card .auth-description{font-size:calc(13px * var(--font-scale));
color:var(--muted);
margin-top:8px}
.role-tabs{display:flex;
gap:4px;
border:1px solid var(--line);
border-radius:12px;
padding:4px;
margin:23px 0;
background:#eeeff1}
.role-tabs button{flex:1;
border:0;
background:transparent;
color:var(--muted);
padding:9px;
border-radius:8px;
font-size:calc(12px * var(--font-scale))}
.role-tabs button.active{background:white;
color:var(--green);
box-shadow:0 2px 8px #151c260c}
.auth-card form{display:grid;
gap:15px}
.auth-card .btn{width:100%}
.auth-switch{font-size:calc(12px * var(--font-scale));
text-align:center;
margin-top:20px;
color:var(--muted)}
.text-button{background:none;
border:0;
padding:0;
color:var(--green);
font:inherit;
cursor:pointer;
text-decoration:underline;
text-underline-offset:3px}
.demo-area{margin-top:22px;
padding-top:18px;
border-top:1px solid var(--line);
text-align:center}
.demo-area .demo-buttons{display:flex;
gap:8px;
margin-top:10px}
.demo-area .btn{font-size:calc(11px * var(--font-scale));
min-height:35px;
padding:7px}
.captcha{background:#f0f2f5;
padding:12px;
border-radius:10px;
display:grid;
grid-template-columns:auto 1fr;
align-items:center;
gap:14px}
.captcha strong{font-size:calc(18px * var(--font-scale));
letter-spacing:3px}
.captcha input{padding:8px}
.registration{max-width:590px;
width:100%}
.registration .auth-card{width:100%}
/* App shell */
.shell{display:grid;
grid-template-columns:226px 1fr;
max-width:1800px;
margin:auto;
min-height:100vh}
.sidebar{height:100vh;
position:sticky;
top:0;
padding:32px 22px 22px;
border-right:1px solid #dee2e799;
display:flex;
flex-direction:column;
background:#f2f4f774;
backdrop-filter:blur(20px)}
.brand{display:flex;
align-items:center;
gap:11px}
.sidebar .brand{padding:0 8px 35px}
.nav-label{font-size:calc(9px * var(--font-scale));
text-transform:uppercase;
letter-spacing:1.7px;
color:#9ca1a7;
margin:8px 14px 14px}
.nav-list{display:grid;
gap:6px}
.nav-item{border:0;
background:transparent;
display:flex;
align-items:center;
gap:12px;
padding:12px 14px;
border-radius:12px;
color:#798089;
font-size:calc(12px * var(--font-scale));
text-align:left;
width:100%;
transition:.18s}
.nav-item svg{width:18px;
height:18px}
.nav-item.active{background:#d8dfe8;
color:#2d3a4c;
font-weight:650}
.nav-item:hover{background:#e2e6ec}
.sidebar-bottom{margin-top:auto}
.private-badge{display:flex;
gap:10px;
padding:16px 12px;
font-size:calc(11px * var(--font-scale));
color:#818891}
.private-badge svg{width:16px}
.sidebar .account{border-top:1px solid var(--line);
padding-top:19px;
display:flex;
align-items:center;
gap:10px}
.avatar{width:35px;
height:35px;
border-radius:50%;
background:#dfe3e9;
display:grid;
place-items:center;
font-size:calc(12px * var(--font-scale));
color:#6f7782;
flex-shrink:0}
.account .name{font-size:calc(11px * var(--font-scale));
font-weight:650}
.account .role{font-size:calc(9px * var(--font-scale));
text-transform:capitalize;
color:var(--muted)}
.main{min-width:0;
padding:25px 35px 45px}
.topbar{display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:30px}
.crumb{font-size:calc(11px * var(--font-scale));
color:#a3a7ad}
.crumb strong{font-weight:500;
color:#707780}
.top-actions{display:flex;
gap:10px;
align-items:center}
.top-date{font-size:calc(11px * var(--font-scale));
color:#838a93;
margin-right:12px}
.mobile-brand{display:none}
.page-heading{margin-bottom:25px}
.page-heading p{color:var(--muted);
font-size:calc(12px * var(--font-scale));
margin-top:7px}
.greeting{font-size:calc(30px * var(--font-scale));
font-weight:500;
letter-spacing:-1.2px}
.greeting em{font-family:Georgia,serif;
font-weight:400}
.dashboard-grid{display:grid;
grid-template-columns:minmax(0,1.53fr) minmax(280px,1fr);
gap:20px}
.main-col,.side-col{display:grid;
align-content:start;
gap:20px}
.overview-card{padding:26px 28px;
background:linear-gradient(135deg,#f0f3f8dc,#e7ebf0d9);
position:relative;
min-height:330px;
overflow:hidden}
.overview-copy{max-width:57%;
position:relative;
z-index:1}
.overview-copy h2{font:400 calc(31px * var(--font-scale))/1.2 Georgia,serif;
letter-spacing:-1px;
margin-top:19px}
.overview-copy p{color:#7e858f;
font-size:calc(12px * var(--font-scale));
line-height:1.8;
margin-top:13px}
.overview-copy .btn{margin-top:23px}
.overview-human{position:absolute;
right:0;
top:0;
width:48%;
height:100%}
.overview-human canvas{width:100%;
height:100%}
.human-tag{position:absolute;
bottom:17px;
right:25px;
border:1px solid #c6cdd6;
background:#f4f6fabd;
border-radius:7px;
padding:5px 9px;
font:calc(9px * var(--font-scale))/1.5 ui-monospace,Consolas,monospace;
color:#788290;
letter-spacing:.7px}
.profile-strip{margin-top:20px;
padding-top:18px;
border-top:1px solid #ccd4df;
display:flex;
gap:25px;
font-size:calc(10px * var(--font-scale));
color:#929aa5;
position:relative;
z-index:1}
.profile-strip strong{display:block;
color:#626d7c;
font-size:calc(12px * var(--font-scale));
font-weight:550;
margin-top:3px}
.stats{display:grid;
grid-template-columns:repeat(3,1fr);
gap:12px}
.stat{padding:19px 18px;
min-width:0}
.stat .stat-icon{width:30px;
height:30px;
border-radius:9px;
background:#e9ecf1;
display:grid;
place-items:center;
margin-bottom:13px;
color:#818fa3}
.stat .stat-icon svg{width:16px;
height:16px}
.stat strong{display:block;
font-size:calc(24px * var(--font-scale));
letter-spacing:-.8px;
font-weight:500;
margin-top:7px}
.stat .stat-label{font-size:calc(10px * var(--font-scale));
color:#8c929a}
.stat small{font-size:calc(10px * var(--font-scale));
color:#9ca2aa}
.section-heading{display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:20px}
.section-heading h2{font-size:calc(15px * var(--font-scale))}
.section-heading .btn{font-size:calc(10px * var(--font-scale))}
.timeline{position:relative;
display:grid;
gap:0}
.timeline-item{display:grid;
grid-template-columns:31px 1fr;
gap:11px;
padding-bottom:21px;
position:relative}
.timeline-item:not(:last-child):before{content:"";
position:absolute;
left:14px;
top:29px;
bottom:0;
width:1px;
background:#dfe3e8}
.timeline-icon{width:29px;
height:29px;
border-radius:50%;
background:#e9edf2;
display:grid;
place-items:center;
color:#7e8ea5}
.timeline-icon svg{width:13px;
height:13px}
.timeline-item h3{font-size:calc(12px * var(--font-scale));
font-weight:550}
.timeline-item p{font-size:calc(11px * var(--font-scale));
color:#91979f;
margin-top:4px}
.timeline-item .timeline-date{font-size:calc(9px * var(--font-scale));
color:#a6abb2;
margin-top:7px}
.next-card{background:linear-gradient(120deg,#f5f7faec,#eaeef4f0)}
.next-card .next-date{display:flex;
gap:13px;
align-items:center;
margin:20px 0}
.date-square{width:50px;
height:56px;
border-radius:12px;
background:#dce2eb;
text-align:center;
padding-top:4px;
color:#677385;
font-size:calc(10px * var(--font-scale))}
.date-square strong{display:block;
font-size:calc(23px * var(--font-scale));
font-weight:500;
line-height:1.2}
.next-card h3{font-size:calc(12px * var(--font-scale))}
.next-card p{font-size:calc(10px * var(--font-scale));
color:#88919d;
margin-top:5px}
.calendar-head{display:flex;
justify-content:space-between;
align-items:center;
margin:10px 0 16px}
.calendar-head strong{font-size:calc(13px * var(--font-scale));
font-weight:550}
.calendar-head button{border:0;
background:none;
color:#727b87;
padding:4px}
.calendar-head svg{width:14px;
height:14px}
.calendar-grid{display:grid;
grid-template-columns:repeat(7,1fr);
gap:5px;
text-align:center}
.weekday{font-size:calc(8px * var(--font-scale));
color:#a6acb4;
padding-bottom:8px}
.calendar-day{border:0;
background:transparent;
border-radius:9px;
font-size:calc(10px * var(--font-scale));
color:#989fa8;
min-height:28px;
position:relative;
padding:4px}
.calendar-day.today{background:#394659;
color:white}
.calendar-day.event:after{content:"";
position:absolute;
bottom:2px;
left:calc(50% - 2px);
width:4px;
height:4px;
border-radius:50%;
background:#a1aec1}
.calendar-day.faded{opacity:.25}
.calendar-day:hover{background:#d9dfe8;
color:#394659}
.alert-item{display:flex;
gap:11px;
padding:13px 0;
border-bottom:1px solid #e6e8ec}
.alert-item:last-child{border:0;
padding-bottom:0}
.alert-icon{width:28px;
height:28px;
border-radius:9px;
background:#f3eedd;
color:#b49b68;
display:grid;
place-items:center;
flex-shrink:0}
.alert-icon svg{width:14px;
height:14px}
.alert-item h3{font-size:calc(11px * var(--font-scale));
font-weight:550}
.alert-item p{font-size:calc(10px * var(--font-scale));
color:#9299a4;
margin-top:4px}
.mini-panel{padding:15px 17px;
border:1px solid var(--line);
border-radius:12px;
background:#f8fafc;
display:flex;
gap:12px;
align-items:center}
.mini-panel .avatar{width:30px;
height:30px}
.patient-id{font:11px ui-monospace,Consolas,monospace;
letter-spacing:1px;
border:1px solid #d0d6df;
border-radius:7px;
background:#f5f7fa;
padding:7px 11px;
color:#717c8c}
.subhead{margin:25px 0 15px;
font-size:calc(14px * var(--font-scale))}
.two-col{display:grid;
grid-template-columns:1fr 1fr;
gap:20px}
.page-card{max-width:1000px}
.report-row{display:flex;
align-items:center;
gap:16px;
padding:18px 0;
border-bottom:1px solid var(--line)}
.report-row:last-child{border-bottom:0}
.report-icon{width:42px;
height:46px;
border-radius:12px;
background:#e4e8ee;
display:grid;
place-items:center;
color:#7d8a9d;
flex-shrink:0}
.report-row .report-info{flex:1}
.report-row h3{font-size:calc(13px * var(--font-scale))}
.report-row p{font-size:calc(11px * var(--font-scale));
color:var(--muted);
margin-top:4px}
.report-row .btn{flex-shrink:0}
.data-table-wrap{overflow:auto}
.data-table{width:100%;
border-collapse:collapse;
font-size:calc(12px * var(--font-scale));
text-align:left}
.data-table th{font-size:calc(10px * var(--font-scale));
text-transform:uppercase;
letter-spacing:.7px;
color:#8d929a;
font-weight:550;
padding:12px;
border-bottom:1px solid var(--line);
white-space:nowrap}
.data-table td{padding:14px 12px;
border-bottom:1px solid #e3e7ec;
vertical-align:top}
.data-table tr:last-child td{border-bottom:0}
.data-table td:first-child{font-weight:550}
.metric-number{font-variant-numeric:tabular-nums}
.score-track{height:5px;
background:#e0e5ec;
border-radius:10px;
overflow:hidden;
margin-top:6px}
.score-track span{display:block;
height:100%;
background:#90a0b6;
border-radius:10px}
.summary-box{background:#eaeef4;
border-radius:14px;
padding:18px;
font-size:calc(12px * var(--font-scale));
color:#646f7e;
line-height:1.9}
.answer-group{border:1px solid var(--line);
border-radius:12px;
padding:14px 17px;
margin-top:12px}
.answer-group summary{cursor:pointer;
font-weight:550;
font-size:calc(12px * var(--font-scale))}
.answer-row{display:grid;
grid-template-columns:1fr 80px;
gap:20px;
padding:11px 0;
border-bottom:1px solid #e3e7ed;
font-size:calc(12px * var(--font-scale))}
.answer-row:last-child{border:0}
.answer-row [dir=auto]{font-family:Tahoma,system-ui,sans-serif;
line-height:1.9}
.answer-value{font-size:calc(10px * var(--font-scale));
color:#68768a;
text-align:right}
.review-list{display:flex;
gap:8px;
flex-wrap:wrap;
margin-top:12px}
.stepper{display:flex;
gap:5px;
margin-bottom:26px}
.stepper span{height:4px;
flex:1;
background:#dbe0e7;
border-radius:10px}
.stepper span.active{background:#65768f}
.survey-card{max-width:900px;
margin:auto}
.question{padding:24px 0;
border-bottom:1px solid var(--line)}
.question:last-child{border-bottom:0}
.question-text{font:calc(14px * var(--font-scale))/2 Tahoma,system-ui,sans-serif;
white-space:normal}
.question-number{font:calc(10px * var(--font-scale))/1.5 ui-monospace,monospace;
color:#9ea7b3;
margin-bottom:10px}
.answer-options{display:flex;
gap:8px;
margin-top:17px}
.answer-option{flex:1;
position:relative}
.answer-option input{position:absolute;
opacity:0;
pointer-events:none}
.answer-option span{display:block;
text-align:center;
border:1px solid var(--line);
border-radius:9px;
padding:9px;
font-size:calc(12px * var(--font-scale));
color:#808a97;
cursor:pointer}
.answer-option input:checked+span{background:#dbe1ea;
color:#404e62;
border-color:#909eb2;
font-weight:650}
.answer-option input:focus-visible+span{outline:3px solid #8a9bb3}
.question-image{max-width:100%;
max-height:300px;
object-fit:contain;
border-radius:10px;
margin-top:15px}
.survey-actions{position:sticky;
bottom:15px;
background:#f8fafde8;
backdrop-filter:blur(20px);
border:1px solid #e1e5eb;
border-radius:15px;
padding:15px 19px;
display:flex;
justify-content:space-between;
align-items:center;
gap:10px;
box-shadow:var(--shadow);
margin-top:20px}
.survey-progress{font-size:calc(11px * var(--font-scale));
color:#838d9a}
.batch-options{display:flex;
gap:10px;
flex-wrap:wrap;
margin:22px 0}
.batch-option{border:1px solid var(--line);
border-radius:12px;
padding:15px 22px;
background:#fff;
color:#707c8d}
.batch-option.active{border-color:#8393aa;
background:#e3e8ee;
color:#404d5f}
.batch-option strong{font-size:calc(23px * var(--font-scale));
display:block}
.batch-option small{font-size:calc(10px * var(--font-scale))}
.profile-facts{display:grid;
grid-template-columns:repeat(3,1fr);
gap:15px;
padding:18px;
background:#eff1f5;
border-radius:13px;
margin:20px 0}
.profile-facts small{display:block;
color:#949ca8;
font-size:calc(10px * var(--font-scale))}
.profile-facts strong{font-size:calc(12px * var(--font-scale));
font-weight:550}
.upload-zone{padding:30px;
border:1px dashed #b3bcc9;
border-radius:15px;
background:#f2f5f9;
text-align:center;
display:grid;
justify-items:center;
gap:12px;
color:#7f8b9b}
.upload-zone input{max-width:320px;
background:white}
.upload-zone svg{width:32px;
height:32px}
.account-card{max-width:720px}
.segmented{display:flex;
gap:4px;
padding:4px;
background:#e3e7ed;
border-radius:10px}
.segmented button{border:0;
background:none;
color:#7e8794;
padding:8px 15px;
border-radius:7px;
font-size:calc(12px * var(--font-scale))}
.segmented button.active{background:white;
color:var(--green);
box-shadow:0 2px 8px #232b3710}
.patient-grid{display:grid;
grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
gap:18px}
.patient-card{padding:22px}
.patient-card h3{font-size:calc(16px * var(--font-scale));
margin:14px 0 4px}
.patient-card .btn{width:100%;
margin-top:18px}
.admin-grid{display:grid;
grid-template-columns:repeat(4,1fr);
gap:15px}
.settings-group{margin-bottom:20px}
.settings-fields{display:grid;
grid-template-columns:1fr 1fr;
gap:18px;
margin-top:20px}
.setting{border-bottom:1px solid #dde2e8;
padding-bottom:16px}
.setting label{font-size:calc(12px * var(--font-scale));
font-weight:550;
display:block;
margin-bottom:5px}
.setting input{max-width:180px;
margin-top:10px}
.setting p{color:var(--muted);
font-size:calc(11px * var(--font-scale))}
.setting small{display:block;
font-size:calc(10px * var(--font-scale));
color:#959eab;
margin-top:5px}
.code{font:calc(11px * var(--font-scale))/1.8 ui-monospace,Consolas,monospace;
white-space:pre-wrap;
background:#ebeef3;
border-radius:10px;
padding:15px;
overflow:auto}
.page-toolbar{display:flex;
gap:10px;
align-items:center;
flex-wrap:wrap;
margin-bottom:20px}
.page-toolbar input{width:260px}
.wide-cell{max-width:350px;
min-width:240px;
font:calc(12px * var(--font-scale))/1.8 Tahoma,sans-serif}
.pager{display:flex;
justify-content:space-between;
align-items:center;
margin-top:20px}
.profile-layout{display:grid;
grid-template-columns:1fr 240px;
gap:20px}
.human-small{height:280px;
position:relative}
.human-small canvas{width:100%;
height:100%}
dialog{border:1px solid #ffffffb0;
border-radius:24px;
padding:0;
max-width:900px;
width:92vw;
max-height:90vh;
background:#f6f8fa;
color:var(--ink);
box-shadow:0 30px 100px #18222f30;
backdrop-filter:blur(25px)}
dialog::backdrop{background:#1c273750;
backdrop-filter:blur(5px)}
.modal-head{display:flex;
justify-content:space-between;
gap:15px;
align-items:center;
padding:24px 28px;
border-bottom:1px solid var(--line)}
.modal-head h2{font-size:calc(19px * var(--font-scale))}
.modal-body{padding:26px 28px;
max-height:70vh;
overflow:auto}
.modal-footer{padding:18px 28px;
border-top:1px solid var(--line);
display:flex;
justify-content:flex-end;
gap:10px}
.print-subtitle{font-size:calc(11px * var(--font-scale));
color:var(--muted);
margin-top:6px}
#toast{position:fixed;
bottom:24px;
left:50%;
transform:translateX(-50%) translateY(30px);
background:#283548;
color:white;
padding:12px 22px;
border-radius:13px;
font-size:calc(12px * var(--font-scale));
opacity:0;
pointer-events:none;
z-index:100;
transition:.2s;
max-width:90vw;
box-shadow:0 10px 40px #16202d20}
#toast.show{opacity:1;
transform:translateX(-50%) translateY(0)}
#print-area{display:none}
.fade-in{animation:fade-in .3s ease}
@keyframes fade-in{from{opacity:0;
transform:translateY(5px)}
to{opacity:1;
transform:translateY(0)}
}
.mobile-nav{display:none}
@media(min-width:1500px){.main{padding-left:48px;
padding-right:48px}
.dashboard-grid{gap:24px}
.overview-card{min-height:360px}
.card{padding:27px}
.overview-copy h2{font-size:calc(36px * var(--font-scale))}
}
@media(max-width:1150px){.shell{grid-template-columns:190px 1fr}
.sidebar{padding:28px 14px}
.main{padding:23px}
.dashboard-grid{grid-template-columns:1.35fr 1fr;
gap:15px}
.card{padding:20px}
.overview-card{padding:22px;
min-height:335px}
.overview-copy h2{font-size:calc(28px * var(--font-scale))}
.overview-copy{max-width:64%}
.overview-human{width:42%;
right:-5px}
.profile-strip{gap:15px}
.stat{padding:16px}
.stats{gap:9px}
.auth-story{padding:40px}
.auth-form-side{padding:30px}
.admin-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){.dashboard-grid{grid-template-columns:1fr}
.side-col{grid-template-columns:1fr 1fr}
.side-col .card:last-child{grid-column:1/-1}
.overview-card{min-height:320px}
.overview-copy{max-width:55%}
.overview-human{width:45%}
.two-col{grid-template-columns:1fr}
.auth-story{padding:30px}
.auth-heading{margin-top:50px}
.auth-heading h1{font-size:calc(42px * var(--font-scale))}
.auth-form-side{padding:25px}
.auth-card{padding:26px}
.profile-layout{grid-template-columns:1fr}
.human-small{height:220px}
}
@media(max-width:650px){h1,.greeting{font-size:calc(26px * var(--font-scale))}
.shell{display:block}
.sidebar{display:none}
.main{padding:18px 17px 105px}
.topbar{margin-bottom:25px}
.crumb{display:none}
.mobile-brand{display:flex}
.mobile-brand .logo-symbol{width:30px;
height:30px;
border-radius:10px;
font-size:calc(28px * var(--font-scale))}
.mobile-brand .brand-name{font-size:calc(22px * var(--font-scale))}
.mobile-brand small{display:none}
.top-date{display:none}
.top-actions{gap:7px}
.top-actions .icon-btn{width:35px;
height:35px}
.page-heading{margin-bottom:20px}
.page-heading.between{align-items:start;
flex-wrap:wrap}
.card{border-radius:20px;
padding:20px}
.dashboard-grid{gap:15px}
.main-col,.side-col{gap:15px}
.side-col{grid-template-columns:1fr}
.side-col .card:last-child{grid-column:auto}
.overview-card{padding:22px;
min-height:330px}
.overview-copy h2{font-size:calc(29px * var(--font-scale))}
.overview-copy p{font-size:calc(11px * var(--font-scale))}
.overview-copy{max-width:63%}
.overview-human{width:43%;
right:-7px}
.overview-copy .btn{font-size:calc(11px * var(--font-scale));
padding:10px 12px}
.human-tag{font-size:calc(7px * var(--font-scale));
right:10px;
bottom:20px}
.profile-strip{font-size:calc(9px * var(--font-scale));
gap:17px}
.profile-strip strong{font-size:calc(10px * var(--font-scale))}
.stats{gap:9px}
.stat{padding:15px 12px;
border-radius:16px}
.stat strong{font-size:calc(20px * var(--font-scale))}
.stat .stat-label{font-size:calc(9px * var(--font-scale))}
.stat small{font-size:calc(8px * var(--font-scale))}
.stat .stat-icon{margin-bottom:10px}
.mobile-nav{display:flex;
position:fixed;
bottom:10px;
left:10px;
right:10px;
z-index:20;
border:1px solid #fff7;
border-radius:22px;
padding:8px 6px max(8px,env(safe-area-inset-bottom));
background:#f3f6fbe6;
backdrop-filter:blur(30px);
box-shadow:0 8px 40px #1c242f26;
justify-content:space-around;
gap:2px}
.mobile-nav button{border:0;
background:none;
display:grid;
justify-items:center;
gap:3px;
min-width:48px;
padding:5px 8px;
border-radius:13px;
color:#8f97a2;
font-size:calc(8px * var(--font-scale))}
.mobile-nav button.active{color:#3d4c60;
background:#dde3ec}
.mobile-nav svg{width:18px;
height:18px}
.form-grid{grid-template-columns:1fr}
.full{grid-column:auto}
.auth-layout{display:block}
.auth-story{padding:24px 25px 0}
.auth-heading{margin-top:30px}
.auth-heading h1{font-size:calc(34px * var(--font-scale));
max-width:350px}
.auth-heading p{font-size:calc(12px * var(--font-scale));
margin-top:12px}
.auth-art{display:none}
.auth-footer{display:none}
.auth-form-side{padding:25px 18px}
.auth-card{max-width:480px;
width:100%;
padding:25px}
.auth-card h2{font-size:calc(23px * var(--font-scale))}
.auth-story .brand-name{font-size:calc(23px * var(--font-scale))}
.auth-story .logo-symbol{width:35px;
height:35px;
font-size:calc(32px * var(--font-scale))}
.auth-layout.registering .auth-heading{display:none}
.report-row{gap:11px}
.report-row p{font-size:calc(10px * var(--font-scale))}
.report-row .btn{padding:6px 11px;
font-size:calc(10px * var(--font-scale))}
.report-row .pill{display:none}
.settings-fields{grid-template-columns:1fr}
.admin-grid{grid-template-columns:1fr 1fr;
gap:10px}
.admin-grid .card{padding:17px}
.page-toolbar input{width:100%}
.page-toolbar .btn{flex:1}
.data-table td,.data-table th{padding:11px 8px;
font-size:calc(10px * var(--font-scale))}
.modal-head{padding:19px 20px}
.modal-body{padding:20px}
.modal-footer{padding:15px 20px}
.answer-options{gap:6px}
.answer-option span{padding:10px 4px;
font-size:calc(11px * var(--font-scale))}
.survey-actions{bottom:85px;
padding:12px}
.survey-actions .btn{padding:9px 12px;
font-size:calc(11px * var(--font-scale))}
.profile-facts{gap:12px;
padding:14px}
.profile-facts strong{font-size:calc(10px * var(--font-scale))}
.profile-facts small{font-size:calc(9px * var(--font-scale))}
.patient-id{font-size:calc(9px * var(--font-scale))}
.batch-option{padding:13px 18px}
.batch-option strong{font-size:calc(21px * var(--font-scale))}
.answer-row{grid-template-columns:1fr 65px;
gap:10px}
.answer-row [dir=auto]{font-size:calc(11px * var(--font-scale))}
.page-heading .btn{font-size:calc(11px * var(--font-scale))}
.top-actions .avatar{width:32px;
height:32px}
.calendar-day{min-height:32px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;
transition:none!important;
scroll-behavior:auto!important}
}
@media print{@page{margin:15mm}
body{background:#fff}
body>#app,body>#toast,body>dialog{display:none!important}
body>#print-area{display:block!important;
color:#1b2737;
background:#fff}
.print-report{font:11pt/1.7 Tahoma,system-ui,sans-serif}
.print-report h1{font-size:24pt}
.print-report .data-table{font-size:9pt}
.print-report .no-print{display:none}
.print-report details{display:block}
.print-report details>summary{font-weight:bold}
.print-report .answer-group{break-inside:avoid;
border:0;
padding:12px 0}
.print-report .answer-row{font-size:9pt}
.print-report .pill{border:1px solid #ddd}
.print-report .summary-box{background:#f2f4f6}
.print-report h2{margin:20px 0 10px}
.print-report .btn{display:none}
.print-report .card{box-shadow:none;
backdrop-filter:none;
border:0}
}
.flip{transform:rotate(180deg)}
@media(max-width:650px){.mobile-nav button{min-width:0;
flex:1;
padding:5px 4px}
.mobile-nav{gap:0}
}

/* A calm blue/slate palette, warm paper and accessible contrast. */
:root{--ink:#1c2b43;--muted:#596b82;--green:#315f9a;--lime:#dce8f7;--line:#d9e1ec;--paper:#ffffffed;--bg:#f1f3f7;--shadow:0 8px 32px #1c35560a;--red:#b62c45;--blue:#315f9a;--amber:#936318}
body{background:radial-gradient(ellipse at 5% 0%,#e4ebf7 0,transparent 55%),radial-gradient(ellipse at 100% 85%,#f3ece4 0,transparent 45%),var(--bg)}
.btn{font-weight:600;background:var(--green)}
.btn:hover{background:#244a7c;box-shadow:0 6px 18px #244a7c20}
.btn.secondary{background:#fff;color:var(--ink);border-color:var(--line)}
.btn.secondary:hover{background:#f3f6fb}
.btn.ghost{color:#315f9a;background:transparent}
.btn.danger{color:#a62239;background:#fbe9ed}
.btn.warning{color:#79500e;background:#fbf1de}
.card{border-color:#ffffff;box-shadow:var(--shadow)}
.sidebar{background:#f7f9fce0;border-inline-end:1px solid var(--line);border-right:0}
.nav-item{color:#596b82;text-align:start}
.nav-item.active,.mobile-nav button.active{background:#dfe9f7;color:#254d82}
.nav-item:hover{background:#e8eef7}
.nav-label{color:#68788e}
.logo-symbol{background:#294c7c;color:#f6f3ed}
.brand-name small,.crumb,.crumb strong,.top-date,.private-badge{color:#607087}
.overview-card{background:linear-gradient(125deg,#f9fbff,#e8eff9);min-height:370px}
.overview-copy{max-width:55%}
.overview-copy p,.auth-heading p{color:#566982}
.overview-human{width:47%;right:0;top:0;height:calc(100% - 72px)}
.human-tag{bottom:65px;right:14px;background:#f8fbffdb;border-color:#d5e0ee;color:#61728c;z-index:2;pointer-events:none}
.profile-strip{border-color:#d5dfed;color:#65748a;margin-top:25px;gap:24px}
.profile-strip strong{color:#334d70}
.overview-copy .pill{background:#e0e9f8;color:#315a8e}
.dot{background:#5a80b1}
.next-card{background:linear-gradient(125deg,#fffdfa,#f5efe7)}
.next-card p,.stat .stat-label,.stat small,.timeline-item p,.timeline-item .timeline-date,.alert-item p,.profile-facts small{color:#65748a}
.date-square{color:#775d3c;background:#eee5d9}
.stat .stat-icon,.timeline-icon{color:#5076a3;background:#eaf0f9}
.avatar{color:#3c608e;background:#e2eaf5}
.pill{background:#e9eff9;color:#385c8d;font-size:calc(11px * var(--font-scale))}
.pill.amber{background:#fbf0d9;color:#805a16}
.pill.red{background:#fbe7ec;color:#a8263e}
.pill.blue{background:#e5eefb;color:#315f9a}
.field label{color:#435773}
.notice{background:#edf3fd;border-color:#d7e3f6;color:#3d5678}
.notice.amber{background:#fcf3e1;color:#7a5a22;border-color:#eeddbb}
.error{background:#fff0f2;color:#a8263e;border-color:#f2cfd7}
.empty{color:#61718a}.empty svg{color:#7c8da5}
.calendar-day,.weekday{color:#61718a}
.calendar-day.today{background:#315f9a;color:white}
.calendar-day:hover{background:#e1eafa;color:#2d517f}
.calendar-day.event:after{background:#b17335}
.mini-panel{background:#f7f9fc}.patient-id{background:#f4f7fd;border-color:#d5e0ee;color:#385c8d}
.summary-box{background:#edf2fa;color:#3e5779}
.data-table th{color:#596b82}.data-table td{border-color:var(--line)}
.score-track{background:#e2e9f2}.score-track span{background:#658ac1}
.stepper span{background:#dce5f1}.stepper span.active{background:#4c77b0}
.question-number,.survey-progress{color:#5c6e89}
.answer-options{gap:12px}
.answer-option span{color:#4d607d;border-color:#cdd8e8;background:#fff;min-height:44px;display:grid;place-items:center;transition:background .16s,border-color .16s,box-shadow .16s}
.answer-option:hover span{border-color:#8aa5c9;background:#f5f8fd}
.answer-option input:checked+span{background:#e2ecfc;color:#264f85;border-color:#7597c8;box-shadow:0 0 0 1px #7597c8;font-weight:700}
.answer-option input[value="Yes"]:checked+span{background:#fde9ed;color:#a31c39;border-color:#d87789;box-shadow:0 0 0 1px #d87789}
.answer-option input[value="No"]:checked+span{background:#e9f1fe;color:#24528c;border-color:#7d9fcd;box-shadow:0 0 0 1px #7d9fcd}
.answer-option input[value="Not sure"]:checked+span,.answer-option input[value="Unknown"]:checked+span,.answer-option input[value="unknown"]:checked+span{background:#fff3d9;color:#80590f;border-color:#d2ad61;box-shadow:0 0 0 1px #d2ad61}
.answer-Yes,.answer-yes{color:#b11e3b!important;background:#ffedf1;border:1px solid #f0c8d1}
.answer-No,.answer-no{color:#27578f!important;background:#eaf2ff;border:1px solid #ccdcf1}
.answer-unknown,.answer-Unknown,.answer-not-sure{color:#815b13!important;background:#fff3dc;border:1px solid #ecd9ae}
.answer-value[class*="answer-"]{display:inline-flex;justify-content:center;align-items:center;padding:3px 8px;border-radius:6px;font-weight:650;white-space:nowrap;justify-self:end}
.answer-guide{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:22px 0}
.answer-guide>div,.answer-guide>section{padding:16px;border:1px solid var(--line);background:#f7f9fd;border-radius:12px}
.answer-guide strong{display:block;margin-bottom:6px;font-size:calc(14px * var(--font-scale))}
.answer-guide p{font-size:calc(12px * var(--font-scale));color:var(--muted);line-height:1.7}
.survey-actions{background:#fcfdffee;border-color:#dce5f2;z-index:8;flex-wrap:wrap}
.save-status{font-size:calc(11px * var(--font-scale));color:#456b99;display:inline-flex;align-items:center;gap:6px;min-height:22px;line-height:1.5}
.save-status.error,.save-status[data-status="error"]{color:#a8263e;background:#fff0f3;padding:5px 9px;border-radius:6px}
.save-status.saving{color:#805f27}
.batch-slider{padding:22px 24px;border:1px solid #d8e3f1;border-radius:18px;background:linear-gradient(120deg,#f4f8ff,#fff);margin:22px 0}
.batch-slider label{display:flex;align-items:center;justify-content:space-between;gap:20px;color:#435b7b;font-weight:600}
.batch-slider output{font-size:calc(32px * var(--font-scale));font-weight:650;letter-spacing:-1px;color:#315f9a;font-variant-numeric:tabular-nums}
.batch-slider input[type=range]{width:100%;height:30px;margin:15px 0 8px;padding:0;border:0;background:transparent;cursor:pointer;accent-color:#315f9a;appearance:none;-webkit-appearance:none}
.batch-slider input[type=range]::-webkit-slider-runnable-track{height:8px;background:linear-gradient(to right,#5b83ba,#d3e1f5);border-radius:10px}
.batch-slider input[type=range]::-moz-range-track{height:8px;background:#d3e1f5;border-radius:10px}
.batch-slider input[type=range]::-moz-range-progress{height:8px;background:#5b83ba;border-radius:10px}
.batch-slider input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:26px;height:26px;margin-top:-9px;border-radius:50%;background:#315f9a;border:4px solid #fff;box-shadow:0 2px 8px #315f9a45;transition:transform .12s}
.batch-slider input[type=range]::-moz-range-thumb{width:19px;height:19px;border-radius:50%;background:#315f9a;border:4px solid white;box-shadow:0 2px 8px #315f9a45}
.batch-slider input[type=range]:active::-webkit-slider-thumb{transform:scale(1.12)}
.slider-scale,.batch-slider .between{display:flex;justify-content:space-between;color:#62758f;font-size:calc(11px * var(--font-scale));font-variant-numeric:tabular-nums}
.profile-facts{background:#edf2f9}.upload-zone{background:#f7f9fd;border-color:#afc1dd;color:#56708f}
.segmented,.role-tabs{background:#e9eef7}.segmented button,.role-tabs button{color:#5d708c}
.segmented button.active,.role-tabs button.active{color:#315f9a}
.captcha{background:#eef2f9}.code{background:#edf2f9;color:#3c5373}
dialog{background:#f9fbff;box-shadow:0 30px 100px #172d4f38}
dialog::backdrop{background:#172d4f66}
#toast{background:#253e62;color:#fff;box-shadow:0 10px 40px #172d4f24}
.mobile-nav{background:#f8fbffed;border-color:#ffffffd9;box-shadow:0 8px 40px #253e6220}
.mobile-nav button{color:#637793}
.language-toggle{display:inline-flex;gap:3px;align-items:center;justify-content:center;min-height:38px;min-width:67px;padding:7px 10px;border:1px solid #cbd8eb;border-radius:11px;background:#fff;color:#315785;font-size:calc(12px * var(--font-scale));font-weight:650;white-space:nowrap;direction:ltr}
.language-toggle:hover{background:#eaf1fc}.language-toggle .active{color:#254e85;font-weight:750}
.global-back{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid #d3dfef;color:#3d5b82;padding:8px 11px;border-radius:11px;min-height:38px;font-size:calc(12px * var(--font-scale));font-weight:600}
.global-back svg{width:16px;height:16px}.global-back:hover{background:#eaf1fc}
.font-controls{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.font-controls button{min-height:40px;min-width:62px;border:1px solid #d0ddef;border-radius:10px;padding:9px 12px;background:#fff;color:#42638d;font-variant-numeric:tabular-nums}
.font-controls button.active,.font-controls button[aria-pressed=true]{background:#dfeafb;border-color:#7d9fcf;color:#244d83;font-weight:700}
.preferences-panel{display:grid;gap:18px;padding-top:18px}.preferences-panel label{font-weight:600;color:#3d5574}.settings-select{max-width:360px}
/* The human viewer owns only its local canvas and these overlay controls. */
.human-viewer{isolation:isolate;overflow:hidden;min-height:180px}
.human-viewer canvas{display:block;touch-action:none;cursor:grab;outline-offset:-4px}
.human-viewer canvas:focus-visible{outline:2px solid #7396c9;border-radius:12px}
.human-controls{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);display:flex;align-items:center;gap:3px;padding:4px;background:#ffffffed;border:1px solid #d3dfef;border-radius:11px;box-shadow:0 3px 12px #263e6012;z-index:4;direction:ltr;backdrop-filter:blur(10px);max-width:calc(100% - 12px)}
.human-controls button{display:grid;place-items:center;min-width:27px;height:28px;border:0;border-radius:7px;color:#45678e;background:transparent;padding:3px 7px;font-size:calc(12px * var(--font-scale));font-weight:650;line-height:1.2}
.human-controls button:hover,.human-controls button[aria-pressed=true]{background:#e4edfa;color:#244c80}
.human-controls button:last-child{font-size:calc(10px * var(--font-scale));border-inline-start:1px solid #e3eaf5;border-radius:0 7px 7px 0}
.human-viewer-hint{position:absolute;bottom:3px;left:0;right:0;text-align:center;color:#647894;z-index:3;pointer-events:none;font-size:calc(8px * var(--font-scale));letter-spacing:0;white-space:nowrap}
.auth-art .human-controls{bottom:26px}.auth-art .human-viewer-hint{bottom:7px}
.human-small{height:350px}.human-small .human-controls{bottom:20px}
/* Native direction and font preferences also apply to dialogs and reports. */
[dir=rtl]{font-family:Tahoma,"Segoe UI",sans-serif}
[dir=rtl] h1,[dir=rtl] h2,[dir=rtl] .greeting,[dir=rtl] .auth-heading h1,[dir=rtl] .overview-copy h2{font-family:Tahoma,"Segoe UI",sans-serif;letter-spacing:0;line-height:1.6}
[dir=rtl] .eyebrow,[dir=rtl] .nav-label,[dir=rtl] .data-table th{letter-spacing:0}
[dir=rtl] .sidebar{border-right:0;border-left:1px solid var(--line)}
[dir=rtl] .nav-item,[dir=rtl] .data-table{text-align:right}
[dir=rtl] .overview-human{right:auto;left:0}
[dir=rtl] .human-tag{right:auto;left:14px}
[dir=rtl] .timeline-item:not(:last-child):before{left:auto;right:14px}
[dir=rtl] .top-date{margin-right:0;margin-left:12px}
[dir=rtl] .answer-value{text-align:left}
[dir=rtl] .global-back svg{transform:rotate(180deg)}
[dir=rtl] .brand-name,[dir=rtl] .brand-name small,[dir=rtl] .patient-id,[dir=rtl] input[type=email],[dir=rtl] input[type=password],[dir=rtl] input[type=date],[dir=rtl] .metric-number{direction:ltr;unicode-bidi:isolate}
[dir=rtl] .brand-name{display:inline-block}
[dir=rtl] .font-controls,[dir=rtl] .batch-slider input[type=range]{direction:ltr}
button,input,select,textarea{max-width:100%}
.page-heading,.modal-head,.survey-actions{overflow-wrap:anywhere}
@media(max-width:1150px){.overview-card{min-height:370px}.overview-copy{max-width:57%}.overview-human{width:44%}}
@media(max-width:900px){.overview-card{min-height:355px}.overview-copy{max-width:56%}.overview-human{width:45%}.human-small{height:330px}}
@media(max-width:650px){.overview-card{min-height:375px}.overview-copy{max-width:58%}.overview-copy h2{font-size:calc(27px * var(--font-scale))}.overview-copy p{font-size:calc(11px * var(--font-scale))}.overview-human{width:42%;height:calc(100% - 82px);right:0;top:7px}.human-tag{font-size:calc(6px * var(--font-scale));bottom:65px;right:5px}.human-controls{gap:0;padding:3px;border-radius:9px;bottom:25px}.human-controls button{min-width:22px;height:27px;padding:3px 4px;font-size:calc(11px * var(--font-scale))}.human-controls button:last-child{font-size:calc(8px * var(--font-scale))}.human-viewer-hint{font-size:calc(6px * var(--font-scale));bottom:9px;white-space:normal;line-height:1.3}.human-small{height:340px}.human-small .human-controls button{min-width:33px;height:32px;font-size:calc(13px * var(--font-scale))}.human-small .human-viewer-hint{font-size:calc(9px * var(--font-scale))}.global-back{padding:7px 8px;font-size:calc(10px * var(--font-scale));min-height:35px}.language-toggle{min-width:54px;min-height:35px;padding:6px 7px;font-size:calc(11px * var(--font-scale))}.top-actions{gap:5px}.answer-guide{grid-template-columns:1fr;gap:8px}.answer-guide>div,.answer-guide>section{padding:13px}.answer-guide strong{margin-bottom:3px}.answer-options{gap:6px}.batch-slider{padding:18px}.survey-actions{gap:9px}.profile-strip{gap:14px}.font-controls button{flex:1}.data-table th{white-space:normal}.mobile-nav button{font-size:calc(9px * var(--font-scale))}[dir=rtl] .overview-human{left:0;right:auto}[dir=rtl] .human-tag{left:5px;right:auto}}
@media print{body>#print-area{color:#1c2b43!important}.answer-Yes,.answer-yes{color:#b11e3b!important}.answer-No,.answer-no{color:#27578f!important}.answer-unknown,.answer-Unknown,.answer-not-sure{color:#815b13!important}.answer-value{-webkit-print-color-adjust:exact;print-color-adjust:exact}.human-controls,.human-viewer-hint,.global-back{display:none!important}}
.auth-form-side{position:relative;padding-top:78px}
.auth-preferences{position:absolute;top:26px;right:35px;display:flex;align-items:center;gap:8px}
.answer-guide{display:block}
.answer-guide>h3{margin-bottom:14px}
.answer-guide>.answer-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border:0;background:transparent;padding:0}
.answer-guide-grid>div{padding:16px;border:1px solid var(--line);background:#f7f9fd;border-radius:12px}
.answer-guide strong{display:inline-block;padding:3px 9px;border-radius:6px}
.answer-guide>.caption{margin-top:12px}
.answer-option[class*="answer-"]{background:transparent;border:0;color:inherit!important}
.answer-option.answer-unknown input:checked+span{background:#fff3d9;color:#80590f;border-color:#d2ad61;box-shadow:0 0 0 1px #d2ad61}
.batch-slider{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:20px}
.batch-slider input,.batch-slider>.between{grid-column:1/-1}
.topbar,.top-actions{flex-wrap:wrap}
[dir=rtl] .auth-preferences{left:35px;right:auto}
@media(max-width:650px){.auth-form-side{padding-top:75px}.auth-preferences{top:17px;right:20px}.answer-guide>.answer-guide-grid{grid-template-columns:1fr;gap:8px}.answer-guide-grid>div{padding:13px}.topbar{gap:10px}.top-actions{justify-content:flex-end;flex:1}.global-back{white-space:nowrap}[dir=rtl] .auth-preferences{left:20px;right:auto}}
