:root { --blue:#034991; --blue-dark:#003c71; --green:#177649; --green-soft:#eaf5ef; --red:#cd1719; --ink:#202827; --muted:#63706d; --line:#dce5e1; --page:#f4f7f5; --paper:#fff; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:radial-gradient(circle at 8% 0%,rgba(23,118,73,.08),transparent 25rem),var(--page); font-family:"Source Sans 3","Segoe UI",sans-serif; }
button,input,select { font:inherit; }
.site-header { min-height:112px; padding:12px max(20px,calc((100% - 1240px)/2)); display:flex; align-items:center; justify-content:space-between; gap:24px; border-top:5px solid var(--red); border-bottom:1px solid var(--line); background:#fff; }
.brand { display:flex; align-items:center; gap:16px; color:var(--ink); font-weight:800; line-height:1.08; text-decoration:none; }
.brand img { width:82px; height:82px; object-fit:contain; }
.header-actions { display:flex; align-items:center; gap:12px; }
.una-logo { width:94px; height:76px; object-fit:contain; }
.install-button,.logout-button,.back-link { color:var(--blue); font-weight:750; }
.install-button,.logout-button { min-height:42px; padding:9px 15px; border:1px solid var(--blue); border-radius:999px; background:#fff; cursor:pointer; }
.page { width:min(1160px,calc(100% - 36px)); margin:0 auto 60px; }
.back-link { display:inline-block; margin:22px 0 8px; text-decoration:none; }
.intro { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; padding:20px 0 26px; }
.eyebrow,.step { margin:0 0 5px; color:var(--green); text-transform:uppercase; letter-spacing:.12em; font-size:13px; font-weight:850; }
h1 { margin:0; color:var(--blue-dark); font-size:clamp(30px,4vw,48px); line-height:1.05; }
.intro p:last-child,.panel-heading p,.identity-card p { margin:8px 0 0; color:var(--muted); }
.session-card { min-width:220px; padding:14px 18px; border:1px solid var(--line); border-radius:14px; background:#fff; box-shadow:0 8px 24px rgba(24,47,40,.06); }
.session-card span,.session-card strong { display:block; }
.session-card span { color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.identity-card,.panel { border:1px solid var(--line); border-radius:18px; background:var(--paper); box-shadow:0 10px 32px rgba(24,47,40,.07); }
.identity-card { display:grid; grid-template-columns:minmax(260px,.8fr) minmax(340px,1.2fr); align-items:end; gap:28px; padding:25px; border-left:5px solid var(--green); }
h2 { margin:0; color:var(--blue-dark); font-size:25px; }
label,legend { color:var(--ink); font-weight:750; }
.input-action { display:grid; grid-template-columns:1fr auto; gap:10px; }
input,select { width:100%; min-height:50px; padding:11px 14px; border:1px solid #bdcac5; border-radius:11px; background:#fff; color:var(--ink); }
input:focus,select:focus,button:focus-visible { outline:3px solid rgba(3,73,145,.18); outline-offset:2px; border-color:var(--blue); }
.input-action button,.primary-action { min-height:50px; padding:11px 20px; border:0; border-radius:11px; color:#fff; background:linear-gradient(135deg,var(--green),#0e5936); font-weight:850; cursor:pointer; }
.authorization-grid { display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:20px; margin-top:20px; }
.panel { padding:24px; }
.panel-heading { display:flex; align-items:flex-start; gap:13px; min-height:78px; }
.panel-number { display:grid; place-items:center; width:36px; height:36px; flex:0 0 36px; border-radius:50%; color:#fff; background:var(--blue); font-weight:850; }
.panel form { display:grid; gap:12px; }
fieldset { margin:4px 0 0; padding:0; border:0; }
legend { margin-bottom:8px; }
.reason-options { display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; }
.reason-options label { position:relative; }
.reason-options input { position:absolute; opacity:0; pointer-events:none; }
.reason-options span { min-height:54px; padding:8px 10px; display:grid; place-items:center; border:1px solid var(--line); border-radius:10px; color:var(--muted); text-align:center; line-height:1.1; cursor:pointer; }
.reason-options input:checked + span { border-color:var(--green); color:var(--green); background:var(--green-soft); box-shadow:inset 0 0 0 1px var(--green); }
.student-result { padding:14px 16px; border:1px solid #b9dac8; border-radius:12px; background:var(--green-soft); }
.student-result span,.student-result strong,.student-result small { display:block; }
.student-result span { color:var(--green); font-size:11px; font-weight:850; text-transform:uppercase; letter-spacing:.1em; }
.student-result strong { font-size:18px; }
.student-result small { color:var(--muted); }
.message { margin-bottom:15px; padding:13px 16px; border-radius:11px; color:#8c1416; background:#fff0f0; border:1px solid #efb8b9; font-weight:700; }
.message.is-success { color:#0e5936; background:var(--green-soft); border-color:#a8d4bb; }
button:disabled { opacity:.6; cursor:wait; }
[hidden] { display:none !important; }
@media (max-width:820px) { .authorization-grid,.identity-card { grid-template-columns:1fr; } .intro { align-items:flex-start; flex-direction:column; } .session-card { width:100%; } }
@media (max-width:580px) { .site-header { min-height:88px; padding:10px 14px; } .brand img { width:60px;height:60px; } .brand span { font-size:13px; } .una-logo { display:none; } .logout-button { padding:8px 12px; } .page { width:min(100% - 22px,1160px); } .input-action { grid-template-columns:1fr; } .reason-options { grid-template-columns:1fr; } .reason-options span { min-height:45px; } .panel,.identity-card { padding:18px; } }
