:root{--ink:#f8f5ff;--muted:#b9b0d9;--line:rgba(255,255,255,.11);--cyan:#20e7ff;--pink:#ff4ccf;--amber:#ffc857;--green:#39f6b2;--red:#ff5f7e;--shadow:0 24px 70px rgba(27,13,61,.36)}
*{box-sizing:border-box}body{margin:0;min-height:100vh;overflow-x:hidden;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;color:var(--ink);background:radial-gradient(circle at 12% 92%,rgba(32,231,255,.42),transparent 18%),radial-gradient(circle at 86% 12%,rgba(255,76,207,.34),transparent 22%),linear-gradient(135deg,#dda4ff 0%,#9f7df2 45%,#6f54db 100%)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 18% 20%,rgba(255,255,255,.25),transparent 18%),radial-gradient(circle at 80% 70%,rgba(32,231,255,.17),transparent 20%);filter:blur(12px);z-index:0}
#particleWave{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.55;mix-blend-mode:screen}.shell{position:relative;z-index:1;min-height:100vh;padding:28px}.app-frame{width:min(1160px,100%);min-height:680px;margin:0 auto;display:grid;grid-template-columns:188px 1fr;gap:22px;position:relative}
.side{position:relative;z-index:1;padding:28px 14px;border-radius:28px;background:linear-gradient(180deg,rgba(88,66,144,.72),rgba(55,38,105,.58));box-shadow:var(--shadow);backdrop-filter:blur(18px);min-height:680px}.brand{display:flex;align-items:center;gap:11px;padding:5px 8px 22px}.brand-logo{width:42px;height:42px;border-radius:16px;display:grid;place-items:center;font-weight:950;background:linear-gradient(135deg,rgba(32,231,255,.42),rgba(255,76,207,.54));border:1px solid rgba(255,255,255,.18);box-shadow:0 12px 28px rgba(0,0,0,.22),inset 0 0 20px rgba(255,255,255,.10)}.brand b{display:block;font-size:14px}.brand span{display:block;margin-top:2px;color:#cfc4f1;font-size:11px}.menu{display:grid;gap:12px}
.menu-item{width:100%;min-height:48px;display:flex;align-items:center;gap:12px;border:0;border-radius:14px;padding:0 14px;color:#f2ecff;background:transparent;font-size:14px;font-weight:900;cursor:pointer;box-shadow:none;text-align:left}.menu-item:hover{background:rgba(255,255,255,.10);transform:none}.menu-item.active{background:rgba(20,16,45,.82);box-shadow:inset 3px 0 0 rgba(32,231,255,.9),0 12px 28px rgba(0,0,0,.16)}.menu-item i{width:28px;height:28px;border-radius:11px;display:grid;place-items:center;font-style:normal;background:rgba(255,255,255,.10);color:#d9f9ff}
.side-foot{position:absolute;left:16px;right:16px;bottom:18px;padding:16px;border-radius:22px;background:linear-gradient(180deg,rgba(22,19,48,.10),rgba(20,17,43,.64))}.wave-bars{height:42px;display:flex;align-items:center;gap:4px}.wave-bars i{flex:1;min-width:3px;border-radius:999px;background:linear-gradient(180deg,var(--cyan),var(--pink));animation:pulseBar 1.15s ease-in-out infinite alternate;opacity:.82}.wave-bars i:nth-child(2n){animation-delay:.12s}.wave-bars i:nth-child(3n){animation-delay:.24s}@keyframes pulseBar{from{height:12px}to{height:36px}}
.workspace{position:relative;z-index:1;min-height:680px;max-height:calc(100vh - 56px);padding:24px;border-radius:30px;background:linear-gradient(180deg,rgba(18,17,39,.94),rgba(13,13,30,.92));box-shadow:var(--shadow);overflow:auto}.workspace:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 80% 0,rgba(32,231,255,.12),transparent 24%),radial-gradient(circle at 0 90%,rgba(255,76,207,.13),transparent 28%)}.workspace::-webkit-scrollbar{width:10px}.workspace::-webkit-scrollbar-thumb{border-radius:999px;background:rgba(255,255,255,.16)}.topbar{position:relative;z-index:1;height:34px;display:flex;align-items:center;justify-content:center;margin-bottom:18px}.search{height:28px;width:min(430px,70%);border:1px solid rgba(255,255,255,.10);border-radius:8px;background:rgba(255,255,255,.045);color:#8f86b9;font-size:12px;display:flex;align-items:center;justify-content:center;gap:8px}.view{position:relative;z-index:1;display:none}.view.active{display:block}
.hero{min-height:150px;position:relative;overflow:hidden;border-radius:18px;padding:30px 34px;margin-bottom:22px;background:radial-gradient(circle at 20% 35%,rgba(255,76,207,.75),transparent 25%),radial-gradient(circle at 76% 35%,rgba(32,231,255,.82),transparent 32%),linear-gradient(120deg,#6049e8,#ed42bf 46%,#21d7ff);box-shadow:0 20px 42px rgba(0,0,0,.24)}.hero:before{content:"";position:absolute;right:55px;top:-48px;width:230px;height:230px;border-radius:45% 55% 45% 55%;background:rgba(255,255,255,.20);transform:rotate(18deg)}.hero h1{position:relative;z-index:1;margin:0;font-size:28px;line-height:1.25;text-align:center}.hero p{position:relative;z-index:1;margin:10px auto 0;color:rgba(255,255,255,.84);line-height:1.58;font-size:13px;text-align:center;max-width:560px}
.content-grid{display:grid;grid-template-columns:minmax(340px,.95fr) minmax(330px,1.05fr);gap:18px}.section-title{display:flex;justify-content:space-between;align-items:center;margin:0 0 10px}.section-title h2{margin:0;font-size:19px}.section-title span{color:#8b83ae;font-size:11px;font-weight:800}.form-card,.flow-card,.tool-card,.guide-card{border:1px solid rgba(255,255,255,.10);border-radius:20px;background:linear-gradient(180deg,rgba(70,58,115,.58),rgba(43,35,78,.72));box-shadow:0 18px 38px rgba(0,0,0,.20);padding:18px}.form-card{min-height:390px;background:radial-gradient(circle at 0 0,rgba(32,231,255,.18),transparent 36%),linear-gradient(180deg,rgba(77,66,125,.72),rgba(37,31,70,.78))}
.flow-card{min-height:390px;background:radial-gradient(circle at 100% 0,rgba(255,76,207,.18),transparent 36%),linear-gradient(180deg,rgba(56,47,103,.72),rgba(30,27,61,.82))}.field{margin-top:12px}label{display:flex;justify-content:space-between;gap:8px;margin:0 0 7px;color:#efeaff;font-weight:850;font-size:12px}label span{color:#a79cc9;font-weight:700}input,textarea{width:100%;border:1px solid rgba(255,255,255,.10);border-radius:12px;background:rgba(18,16,39,.72);color:#fff;padding:0 14px;font-size:13px;outline:none}input{height:43px}textarea{min-height:154px;padding:14px;resize:vertical;line-height:1.55}input::placeholder,textarea::placeholder{color:#726995}input:focus,textarea:focus{border-color:rgba(32,231,255,.62);box-shadow:0 0 0 4px rgba(32,231,255,.10);background:rgba(13,12,32,.86)}.hint{color:#998fbd;font-size:11px;line-height:1.55;margin-top:8px}.actions{display:grid;grid-template-columns:1fr;gap:10px;margin-top:18px}
button{border:0;min-height:43px;border-radius:13px;padding:11px 14px;cursor:pointer;font-weight:950;font-size:13px;transition:transform .16s ease,filter .16s ease,opacity .16s ease;box-shadow:0 14px 26px rgba(0,0,0,.22)}button:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.06)}button:disabled{opacity:.42;cursor:not-allowed}.primary{color:#19092a;background:linear-gradient(90deg,#25e5ff,#ff49cf)}.pause{color:#261300;background:linear-gradient(90deg,#ffc857,#ff9e4a)}
.summary{margin-bottom:14px}.summary strong{display:block;font-size:22px}.summary span{display:block;color:#a79cc9;font-size:12px;margin-top:5px}.meter{height:9px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.08);margin:13px 0 16px}.meter>i{display:block;height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,var(--cyan),var(--pink));transition:width .35s ease;box-shadow:0 0 24px rgba(32,231,255,.38)}.steps{display:grid;gap:9px}.step{display:grid;grid-template-columns:36px 1fr auto;gap:10px;align-items:center;padding:10px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:rgba(255,255,255,.055)}.step.active{border-color:rgba(32,231,255,.45);background:rgba(32,231,255,.10)}.step.done{border-color:rgba(57,246,178,.35);background:rgba(57,246,178,.08)}.step.error{border-color:rgba(255,95,126,.40);background:rgba(255,95,126,.10)}.icon{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;font-weight:1000;color:#b4abd2;background:rgba(255,255,255,.08);font-size:12px}.step h3{margin:0;font-size:12px}.step p{margin:3px 0 0;color:#9d93bf;font-size:10px;line-height:1.35}.step .state{border-radius:999px;padding:5px 8px;font-size:10px;font-weight:950;background:rgba(255,255,255,.07);color:#d8d1ee}.badge{display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.07);color:#dcd5f4;border-radius:999px;padding:7px 10px;font-size:11px;font-weight:900}.badge.running{color:#9ef5ff;background:rgba(32,231,255,.10);border-color:rgba(32,231,255,.30)}.badge.done{color:#bdffe6;background:rgba(57,246,178,.10);border-color:rgba(57,246,178,.30)}.badge.error{color:#ffd0da;background:rgba(255,95,126,.10);border-color:rgba(255,95,126,.30)}
.public-log{margin-top:16px}.public-log h3{margin:0 0 10px;color:#f1edff;font-size:13px}.log-line{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;margin-bottom:7px;border-radius:10px;color:#eee9ff;font-size:11px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.06)}.log-line b{color:#c8f8ff;white-space:nowrap}.job-id{margin-top:10px;color:#b9b0d9;font-size:11px;word-break:break-all}.page-title{margin:0 0 14px;font-size:28px}.tool-card,.guide-card{min-height:520px}.tool-code-list{display:grid;gap:10px;margin-top:14px}.code-card{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;border:1px solid rgba(255,255,255,.10);border-radius:14px;padding:12px;background:rgba(255,255,255,.07)}.code-card b{display:block;font-size:24px;letter-spacing:.16em;color:#c8f8ff}.code-card span{display:block;color:#a79cc9;font-size:11px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:520px}.copy-btn{min-height:36px;box-shadow:none;color:#19092a;background:linear-gradient(90deg,#25e5ff,#ff49cf)}
.tutorial-intro{margin:0 0 16px;color:#c9c1e6;font-size:13px;line-height:1.75}.tutorial-list{display:grid;gap:14px;margin-top:12px}.tutorial-card{width:100%;min-height:96px;display:grid;grid-template-columns:54px 1fr auto;align-items:center;gap:14px;text-align:left;border:1px solid rgba(255,255,255,.11);border-radius:18px;padding:16px;color:#fff;background:linear-gradient(135deg,rgba(32,231,255,.16),rgba(255,76,207,.14));box-shadow:0 16px 34px rgba(0,0,0,.18)}.tutorial-card .t-icon{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;font-size:21px;font-weight:950;color:#07111f;background:linear-gradient(135deg,#25e5ff,#ff49cf)}.tutorial-card b{display:block;margin-bottom:5px;font-size:17px}.tutorial-card p{margin:0;color:#c9c1e6;font-size:12px;line-height:1.55}.tutorial-card .arrow{color:#c8f8ff;font-size:24px}.tutorial-detail{display:none}.tutorial-detail.active{display:block}.tutorial-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.back-btn{min-height:36px;box-shadow:none;color:#c8f8ff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.10)}.warn-box{margin:14px 0 18px;border:1px solid rgba(255,200,87,.36);background:rgba(255,200,87,.12);color:#fff4c7;border-radius:16px;padding:14px;font-weight:900;line-height:1.7}.tutorial-steps{display:grid;gap:18px}.tutorial-step{border:1px solid rgba(255,255,255,.10);border-radius:18px;overflow:hidden;background:rgba(255,255,255,.055)}.tutorial-step-head{display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:start;padding:15px}.step-no{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;color:#07111f;font-weight:1000;background:linear-gradient(135deg,#25e5ff,#ff49cf)}.tutorial-step h3{margin:0;font-size:15px;line-height:1.45}.tutorial-step p{margin:6px 0 0;color:#b9b0d9;font-size:12px;line-height:1.75}.tutorial-images{display:grid;gap:10px;padding:0 15px 15px}.tutorial-images.two{grid-template-columns:repeat(2,minmax(0,1fr))}.tutorial-images.compact{max-width:680px}.tutorial-img{width:100%;display:block;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:#eef2f8;box-shadow:0 16px 34px rgba(0,0,0,.22)}.tutorial-img.compact{width:auto;max-width:100%;background:#fff}
@media(max-width:900px){.shell{padding:16px}.app-frame{grid-template-columns:1fr}.side{min-height:auto}.menu{grid-template-columns:repeat(3,1fr)}.side-foot{display:none}.content-grid{grid-template-columns:1fr}.hero h1,.hero p{text-align:left}}@media(max-width:700px){.tutorial-card{grid-template-columns:46px 1fr}.tutorial-card .arrow{display:none}.tutorial-images.two{grid-template-columns:1fr}}


.card-check-row{display:grid;grid-template-columns:1fr 112px;gap:10px}.verify-btn{min-height:43px;box-shadow:none;color:#19092a;background:linear-gradient(90deg,#8df6ff,#d866ff)}.card-status.ok{color:#bdffe6}.card-status.error{color:#ffd0da}.field.locked input{opacity:.62}.form-card.locked .actions .primary{filter:grayscale(.25)}
@media(max-width:560px){.card-check-row{grid-template-columns:1fr}.verify-btn{width:100%}}