.walk-visual{opacity:0;transition:opacity .3s var(--ease-harb), transform .3s var(--ease-harb);pointer-events:none;transform:translateY(8px)}.walk-visual.is-active{opacity:1;pointer-events:auto;transform:none}@media (min-width:1024px){.walk-step{opacity:.45;transition:opacity .25s var(--ease-harb)}.walk-step.is-active{opacity:1}}.device{border:1px solid var(--line);background:var(--surface-raised);padding:10px}.device-bar{gap:6px;padding:0 2px 10px;display:flex}.device-bar span{background:var(--line-strong);width:8px;height:8px}.device-screen{aspect-ratio:16/10;position:relative;overflow:hidden}.tillo-ui{font-family:var(--font-tillo-sans), var(--font-plex-arabic), system-ui, sans-serif;background:var(--t-surface);color:var(--t-ink);grid-template-columns:112px 1fr;height:100%;font-size:11px;line-height:1.5;display:grid}html[lang=ar] .tillo-ui{font-family:var(--font-plex-arabic), var(--font-tillo-sans), system-ui, sans-serif}@media (min-width:640px){.tillo-ui{font-size:12px}}.t-side{background:var(--t-surface-raised);border-inline-end:1px solid var(--t-line);flex-direction:column;gap:2px;padding:10px 8px;display:flex}.t-brand{letter-spacing:-.02em;padding:2px 6px 10px;font-size:13px;font-weight:700}.t-group{text-transform:uppercase;letter-spacing:.08em;color:var(--t-ink-muted);padding:8px 6px 2px;font-size:9px}.t-nav{color:var(--t-ink-muted);border-radius:8px;padding:5px 6px;position:relative}.t-nav.is-active{background:var(--t-ultra-soft);color:var(--t-ink);font-weight:600}.t-nav.is-active:before{content:"";inset-inline-start:0;background:var(--t-flare);border-radius:2px;width:3px;position:absolute;top:6px;bottom:6px}.t-main{padding:12px;overflow:hidden}.t-title{justify-content:space-between;align-items:center;margin-bottom:10px;font-size:14px;font-weight:700;display:flex}.t-btn{background:var(--t-ultra);color:var(--t-on-ultra);border-radius:999px;padding:4px 10px;font-size:10px;font-weight:600}.t-card{background:var(--t-surface-raised);border:1px solid var(--t-line);border-radius:12px;padding:10px}.t-tabs{border-bottom:1px solid var(--t-line);color:var(--t-ink-muted);gap:10px;margin:0 -10px 8px;padding:0 10px 6px;font-size:10px;display:flex}.t-tabs .is-active{color:var(--t-ink);border-bottom:2px solid var(--t-ultra);margin-bottom:-7px;padding-bottom:5px;font-weight:600}.t-row{border-top:1px solid var(--t-line);grid-template-columns:1.6fr 1.2fr 1fr .9fr;align-items:center;gap:6px;padding:6px 0;display:grid}.t-row.is-head{color:var(--t-ink-muted);text-transform:uppercase;letter-spacing:.06em;border-top:0;font-size:9px}.t-money{font-variant-numeric:tabular-nums;text-align:end;font-weight:600}.t-pill{background:var(--t-ultra-soft);color:var(--t-ink);white-space:nowrap;border-radius:999px;align-items:center;gap:4px;padding:2px 7px;font-size:9px;font-weight:600;display:inline-flex}.t-pill:before{content:"";background:var(--t-ultra);border-radius:50%;width:5px;height:5px}.t-pill.ok{background:#e3f3ea}.t-pill.ok:before{background:var(--t-success)}.t-pill.warn{background:#fbeedd}.t-pill.warn:before{background:var(--t-warning)}.t-pill.bad{background:#fbe3e1}.t-pill.bad:before{background:var(--t-danger)}.t-kpis{grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px;display:grid}.t-kpi b{font-variant-numeric:tabular-nums;font-size:15px;display:block}.t-kpi small{color:var(--t-ink-muted);font-size:9px}.t-chart{align-items:flex-end;gap:6px;height:64px;display:flex}.t-chart i{background:var(--t-ultra);transform-origin:bottom;animation:t-grow .7s var(--ease-harb) both;border-radius:3px 3px 0 0;flex:1}.t-chart i:nth-child(2n){background:var(--t-ultra-soft)}.t-new{animation:t-slide .5s var(--ease-harb) both;background:var(--t-ultra-soft)}.t-tick{animation:t-pop .4s var(--ease-harb) .3s both}.t-fade{animation:t-fade .5s var(--ease-harb) both}.t-soon{border:1px dashed var(--t-line-strong);color:var(--t-ink-muted);border-radius:12px;padding:10px}@keyframes t-grow{0%{transform:scaleY(0)}}@keyframes t-slide{0%{opacity:0;transform:translateY(-8px)}}@keyframes t-pop{0%{opacity:0;transform:scale(.9)}}@keyframes t-fade{0%{opacity:0}}.walk-visual:not(.is-active) .t-chart i,.walk-visual:not(.is-active) .t-new,.walk-visual:not(.is-active) .t-tick,.walk-visual:not(.is-active) .t-fade{animation:none}.chat{border:1px solid var(--line);background:var(--surface-raised);flex-direction:column;gap:8px;min-height:300px;padding:14px;display:flex}.chat-msg{opacity:0;max-width:82%;padding:9px 12px;font-size:14px;line-height:1.6;transform:translateY(6px)}.chat-msg.customer{background:var(--surface);border:1px solid var(--line);align-self:flex-start}.chat-msg.ai{background:var(--ink);color:var(--surface);align-self:flex-end}.chat-msg .who{letter-spacing:.08em;text-transform:uppercase;opacity:.7;margin-bottom:2px;font-size:10px;display:block}.is-active .chat-msg{animation:chat-in .35s var(--ease-harb) forwards}.is-active .chat-msg:first-child{animation-delay:.2s}.is-active .chat-msg:nth-child(2){animation-delay:1.1s}.is-active .chat-msg:nth-child(3){animation-delay:2.3s}.is-active .chat-msg:nth-child(4){animation-delay:3.3s}.is-active .chat-msg:nth-child(5){animation-delay:4.5s}.is-active .chat-msg:nth-child(6){animation-delay:5.3s}@keyframes chat-in{to{opacity:1;transform:none}}.wave{align-items:center;gap:3px;height:48px;display:flex}.wave i{background:var(--red);width:4px;height:30%;animation:1.1s ease-in-out infinite alternate wave}.wave i:nth-child(3n){height:60%;animation-delay:.2s}.wave i:nth-child(3n+1){height:45%;animation-delay:.4s}.wave i:nth-child(5n){height:90%;animation-delay:.1s}.walk-visual:not(.is-active) .wave i{animation-play-state:paused}@keyframes wave{to{transform:scaleY(.3)}}.flow-step{opacity:.35}.is-active .flow-step{animation:t-fade .5s var(--ease-harb) forwards}.is-active .flow-step:nth-child(2){animation-delay:.7s}.is-active .flow-step:nth-child(3){animation-delay:1.4s}.media-wall{background:var(--line);border:1px solid var(--line);grid-template-columns:repeat(3,1fr);gap:1px;display:grid}.media-wall>div{aspect-ratio:9/16;background:var(--surface-raised);position:relative;overflow:hidden}.org-line{transition:all .6s var(--ease-harb)}.bar-chart rect{transform-origin:bottom;transition:transform .6s var(--ease-harb);transform:scaleY(0)}.is-active .bar-chart rect{transform:scaleY(1)}@media (prefers-reduced-motion:reduce){.walk-visual,.walk-step,.chat-msg,.flow-step,.bar-chart rect{opacity:1!important;transition:none!important;animation:none!important;transform:none!important}.wave i{animation:none!important}}
