*{box-sizing:border-box}body{margin:0;background:#0b1221;color:#eef3ff;font:17px/1.7 system-ui}main,nav,footer{max-width:1000px;margin:auto;padding:25px}nav{display:flex;gap:20px;flex-wrap:wrap;border-bottom:1px solid #ffffff20}a{color:#91e7ce}h1{font-size:clamp(30px,5vw,48px);line-height:1.15}h2{margin-top:34px}p{max-width:820px}.lead{color:#bacce0;font-size:20px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}.card,.exercise{background:#18263b;border:1px solid #304761;padding:22px;border-radius:16px}pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#111d30;padding:20px;border-radius:12px;font:16px/1.6 ui-monospace}textarea,input,button{font:inherit;padding:12px;border:1px solid #6a849f;border-radius:8px}textarea{width:100%;min-height:110px;background:#101d2f;color:#fff}button{background:#91e7ce;color:#071b17;cursor:pointer;margin:7px}button:focus-visible,a:focus-visible{outline:3px solid #f5d06c;outline-offset:4px}.note{color:#adbed4;font-size:14px}table{width:100%;border-collapse:collapse}td,th{border:1px solid #48627f;padding:10px;text-align:left}.flow{color:#a5baff;font-weight:700}summary{cursor:pointer;color:#91e7ce}label{display:block}footer{font-size:14px;color:#adc0d9}code{overflow-wrap:anywhere}

.prompt-dialogue{margin:24px 0;padding:24px;background:#18263b;border:1px solid #48627f;border-radius:16px}
.prompt-dialogue .prompt-speaker{display:inline-block;margin:0 0 8px;padding:4px 12px;background:#111d30;color:#91e7ce;border-radius:999px;font-weight:700}
.prompt-dialogue .prompt-intro{margin:0 0 16px;color:#d6e1ef}
.prompt-dialogue pre{margin:0 0 16px;border:1px solid #304761}
.prompt-dialogue [data-copy-prompt]{margin:0}
.prompt-dialogue [data-copy-status]{min-height:24px;margin:8px 0 0;color:#bacce0;font-size:14px}
@media(max-width:520px){.prompt-dialogue{padding:16px}.prompt-dialogue [data-copy-prompt]{width:100%}}
@media(prefers-reduced-motion:reduce){.prompt-dialogue *{scroll-behavior:auto;transition:none!important}}
