@font-face{font-family:'Plus Jakarta Sans';font-weight:300;font-display:swap;src:url(/fonts/plus-jakarta-sans-latin-300-normal.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-weight:400;font-display:swap;src:url(/fonts/plus-jakarta-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-weight:600;font-display:swap;src:url(/fonts/plus-jakarta-sans-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-weight:700;font-display:swap;src:url(/fonts/plus-jakarta-sans-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-weight:800;font-display:swap;src:url(/fonts/plus-jakarta-sans-latin-800-normal.woff2) format('woff2')}

:root{
  --wj-blue:#003595;--wj-green:#47d7ac;--wj-grey:#a2a9ad;--wj-deep:#00266b;
  --ink:#0c1b3d;--muted:#5d6782;--line:#dfe5f0;--soft:#f2f5fb;--danger:#c0392b;--ok:#13795b;
  --sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);
  --sal:env(safe-area-inset-left,0px);--sar:env(safe-area-inset-right,0px);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;color:var(--ink);background:var(--wj-blue)}
button{font:inherit;color:inherit;touch-action:manipulation;cursor:pointer}
[hidden]{display:none!important}

.top{position:relative;overflow:hidden;color:#fff;padding:calc(var(--sat) + 26px) calc(var(--sar) + 22px) 46px calc(var(--sal) + 22px);background:radial-gradient(110% 80% at 100% 0%,rgba(71,215,172,.38),transparent 60%),radial-gradient(70% 60% at 0% 100%,rgba(26,86,214,.55),transparent 70%),var(--wj-blue)}
.top>*{max-width:520px;margin-left:auto;margin-right:auto}
.logo{display:block;width:140px;height:auto;margin-bottom:30px}
.title{margin:0 auto 10px;font-size:clamp(30px,8.4vw,40px);line-height:1.08;font-weight:800;letter-spacing:-.02em}
.title b{color:var(--wj-green);font-weight:800}
.sub{margin:0 auto;font-size:17px;line-height:1.45;color:rgba(255,255,255,.86);font-weight:400}

.sheet{flex:1;background:#fff;border-radius:24px 24px 0 0;margin-top:-20px;position:relative;padding:28px calc(var(--sar) + 20px) calc(var(--sab) + 40px) calc(var(--sal) + 20px)}
.sheet>*{max-width:520px;margin-left:auto;margin-right:auto}
.h2{font-size:26px;font-weight:800;color:var(--wj-blue);margin:6px 0 10px;letter-spacing:-.01em}
.lead{font-size:17px;line-height:1.5;color:var(--muted);margin:0}
.center{text-align:center}

.saved{background:#e6f9f2;color:var(--ok);border-radius:14px;padding:13px 15px;font-weight:600;font-size:15px;line-height:1.4;margin:0 0 22px}

.label{display:block;font-weight:700;font-size:15px;margin:0 0 8px;color:var(--wj-blue)}
.label small{font-weight:400;color:var(--muted)}
.input{display:block;width:100%;font:inherit;font-size:17px;line-height:1.45;padding:14px 16px;border:1.5px solid var(--line);border-radius:14px;background:var(--soft);color:var(--ink);outline:none;margin-bottom:22px;-webkit-appearance:none;appearance:none}
.input:focus{border-color:var(--wj-blue);background:#fff}
.input::placeholder{color:#8f99b2}
.area{resize:vertical;min-height:170px;margin-bottom:6px}
.row{display:flex;justify-content:flex-end;font-size:13px;margin:0 0 20px}
.muted{color:var(--muted)}

.btn{display:block;width:100%;padding:17px 20px;border:0;border-radius:999px;font-size:18px;font-weight:800;text-align:center;transition:transform .1s,opacity .2s}
.btn:active{transform:scale(.98)}
.btn:disabled{opacity:.55}
.btn-main{background:var(--wj-green);color:var(--wj-blue);margin-top:6px}
.btn-soft{background:var(--soft);color:var(--wj-blue);border:1.5px dashed #b6c2da;font-size:16px;font-weight:700}

.list{list-style:none;padding:0;margin:0 0 12px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.list:empty{display:none}
.item{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--soft)}
.item img{width:100%;height:100%;object-fit:cover;display:block}
.item .st{position:absolute;inset:auto 0 0 0;padding:5px 6px;font-size:12px;font-weight:700;color:#fff;background:linear-gradient(transparent,rgba(0,38,107,.88));text-align:center}
.item .prog{position:absolute;left:0;top:0;height:4px;background:var(--wj-green);width:0;transition:width .2s}
.item.done .st{display:none}
.item.fail .st{background:rgba(192,57,43,.9)}
.item.fail{cursor:pointer}
.item .del{position:absolute;top:6px;right:6px;width:30px;height:30px;border-radius:50%;border:0;background:rgba(0,38,107,.75);color:#fff;font-size:18px;line-height:30px;padding:0;display:none}
.item.done .del{display:block}

.msg{min-height:22px;margin:16px 0 4px;font-size:15px;font-weight:700;text-align:center}
.msg.ok{color:var(--ok)}
.msg.bad{color:var(--danger)}

@media (min-width:700px){.top{padding-top:calc(var(--sat) + 48px);padding-bottom:64px}.sheet{padding-top:38px}}