/* Shared Zalio family styling for fictional portfolio interactions. */
:root{--ink:#1d1a1e;--ink2:#2c272c;--paper:#f8f7f4;--line:#e7e1dc;--muted:#676166;--accent:#ff530d;--serif:'Manrope',sans-serif;--sans:'Manrope',sans-serif}
body{background:var(--paper);color:var(--ink);font-family:var(--sans)}
.skip{background:var(--accent);color:#fff}
.demo-top{background:#fff;color:var(--ink);border-bottom:1px solid var(--line);height:76px}
.demo-brand{display:flex;align-items:center;gap:.25rem;font-size:.8rem;white-space:nowrap}
.demo-brand img{width:150px;height:auto;margin:-11px -17px;display:block}
.demo-brand .demo-brand-label{display:inline;border:0;width:auto;height:auto;color:#70676c;font:700 .8rem var(--sans);letter-spacing:0;margin:0;padding:0}
.demo-top-right small{color:#a24621}
.demo-back{border-color:#cbb6a9}
.demo-back:hover{color:var(--accent)}
.demo-banner{background:#fff1e8;border-color:#f0d1c1;color:#7e3719}
.demo-kicker,.demo-stat small,.demo-card small,.demo-panel small,.planner-panel small,.intake-panel small,.queue-panel small,.notification-panel small{color:#a3441d}
.demo-main .view-title,.demo-solo-head h1{font-family:var(--sans);font-weight:800;letter-spacing:-.065em}
.demo-side{background:#241f23;color:#eee7e8}
.demo-side-head{border-color:#55474d}.demo-side-head small,.demo-side-footer small{color:#ffae87}.demo-side-head strong{font-family:var(--sans);font-weight:800;color:#fff}
.demo-side button{color:#d1c8cb;border-radius:6px}
.demo-side button[aria-current="page"],.demo-side button:hover{background:var(--accent);color:#fff}
.demo-side-footer{border-color:#55474d}
.demo-stat,.demo-card,.demo-panel,.planner-board,.planner-panel,.intake-panel,.queue-panel,.notification-panel,.inbox-layout{border-color:var(--line);border-radius:12px}
.demo-stat strong{font-family:var(--sans);font-weight:800}
.demo-card h2,.demo-panel h2,.conversation-list h2,.planner-toolbar strong,.planner-panel h2,.planner-panel h3,.intake-layout h2{font-family:var(--sans);font-weight:800;letter-spacing:-.05em}
.demo-lead,.demo-panel p,.demo-panel ul,.demo-stat p,.demo-solo-head p,.intake-layout p,.planner-panel p,.planner-panel li{color:#625c61}
.demo-icon{background:#ffeadc;color:#9f3f18;border-radius:7px}
.demo-button{background:#211c20;border:1px solid #211c20;border-radius:7px;color:#fff}
.demo-button:hover{background:var(--accent);border-color:var(--accent)}
.demo-button.secondary{background:#fff;color:var(--ink);border-color:#d4c4ba}
.demo-button.secondary:hover{background:#fff0e7;border-color:var(--accent)}
.demo-button:focus-visible,.demo-side button:focus-visible,input:focus-visible,textarea:focus-visible,.picker:focus-visible,.floor-cell:focus-visible{outline:3px solid #ff8e59;outline-offset:2px}
.demo-tag{background:#fff0e6;color:#a14118;border-radius:99px}.demo-tag.amber{background:#ffeadc;color:#9b451d}.demo-tag.gray{background:#eeeae5;color:#625d60}
.lead-pick:hover,.lead-pick.active,.conversation-list button{background:#fff1e8}
.lead-detail-row,.demo-list-item,.retention-signal{border-color:#ebe3dd}
.timeline{border-color:#e4a98e}.timeline div:before{background:var(--accent)}
.bubble{background:#f3eeea}.bubble.outgoing{background:#ffe1cf}
.composer input,.intake-form input,.intake-form textarea,.intake-form select{border-color:#d9cac1;border-radius:6px;background:#fff;color:var(--ink)}
.draft-box{background:#fff1e8;border-color:#f1d0bf;border-radius:8px}.draft-box p,.demo-toast{color:#983d17}
.floor-grid{background:#e5d8cd}.floor-cell{background:#fbf8f4;border-color:#e9ddd3;color:#613f32;border-radius:3px}.floor-cell:hover{background:#ffe4d4}.floor-cell.occupied{background:#e0ac91;border-color:#b7724d}.floor-cell.occupied[data-kind="cardio"]{background:#f0cf9f}.floor-cell.occupied[data-kind="mobility"]{background:#e8d6c5}
.picker{border-color:#e2d7cf;border-radius:7px}.picker[aria-pressed="true"],.picker:hover{background:#fff1e8;border-color:var(--accent)}
.demo-solo-head a:not(.demo-button){text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:.2rem}
@media(max-width:650px){.demo-top{height:68px;padding:0 1rem}.demo-brand img{width:128px;margin:-10px -14px}.demo-brand .demo-brand-label{display:none}.demo-back{font-size:.7rem;white-space:nowrap}.demo-banner{padding:.8rem 1rem}}
