:root{--o:#b8923a;--od:#8a6d1f;--l:#e8e0cc}*{box-sizing:border-box}body{margin:0;font:14px Inter,system-ui,sans-serif;background:#faf8f2;color:#2b2b2b}[hidden]{display:none!important}
.lg{min-height:100vh;display:grid;place-items:center}form{background:#fff;padding:32px;width:min(380px,92vw);border:1px solid var(--l);border-top:3px solid var(--o)}h1{font:600 24px Georgia,serif;letter-spacing:.15em;margin:0}p{color:var(--od)}
input,textarea{width:100%;padding:10px;margin:5px 0 10px;border:1px solid var(--l);font:inherit}textarea{min-height:70px}button{background:var(--o);color:#fff;border:0;padding:10px 18px;cursor:pointer;font:inherit}button.g{background:none;color:var(--od);border:1px solid var(--o)}.cp{display:flex;gap:10px;align-items:center}.er{color:#a33;min-height:18px}
header{display:flex;justify-content:space-between;padding:14px 4%;background:#fff;border-bottom:1px solid var(--l);flex-wrap:wrap;gap:8px}main{padding:20px 4%;max-width:1100px;margin:auto}#pf{width:100%;max-width:560px;margin-bottom:20px}
.it{background:#fff;border:1px solid var(--l);padding:14px;margin-bottom:10px}.it b{color:var(--od)}.it select{padding:6px}.it button{margin:6px 6px 0 0;padding:6px 12px}
/* ---- animacoes ---- */
@keyframes up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes shine{from{left:-60%}to{left:130%}}
@keyframes bg{0%,100%{background-position:0 0}50%{background-position:100% 100%}}
@keyframes bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.lg{background:linear-gradient(120deg,#faf8f2,#fff,#f3e8c8,#faf8f2);background-size:300% 300%;animation:bg 14s ease infinite}
#f{animation:up .8s cubic-bezier(.2,.7,.2,1);position:relative}#f:before{content:"";position:absolute;left:0;right:0;top:-3px;height:3px;background:var(--o);transform-origin:left;animation:bar 1.1s .3s both}
#f>*{animation:up .6s both}#f>*:nth-child(2){animation-delay:.15s}#f>*:nth-child(3){animation-delay:.22s}#f>*:nth-child(4){animation-delay:.29s}#f>*:nth-child(5){animation-delay:.36s}#f>*:nth-child(6){animation-delay:.43s}#f>*:nth-child(7){animation-delay:.5s}
input,textarea,select{transition:border-color .25s,box-shadow .25s}input:focus,textarea:focus,select:focus{outline:0;border-color:var(--o);box-shadow:0 0 0 3px #b8923a22}
button{position:relative;overflow:hidden;transition:background .25s,transform .15s,color .25s}button:active{transform:scale(.96)}button:not(.g):hover{background:var(--od)}button.g:hover{background:var(--o);color:#fff}
button:not(.g):after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(90deg,transparent,#fff6,transparent);transform:skewX(-20deg)}button:not(.g):hover:after{animation:shine .8s}
#ap{animation:fade .6s}header{animation:up .6s}main section{animation:up .5s}
.it{animation:up .5s both;transition:transform .25s,box-shadow .25s,border-color .25s}.it:hover{transform:translateX(6px);border-color:var(--o);box-shadow:0 4px 14px #b8923a22}
.it:nth-child(2){animation-delay:.05s}.it:nth-child(3){animation-delay:.1s}.it:nth-child(4){animation-delay:.15s}.it:nth-child(5){animation-delay:.2s}.it:nth-child(n+6){animation-delay:.25s}
#pf{animation:up .5s}
@media(prefers-reduced-motion:reduce){*,*:after{animation:none!important;transition:none!important}}
/* ---- importacao ---- */
#si{max-width:760px}#si textarea{min-height:200px;font:13px ui-monospace,Consolas,monospace}#rs{white-space:pre-wrap;background:#fff;border:1px solid var(--l);padding:12px;min-height:44px;margin-top:14px}#bq{max-width:560px;margin-bottom:14px}