:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:#123d38;background:#f2f5ef;--ink:#123d38;--muted:#66756e;--deep:#0e4d43;--line:#d8e2db;--shadow:0 22px 60px rgba(20,61,54,.11)}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 88% 8%,#dcefe4 0,transparent 34%),linear-gradient(145deg,#f7f9f4,#edf3ec);overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.25;background-image:radial-gradient(#9db9a9 .6px,transparent .6px);background-size:18px 18px;mask-image:linear-gradient(135deg,#000,transparent 75%)}header{height:76px;padding:0 clamp(20px,6vw,92px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(185,205,193,.7);background:rgba(247,250,246,.68);backdrop-filter:blur(18px);position:relative;z-index:2}header strong{font-size:14px;letter-spacing:.22em;color:var(--ink)}header span{font-size:10px;letter-spacing:.14em;color:#78877f}main{max-width:1150px;margin:0 auto;padding:clamp(54px,8vw,104px) 24px 80px}.eyebrow{margin:0 0 22px;color:var(--deep);font-size:11px;font-weight:800;letter-spacing:.18em}.eyebrow span{color:#9bb5a8;margin:0 6px}h1{font-size:clamp(42px,7vw,86px);line-height:.98;letter-spacing:-.065em;margin:0;color:var(--ink);animation:rise .75s cubic-bezier(.2,.7,.2,1) both}h1 em{font-style:normal;color:transparent;-webkit-text-stroke:1px #397064}.lede{max-width:600px;margin:28px 0 0;color:var(--muted);font-size:clamp(16px,2vw,19px);line-height:1.55}form{display:grid;grid-template-columns:minmax(0,1fr) 210px auto;gap:14px;align-items:stretch;padding:14px;margin-top:38px;background:rgba(255,255,255,.72);border:1px solid rgba(190,210,199,.9);border-radius:24px;box-shadow:var(--shadow);backdrop-filter:blur(18px);animation:rise .85s .12s cubic-bezier(.2,.7,.2,1) both}.dropzone{min-height:118px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;border:1px dashed #a9c5b5;border-radius:16px;background:linear-gradient(135deg,rgba(235,248,239,.86),rgba(255,255,255,.5));cursor:pointer;transition:.25s ease}.dropzone:hover,.dropzone.dragover{border-color:var(--deep);background:#e5f5ea;transform:translateY(-2px);box-shadow:0 12px 24px rgba(20,75,61,.08)}.drop-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:#d1eee0;color:var(--deep);font-size:22px}.dropzone strong{font-size:15px}.dropzone small{color:var(--muted);font-size:11px}.dropzone input{position:absolute;width:1px;height:1px;opacity:0}.field{display:grid;align-content:center;gap:9px;padding:0 12px;color:var(--muted);font-size:12px;font-weight:700}.field select{width:100%;padding:13px 12px;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:10px;font:inherit;font-weight:500}button{border:0;border-radius:12px;padding:0 22px;background:linear-gradient(135deg,#165a4d,#0c4038);color:#fff;font:700 14px inherit;cursor:pointer;box-shadow:0 10px 24px rgba(14,77,67,.2);transition:.22s ease}button:hover{transform:translateY(-2px);box-shadow:0 15px 30px rgba(14,77,67,.28)}button:disabled{opacity:.5;transform:none}.note{margin:15px 5px 0;font-size:11px;line-height:1.6;color:#718078}.note:before{content:"✓";display:inline-grid;place-items:center;width:18px;height:18px;margin-right:7px;border-radius:50%;background:#d8eee1;color:var(--deep);font-weight:800}#history{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}#history button{padding:9px 12px;background:#fff;color:var(--deep);border:1px solid var(--line);box-shadow:none;font-size:11px}#status{display:flex;align-items:center;gap:9px;margin:28px 0;font-weight:700;color:var(--deep);font-size:14px}.status-dot{width:8px;height:8px;border-radius:50%;background:#73b99b;box-shadow:0 0 0 5px rgba(115,185,155,.16);animation:pulse 2s infinite}section{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding-top:20px}section[hidden]{display:none}section>div{min-width:0}h2{font-size:18px;letter-spacing:-.02em}iframe,textarea{width:100%;height:480px;box-sizing:border-box;border:1px solid #c8d7cc;border-radius:16px;background:#fff;box-shadow:0 10px 30px rgba(20,61,54,.07)}textarea{padding:18px;line-height:1.65;color:var(--ink);resize:vertical}img{max-width:100%;max-height:540px;object-fit:contain;border-radius:16px}.layout{margin:14px 0;padding:15px 17px;border:1px solid #cbded1;border-radius:14px;background:rgba(236,247,239,.85)}.layout[hidden]{display:none}.layout h3{margin:0;font-size:15px}.layout p{margin:6px 0 0;font-size:12px;line-height:1.5;color:var(--muted)}#download,#delete{margin-top:12px;padding:12px 15px;font-size:12px}#delete{background:#fff;color:#9b4d4d;border:1px solid #e7cccc;box-shadow:none}@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}@keyframes pulse{50%{box-shadow:0 0 0 9px rgba(115,185,155,0)}}@media(max-width:760px){header{height:64px;padding:0 20px}header span{max-width:150px;text-align:right;font-size:9px}main{padding-top:48px}form{grid-template-columns:1fr;margin-top:30px;padding:10px;border-radius:19px}.field{padding:12px 5px}.field select{padding:12px}button{min-height:50px}section{grid-template-columns:1fr;gap:30px}iframe,textarea{height:380px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
:root{--progress-glow:#6fc8a1}.progress-card{margin-top:22px;padding:16px 18px;border:1px solid #c9dfd0;border-radius:16px;background:rgba(235,248,239,.72);box-shadow:0 12px 32px rgba(20,61,54,.07);animation:rise .35s ease both}.progress-card[hidden]{display:none}.progress-head{display:flex;justify-content:space-between;gap:15px;color:var(--deep);font-size:12px;font-weight:800}.progress-head span:last-child{color:var(--muted);font-variant-numeric:tabular-nums}.progress-track{height:8px;margin-top:12px;overflow:hidden;border-radius:99px;background:#d7e8dc}.progress-track span{display:block;width:42%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#267763,#a6e6bf,#267763);background-size:200% 100%;animation:progressFlow 1.8s ease-in-out infinite}.progress-hint,.progress-card p{margin:10px 0 0;color:var(--muted);font-size:11px;line-height:1.4}@keyframes progressFlow{0%{transform:translateX(-120%);background-position:0 0}55%{transform:translateX(140%);background-position:100% 0}100%{transform:translateX(260%);background-position:0 0}}