*{box-sizing:border-box}body{margin:0;background:#f4f3ef;color:#262421;font:16px/1.45 "Segoe UI",system-ui,sans-serif}header{background:#292723;color:white;padding:16px max(5%,calc((100% - 740px)/2));display:flex;align-items:center;gap:10px;white-space:nowrap}header b{background:#a82e32;color:white;padding:3px 9px;font-size:21px}header span{margin-left:auto;color:#dedbd2;font-size:13px}main{max-width:760px;margin:auto;padding:24px 16px 60px}h1{font-size:36px;letter-spacing:-1px;margin:4px 0}h2{font-size:21px;margin:0 0 14px}.note{margin:0 0 20px;color:#58544e}section{background:white;border:1px solid #dcd9d2;padding:20px;border-radius:10px;margin:14px 0}.fields,form,.total,li{display:flex;gap:12px;align-items:end}.fields label,form label{flex:1;min-width:0}label{display:block;font-weight:600;margin-bottom:10px}input,select,button{font:inherit;border-radius:6px;padding:10px;min-height:45px}input,select{width:100%;display:block;border:1px solid #918d84;margin-top:4px;background:white;color:inherit}button{background:#8f272b;border:0;color:white;cursor:pointer;font-weight:600}button:disabled{background:#ddd9d4;color:#68645f;cursor:default}form{margin:15px 0}form label{margin:0}#concept{color:#70452c;font-weight:600;margin:6px 0 0}#status{color:#76382d}video{width:100%;max-height:320px;background:#292723;margin-top:12px}ul{padding:0;list-style:none}li,.total,details{padding:10px 0;border-top:1px solid #ddd9d4}li,.total{justify-content:space-between;align-items:center}li button{background:#f1eae7;color:#712a29}.total{margin-bottom:10px}summary{cursor:pointer;padding:6px}details p{overflow-wrap:anywhere}#save{width:100%}[hidden]{display:none!important}@media(max-width:510px){.fields{display:block}main{padding:16px 12px}section{padding:16px}header{padding:12px}header span{font-size:11px}}
#view{position:relative;width:min(100%,360px);aspect-ratio:1;margin:12px auto 0;overflow:hidden;border-radius:8px;background:#292723}#view video{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:cover;margin:0}#guide{position:absolute;inset:16%;border:3px solid white;border-radius:3px;box-shadow:0 0 0 500px #0007;pointer-events:none}#aim{text-align:center;margin:6px 0;font-size:.9rem}#status:not(:empty){padding:12px;border-radius:6px;font-weight:600;background:#f0eee8}#status[data-kind=ok]{background:#d9f4e7;color:#135635}#status[data-kind=warning]{background:#fff0d1;color:#683908}#view[data-kind=ok] #guide{border-color:#72ffab}#view[data-kind=warning] #guide{border-color:#ffcb67}
#testSound{background:#eeeae4;color:#483f34}

.auth { max-width: 32rem; }
.auth form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; margin: 0; align-items: stretch; }
.auth input, .auth button { width: 100%; min-height: 52px; font-size: 18px; }
.auth small { margin-top: -.5rem; color: #514d47; font-size: 1rem; }
.auth [role=status] { margin: 0; color: #742127; }
.auth [role=status]:empty { display: none; }
.auth a { display: inline-block; padding: 12px 0; color: #79252a; }
header img{width:42px;height:42px;object-fit:contain}header.login-brand{justify-content:center;background:transparent;padding:36px 0 4px}.login-brand img{width:96px;height:96px}.auth h1{text-align:center;margin-bottom:24px}section,dialog{border-radius:16px;box-shadow:0 5px 22px #34221a0b}h3{font-size:1rem;margin:20px 0 8px}article{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:12px 0;border-top:1px solid #ddd}article strong{grid-column:1}article span{grid-column:1;color:#625d57;font-size:.92rem}article b{grid-column:2;grid-row:1/3;align-self:center;font-variant-numeric:tabular-nums}dialog{border:1px solid #dad5ce;width:min(92vw,450px);max-height:85dvh;overflow:auto;padding:22px}dialog::backdrop{background:#241b18aa}dialog button{margin-top:14px}.secondary{background:#eeeae5;color:#492e29}#next,#save{width:100%;margin-top:15px}#back{margin-bottom:18px}button:focus-visible,summary:focus-visible{outline:3px solid #ab7920;outline-offset:3px}
