*{box-sizing:border-box}body{margin:0;background:#f4f6f1;color:#16261c;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}main{max-width:520px;margin:0 auto;padding:32px 24px 24px}header{display:flex;justify-content:space-between;align-items:center}.brand{font-size:24px;font-weight:850;letter-spacing:-1px}.brand-dot{color:#276a48;font-size:13px;vertical-align:middle}.badge{font-size:12px;color:#375242;background:#e4ecdf;padding:8px 12px;border-radius:24px}.intro{margin:48px 0 28px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:750;color:#42664f}h1{font-size:clamp(42px,10vw,56px);line-height:1.06;letter-spacing:-2.5px;margin:14px 0 18px;font-weight:780}.lead{color:#536459;margin:0;font-size:17px}.card{background:#fff;padding:28px;border:1px solid #dbe3d8;border-radius:20px;box-shadow:0 12px 38px #20352808}label{display:block;font-size:14px;font-weight:700;margin:0 0 10px}input{width:100%;border:1px solid #bdccbf;border-radius:10px;padding:15px;font-size:22px;font-family:inherit;letter-spacing:2px;background:#fcfdfb;color:#16261c}input::placeholder{letter-spacing:0;font-size:17px;color:#66756b}input:focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #1e7446;outline-offset:3px}.hint{font-size:12px;line-height:1.6;color:#526259;margin:10px 0 18px}button{font:inherit;cursor:pointer;border:0;min-height:48px;border-radius:10px;font-weight:650}#generate{display:flex;align-items:center;justify-content:space-between;width:100%;padding:15px 18px;background:#245f40;color:#fff}button:disabled{opacity:.6;cursor:wait}#generate:hover{background:#194f31}.error{color:#a12222;font-size:13px;margin:10px 0}.result{border-top:1px solid #e1e8df;margin-top:26px;padding-top:24px;text-align:center}.qr-frame{background:#fff;margin:auto;max-width:320px}canvas{display:block;width:100%;height:auto;image-rendering:pixelated}.student-id{font-size:18px;font-weight:650;letter-spacing:2px;margin:16px 0 0}.actions{display:flex;gap:10px}.secondary{background:#e6eee1;color:#1e5235;flex:1;padding:12px}.text-button{padding:12px 16px;color:#4a5b4e;background:transparent}.privacy{display:flex;gap:10px;margin:22px 4px;color:#4c6252;font-size:12px;line-height:1.7}.privacy>span{font-size:18px;color:#276a48}.privacy p{margin:0}details{border-top:1px solid #dbe3d8;padding-top:18px;color:#4c6252;font-size:12px;line-height:1.7}summary{cursor:pointer;font-weight:650;min-height:30px}code{display:block;padding:12px;background:#e6eee1;border-radius:8px;color:#1b442c;overflow-wrap:anywhere}footer{margin-top:24px;color:#59695c;font-size:11px;line-height:1.7}footer nav{display:flex;gap:8px 18px;flex-wrap:wrap}a{color:#285a3d;text-underline-offset:3px}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}@media(max-width:360px){main{padding:24px 16px}.card{padding:20px}.intro{margin-top:34px}}