*{box-sizing:border-box}:root{--ink:#15121c;--muted:#696372;--bg:#f6f7fb;--panel:#fff;--line:#e7e5ed;--hot:#ff4d2e;--orange:#ff8a1f;--pink:#ff2d7a;--purple:#6d3df5;--blue:#2f7cff;--green:#28a66a}
html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--ink);line-height:1.6}a{text-decoration:none;color:inherit}.wrap{width:min(1140px,92%);margin:auto}
header{background:rgba(255,255,255,.88);backdrop-filter:blur(18px);border-bottom:1px solid #e9e7ee;position:sticky;top:0;z-index:50}.nav{min-height:72px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:23px;font-weight:950;letter-spacing:-.7px}.brand span{background:linear-gradient(90deg,var(--hot),var(--pink),var(--purple));-webkit-background-clip:text;background-clip:text;color:transparent}.links{display:flex;gap:8px;font-size:14px;font-weight:850}.links a{padding:10px 14px;border-radius:999px;transition:.2s}.links a:hover{background:#f2efff;color:var(--purple)}
.hero{position:relative;overflow:hidden;padding:86px 0 58px;text-align:center;color:#fff;background:#12101a;isolation:isolate}.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 15% 30%,rgba(255,77,46,.32),transparent 25%),radial-gradient(circle at 85% 20%,rgba(109,61,245,.28),transparent 26%),radial-gradient(circle at 50% 110%,rgba(47,124,255,.2),transparent 34%);z-index:-2}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 0 32%,rgba(255,255,255,.035) 50%,transparent 68%);z-index:-1;pointer-events:none}.hero-content{position:relative;z-index:3}.pill{display:inline-block;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18);padding:8px 15px;border-radius:999px;font-size:13px;font-weight:900;box-shadow:0 12px 35px rgba(0,0,0,.2)}.hero h1{font-size:clamp(46px,7vw,78px);line-height:.98;letter-spacing:-3.2px;margin:20px 0 17px}.hero h1 span{background:linear-gradient(90deg,#ff8a1f,#ff4d2e,#ff2d7a,#8e6bff);-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{max-width:720px;margin:auto;color:#d9d5e1;font-size:18px}
.search{max-width:720px;margin:28px auto 0;position:relative}.search input{width:100%;padding:19px 76px 19px 54px;border:1px solid rgba(255,255,255,.16);border-radius:18px;font-size:16px;background:#fff;color:#17131d;box-shadow:0 18px 55px rgba(0,0,0,.28)}.search input:focus{outline:3px solid rgba(255,138,31,.35);border-color:#ff8a1f}.search-icon{position:absolute;left:20px;top:10px;font-size:31px;line-height:1;color:#7d7786;z-index:2}.search-hint{position:absolute;right:17px;top:16px;padding:5px 8px;border-radius:8px;background:#f0eef3;color:#77717e;font-size:12px;font-weight:800}.hero-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:18px}.hero-chip{padding:9px 13px;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.06);border-radius:999px;font-size:13px;font-weight:850;transition:.2s}.hero-chip:hover{background:#fff;color:#16121c;transform:translateY(-2px)}
.element-orbit{position:absolute;inset:0;pointer-events:none;z-index:1}.el{position:absolute;width:64px;height:64px;display:grid;place-items:center;border-radius:20px;font-style:normal;font-size:28px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.11);box-shadow:0 15px 50px rgba(0,0,0,.18);animation:float 6s ease-in-out infinite}.el-fire{left:8%;top:20%;animation-delay:-1s}.el-water{left:18%;bottom:10%;animation-delay:-3s}.el-earth{right:12%;top:18%;animation-delay:-2s}.el-air{right:7%;bottom:13%;animation-delay:-4s}.el-ether{left:48%;top:8%;animation-delay:-5s}@keyframes float{50%{transform:translateY(-12px) rotate(3deg)}}
.section{padding:52px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:22px}.section h2{font-size:32px;letter-spacing:-1px;margin:2px 0 0}.eyebrow{display:block;color:#817b8c;font-size:11px;letter-spacing:1.4px;font-weight:950}.section-note{color:#817b8c;font-size:13px;font-weight:750}.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.quick-card{display:flex;align-items:center;gap:13px;padding:18px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 8px 28px rgba(25,20,40,.05);transition:.2s}.quick-card:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(25,20,40,.1)}.quick-card>span{font-size:26px}.quick-card div{min-width:0;flex:1}.quick-card b{display:block;font-size:14px}.quick-card small{display:block;color:var(--muted);font-size:12px;line-height:1.35;margin-top:2px}.quick-card strong{font-size:20px}.q-fire{border-top:3px solid var(--hot)}.q-water{border-top:3px solid var(--blue)}.q-earth{border-top:3px solid var(--green)}.q-air{border-top:3px solid var(--purple)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{position:relative;background:#fff;border:1px solid var(--line);border-radius:20px;padding:23px;box-shadow:0 10px 32px rgba(25,20,40,.055);overflow:hidden;transition:transform .2s,box-shadow .2s,border-color .2s}.card:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--hot),var(--orange),var(--pink),var(--purple))}.card:hover{transform:translateY(-6px);box-shadow:0 20px 46px rgba(25,20,40,.12);border-color:#d9d5e1}.card-icon{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:13px;background:#f4f1ff;font-size:22px;margin-bottom:13px}.card h3{margin:0 0 7px;font-size:18px;letter-spacing:-.2px}.card p{margin:0;color:var(--muted);font-size:14px;min-height:45px}.card-link{display:inline-block;margin-top:15px;font-size:13px;color:#5d42d8}.surprise-hit{animation:hit 1.2s ease}@keyframes hit{0%,100%{transform:translateY(0);box-shadow:0 10px 32px rgba(25,20,40,.055)}35%{transform:translateY(-10px) scale(1.025);box-shadow:0 22px 55px rgba(109,61,245,.25)}}
.surprise{margin:10px 0 55px;padding:28px 30px;border-radius:24px;background:#15121e;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:25px;box-shadow:0 20px 60px rgba(20,15,30,.15)}.surprise .eyebrow{color:#aaa4b7}.surprise h2{margin:3px 0 4px;font-size:28px}.surprise p{margin:0;color:#c8c3cf;font-size:14px}.surprise button{border:0;border-radius:13px;padding:13px 19px;background:linear-gradient(135deg,var(--hot),var(--pink),var(--purple));color:#fff;font-weight:900;cursor:pointer;box-shadow:0 10px 25px rgba(255,45,122,.25);transition:.2s}.surprise button:hover{transform:translateY(-2px) scale(1.02)}
.tool{max-width:800px;margin:52px auto;padding:0 20px 50px}.tool h1{font-size:clamp(34px,5vw,46px);line-height:1.1;letter-spacing:-1.2px}.muted{color:var(--muted)}.fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}label{display:block;font-weight:800;font-size:14px;margin-bottom:12px}input,select,textarea{width:100%;margin-top:7px;padding:13px 14px;border:1px solid #d9d6df;border-radius:12px;font:inherit;background:#fff;transition:.18s}input:focus,select:focus,textarea:focus{outline:3px solid #ffe0d5;border-color:var(--hot);box-shadow:0 0 0 1px var(--hot)}button,.btn{border:0;border-radius:12px;padding:13px 20px;background:linear-gradient(135deg,var(--hot),var(--orange));color:#fff;font-weight:900;cursor:pointer;margin-top:7px;box-shadow:0 9px 22px rgba(255,77,46,.22);transition:.18s}button:hover,.btn:hover{transform:translateY(-2px);box-shadow:0 13px 28px rgba(255,77,46,.3)}button:disabled{opacity:.5;cursor:not-allowed;transform:none!important;box-shadow:none}.result{margin-top:20px;padding:20px;background:#fff7f2;border:1px solid #ffc6ae;border-radius:14px}.drop{border:2px dashed #c8c2d1;background:#fff;border-radius:16px;padding:34px;text-align:center}footer{background:#15121e;color:#ddd5df;padding:38px 0}.footerlinks{display:flex;gap:18px;flex-wrap:wrap}.footerlinks a{color:#fff}.footerlinks a:hover{color:#ff9a72}.small{font-size:13px;color:#aaa0ae}
@media(max-width:900px){.quick-grid{grid-template-columns:1fr 1fr}.grid{grid-template-columns:1fr 1fr}.el{opacity:.55}}@media(max-width:750px){.links{display:none}.hero{padding:68px 0 52px}.section{padding:38px 0}.section-head{align-items:start;flex-direction:column;gap:4px}.el-ether{display:none}}@media(max-width:560px){.quick-grid,.grid{grid-template-columns:1fr}.hero h1{font-size:44px;letter-spacing:-2px}.hero p{font-size:16px}.hero-actions{gap:7px}.hero-chip{font-size:12px}.card,.quick-card{padding:20px}.surprise{align-items:flex-start;flex-direction:column}.surprise button{width:100%}.search-hint{display:none}}

.panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:0 10px 32px rgba(25,20,40,.055)}
.tags{display:flex;flex-wrap:wrap;gap:8px}.tag{display:inline-block;background:#f4f1ff;color:#4f35c6;border:1px solid #ded6ff;padding:7px 10px;border-radius:999px;font-weight:800;font-size:13px}.dict-block{padding:12px 0;border-top:1px solid var(--line)}.dict-block h4{margin:0}.dict-block p{margin:7px 0;color:var(--muted)}.tool-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.tool-actions button{margin-top:0}.scan-preview{max-width:100%;max-height:360px;display:block;margin:18px auto;border-radius:12px;border:1px solid var(--line)}canvas.qr{display:block;max-width:100%;height:auto;margin:22px auto;border:12px solid #fff;box-shadow:0 8px 28px rgba(0,0,0,.08)}