*{box-sizing:border-box;margin:0}
html,body{min-height:100%}
body{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 18px 0;-webkit-font-smoothing:antialiased}
.gate{position:relative;width:100%;max-width:460px;text-align:center}
.check{position:relative;display:flex;gap:14px;align-items:flex-start;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.check input{position:absolute;opacity:0;width:1px;height:1px}
.box{flex:none;display:grid;place-items:center;transition:all .2s ease}
.box:after{content:"";width:40%;height:22%;border:solid currentColor;border-width:0 0 3px 3px;transform:rotate(-45deg) translate(1px,-1px) scale(0);transition:transform .2s ease}
.check input:checked+.box:after{transform:rotate(-45deg) translate(1px,-1px) scale(1)}
.txt{line-height:1.55}
.msg{min-height:1.5em;margin-top:16px;font-size:14px}
.again{margin-top:6px;font-size:14px}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;opacity:0}
.ai-notice{width:100%;max-width:720px;margin-top:auto;padding:56px 8px 22px;font-size:10.5px;line-height:1.5;text-align:center}
.ai-notice p+p{margin-top:6px}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

/* Terminal — nền đen, chữ xanh lá, mono, scanline */
body{background:#050805;color:#b7f7c4;font-family:"JetBrains Mono",ui-monospace,Menlo,monospace}
body:after{content:"";position:fixed;inset:0;pointer-events:none;
 background:repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 1px,transparent 1px 3px)}
.gate{text-align:left;max-width:520px;padding:0;border:1px solid #1f4d2a;border-radius:8px;background:#071107;box-shadow:0 0 40px rgba(34,197,94,.12)}
.deco{height:30px;border-bottom:1px solid #1f4d2a;background:
 radial-gradient(circle at 16px 15px,#ef4444 4px,transparent 5px),radial-gradient(circle at 32px 15px,#eab308 4px,transparent 5px),
 radial-gradient(circle at 48px 15px,#22c55e 4px,transparent 5px)}
.kicker,h1,.lead,.check,.msg,.again{margin-left:24px;margin-right:24px}
.kicker{margin-top:22px;font-size:13px;color:#4ade80}
.kicker:after{content:"_";animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
h1{font-size:clamp(20px,5vw,24px);font-weight:700;color:#ecfdf0;margin-top:14px;line-height:1.35}
h1:before{content:"> ";color:#22c55e}
.lead{color:#86c99a;font-size:14px;line-height:1.65;margin-top:10px;margin-bottom:22px}
.check{padding:14px 14px;border:1px dashed #2c6b3b;border-radius:4px;background:#0a180c}
.check:hover{border-color:#4ade80}
.check:focus-within{outline:2px solid #4ade80;outline-offset:3px}
.box{width:auto;height:auto;font-weight:700;color:#4ade80;display:block}
.box:before{content:"[ ]"}
.box:after{display:none}
.check input:checked+.box:before{content:"[x]";color:#ecfdf0;text-shadow:0 0 8px #22c55e}
.txt{font-size:14px;color:#c6f6d2}.txt b{color:#4ade80;font-weight:700}
.msg{font-size:13px;margin-bottom:4px}.msg.good{color:#4ade80}.msg.good:before{content:"✓ "}.msg.err{color:#f87171}.msg.err:before{content:"✗ "}
.again{font-size:13px;margin-bottom:22px}.again a{color:#4ade80}
.gate>.msg:last-of-type{margin-bottom:22px}
.ai-notice{color:#2f6b3d;font-size:10px}
