/* Fallback local: mantém a interface utilizável mesmo sem acesso ao CDN do Twind. */
:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: #020617; color: #f1f5f9; }
body > main { max-width: 72rem; margin: 0 auto; padding: 2.5rem 1.25rem; }
body.grid { display: grid; place-items: center; padding: 1.25rem; }
body.grid > main { width: 100%; max-width: 28rem; padding: 0; }
header { border-bottom: 1px solid #1e293b; background: #020617; }
header > div { max-width: 72rem; margin: 0 auto; padding: 1.25rem; display: flex; align-items: center; justify-content: space-between; }
h1,h2,h3,p { margin-top: 0; } h1,h2,h3 { color: #f8fafc; line-height: 1.12; } h1 { font-size: 2rem; } h2 { font-size: 1.75rem; } h3 { font-size: 1.125rem; }
p { line-height: 1.5; } .text-slate-400,.text-slate-300,.text-slate-500 { color: #94a3b8; } .text-cyan-400,.text-cyan-300 { color: #22d3ee; }
.font-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; } .uppercase { text-transform: uppercase; } .tracking-widest { letter-spacing: .12em; } .text-xs { font-size: .75rem; } .text-sm { font-size: .875rem; } .font-bold { font-weight: 700; }
.bg-slate-900 { background: #0f172a; } .bg-slate-950 { background: #020617; } .border { border: 1px solid #334155; } .border-slate-800 { border-color: #1e293b; } .rounded-2xl { border-radius: 1rem; } .rounded-lg { border-radius: .5rem; }
form.bg-slate-900, article { padding: 1.5rem; box-shadow: 0 18px 45px rgba(0,0,0,.25); }
form > div { margin-bottom: 1.15rem; } label { display: block; margin-bottom: .5rem; color: #cbd5e1; font-size: .875rem; }
input, textarea { width: 100%; padding: .75rem; color: #f8fafc; background: #020617; border: 1px solid #475569; border-radius: .5rem; font: inherit; } input:focus,textarea:focus { outline: 2px solid #22d3ee; outline-offset: 1px; }
button { cursor: pointer; border: 0; font: inherit; } button:not([name="delete"]) { width: 100%; padding: .8rem; border-radius: .5rem; color: #083344; background: #22d3ee; font-weight: 700; } button:not([name="delete"]):hover { background: #67e8f9; }
a { color: #67e8f9; text-decoration: none; } a:hover { color: #cffafe; } .space-y-4 > * + * { margin-top: 1rem; } .space-y-5 > * + * { margin-top: 1.25rem; }
main > div.grid { display: grid; gap: 2.5rem; } article { border: 1px solid #1e293b; border-radius: 1rem; background: #0f172a; } article + article { margin-top: 1rem; } article > div:first-child { display: flex; justify-content: space-between; gap: .75rem; } article > div:last-child { border-top: 1px solid #1e293b; padding-top: 1rem; display: flex; justify-content: space-between; align-items: center; }
article form { margin: 0; } button[name="delete"] { background: transparent; color: #fda4af; padding: .25rem; } .whitespace-pre-wrap { white-space: pre-wrap; }
@media (min-width: 1024px) { main > div.grid { grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); } }
@media (max-width: 639px) { h1,h2 { font-size: 1.6rem; } header > div { padding: 1rem 1.25rem; } }