*{box-sizing:border-box}
body{margin:0;font:15px Arial,"Microsoft YaHei",sans-serif;background:#f5f7fb;color:#172033}
button,input,select,textarea{font:inherit}
.login{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#061d4b,#183e79)}
.loginbox{width:410px;background:#fff;padding:34px;border-radius:18px;box-shadow:0 24px 70px #0004}
.logo{max-width:160px;max-height:55px;object-fit:contain}
.side-logo{max-width:150px;max-height:42px;object-fit:contain;margin-bottom:7px}
.brand{font-size:25px;font-weight:800;color:#092b66}
.muted{color:#71809b}
.field{display:grid;gap:6px;margin:10px 0}
.field input,.field select,.field textarea{padding:11px;border:1px solid #dce2ed;border-radius:9px;background:#fff;width:100%}
.field select[multiple]{min-height:105px}
.check{align-content:center}
.check label{margin:7px 0}
.btn{border:0;border-radius:8px;padding:9px 13px;cursor:pointer;background:#e9eef8;color:#18335f}
.primary{background:#e9aa13;color:#111;font-weight:700}
.danger{background:#fee;color:#a22}
.full{width:100%}
.app{display:none}
.side{position:fixed;width:260px;top:0;bottom:0;background:white;border-right:1px solid #e3e7ef;padding:20px 16px;overflow:auto}
.nav{margin-top:18px}
.nav button{display:block;width:100%;text-align:left;padding:11px 12px;margin:2px 0;border:0;background:transparent;border-radius:8px;color:#4a5870;cursor:pointer}
.nav button.active{background:#f0f3fb;color:#0a2d68;font-weight:700;border-left:3px solid #e7aa17}
.main{margin-left:260px}
.top{height:68px;background:white;border-bottom:1px solid #e3e7ef;display:flex;align-items:center;justify-content:space-between;padding:0 28px}
.content{padding:28px;max-width:1640px}
.page{display:none}
.page.active{display:block}
h1{font-size:31px}
.card{background:white;border:1px solid #e0e5ee;border-radius:14px;padding:18px;margin:12px 0}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.metric b{font-size:28px;display:block;margin-top:8px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.toolbar,.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.tabs button{border:1px solid #dce2ed;background:white;padding:8px 12px;border-radius:8px;cursor:pointer}
.tbl{width:100%;border-collapse:collapse}
.tbl th,.tbl td{padding:10px;border-bottom:1px solid #edf0f5;text-align:left;vertical-align:top}
.tbl th{color:#71809b;white-space:nowrap}
.badge{display:inline-block;padding:3px 7px;border-radius:99px;background:#eef3ff}
.output{white-space:pre-wrap;background:#f8faff;border:1px dashed #cad5e8;padding:14px;border-radius:10px;min-height:120px}
.modal{position:fixed;inset:0;background:#0007;display:none;place-items:center;z-index:20}
.modal .box{background:white;width:min(800px,94vw);max-height:88vh;overflow:auto;padding:22px;border-radius:14px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sub{display:none}
.sub.active{display:block}
.scroll{overflow:auto}
.flow{padding:18px;background:#f8faff;border-radius:10px;line-height:2}
.checklist{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.checklist label{padding:10px;border:1px solid #e0e5ee;border-radius:8px;background:#fafcff}
.thumb{width:50px;height:50px;object-fit:cover;border-radius:7px;background:#eee}
@media(max-width:950px){.side{width:205px}
.main{margin-left:205px}
.grid2,.cards{grid-template-columns:1fr}
.checklist{grid-template-columns:1fr}
}
.workflow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:#fff;border:1px solid #dfe5ef;border-radius:14px;padding:13px 16px;margin:0 0 16px}
.workflow b{color:#10264b;margin-right:8px}
.workflow span{font-size:13px;background:#f3f6fb;border:1px solid #e2e8f0;border-radius:999px;padding:6px 10px}
.editor{width:100%;min-height:340px;resize:vertical;border:1px solid #d7dfec;border-radius:10px;padding:14px;font:inherit;line-height:1.65;box-sizing:border-box;background:#fbfcff}
.between{justify-content:space-between;align-items:center}
.statusline{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0 14px}
.mini-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.danger{color:#b42318}
.system-intro{padding:4px 0 14px;color:#667085}
.permission-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.permission-grid label{background:#f7f9fc;padding:8px;border-radius:8px}
.kvgrid{display:grid;grid-template-columns:220px 1fr auto;gap:10px;align-items:center}
.preview-img{max-width:100%;max-height:280px;border-radius:10px;border:1px solid #e1e6ef;margin-top:8px}
/* V8.1 navigation and brand refinement */
.loginbox{width:430px;text-align:center}.loginbox .field{text-align:left}
.logo{width:280px;max-width:none;height:118px;max-height:none;object-fit:cover;object-position:center;display:block;margin:0 auto 8px}
.side{width:276px;padding:14px 16px 20px}.main{margin-left:276px}
.side-logo{width:216px;max-width:none;height:92px;max-height:none;object-fit:cover;object-position:center;display:block;margin:0 auto}
.brand{display:none}.side>.muted{text-align:center;font-size:12px;line-height:1.45;padding:0 8px 12px;border-bottom:1px solid #edf0f5}
.nav{margin-top:12px;display:grid;gap:3px}.nav button{display:flex;align-items:center;min-height:42px;padding:10px 14px;margin:0;border-radius:9px;white-space:nowrap}
.nav button:hover{background:#f7f9fc;color:#173b72}.nav button.active{padding-left:10px;border-left:4px solid #e7aa17}
.nav button:nth-child(6),.nav button:nth-child(10),.nav button:nth-child(13){margin-top:9px;border-top:1px solid #edf0f5;border-radius:0;padding-top:17px}
.content{padding:28px 32px 48px;max-width:1680px}h1{font-size:30px;margin:8px 0 24px;letter-spacing:-.5px}
.empty-state{padding:30px;text-align:center;color:#71809b;background:#fafcff;border:1px dashed #cad5e8;border-radius:12px}
@media(max-width:950px){.side{width:218px}.main{margin-left:218px}.side-logo{width:178px;height:76px}}
.side-logo-wrap{width:244px;height:112px;overflow:hidden;position:relative;margin:0 auto 2px;background:#fff}
.side-logo-wrap .side-logo{position:absolute;width:360px;max-width:none;height:360px;max-height:none;left:-58px;top:-118px;object-fit:contain;margin:0}
.login-logo-wrap{width:330px;height:145px;overflow:hidden;position:relative;margin:0 auto 8px;background:#fff}
.login-logo-wrap .logo{position:absolute;width:470px;max-width:none;height:470px;max-height:none;left:-70px;top:-154px;object-fit:contain;margin:0}
.generation-status{min-height:32px;margin-top:12px;color:#38506f;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.generation-status small{width:100%;margin-left:28px;color:#71809b}.spinner{width:18px;height:18px;border:3px solid #f4d589;border-top-color:#b97800;border-radius:50%;animation:spin .8s linear infinite}.success-text{color:#087443}.btn:disabled{cursor:not-allowed;opacity:.65}@keyframes spin{to{transform:rotate(360deg)}}
