:root{--bg:#F3F7F4;--paper:#fff;--cream:#EDF6F0;--ink:#183D32;--ink-2:#48645B;--ink-3:#627B72;--accent:#008C59;--accent-deep:#006B44;--accent-soft:#E1F3E9;--line:#244B3E;--line-soft:#D8E6DD}
.topbar{background:#fffffff2;border-bottom:1px solid var(--line-soft);height:72px}.logo small{display:block;font-size:11px;letter-spacing:.12em;margin-top:3px}.xdf-mark{display:flex;width:42px;height:46px;color:var(--accent)}.xdf-mark svg{width:100%;height:100%}.toolbar-sticky{background:#f3f7f4f2!important}.btn{transition:transform 140ms cubic-bezier(.23,1,.32,1),opacity 140ms}.btn:active{transform:scale(.97)}.btn-primary{box-shadow:0 3px 0 #005536;border-color:var(--accent)}.hero{background:linear-gradient(120deg,#e5f3eb,#fff)}
.auth-page{max-width:1100px;margin:0 auto;padding:80px 28px;display:grid;grid-template-columns:1.15fr 1fr;gap:70px;align-items:center}.eyebrow{font-size:11px;letter-spacing:.16em;font-weight:800;color:var(--accent)}.auth-intro h1{font-size:clamp(32px,4vw,50px);line-height:1.4;margin:24px 0}.auth-intro em{font-style:normal;color:var(--accent)}.auth-intro p{line-height:1.9;color:var(--ink-2);font-size:16px}.auth-notes{display:flex;gap:14px;margin-top:35px}.auth-notes span{padding:22px 24px;background:#fff0b9;transform:rotate(-5deg);border-radius:6px 6px 20px 6px;font-weight:800}.auth-notes span:nth-child(2){background:#d8eee0;transform:rotate(4deg)}.auth-notes span:nth-child(3){background:#e4e3f5;transform:rotate(-2deg)}.auth-card{background:#fff;border:1px solid var(--line-soft);border-radius:24px;padding:32px;box-shadow:0 16px 45px #164f3510;animation:auth-enter 180ms ease-out}.auth-card h2{font-size:25px;margin-bottom:10px}.auth-card p{font-size:13px;color:var(--ink-2);line-height:1.7}.auth-card label{display:block;font-weight:700;font-size:13px;margin-top:20px}.auth-card input{display:block;width:100%;border:1px solid #bdcfc5;background:#fbfdfb;padding:13px;border-radius:10px;margin-top:8px}.auth-card input:focus-visible{outline:3px solid #008c5930;border-color:var(--accent)}.auth-card form>.btn{width:100%;margin-top:16px}.auth-switch{display:block;margin:22px auto 18px;font-size:13px;color:var(--accent-deep)}.guest-entry{display:block;border-top:1px solid var(--line-soft);padding-top:20px;text-align:center;font-weight:700;text-decoration:none}.auth-card .auth-hint{font-size:11px;margin-top:20px;color:#627B72}#auth-error{color:#b42318;margin-top:10px}button:disabled{opacity:.55;cursor:wait}[hidden]{display:none!important}
@keyframes auth-enter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media(max-width:700px){.auth-page{grid-template-columns:1fr;padding:30px 18px;gap:28px}.auth-intro h1{font-size:30px;margin:12px 0}.auth-notes{display:none}.auth-card{padding:24px}.logo{font-size:16px}.topbar{padding:0 14px}.auth-intro p{font-size:14px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.layout-rows .ans-grid { display:block; }
.layout-rows .ans-item { display:grid; grid-template-columns:150px minmax(180px,1fr) minmax(220px,1fr); gap:12px; align-items:center; }
.teacher-comment { display:flex; gap:6px; margin-top:8px; }
.teacher-comment input { min-width:0; flex:1; border:1.5px solid var(--line-soft); border-radius:8px; padding:7px 9px; background:#fffdf7; }
.teacher-comment button { border:1.5px solid var(--accent); color:var(--accent-deep); background:var(--accent-soft); border-radius:8px; padding:5px 10px; font-weight:800; cursor:pointer; }
.auth-code-row{display:flex;align-items:center;gap:8px}.auth-code-row input{min-width:0;flex:1}.auth-code-row .btn{flex-shrink:0;font-size:12px;margin-top:8px;padding:12px}.auth-links{display:flex;justify-content:center;gap:24px}.auth-links .auth-switch{margin:20px 0}.auth-message{color:#b42318!important;overflow-wrap:anywhere}.auth-message.success{color:var(--accent-deep)!important}.auth-dialog{width:min(460px,calc(100vw - 32px));max-height:90vh;overflow:auto;margin:auto;color:var(--ink)}.auth-dialog::backdrop{background:#183d3260}.auth-card input{box-sizing:border-box}