chick
24 lines
21 KiB
CSS
24 lines
21 KiB
CSS
:root{
|
|
--animal-primary-color:#19c8b9;--animal-primary-color-hover:#3dd4c6;--animal-primary-color-active:#50b9ab;--animal-primary-color-bg:#e6f9f6;
|
|
--animal-success-color:#6fba2c;--animal-warning-color:#f5c31c;--animal-error-color:#e05a5a;
|
|
--animal-text-color:#794f27;--animal-text-color-body:#725d42;--animal-text-color-secondary:#9f927d;--animal-text-color-muted:#8a7b66;--animal-text-color-disabled:#c4b89e;
|
|
--animal-border-color:#aaa69d;--animal-border-color-hover:#827157;--animal-border-color-light:#e8e2d6;
|
|
--animal-bg-color:#f8f8f0;--animal-bg-color-content:rgb(247,243,223);--animal-bg-color-secondary:#f0e8d8;--animal-bg-color-disabled:#f0ece2;
|
|
--animal-font-family:Nunito,'Noto Sans SC',-apple-system,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;
|
|
--animal-spacing-xs:4px;--animal-spacing-sm:8px;--animal-spacing-md:12px;--animal-spacing-lg:16px;--animal-spacing-xl:24px;
|
|
--animal-border-radius-sm:16px;--animal-border-radius-base:18px;--animal-border-radius-lg:24px;--animal-border-width:2px;
|
|
--animal-shadow-sm:0 2px 4px 0 rgba(61,52,40,.06);--animal-shadow-base:0 3px 10px 0 rgba(61,52,40,.1);--animal-shadow-lg:0 8px 24px 0 rgba(61,52,40,.14);
|
|
--animal-motion-duration-base:.25s;--animal-motion-ease:cubic-bezier(.4,0,.2,1);
|
|
}
|
|
*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;min-height:100vh;font-family:var(--animal-font-family);font-weight:500;letter-spacing:.01em;color:var(--animal-text-color);background:var(--animal-bg-color);overflow:hidden}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #ffcc00;outline-offset:2px}.island-bg{position:fixed;inset:0;z-index:-1;overflow:hidden;background:radial-gradient(circle at 12% 10%,rgba(130,213,187,.28),transparent 24%),radial-gradient(circle at 88% 6%,rgba(247,205,103,.28),transparent 22%),linear-gradient(180deg,#f8f8f0 0%,#f4efd9 54%,#e8dfbd 100%)}.island-bg:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(196,184,158,.15) 1.5px,transparent 1.5px),radial-gradient(circle,rgba(196,184,158,.1) 1px,transparent 1px);background-size:28px 28px,14px 14px;background-position:0 0,7px 7px}.cloud{position:absolute;border-radius:999px;background:rgba(255,255,255,.72);filter:blur(.1px)}.cloud:before,.cloud:after{content:"";position:absolute;border-radius:50%;background:inherit}.cloud-a{width:170px;height:48px;left:8%;top:7%}.cloud-a:before{width:72px;height:72px;left:28px;top:-28px}.cloud-a:after{width:56px;height:56px;right:26px;top:-18px}.cloud-b{width:210px;height:58px;right:8%;top:12%;opacity:.7}.cloud-b:before{width:86px;height:86px;left:34px;top:-36px}.cloud-b:after{width:72px;height:72px;right:28px;top:-26px}.leaf{position:absolute;color:#8ac68a;font-size:18px;opacity:.42;animation:leafFloat 7s ease-in-out infinite}.leaf-a{left:46%;top:8%}.leaf-b{right:26%;bottom:9%;animation-delay:1.7s}@keyframes leafFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-12px) rotate(12deg)}}
|
|
.island-shell{height:100vh;display:grid;grid-template-columns:390px minmax(0,1fr);gap:24px;padding:24px}.nook-sidebar,.nook-workspace{min-height:0}.nook-sidebar{display:flex;flex-direction:column;gap:14px}.nook-workspace{display:flex;flex-direction:column;gap:16px;overflow:hidden}.island-card{border-radius:20px;background:var(--animal-bg-color-content);color:var(--animal-text-color-body);font-weight:500;transition:all .3s ease;border:1.5px solid #d4c4a8}.island-card:hover{transform:translateY(-2px)}.pattern-default{background:radial-gradient(circle,rgba(196,184,158,.15) 1.5px,transparent 1.5px),radial-gradient(circle,rgba(196,184,158,.1) 1px,transparent 1px),rgb(247,243,223);background-size:28px 28px,14px 14px;background-position:0 0,7px 7px;border-color:#d4c4a8}.pattern-app-teal{background:radial-gradient(circle,rgba(130,213,187,.18) 1.5px,transparent 1.5px),radial-gradient(circle,rgba(170,235,210,.12) 1px,transparent 1px),#e8faf5;background-size:28px 28px,14px 14px;background-position:0 0,7px 7px;border-color:#82d5bb;color:#2a6b5a}.pattern-app-yellow{background:radial-gradient(circle,rgba(247,205,103,.18) 1.5px,transparent 1.5px),radial-gradient(circle,rgba(255,230,160,.12) 1px,transparent 1px),#fff8e0;background-size:28px 28px,14px 14px;background-position:0 0,7px 7px;border-color:#f7cd67;color:#7a6528}.pattern-app-blue{background:radial-gradient(circle,rgba(136,157,240,.18) 1.5px,transparent 1.5px),radial-gradient(circle,rgba(180,195,255,.12) 1px,transparent 1px),#e8edff;background-size:28px 28px,14px 14px;background-position:0 0,7px 7px;border-color:#889df0;color:#4a5a8a}.pattern-purple{background:radial-gradient(circle,rgba(183,125,238,.18) 1.5px,transparent 1.5px),radial-gradient(circle,rgba(220,180,255,.12) 1px,transparent 1px),#f0e8ff;background-size:28px 28px,14px 14px;background-position:0 0,7px 7px;border-color:#b77dee;color:#6a3a9a}.pattern-app-pink{background:radial-gradient(circle,rgba(248,166,178,.18) 1.5px,transparent 1.5px),radial-gradient(circle,rgba(255,200,210,.12) 1px,transparent 1px),#fde4e8;background-size:28px 28px,14px 14px;background-position:0 0,7px 7px;border-color:#f8a6b2;color:#a85565}
|
|
.sidebar-card{padding:18px;text-align:center}.sidebar-subtitle{margin:12px 0 16px;color:var(--animal-text-color-muted);line-height:1.45}.sidebar-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}.block-btn{width:100%}.ribbon{--rf:#27d039;--rb:#20992a;--rk:#115017;--rt:#fff;position:relative;display:inline-flex;align-items:center;justify-content:center;height:2em;padding:0 1.6em;color:var(--rt);font-size:24px;font-weight:900;letter-spacing:.04em;white-space:nowrap;filter:drop-shadow(0 .08em .12em rgba(61,52,40,.08))}.compact-ribbon{font-size:19px}.ribbon-text{position:relative;z-index:4;height:2em;display:inline-flex;align-items:center;padding-top:.11em;color:var(--rt);text-shadow:0 .04em .08em rgba(61,52,40,.08)}.ribbon-back{position:absolute;bottom:-.4em;width:1.7em;height:1.7em;background:var(--rb);z-index:1}.ribbon-back-left{left:-.6em;border-radius:.08em 0 0 .08em;clip-path:polygon(100% 0,100% 100%,0 100%,30% 50%,0 0)}.ribbon-back-right{right:-.6em;border-radius:0 .08em .08em 0;clip-path:polygon(0 0,100% 0,70% 50%,100% 100%,0 100%)}.ribbon-fold{position:absolute;top:calc(100% - .05em);width:0;height:0;border-style:solid;z-index:2}.ribbon-fold-left{left:.15em;border-width:0 .95em .45em 0;border-color:transparent var(--rk) transparent transparent}.ribbon-fold-right{right:.16em;border-width:0 0 .45em .95em;border-color:transparent transparent transparent var(--rk)}.ribbon-front{position:absolute;inset:0 .1em;background:var(--rf);border-radius:.2em;z-index:3;transform:perspective(11.5em) rotateX(3deg);box-shadow:inset 0 -.06em 0 rgba(0,0,0,.05)}.section-ribbon{--rf:#8ac68a;--rb:#509050;--rk:#205020;--rt:#fff;display:inline-flex;align-items:center;min-height:34px;padding:6px 18px;border-radius:12px;background:var(--rf);color:var(--rt);font-weight:900;letter-spacing:.04em;box-shadow:0 4px 0 0 var(--rb);transform:perspective(800px) rotateY(3deg)}.color-app-yellow{--rf:#f7cd67;--rb:#d4a030;--rk:#8a6010;--rt:#725d42}.color-app-green{--rf:#8ac68a;--rb:#509050;--rk:#205020;--rt:#fff}.color-purple{--rf:#b77dee;--rb:#9050d0;--rk:#5a1a9a;--rt:#fff}.color-app-pink{--rf:#f8a6b2;--rb:#e06880;--rk:#a03060;--rt:#fff}.color-app-teal{--rf:#82d5bb;--rb:#40a880;--rk:#186048;--rt:#fff}
|
|
.animal-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:45px;padding:0 20px;border:2px solid transparent;border-radius:50px;font-weight:700;letter-spacing:.02em;text-decoration:none;line-height:1;transition:all var(--animal-motion-duration-base) var(--animal-motion-ease);user-select:none}.primary-btn{color:#794f27;background:#f8f8f0;border-color:#f8f8f0;box-shadow:0 5px 0 0 #bdaea0}.primary-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 0 0 #bdaea0}.primary-btn:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 0 #bdaea0}.default-btn{color:var(--animal-text-color);background:var(--animal-bg-color);border-color:var(--animal-border-color);box-shadow:var(--animal-shadow-sm)}.default-btn:hover:not(:disabled){color:var(--animal-primary-color);border-color:var(--animal-primary-color);box-shadow:var(--animal-shadow-base);transform:translateY(-1px)}.danger-btn{color:#fff;background:var(--animal-error-color);border-color:var(--animal-error-color);box-shadow:0 5px 0 0 var(--animal-error-color-active)}.danger-btn:hover:not(:disabled){background:#e87878;transform:translateY(-1px);box-shadow:0 6px 0 0 var(--animal-error-color-active)}.disabled,button:disabled{opacity:.5;pointer-events:none}.wallet-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.fleet-card{border-radius:999px;background:#d1da49;color:#3d5a1a;border:2px solid rgba(90,107,40,.18);padding:9px 8px;text-align:center;box-shadow:inset 0 -2px 0 rgba(61,52,40,.08)}.fleet-card b{display:block;font-size:22px;font-weight:900;line-height:1}.fleet-card span{display:block;margin-top:2px;font-size:11px;font-weight:700}.search-pill{height:48px;display:flex;align-items:center;gap:8px;background:rgb(247,243,223);border:2.5px solid #c4b89e;border-radius:50px;padding:0 16px;color:#8a7b66}.search-pill:focus-within{border-color:#ffcc00;box-shadow:0 0 0 3px rgba(255,204,0,.18)}.search-pill input{width:100%;border:0;outline:0;background:transparent;color:#725d42;font-weight:600}.search-pill input::placeholder{color:#9f927d;font-weight:400}.island-tabs,.module-tabs{display:flex;gap:8px;flex-wrap:wrap}.tab-leaf,.module-tabs button{border:0;border-radius:24px;background:rgba(255,255,255,.6);color:#794f27;padding:9px 14px;font-weight:700;transition:all .25s cubic-bezier(.4,0,.2,1)}.tab-leaf:hover,.module-tabs button:hover{background:rgba(25,200,185,.1)}.tab-leaf.active,.module-tabs button.active{background:#0cc0b5;color:#fff9e3;box-shadow:0 3px 0 0 rgba(61,52,40,.08)}.island-list{min-height:0;overflow:auto;display:flex;flex-direction:column;gap:10px;padding-right:3px}.instance-card{border-radius:20px;background:rgb(247,243,223);border:1.5px solid #d4c4a8;padding:14px;color:#725d42;transition:all .3s ease;cursor:pointer}.instance-card:hover{transform:translateY(-2px)}.instance-card.active{border-color:#19c8b9;box-shadow:0 0 0 4px rgba(25,200,185,.15)}.instance-top{display:flex;justify-content:space-between;gap:10px}.instance-name{font-size:16px;font-weight:800;color:#794f27}.instance-url{margin-top:4px;color:#9f927d;font-size:12px;word-break:break-all}.instance-card-actions{display:flex;gap:7px;margin-top:10px}.mini-action{border:1.5px solid #d4c4a8;border-radius:16px;background:#fff9e3;color:#725d42;font-size:12px;font-weight:800;padding:5px 10px}.mini-action:hover{border-color:#19c8b9;color:#19c8b9}.mini-action.danger{border-color:#f8a6b2;color:#e05a5a}.instance-desc{margin-top:8px;color:#8a7b66;font-size:12px;line-height:1.45}.status-pill{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;border-radius:50px;padding:6px 10px;background:#f0e8d8;border:1.5px solid #e8e2d6;font-size:12px;font-weight:800;color:#8a7b66}.status-pill:before{content:"";width:8px;height:8px;border-radius:50%;background:#9f927d}.status-pill.ok{background:#e8f5e8;color:#3a6b3a;border-color:#8ac68a}.status-pill.ok:before{background:#6fba2c}.status-pill.warn{background:#fff8e0;color:#7a6528;border-color:#f7cd67}.status-pill.warn:before{background:#f5c31c}.status-pill.bad{background:#ffe8e8;color:#9a3a3a;border-color:#fc736d}.status-pill.bad:before{background:#e05a5a}.mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:12px}.mini-grid span{min-width:0;color:#9f927d;font-size:11px}.mini-grid b{display:block;color:#725d42;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.config-note{margin-top:auto;color:#8a7b66;font-size:12px}.config-note code{display:block;margin-top:5px;color:#725d42;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
|
.workspace-hero{padding:22px 24px;display:flex;align-items:center;justify-content:space-between;gap:18px}.eyebrow{margin:0 0 6px;color:#8a7b66;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}h1,h2,h3,p{margin:0}h1{font-size:34px;line-height:1.05;font-weight:900;color:#794f27;letter-spacing:.02em}.workspace-hero p:last-child{margin-top:8px;color:#725d42;line-height:1.5}.hero-actions{display:flex;gap:10px;white-space:nowrap}.phone-dock{display:grid;grid-template-columns:repeat(4,112px);gap:14px}.phone-app{height:96px;border:0;border-radius:36px;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font-weight:900;transition:all .25s cubic-bezier(.4,0,.2,1);box-shadow:0 6px 0 rgba(61,52,40,.12)}.phone-app:hover{transform:translateY(-2px) rotate(-1deg)}.phone-app:active{transform:translateY(2px);box-shadow:0 2px 0 rgba(61,52,40,.12)}.phone-app.active{outline:4px solid rgba(255,204,0,.55)}.phone-app span{font-size:26px}.phone-app b{font-size:13px}.app-teal{background:#82d5bb}.app-yellow{background:#f7cd67;color:#725d42}.app-blue{background:#889df0}.app-green{background:#8ac68a}.view{display:none;min-height:0;flex:1;overflow:auto}.view.active{display:block}.dashboard-view{display:none}.dashboard-view.active{display:grid;grid-template-columns:minmax(280px,.82fr) minmax(0,1.18fr);grid-template-rows:auto minmax(0,1fr);gap:16px}.signal-board{padding:18px}.signal-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:18px}.signal-item,.metric{border-radius:20px;background:rgba(255,255,255,.56);border:2px solid rgba(232,226,214,.8);padding:13px}.signal-item span,.metric span{display:block;color:#9f927d;font-size:12px;font-weight:800}.signal-item b,.metric b{display:block;margin-top:6px;color:#794f27;font-size:18px;font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nook-metrics{display:grid;grid-template-columns:repeat(2,minmax(140px,1fr));gap:12px}.module-board{grid-column:1/-1;padding:18px;min-height:0}.board-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.app-grid{display:grid;grid-template-columns:repeat(4,minmax(170px,1fr));gap:14px}.feature{min-height:168px;border-radius:34px;padding:16px;color:#fff;transition:all .25s cubic-bezier(.4,0,.2,1);box-shadow:0 5px 0 rgba(61,52,40,.13);overflow:hidden}.feature:nth-child(8n+1){background:#82d5bb}.feature:nth-child(8n+2){background:#f7cd67;color:#725d42}.feature:nth-child(8n+3){background:#889df0}.feature:nth-child(8n+4){background:#f8a6b2}.feature:nth-child(8n+5){background:#8ac68a}.feature:nth-child(8n+6){background:#e59266}.feature:nth-child(8n+7){background:#b77dee}.feature:nth-child(8n+8){background:#d1da49;color:#3d5a1a}.feature:hover{transform:translateY(-3px) rotate(-.6deg)}.feature-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.feature .eyebrow{color:inherit;opacity:.78}.feature h4{margin:0;font-size:18px;font-weight:900}.feature p{margin-top:8px;font-size:13px;line-height:1.45;color:inherit;opacity:.9}.endpoint-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:13px}.endpoint-pills button{border:2px solid rgba(255,255,255,.55);border-radius:16px;background:rgba(255,255,255,.28);color:inherit;font-size:11px;font-weight:800;padding:5px 7px}.endpoint-pills button:hover{background:rgba(255,255,255,.45)}.danger-note{margin-top:10px;font-size:12px;font-weight:800;color:#fff8e3}.api-layout.active{display:grid;grid-template-columns:330px minmax(0,1fr);gap:16px}.api-catalog,.api-console{padding:18px;min-height:0}.api-catalog{overflow:auto}.endpoint-group{margin:16px 0}.endpoint-group h4{margin:0 0 8px;font-size:14px;font-weight:900;color:inherit}.endpoint-row{display:block;width:100%;text-align:left;border:2px solid rgba(255,255,255,.7);border-radius:18px;background:rgba(255,255,255,.45);color:inherit;font-size:12px;font-weight:800;padding:9px 11px;margin-bottom:7px}.endpoint-row:hover,.endpoint-row.active{background:#fff9e3;border-color:#19c8b9;color:#794f27}.api-console{display:flex;flex-direction:column;gap:12px}.console-toolbar{display:flex;gap:10px}.console-toolbar select{width:110px}.console-toolbar input{flex:1}input,select,textarea{border:2.5px solid #c4b89e;background:rgb(247,243,223);border-radius:50px;padding:11px 15px;color:#725d42;font-weight:700}textarea{border-radius:20px}.request-body{min-height:96px;resize:vertical}.raw-output{flex:1;min-height:410px;margin:0;border:2px solid #d4c4a8;border-radius:20px;background:#fff8e7;color:#725d42;padding:16px;overflow:auto;font:600 12px/1.6 var(--animal-font-family)}.rawpage-view.active{display:flex;flex-direction:column;gap:12px}.frame-toolbar{padding:14px 16px;font-weight:700}.frame{width:100%;flex:1;min-height:580px;border:2px solid #d4c4a8;border-radius:24px;background:white}.empty-state{padding:42px}.mini-empty{padding:18px;text-align:center}.empty-state h3{margin-top:18px;font-size:24px;color:#794f27}.mini-empty h3{margin-top:0;font-size:18px}.empty-state p{margin-top:8px;color:#725d42}dialog{border:0;background:transparent}dialog::backdrop{background:rgba(61,52,40,.35);backdrop-filter:blur(3px)}.login-card,.instance-form{width:min(520px,90vw);padding:24px}.login-card h3{margin-top:18px;font-size:24px;color:#794f27}.login-card p,.form-help{margin-top:8px;color:#725d42;line-height:1.5}.login-card input{width:100%;margin:16px 0}.login-card menu,.form-menu{display:flex;justify-content:flex-end;gap:10px;margin:0;padding:0}.instance-form{max-height:88vh;overflow:auto}.instance-form label{display:block;margin-top:13px;color:#794f27;font-size:13px;font-weight:900}.instance-form input,.instance-form textarea{display:block;width:100%;margin-top:6px}.instance-form textarea{min-height:78px;resize:vertical}.form-menu{margin-top:18px}.form-menu .danger-btn{margin-right:auto}.toast{position:fixed;right:22px;bottom:22px;border:2px solid #d4c4a8;border-radius:20px;background:rgb(247,243,223);color:#794f27;padding:13px 16px;font-weight:800;box-shadow:var(--animal-shadow-lg);z-index:10}.compact .island-shell{gap:14px;padding:14px}.compact .feature{min-height:134px;padding:12px;border-radius:26px}.compact .workspace-hero{padding:16px}.compact .phone-app{height:78px;border-radius:28px}.compact .app-grid{gap:10px}
|
|
@media(max-width:1260px){.island-shell{grid-template-columns:340px minmax(0,1fr)}.app-grid{grid-template-columns:repeat(3,1fr)}.dashboard-view.active{grid-template-columns:1fr}.nook-metrics{grid-template-columns:repeat(4,1fr)}.phone-dock{grid-template-columns:repeat(4,96px)}}@media(max-width:900px){body{overflow:auto}.island-shell{height:auto;grid-template-columns:1fr;padding:14px}.nook-sidebar{max-height:none}.nook-workspace{overflow:visible}.workspace-hero{flex-direction:column;align-items:flex-start}.phone-dock{grid-template-columns:repeat(4,1fr)}.dashboard-view.active,.api-layout.active{grid-template-columns:1fr}.app-grid,.nook-metrics{grid-template-columns:1fr 1fr}}@media(max-width:560px){.wallet-row,.signal-grid,.app-grid,.nook-metrics{grid-template-columns:1fr}.sidebar-actions,.phone-dock{grid-template-columns:1fr 1fr}.hero-actions{flex-direction:column;width:100%}.hero-actions .animal-btn{width:100%}}
|
|
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
|
|
|
|
|
|
/* Device monitoring rebuild: keep API as secondary, make dashboard data-first. */
|
|
.device-dashboard.active{grid-template-columns:minmax(320px,.72fr) minmax(0,1.28fr);grid-template-rows:auto minmax(0,1fr);align-items:stretch}.monitor-summary-card{min-height:100%}.monitor-kpis{align-content:start}.device-detail-board{grid-column:2;grid-row:1 / span 2;padding:18px;overflow:auto}.board-caption{color:#8a7b66;margin-top:10px;line-height:1.5}.device-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(220px,1fr));gap:14px;margin-top:18px}.device-info-card{background:rgba(255,255,255,.62);border:2px solid rgba(212,196,168,.72);border-radius:24px;padding:16px;min-width:0;box-shadow:inset 0 -2px 0 rgba(61,52,40,.04)}.device-info-card h4{margin:0 0 12px;color:#794f27;font-size:18px;font-weight:900}.device-info-card dl{display:grid;gap:8px;margin:0}.device-info-card dl div{display:grid;grid-template-columns:86px minmax(0,1fr);gap:10px;align-items:baseline}.device-info-card dt{color:#9f927d;font-size:12px;font-weight:900}.device-info-card dd{margin:0;color:#4d3a22;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.monitor-device-card .instance-card-actions{margin-top:10px}.monitor-mini-grid{grid-template-columns:repeat(2,1fr);margin-top:12px}.monitor-metric.temperature b{color:#c05b28}.monitor-metric.traffic b{color:#2f7e98}.monitor-metric.signal b{color:#4b8f24}.status-pill.signal,.status-pill.temperature,.status-pill.traffic{background:#e6f9f6;color:#2a6b5a}.compact .device-info-card{padding:12px}.compact .device-info-card dl{gap:5px}.api-layout:before{content:'调试接口为次级入口；日常巡检请回到设备监控页。';display:block;grid-column:1 / -1;color:#8a7b66;font-weight:800;margin:0 0 8px 4px}@media(max-width:1260px){.device-dashboard.active{grid-template-columns:1fr}.device-detail-board{grid-column:auto;grid-row:auto}.device-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.device-detail-grid{grid-template-columns:1fr}.device-info-card dl div{grid-template-columns:76px minmax(0,1fr)}}
|