.operation-panel{margin:0 0 28px;border:1px solid #dcdef1;border-radius:24px;background:#fff;overflow:hidden;color:#211b47}.operation-hero{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:36px;background:linear-gradient(120deg,#ecfcff,#f3efff)}.operation-hero h2{font-size:clamp(25px,3vw,36px);line-height:1.2;margin:12px 0}.operation-hero p{max-width:600px;line-height:1.7;color:#656882}.operation-art{position:relative;flex:0 0 120px;height:116px}.operation-window{display:grid;place-items:center;width:98px;height:98px;border-radius:24px;border:4px solid #fff;background:linear-gradient(140deg,#06c9db,#9773f4);color:#fff;font-size:54px;font-weight:800;box-shadow:0 15px 35px #7764ce25;transform:rotate(-8deg)}.operation-spark{position:absolute;right:0;top:0;color:#7360c9;font-size:38px}.is-building .operation-window{animation:hydia-build 3s ease-in-out infinite}.operation-steps{display:flex;gap:18px;list-style:none;padding:22px 36px;margin:0;border-bottom:1px solid #eeedf5;counter-reset:step}.operation-steps li{flex:1;font-size:13px;color:#76748b;counter-increment:step}.operation-steps li:before{content:counter(step);display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#eeedf5;margin-right:8px}.operation-steps .done{color:#5441a3}.operation-steps .done:before{background:#e9e2ff}.operation-details{padding:28px 36px}.operation-links{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:28px}.operation-domain h3{font-size:21px;margin:0 0 10px}.operation-domain p{line-height:1.6;color:#696b86}.operation-domain-form{display:flex;align-items:end;gap:16px;margin:20px 0}.operation-domain-form .field{flex:1;margin:0}.operation-domain-status{font-size:14px}.operation-dns{white-space:pre-wrap;overflow-wrap:anywhere;background:#f6f5fc;padding:18px;border-radius:12px;font-family:inherit;font-size:14px;line-height:1.7}@keyframes hydia-build{50%{transform:translateY(-9px) rotate(3deg)}}@media(prefers-reduced-motion:reduce){.is-building .operation-window{animation:none}}@media(max-width:640px){.operation-hero{padding:24px;gap:12px}.operation-art{flex-basis:65px;height:70px}.operation-window{width:60px;height:60px;font-size:34px;border-radius:17px}.operation-spark{font-size:25px}.operation-steps{padding:20px 24px;flex-direction:column;gap:12px}.operation-details{padding:24px}.operation-domain-form{align-items:stretch;flex-direction:column}.operation-links .button{width:100%;text-align:center}}
