:root{color-scheme:light;font:16px/1.55 Inter,Arial,sans-serif;background:#f5f6fa;color:#183b66}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;padding-bottom:110px}button,a,input{touch-action:manipulation}button,a{font:inherit}a{color:#155fc0}button{cursor:pointer;min-height:48px;border:1px solid #b8cce8;border-radius:10px;padding:10px 16px;background:white;color:#183b66;font-weight:600}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #183b66;outline-offset:4px}.sample-header,main{max-width:800px;margin:auto;padding:18px 22px}.sample-header{padding-bottom:4px}.top{display:flex;align-items:center;justify-content:space-between;gap:16px}.top img{max-width:156px;height:auto}.close{display:grid;place-items:center;min-width:48px;min-height:48px;text-decoration:none;border:1px solid #dce6f3;border-radius:12px;background:white;font-size:28px}.language{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap;margin:8px 0 16px}.language a{display:inline-block;min-height:36px;padding:6px 12px;border:1px solid #c4d9f6;border-radius:24px;text-decoration:none;font-size:13px}.language a[aria-current]{background:#1a73e8;color:white;border-color:#1a73e8}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.04em;color:#536e8b;margin:8px 0}h1{font-size:clamp(23px,4vw,32px);line-height:1.2;letter-spacing:-.6px;margin:8px 0 12px}h2{font-size:22px;line-height:1.3;margin:0 0 16px}h3{font-size:20px;line-height:1.3;margin:0 0 12px}p{margin:12px 0}.sample-note{font-size:13px;line-height:1.5;color:#526780;margin:8px 0}.step{font-weight:600;font-size:14px;margin:0 0 16px}.card{border:1px solid #dce6f3;background:white;border-radius:18px;padding:24px;box-shadow:0 6px 20px #183b6605}fieldset{border:0;margin:0;padding:0;min-width:0}legend{font-size:17px;font-weight:600;margin:0 0 16px;padding:0;line-height:1.5}.choice{display:flex;gap:12px;align-items:flex-start;min-height:52px;border:1px solid #dce6f3;border-radius:12px;padding:14px 12px;margin:10px 0;cursor:pointer}.choice:has(input:checked){border-color:#1a73e8;background:#edf5ff}.choice input{accent-color:#1a73e8;flex:0 0 18px;width:18px;height:18px;margin:4px 0 0}.choice span{min-width:0}.required{color:#a52f35}.correct,.incorrect{padding:18px;border:1px solid;border-radius:14px}.correct{background:#f1faf5;border-color:#9fcfb4}.incorrect{background:#fff5f5;border-color:#dba9ad}.incorrect h3{color:#a52f35}.correct h3{color:#237347}#feedback-hint{font-size:15px}.sample-nav{position:fixed;bottom:0;left:0;right:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px max(20px,calc((100vw - 756px)/2)) calc(14px + env(safe-area-inset-bottom));background:#f5f6faf7;border-top:1px solid #dce6f3}.sample-nav span{white-space:nowrap;color:#536e8b;font-size:14px}.sample-nav #sample-next,.primary-link{background:#1a73e8;color:white;border-color:#1a73e8}.primary-link{display:inline-block;text-decoration:none;border:1px solid;border-radius:10px;padding:12px 16px;margin-top:12px;min-height:48px;font-weight:600}@media(max-width:400px){.sample-header,main{padding-left:14px;padding-right:14px}.card{padding:18px}.sample-nav{padding-left:14px;padding-right:14px;gap:8px}.sample-nav button{font-size:14px;padding:10px 12px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

/* Keep full principle/hint feedback within the two-screen phone budget. */
.card:has(#feedback:not([hidden])) #page-copy{display:none}#feedback{padding:14px}
@media(max-height:650px){.sample-header{padding-top:12px}.language{margin-top:4px;margin-bottom:10px}.sample-note{font-size:12px;line-height:1.4}main{padding-top:10px}.card{padding:18px}.sample-nav{padding-top:10px;padding-bottom:calc(10px + env(safe-area-inset-bottom))}}
