:root{--ink:#202923;--muted:#778078;--line:#e5e9e4;--paper:#fff;--canvas:#f5f7f4;--green:#167a55;--green-dark:#105b40;--lime:#d9f16a;--coral:#ef6a51;--blue:#4e7eb2;--shadow:0 16px 42px rgba(29,48,35,.08);--sans:'DM Sans',sans-serif;--display:'Space Grotesk',sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--canvas);color:var(--ink);font:14px/1.5 var(--sans);min-height:100vh}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.shell{min-height:100vh}.topbar{height:68px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px;position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:10px;font:700 20px var(--display);letter-spacing:-.6px}.brandmark{width:30px;height:30px;border-radius:9px;background:var(--green);display:grid;place-items:center;color:white}.brandmark svg{width:19px;height:19px}.toplinks{display:flex;gap:30px;color:#58625a;font-weight:600}.toplinks a:hover,.toplinks a.active{color:var(--green)}.account{display:flex;align-items:center;gap:10px}.button{height:38px;border:1px solid var(--line);border-radius:7px;background:white;color:var(--ink);padding:0 14px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:background .16s,border .16s,transform .16s}.button:hover{background:#f7faf6;border-color:#cbd5cd}.button.primary{background:var(--green);border-color:var(--green);color:white}.button.primary:hover{background:var(--green-dark);transform:translateY(-1px)}.button.dark{background:var(--ink);border-color:var(--ink);color:#fff}.button.small{height:34px;padding:0 11px;font-size:12px}.button.icon{width:38px;padding:0}.button svg{width:16px;height:16px}.layout{max-width:1440px;margin:auto;display:grid;grid-template-columns:242px minmax(0,1fr);min-height:calc(100vh - 68px)}.sidebar{padding:25px 15px 26px 24px;border-right:1px solid var(--line);background:#f9faf8;display:flex;flex-direction:column;gap:24px}.side-label{font-size:10px;text-transform:uppercase;letter-spacing:1.2px;color:#98a198;font-weight:700;padding:0 10px 7px}.side-group{display:grid;gap:3px}.side-link{min-height:37px;width:100%;display:flex;align-items:center;gap:10px;padding:0 10px;border:0;border-radius:6px;background:transparent;color:#576159;text-align:left;font-size:13px;font-weight:600}.side-link svg{width:16px;height:16px;color:#879189;flex:none}.side-link:hover,.side-link.active{background:#e9f2ec;color:var(--green)}.side-link.active svg{color:var(--green)}.side-link .count{margin-left:auto;color:#929c94;font-size:11px}.side-bottom{margin-top:auto;border-top:1px solid var(--line);padding-top:16px}.privacy-note{margin:14px 7px 0;padding:12px;background:#eef4ed;border-radius:6px;color:#607263;font-size:11px;line-height:1.45}.privacy-note strong{display:block;color:#385541;margin-bottom:3px}.main{padding:28px 42px 54px;min-width:0}.breadcrumbs{font-size:12px;color:#8b958d;margin-bottom:22px}.breadcrumbs span{color:#c0c7c1;padding:0 8px}.view{animation:appear .22s ease-out}@keyframes appear{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.welcome{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(260px,.9fr);align-items:center;gap:30px;background:#e8f0e8;border:1px solid #dce8dc;border-radius:9px;padding:34px 38px;min-height:238px;overflow:hidden;position:relative}.welcome:after{content:"";position:absolute;right:0;top:0;width:42%;height:100%;opacity:.45;background-image:radial-gradient(#93b7a1 1px,transparent 1px);background-size:13px 13px;mask-image:linear-gradient(90deg,transparent,#000)}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:1.35px;color:var(--green);font-weight:700;display:flex;align-items:center;gap:8px}.eyebrow:before{content:"";height:2px;width:20px;background:var(--coral)}h1,h2,h3,p{margin-top:0}h1{font:600 clamp(30px,3vw,42px)/1.08 var(--display);letter-spacing:-1.7px;margin:12px 0 10px;max-width:500px}.welcome p{color:#647269;margin:0 0 20px;max-width:440px}.hero-actions{display:flex;gap:9px;flex-wrap:wrap}.paper-stack{height:180px;position:relative;z-index:1;display:flex;justify-content:center;align-items:center}.sheet{position:absolute;width:128px;height:164px;background:#fff;border:1px solid #d9e0d9;border-radius:4px;box-shadow:0 9px 20px #5972601f;padding:17px 14px}.sheet.back{transform:rotate(10deg) translate(24px,4px);background:#f7fbf7}.sheet.mid{transform:rotate(-7deg) translate(-20px,6px);background:#fdfefd}.sheet.front{transform:rotate(1deg) translate(3px,0);padding-top:22px}.sheet-head{height:7px;background:#dbe5dd;width:54%;border-radius:2px;margin-bottom:13px}.sheet-line{height:4px;background:#e9eeea;border-radius:2px;margin:6px 0;width:90%}.sheet-line.short{width:60%}.sheet-chart{height:36px;margin-top:14px;border-radius:3px;background:linear-gradient(90deg,#d5efaa 0 23%,#75ad87 23% 46%,#b5d1ba 46% 70%,#3c8662 70%)}.sheet-tag{position:absolute;right:-22px;bottom:19px;background:var(--lime);padding:6px 9px;font-size:10px;font-weight:700;border-radius:3px;transform:rotate(4deg);box-shadow:0 3px 8px #536b4720}.section-head{display:flex;align-items:end;justify-content:space-between;margin:29px 0 13px}.section-head h2{font:600 18px var(--display);margin:0;letter-spacing:-.4px}.section-head p{font-size:12px;color:var(--muted);margin:3px 0 0}.link-button{border:0;background:transparent;color:var(--green);font-weight:700;font-size:12px;padding:5px}.link-button:hover{text-decoration:underline}.quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.tool-card{border:1px solid var(--line);background:#fff;border-radius:7px;padding:14px 14px 13px;text-align:left;min-height:112px;transition:transform .15s,border .15s,box-shadow .15s;color:var(--ink)}.tool-card:hover{transform:translateY(-2px);border-color:#b9d2bf;box-shadow:0 6px 18px #30483610}.tool-icon{height:31px;width:31px;border-radius:7px;display:grid;place-items:center;background:#eaf3eb;color:var(--green);margin-bottom:9px}.tool-icon svg{height:17px;width:17px}.tool-card strong{display:block;font-size:13px}.tool-card small{display:block;margin-top:3px;color:#88928a;font-size:11px}.catalog-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:26px}.catalog-toolbar{display:flex;align-items:center;gap:10px;margin:15px 0 20px}.search{position:relative;flex:1;max-width:390px}.search svg{position:absolute;left:12px;top:11px;width:16px;color:#89948b}.search input{width:100%;height:38px;border:1px solid var(--line);border-radius:6px;padding:0 12px 0 37px;background:#fff;outline:0}.search input:focus,.field:focus{border-color:#76a48a;box-shadow:0 0 0 3px #1b80531c}.filter-select{height:38px;border:1px solid var(--line);border-radius:6px;background:#fff;padding:0 28px 0 11px;color:#59655c}.category{margin-top:20px}.category-title{font:600 15px var(--display);margin:0 0 9px}.catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.catalog-item{border:1px solid var(--line);background:#fff;border-radius:6px;display:flex;align-items:center;gap:10px;padding:10px;text-align:left;min-width:0;color:var(--ink)}.catalog-item:hover{border-color:#b9d2bf;background:#fbfdfb}.catalog-item .tool-icon{height:30px;width:30px;margin:0;flex:none}.catalog-item strong{font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.catalog-item small{display:block;font-size:10px;color:#929b94;margin-top:2px}.catalog-side{border-left:1px solid var(--line);padding-left:21px}.side-panel{background:#fff;border:1px solid var(--line);border-radius:7px;padding:15px;margin-bottom:11px}.side-panel h3{font:600 14px var(--display);margin:0 0 6px}.side-panel p{font-size:11px;color:#79837b;margin:0 0 11px}.upload-panel{max-width:860px}.tool-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px}.tool-title-row h1{font-size:32px;margin:5px 0 7px}.tool-title-row p{margin:0;color:var(--muted)}.tool-layout{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:18px}.work-box,.options-box{border:1px solid var(--line);background:#fff;border-radius:8px}.work-box{padding:17px}.dropzone{min-height:235px;border:1.5px dashed #bacabd;border-radius:7px;background:#fbfdfb;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:25px;transition:.15s}.dropzone.dragging{background:#edf7ee;border-color:var(--green)}.upload-symbol{height:46px;width:46px;background:#e5f1e7;color:var(--green);border-radius:13px;display:grid;place-items:center;margin-bottom:10px}.upload-symbol svg{width:23px}.dropzone h3{font:600 16px var(--display);margin:0 0 4px}.dropzone p{font-size:12px;color:#879189;margin:0 0 13px}.file-hint{font-size:10px!important;margin-top:10px!important;margin-bottom:0!important}.file-list{display:grid;gap:7px;margin-top:12px}.file-row{display:flex;align-items:center;gap:10px;padding:9px 10px;border:1px solid var(--line);border-radius:6px;background:#fff}.file-badge{width:30px;height:34px;border-radius:4px;background:#fff0ed;color:var(--coral);display:grid;place-items:center;flex:none}.file-badge svg{width:16px}.file-meta{min-width:0;flex:1}.file-meta strong{font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-meta small{font-size:10px;color:#8d978f}.remove-file{border:0;background:transparent;color:#89928b;padding:5px}.remove-file svg{width:15px;height:15px;display:block}.options-box{padding:16px;height:max-content}.options-box h3{font:600 14px var(--display);margin:0 0 14px}.field-wrap{margin-bottom:13px}.field-wrap label{display:block;font-size:11px;font-weight:700;margin-bottom:5px;color:#46534a}.field{width:100%;height:36px;border:1px solid #dce3dd;border-radius:5px;padding:0 10px;background:#fff;outline:0;color:var(--ink)}textarea.field{height:75px;padding:9px;resize:vertical}.field-help{font-size:10px;color:#89938b;margin-top:4px}.check-row{display:flex;align-items:center;gap:8px;margin:11px 0;font-size:11px;color:#59645c}.md-info{border:1px dashed var(--line);border-radius:8px;padding:10px 12px;margin:0 0 12px;font-size:12px;color:var(--muted);display:grid;gap:4px}.md-info div{display:flex;justify-content:space-between;gap:10px}.md-info strong{color:var(--ink);font-weight:600;text-align:right}.check-row input{accent-color:var(--green)}.process-button{width:100%;height:41px;margin-top:8px}.privacy{display:flex;gap:7px;align-items:flex-start;font-size:10px;color:#839087;margin-top:12px;line-height:1.4}.privacy svg{width:14px;flex:none;color:var(--green)}.result{margin-top:14px;padding:12px 13px;background:#edf7ed;border:1px solid #cfe2d2;border-radius:6px;display:none;font-size:12px;color:#315f3d}.result.show{display:block}.result.error{background:#fff2ee;border-color:#f1d2c8;color:#904635}.result a{font-weight:700;text-decoration:underline;margin-left:5px}.info-strip{margin-top:13px;padding:12px 13px;border-radius:6px;background:#f6f7f5;color:#778078;font-size:11px;line-height:1.5}.info-strip strong{color:#48544a}.page-heading h1{font-size:32px;margin:7px 0 8px}.page-heading p{color:var(--muted);max-width:650px}.content-surface{background:#fff;border:1px solid var(--line);border-radius:8px;padding:22px;margin-top:20px}.pricing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}.price-card{border:1px solid var(--line);border-radius:7px;padding:18px}.price-card.featured{border-color:#80b095;box-shadow:inset 0 3px var(--green)}.price-card h3{font:600 16px var(--display);margin:0 0 6px}.price{font:700 26px var(--display);margin:12px 0}.price small{font:400 12px var(--sans);color:var(--muted)}.price-card p,.price-card li{font-size:12px;color:#778078}.price-card ul{padding-left:18px;line-height:2.1}.doc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.doc-item{padding:14px;border:1px solid var(--line);border-radius:6px}.doc-item h3{font:600 14px var(--display);margin:0 0 5px}.doc-item p{font-size:12px;color:var(--muted);margin:0}.footer{border-top:1px solid var(--line);margin-top:40px;padding-top:16px;display:flex;justify-content:space-between;gap:12px;color:#8a948c;font-size:11px}.footer-links{display:flex;flex-wrap:wrap;gap:15px}.toast{position:fixed;right:22px;bottom:22px;background:#202923;color:#fff;padding:11px 15px;border-radius:6px;box-shadow:var(--shadow);font-size:12px;z-index:50;opacity:0;transform:translateY(8px);transition:.2s;pointer-events:none}.toast.show{opacity:1;transform:translateY(0)}.modal-backdrop{position:fixed;inset:0;background:#13211866;z-index:40;display:none;align-items:center;justify-content:center;padding:20px}.modal-backdrop.show{display:flex}.modal{width:min(420px,100%);background:white;border-radius:9px;padding:22px;box-shadow:var(--shadow)}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.modal-head h2{font:600 18px var(--display);margin:0}.modal-close{background:transparent;border:0;font-size:23px;color:#7b857d}.mobile-menu{display:none}.user-chip{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:#4e5a51;max-width:260px}.user-chip span.email{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.plan-badge{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;padding:3px 7px;border-radius:4px;background:#eef1ed;color:#6b766e;flex:none}.plan-badge.premium{background:var(--lime);color:#2d3a14}.history-list{display:grid;gap:7px;margin-top:12px}.stat-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:16px}.stat{border:1px solid var(--line);border-radius:6px;padding:12px 14px}.stat small{display:block;color:var(--muted);font-size:11px}.stat strong{font:600 18px var(--display)}.upi-box{text-align:center}.upi-qr{width:190px;height:190px;margin:4px auto 10px;border:1px solid var(--line);border-radius:8px;padding:8px;background:#fff}.upi-qr img,.upi-qr svg{width:100%;height:100%;display:block}.upi-id{display:flex;align-items:center;justify-content:center;gap:8px;font-weight:700;margin-bottom:10px}.upi-steps{text-align:left;font-size:12px;color:#5e6a61;padding-left:18px;margin:12px 0}.notice{padding:10px 12px;border-radius:6px;background:#fff8e6;border:1px solid #f0e0b0;color:#7a5b12;font-size:12px;margin-bottom:12px}
@media(max-width:1100px){.main{padding:25px 26px 45px}.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-layout{grid-template-columns:minmax(0,1fr)}.catalog-side{display:none}.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-layout{grid-template-columns:minmax(0,1fr) 260px}}
@media(max-width:760px){.topbar{height:60px;padding:0 16px}.toplinks{display:none}.account .button:not(.primary){display:none}.layout{display:block}.sidebar{display:none}.main{padding:20px 16px 35px}.welcome{padding:24px 22px;grid-template-columns:1fr;min-height:0}.welcome h1{font-size:34px}.paper-stack{height:128px;margin-top:-5px}.sheet{transform-origin:center center;scale:.78}.sheet.back{transform:rotate(10deg) translate(24px,4px);scale:.78}.sheet.mid{transform:rotate(-7deg) translate(-20px,6px);scale:.78}.sheet.front{transform:rotate(1deg) translate(3px,0);scale:.78}.welcome:after{width:100%;height:50%;top:auto;bottom:0}.section-head{margin-top:24px}.tool-layout{grid-template-columns:1fr}.tool-title-row h1,.page-heading h1{font-size:28px}.options-box{order:0}.work-box{order:1}.dropzone{min-height:190px}.catalog-toolbar{flex-wrap:wrap}.search{max-width:none;flex-basis:100%}.catalog-grid{grid-template-columns:1fr 1fr}.catalog-item{padding:9px 7px;gap:7px}.catalog-item strong{font-size:11px}.catalog-item .tool-icon{height:27px;width:27px}.pricing-grid{grid-template-columns:1fr}.stat-row{grid-template-columns:1fr}.user-chip span.email{display:none}.footer{flex-direction:column}.mobile-menu{display:inline-flex}.breadcrumbs{margin-bottom:16px}}
@media(max-width:410px){.catalog-grid{grid-template-columns:1fr}.quick-grid{grid-template-columns:1fr 1fr}.tool-card{padding:12px;min-height:106px}.account .primary{height:34px;padding:0 10px}.brand{font-size:18px}}
/* ---------- Motion & polish ---------- */
:root{--ease:cubic-bezier(.2,.75,.2,1);--spring:cubic-bezier(.34,1.56,.64,1)}
body{background:radial-gradient(1200px 600px at 100% -10%,#e3f1e6 0,transparent 60%),radial-gradient(900px 500px at -10% 110%,#eef7d6 0,transparent 55%),var(--canvas);background-attachment:fixed}
.topbar{background:rgba(255,255,255,.82);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);transition:box-shadow .3s,background .3s}
.topbar.scrolled{box-shadow:0 8px 28px rgba(29,48,35,.09);background:rgba(255,255,255,.92)}
.brandmark{position:relative;overflow:hidden;background:linear-gradient(135deg,#1c9468,#105b40);box-shadow:0 4px 12px #167a5540;transition:transform .5s var(--spring)}
.brand:hover .brandmark{transform:rotate(-12deg) scale(1.08)}
.brandmark:after{content:"";position:absolute;inset:-40%;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%);transform:translateX(-100%);animation:brandShine 5s 1.2s infinite}
@keyframes brandShine{0%,70%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.toplinks a{position:relative;transition:color .2s}.toplinks a:after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:var(--green);transform:scaleX(0);transition:transform .3s var(--ease)}.toplinks a:hover:after,.toplinks a.active:after{transform:scaleX(1)}
.button{position:relative;overflow:hidden;transition:background .2s,border .2s,transform .25s var(--spring),box-shadow .25s}
.button:active{transform:scale(.97)}
.button.primary{background:linear-gradient(135deg,#1b8a61,#136a4a);box-shadow:0 6px 16px #167a5530}
.button.primary:hover{box-shadow:0 10px 24px #167a5545}
.button.primary:after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .6s var(--ease)}
.button.primary:hover:after{left:130%}
.button.working{pointer-events:none;opacity:.92}
.button.working:before{content:"";width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .7s linear infinite;flex:none}
@keyframes spin{to{transform:rotate(360deg)}}
.side-link{position:relative;transition:background .2s,color .2s,padding .25s var(--ease)}
.side-link:hover{padding-left:14px}
.side-link.active:before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:3px;background:var(--green);animation:growY .35s var(--spring)}
@keyframes growY{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.view{animation:viewIn .45s var(--ease)}
@keyframes viewIn{from{opacity:0;transform:translateY(10px);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
.stagger{animation:rise .55s var(--ease) backwards;animation-delay:calc(var(--i,0)*45ms + 80ms)}
@keyframes rise{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
/* Hero */
.welcome{background:linear-gradient(120deg,#e4f0e6,#edf6e2 45%,#e3efe9);background-size:200% 200%;animation:heroShift 14s ease-in-out infinite alternate;isolation:isolate}
@keyframes heroShift{from{background-position:0% 50%}to{background-position:100% 50%}}
.blob{position:absolute;border-radius:50%;filter:blur(38px);opacity:.55;z-index:-1;pointer-events:none}
.blob.b1{width:260px;height:260px;background:#bfe3a3;top:-80px;right:18%;animation:drift1 16s ease-in-out infinite alternate}
.blob.b2{width:220px;height:220px;background:#9fd3bd;bottom:-90px;left:30%;animation:drift2 19s ease-in-out infinite alternate}
.blob.b3{width:160px;height:160px;background:#f7c7b6;top:30%;right:-40px;opacity:.4;animation:drift1 22s ease-in-out infinite alternate-reverse}
@keyframes drift1{to{transform:translate(-60px,40px) scale(1.15)}}
@keyframes drift2{to{transform:translate(70px,-30px) scale(.9)}}
.welcome h1 .shine{background:linear-gradient(90deg,var(--green),#3fae7c,var(--coral),var(--green));background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:textShine 6s linear infinite}
@keyframes textShine{to{background-position:300% 0}}
.welcome .eyebrow,.welcome h1,.welcome p,.welcome .hero-actions{animation:rise .7s var(--ease) backwards}
.welcome h1{animation-delay:.08s}.welcome p{animation-delay:.16s}.welcome .hero-actions{animation-delay:.24s}
.paper-stack{transform:translate(calc(var(--px,0)*10px),calc(var(--py,0)*8px));transition:transform .4s var(--ease)}
.sheet{animation:float 6s ease-in-out infinite;transition:box-shadow .3s}
.sheet.back{animation-delay:-2s;animation-duration:7s}.sheet.mid{animation-delay:-4s;animation-duration:6.5s}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -9px}}
.welcome:hover .sheet{box-shadow:0 16px 30px #59726033}
.sheet-line{transform-origin:left;animation:lineIn .9s var(--ease) both .5s}
@keyframes lineIn{from{transform:scaleX(0)}}
.sheet-chart{transform-origin:bottom;animation:barUp 1.1s var(--spring) both .7s}
@keyframes barUp{from{transform:scaleY(0)}}
.sheet-tag{animation:tagPop .6s var(--spring) both 1.2s,wiggle 4s ease-in-out 2s infinite}
@keyframes tagPop{from{opacity:0;transform:rotate(4deg) scale(.4)}}
@keyframes wiggle{0%,90%,100%{rotate:0deg}93%{rotate:-4deg}96%{rotate:3deg}}
/* Cards */
.tool-card,.catalog-item,.price-card,.doc-item,.side-panel{position:relative;overflow:hidden}
.tool-card:before,.catalog-item:before,.price-card:before{content:"";position:absolute;inset:0;background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%),rgba(22,122,85,.10),transparent 60%);opacity:0;transition:opacity .3s;pointer-events:none}
.tool-card:hover:before,.catalog-item:hover:before,.price-card:hover:before{opacity:1}
.tool-card{transition:transform .35s var(--spring),border .2s,box-shadow .3s}
.tool-card:hover{transform:translateY(-5px);box-shadow:0 14px 30px #30483618}
.catalog-item{transition:transform .3s var(--spring),border .2s,background .2s,box-shadow .3s}
.catalog-item:hover{transform:translateY(-2px);box-shadow:0 8px 18px #3048360f}
.tool-icon{transition:transform .45s var(--spring),background .3s,color .3s}
.tool-card:hover .tool-icon,.catalog-item:hover .tool-icon{transform:rotate(-8deg) scale(1.12);background:var(--green);color:#fff}
.price-card{transition:transform .35s var(--spring),box-shadow .3s}
.price-card:hover{transform:translateY(-6px);box-shadow:0 18px 36px #30483614}
.price-card.featured{border-color:transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,var(--green),var(--lime),var(--coral),var(--green)) border-box;border:1.5px solid transparent;background-size:100% 100%,300% 300%;animation:ring 8s linear infinite}
@keyframes ring{to{background-position:0 0,300% 0}}
.popular{position:absolute;top:14px;right:14px;font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;background:var(--lime);color:#2d3a14;padding:3px 8px;border-radius:20px;animation:tagPop .6s var(--spring) both .5s}
.price{display:inline-block}
.price-card.featured .price{animation:pricePop .8s var(--spring) both .35s}
@keyframes pricePop{from{opacity:0;transform:scale(.6)}}
.doc-item,.stat{transition:transform .3s var(--spring),box-shadow .3s,border .2s}
.doc-item:hover,.stat:hover{transform:translateY(-3px);box-shadow:0 10px 22px #3048360f;border-color:#c9dccd}
/* Upload & results */
.dropzone{transition:background .25s,border-color .25s,transform .3s var(--spring)}
.dropzone:hover{border-color:#8fb89b;background:#f6fbf6}
.dropzone.dragging{transform:scale(1.015);box-shadow:0 0 0 6px #167a5514}
.upload-symbol{animation:bob 2.6s ease-in-out infinite}
.dropzone.dragging .upload-symbol{animation:bob .6s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.file-row{animation:rise .4s var(--ease) backwards}
.remove-file{transition:color .2s,transform .2s}.remove-file:hover{color:var(--coral);transform:scale(1.15)}
.result.show{animation:resultIn .5s var(--spring)}
@keyframes resultIn{from{opacity:0;transform:translateY(8px) scale(.96)}}
.result.show:not(.error):before{content:"✓";display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--green);color:#fff;font-weight:700;margin-right:8px;animation:checkPop .5s var(--spring) .1s both}
@keyframes checkPop{from{transform:scale(0) rotate(-45deg)}}
.result.error{animation:resultIn .5s var(--spring),shake .4s .1s}
@keyframes shake{25%{transform:translateX(-5px)}50%{transform:translateX(4px)}75%{transform:translateX(-2px)}}
#download-result{display:inline-block;animation:nudge 1.6s ease-in-out .6s 2}
@keyframes nudge{50%{transform:translateY(-2px)}}
/* Overlays */
.modal-backdrop{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.modal-backdrop.show{animation:fade .25s ease}
.modal-backdrop.show .modal{animation:modalIn .4s var(--spring)}
@keyframes fade{from{opacity:0}}
@keyframes modalIn{from{opacity:0;transform:translateY(16px) scale(.95)}}
.toast{transition:opacity .3s,transform .4s var(--spring)}
.plan-badge.premium{background:linear-gradient(90deg,#d9f16a,#f3ffb0,#d9f16a);background-size:200% 100%;animation:textShine 3s linear infinite}
.field{transition:border-color .2s,box-shadow .2s}
/* ---------- Themes: accent colors + dark mode ---------- */
:root{--surface:#fff;--surface-2:#f9faf8;--text-2:#576159;--soft:color-mix(in srgb,var(--green) 11%,#fff);--soft-2:color-mix(in srgb,var(--green) 5%,#fff)}
[data-accent="blue"]{--green:#2563eb;--green-dark:#1d4ed8}
[data-accent="violet"]{--green:#7c3aed;--green-dark:#6d28d9}
[data-accent="rose"]{--green:#e11d48;--green-dark:#be123c}
[data-accent="amber"]{--green:#c2410c;--green-dark:#9a3412}
[data-theme="dark"]{--ink:#e7ede8;--muted:#9aa69d;--line:#27302a;--paper:#161c18;--canvas:#0e1310;--surface:#161c18;--surface-2:#121714;--text-2:#aab5ad;--soft:color-mix(in srgb,var(--green) 20%,#161c18);--soft-2:color-mix(in srgb,var(--green) 9%,#161c18);--shadow:0 16px 42px rgba(0,0,0,.45);color-scheme:dark}
[data-theme="dark"][data-accent="green"]{--green:#2fb37f;--green-dark:#1f8f63}
[data-theme="dark"][data-accent="blue"]{--green:#4f8df7;--green-dark:#2f6fe0}
[data-theme="dark"][data-accent="violet"]{--green:#9b6bf7;--green-dark:#7c4ae8}
[data-theme="dark"][data-accent="rose"]{--green:#f05273;--green-dark:#d6335a}
[data-theme="dark"][data-accent="amber"]{--green:#f08a3c;--green-dark:#d96d1e}
body,.topbar,.sidebar,.tool-card,.catalog-item,.side-panel,.work-box,.options-box,.content-surface,.price-card,.doc-item,.stat,.file-row,.modal,.field,.search input,.filter-select{transition:background-color .35s,border-color .35s,color .35s}
.sidebar{background:var(--surface-2)}
.side-link{color:var(--text-2)}
.side-link:hover,.side-link.active{background:var(--soft);color:var(--green)}
.tool-icon,.upload-symbol{background:var(--soft);color:var(--green)}
.dropzone{background:var(--soft-2);border-color:color-mix(in srgb,var(--green) 28%,var(--line))}
.dropzone:hover{background:var(--soft-2);border-color:color-mix(in srgb,var(--green) 55%,var(--line))}
.dropzone.dragging{background:var(--soft);border-color:var(--green);box-shadow:0 0 0 6px color-mix(in srgb,var(--green) 12%,transparent)}
.button.primary,.button.primary:hover{background:linear-gradient(135deg,var(--green),var(--green-dark));border-color:var(--green)}
.button.primary{box-shadow:0 6px 16px color-mix(in srgb,var(--green) 22%,transparent)}
.button.primary:hover{box-shadow:0 10px 24px color-mix(in srgb,var(--green) 32%,transparent)}
.brandmark{background:linear-gradient(135deg,var(--green),var(--green-dark));box-shadow:0 4px 12px color-mix(in srgb,var(--green) 28%,transparent)}
.tool-card:before,.catalog-item:before,.price-card:before{background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--green) 12%,transparent),transparent 60%)}
.search input:focus,.field:focus{border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 15%,transparent)}
.welcome{background:linear-gradient(120deg,var(--soft),color-mix(in srgb,var(--lime) 16%,var(--surface)) 45%,var(--soft-2));background-size:200% 200%;border-color:color-mix(in srgb,var(--green) 14%,var(--line))}
.blob.b2{background:color-mix(in srgb,var(--green) 40%,#fff)}
.price-card.featured{background:linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(135deg,var(--green),var(--lime),var(--coral),var(--green)) border-box;background-size:100% 100%,300% 300%}
.privacy-note{background:var(--soft-2);color:var(--muted)}.privacy-note strong{color:var(--ink)}
.result{background:var(--soft-2);border-color:color-mix(in srgb,var(--green) 25%,var(--line));color:var(--green-dark)}
.result.show:not(.error):before{background:var(--green)}
[data-theme="dark"] body{background:radial-gradient(1200px 600px at 100% -10%,color-mix(in srgb,var(--green) 13%,transparent) 0,transparent 60%),radial-gradient(900px 500px at -10% 110%,#18200f 0,transparent 55%),var(--canvas);background-attachment:fixed}
[data-theme="dark"] .topbar{background:rgba(18,23,20,.78);border-color:var(--line)}
[data-theme="dark"] .topbar.scrolled{background:rgba(18,23,20,.94);box-shadow:0 8px 28px rgba(0,0,0,.4)}
[data-theme="dark"] .toplinks{color:#aab5ad}
[data-theme="dark"] .button:not(.primary){background:var(--surface);color:var(--ink);border-color:var(--line)}
[data-theme="dark"] .button:not(.primary):hover{background:#1d2520;border-color:#3a463e}
[data-theme="dark"] :is(.tool-card,.catalog-item,.side-panel,.work-box,.options-box,.content-surface,.price-card:not(.featured),.doc-item,.stat,.file-row,.modal,.search input,.filter-select,.field){background-color:var(--surface);color:var(--ink);border-color:var(--line)}
[data-theme="dark"] .catalog-item:hover{background-color:#1b231e}
[data-theme="dark"] .welcome p{color:var(--muted)}
[data-theme="dark"] .welcome:after{opacity:.16}
[data-theme="dark"] .blob{opacity:.22}
[data-theme="dark"] .sheet{background:#eef3ef;border-color:#c9d3cb}
[data-theme="dark"] .info-strip{background:#131915;color:var(--muted)}[data-theme="dark"] .info-strip strong{color:var(--ink)}
[data-theme="dark"] .field-wrap label{color:#c4cdc6}
[data-theme="dark"] .check-row{color:#b7c1b9}
[data-theme="dark"] .plan-badge:not(.premium){background:#222b25;color:#aab5ad}
[data-theme="dark"] .result:not(.error){color:#c9f0dc}
[data-theme="dark"] .result.error{background:#2a1714;border-color:#4a2620;color:#f3ab9b}
[data-theme="dark"] .notice{background:#2a2410;border-color:#4a3f18;color:#ecd68e}
[data-theme="dark"] .file-badge{background:#2d1b17}
[data-theme="dark"] .modal-backdrop{background:rgba(0,0,0,.6)}
[data-theme="dark"] .modal-close{color:#aab5ad}
[data-theme="dark"] .toast{background:#e7ede8;color:#0e1310}
[data-theme="dark"] .side-label{color:#6f7a72}
[data-theme="dark"] .user-chip{color:#c4cdc6}
[data-theme="dark"] .price-card.featured .price,[data-theme="dark"] .price-card h3,[data-theme="dark"] .doc-item h3{color:var(--ink)}
/* Theme picker */
.theme-wrap{position:relative;display:flex;align-items:center;gap:10px}
#theme-btn svg{transition:transform .5s var(--spring)}#theme-btn:hover svg{transform:rotate(-25deg) scale(1.1)}
.theme-pop{position:absolute;right:0;top:calc(100% + 12px);width:250px;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:0 20px 44px rgba(20,30,24,.18);padding:14px;z-index:60;display:none;transform-origin:top right}
.theme-pop.show{display:block;animation:modalIn .35s var(--spring)}
.theme-pop h4{margin:0 0 8px;font:700 10px var(--sans);text-transform:uppercase;letter-spacing:1.1px;color:var(--muted)}
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;background:var(--surface-2);border:1px solid var(--line);border-radius:9px;padding:3px;margin-bottom:14px}
.seg button{border:0;background:transparent;color:var(--text-2);border-radius:6px;padding:7px 0;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:5px;transition:background .2s,color .2s}
.seg button svg{width:14px;height:14px}
.seg button.on{background:var(--surface);color:var(--green);box-shadow:0 1px 5px rgba(0,0,0,.14)}
.swatches{display:flex;gap:9px}
.swatch{width:32px;height:32px;border-radius:50%;border:3px solid var(--surface);box-shadow:0 0 0 1px var(--line);transition:transform .3s var(--spring),box-shadow .2s;display:grid;place-items:center;color:#fff}
.swatch svg{width:14px;height:14px;opacity:0;transition:opacity .2s}
.swatch:hover{transform:scale(1.13)}
.swatch.on{box-shadow:0 0 0 2px var(--ink)}.swatch.on svg{opacity:1}
.theme-note{font-size:10px;color:var(--muted);margin-top:12px}
/* Admin */
.admin-stats{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.stat strong.big{display:block;font-size:24px;margin:2px 0}
.tabs{display:flex;gap:4px;margin-top:22px;border-bottom:1px solid var(--line);overflow-x:auto}
.tab{border:0;background:transparent;padding:10px 14px;font-weight:700;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;transition:color .2s,border-color .2s}
.tab:hover{color:var(--ink)}.tab.on{color:var(--green);border-color:var(--green)}
.tab .count{background:var(--coral);color:#fff;border-radius:10px;padding:1px 7px;font-size:10px;margin-left:6px;animation:tagPop .5s var(--spring)}
.table-wrap{overflow-x:auto}
.admin-table{width:100%;border-collapse:collapse;font-size:12px}
.admin-table th{text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
.admin-table td{padding:10px;border-bottom:1px solid var(--line);vertical-align:middle}
.admin-table tbody tr{animation:rise .4s var(--ease) backwards;transition:background .2s}
.admin-table tbody tr:hover{background:var(--soft-2)}
.admin-table code{font-size:12px;background:var(--surface-2);border:1px solid var(--line);padding:2px 6px;border-radius:4px}
.pill{display:inline-block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:3px 8px;border-radius:20px}
.pill.pending{background:#fff1cc;color:#8a6200}.pill.approved{background:#dcf5e7;color:#11643f}.pill.rejected{background:#fde3de;color:#9a3a26}.pill.premium{background:var(--lime);color:#2d3a14}.pill.free{background:#eef1ed;color:#6b766e}
[data-theme="dark"] .pill.pending{background:#3a2f0e;color:#f5d06b}[data-theme="dark"] .pill.approved{background:#123524;color:#7fe0ad}[data-theme="dark"] .pill.rejected{background:#3a1a14;color:#f3a08e}[data-theme="dark"] .pill.free{background:#222b25;color:#aab5ad}
.admin-toolbar{display:flex;gap:10px;align-items:center;margin-bottom:14px;flex-wrap:wrap}
.msg-body{white-space:pre-wrap;word-break:break-word;margin:8px 0 10px;font-size:13px}
.button.danger{color:#b03a22}.button.danger:hover{border-color:#e9b3a6;background:#fff4f1}
[data-theme="dark"] .button.danger{color:#f3a08e}[data-theme="dark"] .button.danger:hover{background:#2a1714;border-color:#5a2c22}
.account .button.active{border-color:var(--green);color:var(--green)}
.sheet{color:#202923}
/* Promos, extension page, YouTube */
.promo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:26px}
.promo{display:flex;gap:14px;align-items:flex-start;padding:18px;border:1px solid var(--line);border-radius:10px;background:var(--surface);transition:transform .35s var(--spring),box-shadow .3s}
.promo:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(48,72,54,.1)}
.promo h3{font:600 16px var(--display);margin:4px 0 4px}.promo p{font-size:12px;color:var(--muted);margin:0 0 12px}
.promo-icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;flex:none;background:var(--soft);color:var(--green)}
.promo-icon svg{width:24px;height:24px}
.promo-icon.yt{background:#ffe5e5;color:#e62117}[data-theme="dark"] .promo-icon.yt{background:#3a1515;color:#ff5a4e}
.ext-promo{background:linear-gradient(135deg,var(--soft-2),var(--surface) 60%)}
.yt-btn{color:#e62117!important;border-color:#f5c2bf!important}.yt-btn:hover{background:#fff1f0!important}
[data-theme="dark"] .yt-btn{color:#ff6b61!important;border-color:#5a2420!important}[data-theme="dark"] .yt-btn:hover{background:#2a1513!important}
.yt-link{display:inline-flex;align-items:center;gap:7px;padding:6px 12px 6px 9px;border-radius:30px;font-size:12px;font-weight:700;color:#fff;background:linear-gradient(135deg,#ff0000,#c4302b);box-shadow:0 6px 16px rgba(230,33,23,.25);transition:transform .3s var(--spring),box-shadow .3s}
.yt-link svg{width:18px;height:18px}.yt-link:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 10px 22px rgba(230,33,23,.35)}
.pro-tag{font-size:9px;font-weight:800;letter-spacing:.6px;padding:2px 6px;border-radius:10px;background:var(--lime);color:#2d3a14;vertical-align:1px}
.ext-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.9fr);gap:28px;align-items:center;padding:30px 34px;border-radius:12px;border:1px solid var(--line);background:linear-gradient(120deg,var(--soft),var(--surface) 55%,var(--soft-2));overflow:hidden}
.ext-hero h1{margin:10px 0 8px}.ext-hero p{color:var(--muted);margin:0 0 18px}
.ext-mock{border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 22px 44px rgba(20,40,28,.14);overflow:hidden;animation:float 6s ease-in-out infinite}
.ext-bar{display:flex;align-items:center;gap:6px;padding:9px 10px;background:var(--surface-2);border-bottom:1px solid var(--line)}
.ext-bar>span{width:9px;height:9px;border-radius:50%;background:#ff5f57}.ext-bar>span:nth-child(2){background:#febc2e}.ext-bar>span:nth-child(3){background:#28c840}
.ext-url{flex:1;margin:0 8px;padding:4px 10px;border-radius:20px;background:var(--surface);border:1px solid var(--line);font-size:11px;color:var(--muted)}
.ext-pin{width:22px;height:22px;border-radius:6px;background:linear-gradient(135deg,var(--green),var(--green-dark));color:#fff;display:grid;place-items:center;box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 25%,transparent);animation:indiaGlow 3s infinite}
.ext-pin svg{width:13px;height:13px}
.ext-pop{margin:12px 12px 14px auto;width:78%;border:1px solid var(--line);border-radius:10px;padding:12px;background:var(--canvas);font-size:11px}
.ext-pop-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}.ext-pop-head b{display:flex;align-items:center;gap:6px;font-size:13px}.ext-pop-head svg{width:15px;height:15px;color:var(--green)}
.ext-pop-head em{font-style:normal;font-size:9px;font-weight:800;background:var(--lime);color:#2d3a14;padding:2px 7px;border-radius:10px}
.ext-pop-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px;border-radius:7px;color:#fff;font-weight:700;background:linear-gradient(135deg,var(--green),var(--green-dark));margin-bottom:9px}.ext-pop-btn svg{width:13px;height:13px}
.ext-pop-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px}.ext-pop-grid span{padding:7px;border:1px solid var(--line);border-radius:6px;background:var(--surface);font-weight:600}
.doc-item .tool-icon{margin-bottom:8px}
.install-steps{list-style:none;counter-reset:s;padding:0;margin:0 0 12px;display:grid;gap:10px}
.install-steps li{counter-increment:s;display:grid;grid-template-columns:30px 1fr;column-gap:10px;align-items:start;font-size:13px}
.install-steps li:before{content:counter(s);grid-row:span 2;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:12px;color:#fff;background:linear-gradient(135deg,var(--green),var(--green-dark))}
.install-steps li span{color:var(--muted);font-size:12px}
.install-steps code{font-size:11px;background:var(--surface-2);border:1px solid var(--line);padding:1px 5px;border-radius:4px}
@media(max-width:900px){.promo-grid,.ext-hero{grid-template-columns:1fr}.ext-hero{padding:22px}}
/* Made in India */
.flag{width:22px;height:15px;flex:none;border-radius:3px;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.flag circle:first-of-type{transform-origin:15px 10px;animation:chakra 6s linear infinite}
@keyframes chakra{to{transform:rotate(360deg)}}
.india-badge{position:relative;display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;padding:6px 14px 6px 8px;border-radius:30px;font-size:12px;color:var(--ink);background:linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(90deg,#FF9933,#fff 50%,#138808) border-box;border:1.5px solid transparent;box-shadow:0 6px 18px rgba(255,153,51,.18);animation:rise .7s var(--ease) .3s backwards,indiaGlow 3.5s ease-in-out 1.2s infinite}
.india-badge strong{background:linear-gradient(90deg,#e8791a,#1b1b8f 50%,#138808);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800;letter-spacing:.2px}
[data-theme="dark"] .india-badge strong{background-image:linear-gradient(90deg,#ffad5c,#f3f3ff 50%,#5fd35a)}
.privacy-note strong svg{width:14px;height:14px;vertical-align:-2px;margin-right:4px;color:var(--green)}
@keyframes indiaGlow{0%,100%{box-shadow:0 6px 18px rgba(255,153,51,.18)}50%{box-shadow:0 6px 22px rgba(19,136,8,.25)}}
.footer{align-items:center;flex-wrap:wrap}
.footer-brand{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.made-india{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;border-radius:30px;font-size:12px;color:var(--ink);background:linear-gradient(90deg,rgba(255,153,51,.14),rgba(255,255,255,0) 50%,rgba(19,136,8,.14));border:1px solid var(--line)}
.made-india strong{color:#138808}[data-theme="dark"] .made-india strong{color:#4cc24a}
.heart{color:#e0245e;display:inline-block;animation:beat 1.4s ease-in-out infinite}
@keyframes beat{0%,100%{transform:scale(1)}15%{transform:scale(1.25)}30%{transform:scale(1)}45%{transform:scale(1.18)}}
.ig-link{display:inline-flex;align-items:center;gap:7px;padding:6px 12px 6px 8px;border-radius:30px;font-size:12px;font-weight:700;color:#fff;background:linear-gradient(45deg,#f58529,#dd2a7b 50%,#8134af 80%,#515bd4);box-shadow:0 6px 16px rgba(221,42,123,.25);transition:transform .3s var(--spring),box-shadow .3s}
.ig-link svg{width:16px;height:16px}
.ig-link:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 10px 22px rgba(221,42,123,.35)}
.footer-brand .copy{color:#8a948c}
.google-btn{width:100%;height:42px;gap:10px;font-weight:700;background:var(--surface);color:var(--ink);border-color:var(--line)}
.google-btn svg{width:18px;height:18px;transition:transform .4s var(--spring)}
.google-btn:hover svg{transform:rotate(-12deg) scale(1.1)}
.or-divider{display:flex;align-items:center;gap:10px;margin:14px 0;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.8px}
.or-divider:before,.or-divider:after{content:"";flex:1;height:1px;background:var(--line)}
.content-surface .google-btn{max-width:360px}.content-surface .or-divider{max-width:360px}
.brand,.account .button{white-space:nowrap}
@media(max-width:400px){.account .button.primary{padding:0 9px}.signed-in .topbar:has(.account .button.primary) .brand-name{display:none}}
@media(max-width:760px){.account .button.keep{display:inline-flex;width:34px;padding:0}.account{gap:6px}.theme-wrap{gap:6px}.account .lbl{display:none}.account .plan-badge{display:none}.theme-pop{right:-60px}}
@media(min-width:761px){.account .button.keep svg{margin-right:-2px}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Photo resizer inputs, result hand-off, and the server-rendered SEO sections under each tool. */
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}
.next-tools{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px}.next-tools span{font-weight:700;margin-right:2px}.next-tools .button{height:30px;font-size:12px}
.seo-content{max-width:980px;margin:34px 0 10px;display:grid;gap:26px;color:var(--ink)}
.seo-content h2{font:600 22px/1.25 var(--display);margin:0 0 10px;letter-spacing:-.3px}
.seo-content p{margin:0 0 10px;color:var(--muted);font-size:14.5px;line-height:1.65}
.seo-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;counter-reset:step}
.seo-steps li{counter-increment:step;border:1px solid var(--line);border-radius:10px;padding:14px 14px 14px 50px;position:relative;background:var(--paper);font-size:13.5px}
.seo-steps li::before{content:counter(step);position:absolute;left:14px;top:13px;width:26px;height:26px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-weight:700;font-size:13px}
.seo-perks{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.seo-perks div{border:1px solid var(--line);border-radius:10px;padding:14px;background:var(--paper)}.seo-perks strong{display:block;margin-bottom:3px}.seo-perks span{color:var(--muted);font-size:13px}
.seo-faq details{border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:8px;background:var(--paper)}
.seo-faq summary{cursor:pointer;font-weight:700;list-style-position:outside}.seo-faq details p{margin:8px 0 0}
.seo-links{display:flex;flex-wrap:wrap;gap:8px}.seo-links a{border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-weight:600;font-size:13px;background:var(--paper)}.seo-links a:hover{border-color:var(--green);color:var(--green)}
.article{max-width:760px}.article h1{font:700 32px/1.2 var(--display);letter-spacing:-.6px;margin:6px 0 12px}.article h2{font:600 21px/1.3 var(--display);margin:26px 0 8px}.article p,.article li{font-size:15.5px;line-height:1.75;color:var(--ink)}.article ol,.article ul{padding-left:22px}.article .cta{display:inline-flex;margin:8px 0 4px}.article table{border-collapse:collapse;width:100%;font-size:14px;margin:10px 0}.article th,.article td{border:1px solid var(--line);padding:8px 10px;text-align:left}
.post-list{display:grid;gap:12px;max-width:760px}.post-list a{display:block;border:1px solid var(--line);border-radius:10px;padding:16px;background:var(--paper)}.post-list a:hover{border-color:var(--green)}.post-list strong{display:block;font:600 17px var(--display);margin-bottom:4px}.post-list span{color:var(--muted);font-size:13.5px}
.privacy-pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 11px;background:var(--soft-2,#eef6ef);color:var(--green-dark);font-weight:700;font-size:12px;margin-top:8px}
@media(max-width:560px){.seo-content h2{font-size:19px}.article h1{font-size:26px}.field-grid{grid-template-columns:1fr 1fr}}