/* Web/UI Lab + living portal */
.ui-hero{display:flex;justify-content:space-between;gap:20px;align-items:end;padding:30px;border-radius:26px;background:radial-gradient(circle at 85% 15%,rgba(244,185,66,.18),transparent 28%),radial-gradient(circle at 15% 90%,rgba(69,211,154,.11),transparent 30%),#0f141a;border:1px solid rgba(255,255,255,.08)}.ui-hero h1{font-size:clamp(32px,5vw,58px);margin:6px 0}.ui-hero p{max-width:720px;color:#9aa6b4}
.ui-command-bar{position:sticky;top:72px;z-index:5;display:flex;align-items:center;gap:12px;margin:18px 0;padding:10px 14px;background:rgba(12,16,21,.88);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08);border-radius:16px}.ui-command-bar input{flex:1;border:0;background:transparent;color:#fff;outline:0;padding:8px}.ui-command-bar span{font-size:11px;color:#727e8b}
.ui-bento{display:grid;grid-template-columns:repeat(12,1fr);gap:10px}.ui-term-card{grid-column:span 3;min-height:150px;text-align:left;display:flex;gap:12px;background:#11171e;color:#f4f6f8;border:1px solid rgba(255,255,255,.07);border-radius:20px;padding:17px;transition:.2s}.ui-term-card:nth-child(7n+1),.ui-term-card:nth-child(7n+5){grid-column:span 6}.ui-term-card:hover{transform:translateY(-3px) scale(1.008);border-color:rgba(244,185,66,.38);box-shadow:0 18px 50px rgba(0,0,0,.22)}.ui-term-card>span{font-size:25px}.ui-term-card small{color:#788493;text-transform:uppercase;letter-spacing:.09em;font-size:9px}.ui-term-card strong{display:block;font-size:17px;margin:5px 0}.ui-term-card p{margin:0;color:#919daa;font-size:12px;line-height:1.45}
.ui-demo-stage{margin-top:28px;padding:22px;border-radius:24px;background:#0e1319;border:1px solid rgba(255,255,255,.07)}.ui-demo-tabs{display:flex;gap:7px;overflow:auto;padding-bottom:12px}.ui-demo-tabs button,.demo-tabs button{white-space:nowrap;border:1px solid rgba(255,255,255,.08);background:#151c24;color:#a9b4c0;padding:9px 12px;border-radius:10px}.ui-demo-tabs button.active,.demo-tabs button.active{background:#f1f3f5;color:#101317}.ui-demo-panel{min-height:190px;border-radius:18px;background:#121820;padding:20px}.demo-content{padding:25px}.ui-demo-panel details{border-bottom:1px solid rgba(255,255,255,.08);padding:14px}.ui-demo-panel summary{cursor:pointer;font-weight:700}.ui-demo-panel details p{color:#94a0ad}.demo-mini-drawer{position:relative;margin-left:auto;width:min(360px,100%);padding:22px;border-radius:18px;background:#1a222c;border:1px solid rgba(255,255,255,.12);animation:uiSlide .22s ease}.demo-mini-drawer>button{float:right}.demo-kanban{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.demo-kanban>div{min-height:140px;background:#0d1218;border-radius:14px;padding:13px}.demo-kanban small{color:#778391}.demo-kanban b{display:block;background:#171f28;border:1px solid rgba(255,255,255,.07);padding:10px;border-radius:10px;margin-top:9px}.demo-timeline{display:grid;gap:0}.demo-timeline span{position:relative;padding:12px 0 12px 28px;border-left:1px solid #35404c;margin-left:8px}.demo-timeline i{position:absolute;width:11px;height:11px;border-radius:50%;background:#f4b942;left:-6px;top:17px}.demo-timeline b{margin-right:12px}.demo-command{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;padding:20px}.demo-command input{background:#0c1117;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:15px;color:#fff}.demo-command span{grid-column:2;color:#788493;font-size:11px}.ui-definition-live{display:flex;gap:18px;align-items:flex-start}.ui-definition-live>span{font-size:42px}.ui-definition-live h3{font-size:25px;margin:4px 0}.ui-definition-live p{color:#98a4b1}.ui-definition-live button,.demo-launch{border:0;border-radius:11px;background:#f2f4f6;color:#111;padding:10px 13px;font-weight:700}
@keyframes uiSlide{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
@media(max-width:900px){.ui-term-card,.ui-term-card:nth-child(7n+1),.ui-term-card:nth-child(7n+5){grid-column:span 6}.demo-kanban{grid-template-columns:1fr}.ui-hero{align-items:flex-start;flex-direction:column}}
@media(max-width:600px){.ui-term-card,.ui-term-card:nth-child(7n+1),.ui-term-card:nth-child(7n+5){grid-column:1/-1}.ui-command-bar{top:58px}.ui-command-bar span{display:none}}