
:root{--red:#ff4058;--red2:#ff6b7d;--violet:#7c5cff;--green:#08d6a0;--bg:#060712;--panel:#121625;--panel2:#1c2033;--text:#fff;--muted:#bbb9d4;--line:rgba(255,255,255,.14);--soft:rgba(255,255,255,.06);--shadow:0 24px 90px rgba(0,0,0,.45)}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;background:var(--bg)}body{font-family:"DM Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;z-index:-3;background:radial-gradient(circle at 7% 8%,rgba(255,64,88,.26),transparent 28%),radial-gradient(circle at 92% 12%,rgba(124,92,255,.26),transparent 33%),radial-gradient(circle at 50% 105%,rgba(8,214,160,.16),transparent 38%),#060712}body:after{content:"";position:fixed;inset:0;z-index:-2;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:52px 52px}.dots{position:fixed;inset:0;pointer-events:none;z-index:-1;overflow:hidden}.dot{position:absolute;width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.34);box-shadow:0 0 16px rgba(255,255,255,.42);animation:rise linear infinite}@keyframes rise{0%{transform:translateY(110vh) translateX(0);opacity:0}12%{opacity:.7}100%{transform:translateY(-12vh) translateX(var(--x));opacity:0}}
a{color:inherit;text-decoration:none}.site-header{position:sticky;top:0;z-index:50;height:74px;padding:0 clamp(16px,4vw,52px);display:flex;align-items:center;justify-content:space-between;background:rgba(6,7,18,.82);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.08)}.logo{display:flex;align-items:center;gap:.7rem;font:800 clamp(1.25rem,3vw,1.75rem) Syne,system-ui;letter-spacing:-.04em;white-space:nowrap}.logo-icon{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,var(--red),var(--red2));display:grid;place-items:center;box-shadow:0 0 30px rgba(255,64,88,.35)}.logo span{color:var(--red)}.nav{display:flex;gap:1rem;align-items:center}.nav a{color:var(--muted);font-weight:800}.nav a:hover{color:white}.header-actions{display:flex;align-items:center;gap:.7rem}.btn{border:0;border-radius:999px;padding:.9rem 1.2rem;font-weight:900;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;transition:.18s;min-height:46px}.btn:hover{transform:translateY(-2px)}.primary{background:linear-gradient(135deg,var(--red),#ff6172);box-shadow:0 12px 34px rgba(255,64,88,.32);color:#fff}.ghost{background:rgba(255,255,255,.055);border:1px solid var(--line);color:#fff}.menu-btn{display:none;border:1px solid var(--line);background:var(--soft);width:44px;height:44px;border-radius:14px;color:#fff;font-size:1.2rem}.container{width:min(1180px,calc(100% - 32px));margin:0 auto}.hero{padding:clamp(3rem,8vw,6.5rem) 0 2rem;text-align:center}.eyebrow{color:var(--red);letter-spacing:.18em;text-transform:uppercase;font-weight:900;font-size:.78rem}.hero h1{font:800 clamp(3.2rem,9vw,7.5rem)/.86 Syne,system-ui;letter-spacing:-.07em;margin:.8rem auto 1rem;max-width:1050px}.hero p{color:var(--muted);font-size:clamp(1.05rem,2.4vw,1.35rem);line-height:1.55;max-width:760px;margin:0 auto}.searchbar{margin:2rem auto 0;max-width:760px;display:flex;gap:.7rem;background:rgba(255,255,255,.055);border:1px solid var(--line);border-radius:20px;padding:.5rem}.searchbar input{flex:1;background:transparent;border:0;color:white;outline:0;font:inherit;padding:.8rem 1rem}.searchbar input::placeholder{color:rgba(255,255,255,.45)}.tools-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin:2.5rem 0 4rem}.tool-card{background:linear-gradient(180deg,rgba(28,31,49,.82),rgba(16,19,31,.94));border:1px solid var(--line);border-radius:26px;padding:1.2rem;min-height:230px;display:flex;flex-direction:column;box-shadow:var(--shadow);position:relative;overflow:hidden}.tool-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 8%,rgba(255,64,88,.18),transparent 38%);opacity:.9}.tool-card>*{position:relative}.tool-card:hover{transform:translateY(-4px);border-color:rgba(255,64,88,.55)}.tool-icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:rgba(255,64,88,.16);font-size:1.55rem;margin-bottom:1.1rem}.tool-card h2,.tool-card h3{font-size:1.45rem;line-height:1.05;margin-bottom:.7rem}.tool-card p{color:var(--muted);line-height:1.45;flex:1}.tool-cta{color:#ff9aaa;font-weight:900;margin-top:1rem}.section{padding:3rem 0}.section h2{font:800 clamp(2.3rem,6vw,5rem)/.9 Syne,system-ui;letter-spacing:-.055em;text-align:center}.section-sub{color:var(--muted);text-align:center;font-size:1.05rem;line-height:1.55;margin:.8rem auto 2rem;max-width:720px}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.feature{background:rgba(255,255,255,.045);border:1px solid var(--line);border-radius:24px;padding:1.3rem}.feature h3{font-size:1.25rem;margin-bottom:.5rem}.feature p{color:var(--muted);line-height:1.55}.footer{border-top:1px solid rgba(255,255,255,.08);padding:2rem 0;color:var(--muted);text-align:center}.tool-hero{padding:clamp(2rem,6vw,5rem) 0 1rem}.breadcrumbs{display:flex;gap:.45rem;color:var(--muted);font-size:.9rem;margin-bottom:1.2rem;flex-wrap:wrap}.tool-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:1.2rem;align-items:start;margin:2rem 0 4rem}.tool-copy h1{font:800 clamp(3rem,8vw,6rem)/.88 Syne,system-ui;letter-spacing:-.065em;margin-bottom:1rem}.tool-copy p{color:var(--muted);font-size:1.08rem;line-height:1.65}.tool-card-runner{background:linear-gradient(180deg,rgba(28,31,49,.9),rgba(11,14,24,.96));border:1px solid var(--line);border-radius:30px;padding:1.2rem;box-shadow:var(--shadow)}.upload-box{border:2px dashed rgba(255,255,255,.22);border-radius:24px;background:rgba(255,255,255,.035);min-height:210px;display:grid;place-items:center;text-align:center;padding:1rem;cursor:pointer}.upload-box:hover{border-color:var(--red);box-shadow:0 0 28px rgba(255,64,88,.13)}.upload-box input{display:none}.upload-icon{font-size:3rem;margin-bottom:.6rem}.upload-box h2{font-size:1.35rem}.upload-box p{color:var(--muted);margin-top:.35rem}.file-list{display:flex;flex-wrap:wrap;gap:.55rem;margin:1rem 0}.pill{display:inline-flex;align-items:center;gap:.35rem;border:1px solid var(--line);background:rgba(255,255,255,.06);border-radius:999px;padding:.55rem .75rem;color:var(--muted);font-size:.9rem}.params{display:grid;gap:.85rem;margin:1rem 0}.field label{display:block;font-weight:900;color:#ddd;margin-bottom:.4rem}.field input,.field select,.field textarea{width:100%;background:rgba(255,255,255,.055);border:1px solid var(--line);border-radius:14px;color:#fff;padding:.9rem 1rem;font:inherit;outline:0}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--red);box-shadow:0 0 0 4px rgba(255,64,88,.1)}.runner-actions{display:flex;gap:.7rem;flex-wrap:wrap}.result{margin-top:1rem;border:1px solid var(--line);background:rgba(0,0,0,.2);border-radius:18px;padding:1rem;color:var(--muted);line-height:1.55;white-space:pre-wrap}.result.ok{border-color:rgba(8,214,160,.35);background:rgba(8,214,160,.08);color:#c8fff0}.result.err{border-color:rgba(255,64,88,.45);background:rgba(255,64,88,.08);color:#ffd7dd}.content-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.content-box{background:rgba(255,255,255,.045);border:1px solid var(--line);border-radius:24px;padding:1.2rem}.content-box h2{font-size:1.35rem;margin-bottom:.7rem}.content-box ol,.content-box ul{padding-left:1.2rem;color:var(--muted);line-height:1.7}.faq{display:grid;gap:.8rem;margin:2rem 0}.faq details{background:rgba(255,255,255,.045);border:1px solid var(--line);border-radius:18px;padding:1rem}.faq summary{cursor:pointer;font-weight:900}.faq p{color:var(--muted);line-height:1.55;margin-top:.6rem}.related{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1rem}.auth-page{min-height:calc(100vh - 74px);display:grid;place-items:center;padding:2rem}.auth-card{width:min(460px,100%);background:linear-gradient(180deg,rgba(28,31,49,.9),rgba(11,14,24,.96));border:1px solid var(--line);border-radius:28px;padding:1.3rem;box-shadow:var(--shadow)}.auth-card h1{font:800 2.8rem/.9 Syne,system-ui;letter-spacing:-.055em;margin-bottom:.5rem}.tabs{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:1rem 0}.tab{border:1px solid var(--line);background:rgba(255,255,255,.055);color:white;border-radius:14px;padding:.8rem;font-weight:900}.tab.active{background:linear-gradient(135deg,var(--red),#ff6172)}.hidden{display:none!important}.notice{padding:.75rem;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid var(--line);color:var(--muted);margin-top:.8rem}.mobile-bottom{display:none}
@media(max-width:980px){.nav{display:none}.menu-btn{display:grid}.tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-layout{grid-template-columns:1fr}.features,.content-grid{grid-template-columns:1fr}.hero{text-align:left}.hero p{margin-left:0}.searchbar{margin-left:0}.site-header{height:66px;padding:0 14px}.logo-icon{width:40px;height:40px}.tool-card{min-height:190px}.tool-copy h1{font-size:3.2rem}.tool-card-runner{border-radius:24px;padding:1rem}.upload-box{min-height:170px}.runner-actions{display:grid;grid-template-columns:1fr}.runner-actions .btn{width:100%}}
@media(max-width:560px){.container{width:calc(100% - 24px)}.hero{padding-top:2.2rem}.hero h1{font-size:2.65rem}.tools-grid{gap:.75rem}.tool-card{min-height:165px;border-radius:20px;padding:.9rem}.tool-icon{width:48px;height:48px;border-radius:14px;font-size:1.35rem}.tool-card h2,.tool-card h3{font-size:1.1rem}.tool-card p{font-size:.86rem}.tool-cta{font-size:.85rem}.header-actions .ghost{display:none}.section h2{font-size:2.2rem}.tool-copy h1{font-size:2.55rem}.tool-copy p{font-size:.96rem}.upload-box h2{font-size:1.1rem}.content-box{border-radius:20px}.auth-page{padding:1rem}.auth-card h1{font-size:2.2rem}.btn{min-height:48px}.footer{padding-bottom:5rem}.mobile-bottom{position:fixed;display:flex;bottom:0;left:0;right:0;height:64px;background:rgba(6,7,18,.9);backdrop-filter:blur(16px);border-top:1px solid rgba(255,255,255,.1);z-index:70;justify-content:space-around;align-items:center}.mobile-bottom a{font-weight:900;color:var(--muted);font-size:.8rem}.mobile-bottom a.active{color:#fff}}
