/* Reutiliza a identidade do site; estilos restritos à área Desenvolvimento. */
body { margin:0; }
.dev-page,.dev-page * { box-sizing:border-box; }
.dev-page { max-width:1120px;margin:auto;padding:16px 16px 32px;line-height:1.5; }
.dev-page h1 { font-size:1.8rem;margin:8px 0; }
.dev-page h2 { font-size:1.15rem;margin:0 0 8px; }
.dev-page p { margin:8px 0; }
.dev-page a { color:#17659a; }
.dev-context,.dev-actions { display:flex;align-items:center;gap:8px 16px;flex-wrap:wrap; }
.dev-context { font-size:.85rem;margin-bottom:8px; }
.dev-trail { margin-bottom:12px; }
.dev-page summary { cursor:pointer;padding:8px 0;min-height:44px;font-weight:600; }
.dev-page button { min-height:44px;border:1px solid #b7cddd;border-radius:10px;padding:8px 12px;background:#fff3c9;color:#163653;font:inherit;cursor:pointer; }
.dev-page button:disabled { opacity:.6;cursor:wait; }
.dev-page :focus-visible { outline:3px solid #17659a;outline-offset:2px; }
.dev-workspace { display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:16px;align-items:start; }
.dev-workspace>section,.dev-result,.dev-card { padding:16px;background:white;border:1px solid #dae5ed;border-radius:18px;box-shadow:0 6px 24px #1636530d; }
.dev-card { display:block;max-width:460px;text-decoration:none;margin:24px 0; }
.dev-card>span { display:block;font-size:2rem;margin-bottom:12px; }
.dev-card strong { display:block;margin-top:20px; }
.dev-editor label { display:block;font-weight:700;margin-bottom:8px; }
#py-code { display:block;width:100%;min-height:200px;resize:vertical;border:1px solid #b7cddd;border-radius:10px;background:#f7fafc;color:#163653;padding:12px;font:16px/1.5 ui-monospace,Consolas,monospace;tab-size:4;white-space:pre;overflow:auto; }
#py-editor-help { font-size:.75rem;color:#516a7f; }
.dev-page pre { white-space:pre-wrap;overflow-wrap:anywhere;font: .95rem/1.5 ui-monospace,Consolas,monospace;background:#edf5fa;border-radius:8px;padding:10px;margin:8px 0;min-width:0; }
.dev-result { margin-top:16px; }
#py-output:empty { display:none; }
#py-error { color:#8b2138;background:#fff1f3; }
#py-trail { display:grid;gap:8px;list-style:none;padding:0;grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); }
#py-trail button { width:100%;text-align:left;background:white; }
#py-trail [aria-current=step] { border:2px solid #17659a;background:#edf5fa; }
#py-confirm { width:min(440px,90vw);border:1px solid #b7cddd;border-radius:16px;padding:20px;color:#163653; }
#py-confirm::backdrop { background:#16365366; }
.dev-page .dev-sr { position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%); }
@media(max-width:767px) {
 .dev-page { padding:8px 10px 24px; }
 .dev-workspace { grid-template-columns:1fr;gap:8px; }
 .dev-workspace>section,.dev-result { padding:12px; }
 .dev-actions { gap:8px; }
 #py-code { min-height:160px;height:180px; }
}

.dev-expected { display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-size:.85rem; }
.dev-expected pre { flex:1;margin:4px 0; }
@media(min-width:768px) {
 .dev-editor { grid-column:2;grid-row:1 / span 2; }
 .dev-support { grid-column:1;grid-row:2; }
}
@media(max-width:767px) {
 .dev-challenge h2 { font-size:1.05rem; }
 .dev-challenge p { font-size:.95rem; }
 .dev-expected { gap:4px; }
 .dev-result { margin-top:8px; }
}

#py-runtime { flex-basis:100%;font-size:.85rem;margin:0; }

.dev-lab-back { display: inline-flex; align-items: center; min-height: 44px; margin-bottom: 8px; }
