/* 众宜海鲜 · 视觉层。业务布局、表单标识和权限由原工作台维护。 */
:root{--navy:#193c58;--orange:#ed783f;--ink:#223b50;--muted:#718498;--line:#e6edf1;--surface:#f4f7f9}
body{color:var(--ink);background:var(--surface);font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif;-webkit-font-smoothing:antialiased}
/* Login: brand blue and orange in a light, quiet composition. */
#login{--pointer-x:32%;--pointer-y:38%;min-height:100vh;position:relative;isolation:isolate;overflow:hidden;background:#f4f6fb;color:#223b50;display:flex;align-items:center;justify-content:center;padding:48px 32px}
#login::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 0% 5%,#10367f26,transparent 57%),radial-gradient(ellipse at 100% 100%,#ff702d30,transparent 59%),linear-gradient(120deg,#eef3fc,#fff5ef)}
#login::after{content:"";position:absolute;width:600px;height:600px;border:1px solid #10367f09;border-radius:50%;top:-390px;right:-70px;z-index:-1;box-shadow:0 0 0 75px #10367f03,0 0 0 150px #10367f02;pointer-events:none}
.login-glow{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;transition:opacity .65s ease;background:radial-gradient(500px circle at var(--pointer-x) var(--pointer-y),#ffbe8c24,transparent 75%)}
.pointer-active .login-glow{opacity:1}.login-glow::before{content:"";position:absolute;left:var(--pointer-x);top:var(--pointer-y);width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,#ff9d6550,#f9b18b22 40%,transparent 72%);filter:blur(14px);transform:translate(-50%,-50%);animation:zy-glow-breathe 3.2s ease-in-out infinite;animation-play-state:paused}.pointer-active .login-glow::before{animation-play-state:running}
.glow-trail{position:absolute;width:250px;height:250px;border-radius:50%;animation:zy-glow-bloom 1.8s ease-out forwards;pointer-events:none}
.glow-trail::before{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,#9dbbe12e,#ffbb901a 36%,transparent 70%);filter:blur(16px)}
.glow-trail::after{content:"";position:absolute;inset:24%;border:1px solid #10367f38;border-radius:50%;box-shadow:0 0 0 19px #10367f08,0 0 0 38px #ff702d09}
.login-water{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.background-ring{position:absolute;width:600px;height:600px;border:1px solid #10367f19;border-radius:50%;box-shadow:0 0 0 48px #10367f07,0 0 0 96px #10367f04;animation:zy-water-ring 16s ease-in-out infinite}
.ring-blue{left:-300px;bottom:-300px;animation-delay:-4s}.ring-orange{right:-240px;top:-300px;border-color:#ff702d25;box-shadow:0 0 0 54px #ff702d09,0 0 0 108px #ff702d05;animation-delay:-11s;animation-duration:19s}
.background-wave{position:absolute;left:-25%;bottom:-280px;width:150%;height:420px;border-radius:45% 55% 0 0 / 80% 75% 0 0;border-top:1px solid #10367f13;background:linear-gradient(180deg,#10367f08,transparent 70%);animation:zy-water-swell 15s ease-in-out infinite alternate;transform-origin:50% 100%}
.wave-orange{bottom:-310px;left:-30%;width:170%;height:460px;border-color:#ff702d20;background:linear-gradient(180deg,#ff702d0d,transparent 75%);animation-delay:-7s;animation-duration:19s}
@keyframes zy-water-ring{0%,100%{transform:translate3d(0,0,0) scale(.85);opacity:.3}50%{transform:translate3d(40px,-25px,0) scale(1.25);opacity:.9}}
@keyframes zy-water-swell{0%{transform:translate3d(-3%,15px,0) rotate(-4deg)}100%{transform:translate3d(4%,-45px,0) rotate(4deg)}}
.effects-paused .login-water *{animation-play-state:paused}
@keyframes zy-glow-breathe{0%,100%{transform:translate(-50%,-50%) scale(.78);opacity:.5}50%{transform:translate(-50%,-50%) scale(1.18);opacity:1}}
@keyframes zy-glow-bloom{0%{transform:translate(-50%,-50%) scale(.45);opacity:0}20%{opacity:.65}100%{transform:translate(-50%,-50%) scale(1.65);opacity:0}}
.login-layout{width:1080px;max-width:100%;display:grid;grid-template-columns:1.08fr 1fr;gap:0;align-items:stretch;border-radius:26px;overflow:hidden;background:#fff;box-shadow:0 30px 90px #1b3f6912,0 2px 12px #1b3f6905;border:1px solid #fff;position:relative}
.login-story{min-width:0;display:flex;flex-direction:column;padding:42px 44px 30px;background:radial-gradient(ellipse at 20% 10%,#edf4ff,transparent 70%),linear-gradient(145deg,#f1f5fc,#fff2e6);position:relative;border-right:1px solid #edf0f4}
.login-wordmark{display:flex;align-items:center;align-self:flex-start;background:transparent;border:0;border-radius:0;padding:0;box-shadow:none}.login-wordmark>img{width:202px;height:auto;display:block}
.story-copy{margin-top:39px}.story-kicker{font-size:10px;letter-spacing:2px;color:#667c9a;display:flex;align-items:center;gap:8px}.story-kicker>span{width:5px;height:5px;border-radius:50%;background:#ff702d}
.story-copy h2{font-size:32px;line-height:1.55;font-weight:700;letter-spacing:.4px;margin:16px 0 12px;color:#173971}.story-copy h2>span{color:#ff702d}.story-copy p{color:#6f8097;font-size:12px;line-height:1.8;letter-spacing:.2px}
.sea-scene{height:264px;position:relative;margin:18px 0 0;transform:translate3d(var(--scene-x,0px),var(--scene-y,0px),0);transition:transform .35s ease-out;pointer-events:none}
.scene-cats{position:relative;width:100%;height:100%}.mascot-card{position:absolute;padding:7px;background:white;border:1px solid #ffffffa0;border-radius:20px;box-shadow:0 12px 28px #3e547416;overflow:hidden}.mascot-main{left:4px;top:8px;width:218px;transform:rotate(-7deg);z-index:2}.mascot-companion{right:4px;top:56px;width:177px;transform:rotate(8deg);z-index:3}
.cat-portrait{position:relative;display:block;overflow:hidden;border-radius:14px;background:#ff963d}.cat-portrait img{position:absolute;display:block;width:auto;height:125%;max-width:none;top:-5%}.cat-calico{height:177px}.cat-orange{height:144px;background:#42b5e9}.cat-calico img{left:0}.cat-orange img{right:0}.mascot-card>span{display:block;font-size:10px;letter-spacing:.5px;text-align:center;color:#697f98;margin:12px 0 5px}.mascot-card>span i{color:#ed9c6c;margin-right:4px}
.mascot-bubble{position:absolute;right:14px;top:4px;padding:9px 13px;border:1px solid #f2dcca;border-radius:20px 20px 20px 3px;font-size:10px;color:#9f7654;letter-spacing:.5px;background:#fffaf3;transform:rotate(4deg)}.mascot-bubble i{color:#f4a36a;margin-right:5px;font-size:9px}
.story-footer{margin-top:auto;display:flex;align-items:center;gap:9px;padding-top:14px;font-size:8px;letter-spacing:1.7px;color:#8192a9}.story-line{height:1px;width:20px;background:#a8b7ca}
#login .login-card{width:100%;margin:0;padding:62px 54px 37px;border-radius:0;color:#223b50;background:#fff;box-shadow:none;border:0;position:relative;transform:none;display:flex;flex-direction:column;justify-content:center}
.login-card-top{display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:1.5px;color:#8290a3;margin-bottom:31px}.login-card-top>i{color:#e8b18d;font-size:17px;transform:rotate(15deg)}
#login .login-card h1{font-size:30px;font-weight:700;letter-spacing:1px;margin:0 0 12px;color:#183767}#login .login-card h1>span{color:#ff702d}#login .login-card>.muted{font-size:12px;color:#8490a1;margin:0 0 15px;line-height:1.8}
#login .login-card .welcome-letter{display:inline-block;position:relative;isolation:isolate;color:inherit}
.welcome-title.is-revealing .welcome-letter{animation:zy-letter-arrive 3.6s ease-in-out infinite both;animation-delay:calc(.18s + var(--letter-index) * .16s)}
.welcome-letter::after{content:"";position:absolute;inset:10% -15%;z-index:-1;border-radius:50%;background:radial-gradient(ellipse,#ffb88670,#9db9f03b 50%,transparent 75%);filter:blur(9px);opacity:0;pointer-events:none}
.welcome-title.is-revealing .welcome-letter::after{animation:zy-letter-halo 3.6s ease-out infinite both;animation-delay:calc(.18s + var(--letter-index) * .16s)}
@keyframes zy-letter-arrive{0%,100%{opacity:0;transform:translateY(9px);filter:blur(5px);text-shadow:0 0 14px #8eaff080}18%{opacity:1;transform:translateY(0);filter:blur(0);text-shadow:0 0 15px #ffb27688}32%,70%{opacity:1;transform:translateY(0);filter:blur(0);text-shadow:0 0 0 transparent}86%{opacity:0;transform:translateY(-4px);filter:blur(3px);text-shadow:0 0 0 transparent}}
@keyframes zy-letter-halo{0%{opacity:0;transform:scale(.65)}12%{opacity:.85}30%,100%{opacity:0;transform:scale(1.5)}}
.effects-paused .welcome-letter,.effects-paused .welcome-letter::after{animation-play-state:paused}
#login .login-card label{display:block;margin:23px 0 0;font-size:12px;font-weight:500;letter-spacing:.3px;color:#415674}.login-input{position:relative;margin-top:10px}.login-input>i{position:absolute;left:16px;top:17px;font-size:15px;color:#96a6bb;pointer-events:none}
#login .login-card .form-control{height:50px;border:1px solid #e4e9f0;background:#fafbfd;border-radius:10px;padding-left:43px;font-size:13px;box-shadow:none;transition:border-color .2s,box-shadow .2s,background .2s}#login .login-card .form-control:focus{border-color:#8ca8d2;background:#fff;box-shadow:0 0 0 4px #10367f08}#login .form-control::placeholder{color:#a0acbb;font-size:12px}
#login .login-card .btn{height:50px;border-radius:10px;margin-top:30px;background:#173e83;border:1px solid #173e83;box-shadow:0 6px 14px #173e8319;font-size:13px;letter-spacing:1px;transition:background .2s,box-shadow .2s}#login .login-card .btn>i{margin-left:13px;font-size:11px;transition:transform .2s}#login .login-card .btn:hover{background:#204f9b;box-shadow:0 8px 18px #173e8329}#login .login-card .btn:hover>i{transform:translateX(4px)}#login .login-card .btn:disabled{opacity:.6}
#login-error{min-height:20px;font-size:12px;line-height:1.7;overflow-wrap:anywhere;margin:13px 0 0}.login-divider{height:1px;background:#edf0f5;margin:18px 0 0}#login .login-card small{display:block;color:#8c9aae;font-size:10px;text-align:left;margin-top:18px;line-height:1.7}#login .login-card small>i{margin-right:6px;color:#9baac0}.login-signoff{font-size:10px;color:#a3adba;letter-spacing:1px;margin-top:36px}
@media(prefers-reduced-motion:reduce){.sea-scene{transform:none!important}.login-glow{display:none}}

/* Workspace: crisp surfaces, a calmer navigation and restrained feedback. */
#app header{height:76px;box-shadow:0 3px 18px #233b4e04;border-color:var(--line)}
.brand img{width:158px}.brand span{font-size:15px;letter-spacing:1px;color:#526b7e}.header-right select{background:#f5f8fa;border:1px solid var(--line);border-radius:9px;font-size:12px}.header-right #user-name{font-size:12px;color:#52697d}.local-tag{border-radius:20px;padding:5px 10px;background:#fff4e9;color:#9a602b}
#app aside{background:linear-gradient(165deg,#14354d,#102b40);padding:31px 14px;border-right:1px solid #173c53}.sidebar-label{font-size:10px;letter-spacing:2.5px;color:#a2b8c8;padding-left:17px;margin-bottom:7px}#nav button{position:relative;font-size:13px;padding:14px 17px;border-radius:10px;color:#b9ccd8;margin:5px 0;transition:background .2s,color .2s,transform .2s}#nav button i{color:#99b4c6;width:29px;font-size:15px}#nav button:hover{background:#ffffff0a;color:#fff;transform:translateX(2px)}#nav button.active{color:#fff;background:linear-gradient(100deg,#426a7b88,#41617444);box-shadow:inset 0 0 0 1px #a3c4ce15}#nav button.active i{color:#ffbc87}#nav button.active::after{background:#ffaf75;box-shadow:0 0 9px #ffaf7530}.sidebar-foot{border-top:1px solid #ffffff12;padding-top:17px;left:14px;right:14px;font-size:10px;color:#8ca8ba}
.page-heading{margin-bottom:25px}.eyebrow{letter-spacing:3px;font-size:9px;color:#8a9eac}.page-heading h1{font-size:26px;letter-spacing:1px;margin-top:10px}.page-heading .muted{font-size:12px;line-height:1.8;color:#7b8f9f}
.btn{border-radius:8px;transition:background .18s,border-color .18s,box-shadow .18s,transform .18s}.btn:active{transform:translateY(1px)}.btn-primary{background:#214d65;border-color:#214d65;box-shadow:0 3px 8px #214d6512}.btn-primary:hover,.btn-primary:focus{background:#2c6178;border-color:#2c6178;box-shadow:0 4px 11px #214d6525}.btn-default{border-color:#dfe7ec;color:#526d80;background:white}.btn-default:hover{background:#f4f8fa;border-color:#becfd9}.btn-danger{background:#bd6358;border-color:#bd6358}.btn-danger:hover{background:#aa5046;border-color:#aa5046}.btn-link{color:#3d6c83}.btn:focus-visible,button:focus-visible{outline:2px solid #eb935c;outline-offset:3px}
.panel{border:1px solid #e4ebef;border-radius:14px;box-shadow:0 5px 24px #1c3d5204;overflow:hidden}.panel-heading{padding:21px 24px}.panel-body{padding:24px}.form-control{border-color:#dfe7ed;border-radius:8px;font-size:13px;transition:border-color .18s,box-shadow .18s}.form-control:focus{border-color:#85a9b8;box-shadow:0 0 0 3px #568da414}.toolbar{gap:11px;margin-bottom:22px}.toolbar>.form-control{background:#fafcfd}.toolbar .btn{min-height:38px}
.table{font-size:12px}.table>thead>tr>th{background:#f5f8fa;color:#60798c;font-weight:500;padding-top:15px;padding-bottom:15px;border-bottom:1px solid #e5edf1}.table>tbody>tr>td{padding-top:13px;padding-bottom:13px;border-color:#edf2f5;transition:background .15s}.table-hover>tbody>tr:hover,.table>tbody>tr:hover>td{background:#f7fafc}.table .btn{font-size:11px;border-radius:6px}.thumb{width:58px;height:48px;border-radius:9px;border:1px solid #edf1f4}.status{border-radius:20px;font-size:11px;padding:5px 11px}.status.OFF_SHELF{background:#edf1f5;color:#6e7f90}.status.CANCELLED{background:#f1eef5;color:#80738e}
.metrics{gap:18px}.metric{position:relative;border-radius:13px;padding:22px 23px;border-color:#e4ebef;box-shadow:0 4px 18px #1c3d5203;overflow:hidden;transition:box-shadow .2s,transform .2s}.metric::after{content:"";position:absolute;width:72px;height:72px;border-radius:50%;right:-15px;top:-20px;background:#386f8810}.metric:nth-child(2)::after{background:#ed783f12}.metric:nth-child(3)::after{background:#3c9e7e12}.metric strong{font-size:29px;margin-top:14px;font-weight:600;letter-spacing:-.7px}.metric:hover{box-shadow:0 8px 22px #1c3d520a;transform:translateY(-2px)}
.alert{border-radius:10px;font-size:12px}.modal-content{border-radius:18px;box-shadow:0 28px 85px #112b4240;overflow:hidden}.modal-backdrop.in{opacity:.36}.modal-header{border-color:var(--line);padding:24px 27px}.modal-title{font-size:20px;letter-spacing:.5px}.modal-header .close{font-size:26px;font-weight:400;opacity:.4}.modal-body{padding:26px 27px}.modal-footer{padding:19px 27px;background:#fafcfd;border-color:var(--line)}.detail-grid{border:1px solid #e9f0f3;background:#f7fafb;border-radius:12px}.permission-group,.home-banner-editor{border-radius:12px;border-color:#e1eaf0}.home-banner-editor{background:#f8fafc}.home-recommendation{border-radius:10px;transition:border-color .2s,background .2s}.home-recommendation:has(input[type=checkbox]:checked){border-color:#82aab8;background:#f1f8fa}.permission-group input[type=checkbox],.home-recommendation input[type=checkbox]{accent-color:#25566d}.help{color:#748a9b}
@keyframes zy-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@media(min-width:1100px){main{padding:114px 34px 42px}}
@media(max-width:600px){#app aside{padding:8px;background:#14354d}#nav button{padding:12px;min-width:100px;margin:0 3px;font-size:12px}#nav button:hover{transform:none}.panel-body{padding:16px}.page-heading{gap:12px}.page-heading h1{font-size:22px}.page-heading>.btn{white-space:nowrap}.metric{padding:17px}.metrics{gap:10px}.metric strong{font-size:24px}.modal-dialog{margin:12px}.modal-body{padding:20px}.modal-header{padding:20px}.modal-footer{padding:16px 20px}.brand img{width:110px}.header-right select{max-width:145px}.toolbar .form-control{max-width:100%}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.sea-scene,#login .login-card{transform:none!important}.login-glow{display:none}.metric:hover,#nav button:hover{transform:none}}
@media(hover:none){.scene-note{animation:none}.metric:hover{transform:none}}

@media(max-width:1100px){.login-story{padding:35px 30px 25px}#login .login-card{padding:45px 35px 30px}.story-copy h2{font-size:28px}.mascot-main{width:193px}.mascot-main .cat-portrait{height:160px}.mascot-companion{width:155px;right:0;top:65px}.mascot-companion .cat-portrait{height:130px}}
@media(max-width:820px){#login{padding:24px 18px}.login-layout{max-width:440px;grid-template-columns:1fr;border-radius:22px}.login-story{padding:26px 28px;background:linear-gradient(120deg,#eff4fd,#fff2e8);border:0;border-bottom:1px solid #edf0f4}.login-wordmark{align-self:flex-start}.login-wordmark>img{width:172px}.story-copy,.sea-scene,.story-footer{display:none}#login .login-card{padding:30px 28px 25px}.login-card-top{margin-bottom:24px}.login-signoff{margin-top:25px}.page-heading h1{font-size:23px}}
@media(prefers-reduced-motion:reduce){.sea-scene{transform:none!important}.login-glow{display:none}}