:root{color-scheme:dark;--mint:#b6edce;--gold:#f9db70}*{box-sizing:border-box}body{margin:0;min-height:100dvh;background:radial-gradient(ellipse at 15% 0%,#29423980,transparent 50%),#10201c;color:#f4f2e9;font:15px system-ui,sans-serif;padding:env(safe-area-inset-top) 20px env(safe-area-inset-bottom)}header{display:flex;align-items:center;justify-content:space-between;max-width:900px;padding:22px 0;margin:auto}.brand{color:var(--mint);text-decoration:none;font-size:22px;font-weight:800;letter-spacing:-1px}.tag{font-size:11px;color:#91aa9b}main{max-width:430px;margin:36px auto 30px;text-align:center}.emblem{width:126px;height:112px;position:relative;margin:0 auto 20px}.emblem span{display:grid;place-items:center;position:absolute;width:40px;height:45px;background:#f0f0e6;color:#1b3828;clip-path:polygon(50% 0,94% 25%,94% 75%,50% 100%,6% 75%,6% 25%);font-size:20px;font-weight:850}.emblem span:nth-child(1){left:22px;top:0;background:var(--mint)}.emblem span:nth-child(2){left:62px;top:0}.emblem span:nth-child(3){left:2px;top:34px}.emblem span:nth-child(4){left:42px;top:34px;background:var(--gold)}.emblem span:nth-child(5){left:82px;top:34px}.emblem span:nth-child(6){left:42px;top:68px}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--mint);font-weight:650}h1{font-size:46px;line-height:1.05;letter-spacing:-2px;margin:14px 0}.description{color:#a3b5aa;line-height:1.6;font-size:14px;margin:0 0 24px}fieldset{border:0;padding:0;margin:0}legend{font-size:12px;color:#a3b5aa;margin:0 auto 12px}.language-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.language-card{display:flex;align-items:center;position:relative;border:1px solid #ffffff20;border-radius:17px;min-height:76px;padding:16px;gap:12px;cursor:pointer;text-align:left;background:#ffffff03}.language-card:hover{background:#ffffff08}.language-card:has(input:checked){border-color:var(--mint);background:#b6edce12}.language-card:has(input:focus-visible){outline:3px solid var(--gold);outline-offset:3px}.language-card input{position:absolute;opacity:0;width:1px;height:1px}.code{display:grid;place-items:center;width:38px;height:42px;background:#ffffff0d;clip-path:polygon(50% 0,94% 25%,94% 75%,50% 100%,6% 75%,6% 25%);font-size:12px;font-weight:800;color:var(--mint);flex-shrink:0}.language-name{font-size:16px;font-weight:650}.check{position:absolute;right:9px;top:6px;color:var(--mint);font-size:13px;display:none}.language-card input:checked~.check{display:block}.start{margin-top:20px;width:100%;border:0;border-radius:16px;padding:16px;background:var(--mint);color:#173b29;font:750 17px system-ui;cursor:pointer}.start:hover{background:#d2f7df}.start:focus-visible{outline:3px solid var(--gold);outline-offset:4px}.note{font-size:11px;color:#789382;margin-top:16px}@media(max-width:500px){header{padding:14px 0}.brand{font-size:20px}main{margin:18px auto}h1{font-size:38px}.language-card{padding:12px;min-height:70px;gap:8px}.language-name{font-size:15px}.description{margin-bottom:20px}}@media(max-height:660px){header{padding:10px 0}main{margin:8px auto}.emblem{transform:scale(.7);transform-origin:center top;height:78px;margin-bottom:5px}h1{font-size:32px;margin:10px 0}.description{font-size:12px;margin-bottom:12px}.language-card{min-height:61px;padding:10px}.language-grid{gap:8px}.start{padding:12px;margin-top:14px}.note{margin-top:10px}}

.records{margin-top:24px;padding:16px 12px 12px;border:1px solid #ffffff15;border-radius:18px;background:#ffffff03;text-align:left}
.records-header{display:flex;align-items:center;gap:7px;margin-bottom:12px}.records-header h2{font-size:14px;margin:0;font-weight:650;color:var(--mint)}.records-symbol{color:var(--gold);font-size:17px}
.records table{width:100%;border-collapse:collapse;table-layout:fixed;font-variant-numeric:tabular-nums}.records th,.records td{padding:8px 3px;text-align:center;border-bottom:1px solid #ffffff0a;font-size:12px}.records thead th{color:#91aa9b;font-size:10px;font-weight:500;line-height:1.25;overflow-wrap:anywhere}.records th:first-child{width:28%;text-align:left}.records tbody th{font-weight:500}.records tbody td{color:var(--mint)}.records tr.active-language{background:#b6edce0b}.records tbody tr:last-child th,.records tbody tr:last-child td{border-bottom:0}.records-note{font-size:10px;line-height:1.5;color:#789382;margin:10px 0 0}
@media(min-width:960px){main{max-width:900px;display:grid;grid-template-columns:430px 390px;column-gap:60px}main>.emblem,main>.eyebrow,main>h1,main>.description,main>form,main>.note{grid-column:1}.records{grid-column:2;grid-row:1/7;align-self:center;margin-top:0}}
@media(max-height:660px){.records{margin-top:16px;padding-top:12px}.records th,.records td{padding-top:6px;padding-bottom:6px}}