:root{--orange:#ff8a1f;--orange-deep:#f26a00;--ink:#fff7f0;--ink-soft:#d9d3e6;--panel:#ffffff14;--panel-line:#ffffff29;--ok:#4ade80;--warn:#fbbf24;--bad:#fb7185;color:var(--ink);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:Cairo,Tajawal,Segoe UI,Tahoma,sans-serif}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}body{background-color:#1a0a30;background-image:linear-gradient(165deg,#5e0a1c 0%,#4a0a33 30%,#2a1050 58%,#0e1c5e 82%,#071445 100%);background-attachment:fixed}body:before{z-index:-1;content:"";background:radial-gradient(circle at 30% 30%,#ff3c5033,#0000 42%),radial-gradient(circle at 70% 70%,#3c64ff38,#0000 42%);animation:18s ease-in-out infinite alternate drift;position:fixed;inset:-30%}@keyframes drift{0%{transform:translate(-6%,-4%)rotate(0)}to{transform:translate(6%,4%)rotate(14deg)}}p,ol{margin:0;padding:0}ol{list-style:none}.app{width:100%;height:100dvh;padding:max(8px, env(safe-area-inset-top)) 12px max(10px, env(safe-area-inset-bottom));flex-direction:column;gap:6px;display:flex;position:relative}.badges{flex-wrap:wrap;flex-shrink:0;justify-content:center;gap:5px;display:flex}.badge{border:1px solid var(--panel-line);background:var(--panel);border-radius:999px;align-items:center;gap:5px;padding:1px 9px;font-size:.72rem;font-weight:600;display:inline-flex}.dot{background:var(--ink-soft);border-radius:50%;width:8px;height:8px}.badge--online .dot{background:var(--ok)}.badge--demo .dot{background:var(--warn)}.badge--error .dot{background:var(--bad)}.badge--demo-note{border-color:var(--warn);color:#fde68a}.notices{z-index:5;top:calc(max(8px, env(safe-area-inset-top)) + 54px);flex-direction:column;gap:6px;display:flex;position:absolute;left:12px;right:12px}.notice{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:12px;padding:8px 12px;font-size:.92rem;font-weight:600;line-height:1.5}.notice--error{border:1px solid var(--bad);background:#780c28d9}.notice--info{border:1px solid var(--warn);background:#5a3c08d9}.stage{flex-direction:column;flex:1;align-items:stretch;min-height:0;animation:.3s ease-out stage-in;display:flex;position:relative}@keyframes stage-in{0%{opacity:0}}.fit-box{flex:1;width:100%;min-width:0;height:100%;min-height:0;display:flex;overflow-y:auto}.fit-text{text-align:center;max-width:100%;margin:auto;font-weight:800;line-height:1.3}.flow{font-weight:900}.flow--user{color:#ffd9b0;text-align:start;text-shadow:0 4px 34px #ff8a1f73;width:100%}.flow--reply{color:#fff;text-shadow:0 4px 34px #8caaff80}.flow--welcome{color:var(--ink);opacity:.92}.flow-fresh{animation:.4s ease-out flow-in}.flow-rest{opacity:0}@keyframes flow-in{0%{opacity:.35;color:#fff}}.reply-link{color:#ffc48a;text-align:center;flex-shrink:0;padding:12px;font-size:1.3rem;font-weight:800}.skip{z-index:3;border:1px solid var(--panel-line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--ink);background:#0a081e8c;border-radius:999px;padding:0 14px;font-size:.9rem;font-weight:700;position:absolute;bottom:-27px;left:0}.thinking-dots{flex-shrink:0;justify-content:center;gap:10px;padding:14px;display:flex}.thinking-dots--idle{visibility:hidden}.thinking-dots i{background:#93c5fd;border-radius:50%;width:14px;height:14px;animation:1.1s ease-in-out infinite dot-wave}.thinking-dots i:nth-child(2){animation-delay:.15s}.thinking-dots i:nth-child(3){animation-delay:.3s}@keyframes dot-wave{0%,to{opacity:.45;transform:translateY(5px)}50%{opacity:1;transform:translateY(-6px)}}.hero{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:8vmin;display:flex}.hero-text{text-align:center;font-size:clamp(1.9rem,9vmin,4.5rem);font-weight:900}.pulse{flex-shrink:0;place-items:center;width:22px;height:22px;display:inline-grid;position:relative}.pulse--hero{width:38vmin;height:38vmin}.pulse-core{background:radial-gradient(circle at 35% 30%,#fff1e2,#ff8a1f 60%,#f26a00);border-radius:50%;width:42%;height:42%;animation:3.2s ease-in-out infinite core-beat;box-shadow:0 0 22px #ff8a1fcc}.pulse-halo{opacity:.55;background:radial-gradient(circle,#ff8a1f8c,#0000 68%);border-radius:50%;transition:opacity .7s;animation:3.2s ease-in-out infinite halo-breathe;position:absolute;inset:-20%}.pulse--hearing .pulse-halo{opacity:1}@keyframes halo-breathe{0%,to{transform:scale(.82)}50%{transform:scale(1.08)}}@keyframes core-beat{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.display{flex-direction:column;flex:1;gap:6px;min-height:0;display:flex}.display-caption{color:var(--ink-soft);text-align:center;-webkit-line-clamp:2;-webkit-box-orient:vertical;flex-shrink:0;font-size:clamp(.95rem,3.8vmin,1.5rem);font-weight:700;line-height:1.4;display:-webkit-box;overflow:hidden}.display-body{flex:1;min-height:0;display:flex}.display-pager{flex-shrink:0;justify-content:center;gap:4px;display:flex}.pager-dot{background:radial-gradient(circle,#fff6 0 28%,#0000 30%);border:0;border-radius:50%;width:28px;height:28px;padding:0}.pager-dot--active{background:radial-gradient(circle, var(--orange) 0 38%, transparent 40%)}.cards{grid-auto-rows:minmax(0,1fr);grid-template-columns:repeat(var(--cols-portrait), minmax(0, 1fr));flex:1;gap:10px;min-width:0;min-height:0;display:grid}@media (orientation:landscape){.cards{grid-template-columns:repeat(var(--cols-landscape), minmax(0, 1fr))}}@media (orientation:portrait){.cards--wide-last .card:last-child{grid-column:1/-1}}.card{background:linear-gradient(150deg, color-mix(in srgb, var(--card), #fff 14%), var(--card) 55%, color-mix(in srgb, var(--card), #000 18%));min-width:0;min-height:0;animation:.5s cubic-bezier(.2,.9,.3,1.2) backwards card-in;animation-delay:calc(var(--i) * .11s);border-radius:22px;padding:10px 14px;transition:transform .3s,opacity .3s,box-shadow .3s;display:flex;position:relative;box-shadow:0 10px 30px #00000059}@keyframes card-in{0%{opacity:0;transform:translateY(26px)scale(.86)}}.card-number,.box-number{top:8px;color:#fff;background:#00000042;border-radius:50%;place-items:center;width:1.9em;height:1.9em;font-size:clamp(.8rem,3vmin,1.15rem);font-weight:800;display:grid;position:absolute;inset-inline-start:10px}.card-text{font-weight:900}.cards--reading .card:not(.card--active){opacity:.42;transform:scale(.97)}.card--active{z-index:1;box-shadow:0 0 0 4px #fff, 0 0 44px 8px var(--card);transform:scale(1.02)}.display--diagram{grid-template-rows:minmax(0,1fr) clamp(3.4rem,17%,7rem) auto;grid-template-columns:minmax(0,1fr);display:grid}.display--diagram .display-pager{grid-column:1/-1}.diagram-caption{color:var(--ink-soft);text-align:center;font-size:clamp(.92rem,3.7vmin,1.15rem);font-weight:700;line-height:1.5;overflow-y:auto}.diagram-caption--user{color:#ffd9b0}@media (orientation:landscape){.display--diagram{grid-template-rows:minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr) clamp(9rem,26%,18rem)}.diagram-caption{text-align:start;align-self:center;max-height:100%}}.thinking-dots--small{vertical-align:middle;gap:4px;padding:0 8px;display:inline-flex}.thinking-dots--small i{width:7px;height:7px}.diagram{touch-action:none;-webkit-user-select:none;user-select:none;flex:1;min-width:0;min-height:0;position:relative;overflow:hidden}.diagram-canvas{transform-origin:0 0;transition:transform .25s;position:absolute;top:0;left:0}.diagram-canvas--live{transition:none}.diagram-arrows{pointer-events:none;position:absolute;inset:0;overflow:visible}.arrow{--arrow-at:calc(var(--order) * var(--step,.32s) * .9);--arrow-ink:color-mix(in srgb, var(--arrow) 45%, #fff)}.arrow-line{fill:none;stroke:var(--arrow-ink);stroke-dasharray:1;stroke-linecap:round;stroke-width:3.5px;animation:.42s ease-in-out backwards arrow-draw;animation-delay:var(--arrow-at);transition:stroke-width .25s}.arrow-tip{fill:var(--arrow-ink);animation:.16s ease-out backwards arrow-tip-in;animation-delay:calc(var(--arrow-at) + .36s)}.arrow--active .arrow-line{stroke-width:5.5px}@keyframes arrow-draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@keyframes arrow-tip-in{0%{opacity:0}}.arrow-label{z-index:1;border:1px solid var(--panel-line);max-width:120px;color:var(--ink);text-align:center;white-space:nowrap;pointer-events:none;animation:.3s ease-out backwards stage-in;animation-delay:calc(var(--order) * var(--step,.32s));background:#140c30eb;border-radius:999px;padding:1px 8px;font-size:.78rem;font-weight:700;line-height:1.5;position:absolute;transform:translate(-50%,-50%)}.box{border:2px solid color-mix(in srgb, var(--box), #fff 35%);background:linear-gradient(150deg, color-mix(in srgb, var(--box), #fff 16%), var(--box) 55%, color-mix(in srgb, var(--box), #000 18%));cursor:pointer;animation:.45s cubic-bezier(.2,.9,.3,1.2) backwards card-in;animation-delay:calc(var(--i) * var(--step,.32s));border-radius:16px;padding:5px 10px;transition:opacity .3s,box-shadow .3s,transform .25s;display:flex;position:absolute;box-shadow:0 8px 22px #00000059}.box-number{top:3px;font-size:.68rem;inset-inline-start:4px}.box-text{font-weight:900}.diagram--reading .box:not(.box--active){opacity:.5}.box--active{z-index:2;box-shadow:0 0 0 3px #fff, 0 0 38px 8px var(--box);transform:scale(1.05)}.box--drawn{box-shadow:none;background:0 0;border:0;border-radius:0;padding:0}.box-shape{pointer-events:none;position:absolute;inset:0;overflow:visible}.box-shape-fill{fill:var(--box)}.box-shape-line{fill:none;stroke:color-mix(in srgb, var(--box), #fff 38%);stroke-linejoin:round;stroke-width:2px}.box-label{display:flex;position:absolute}.box--drawn.box--active{box-shadow:none}.box--drawn.box--active .box-shape-line{stroke:#fff;stroke-width:4px}.box--join:after{content:"";position:absolute;inset:-10px}.box--join .box-text{font-weight:800}.arrow--dashed .arrow-line{stroke-dasharray:7 6;animation:.3s ease-out backwards stage-in;animation-delay:var(--arrow-at)}.lifeline{stroke:var(--panel-line);stroke-dasharray:5 6;stroke-width:1.5px}.arrow-card{z-index:1;color:var(--ink);pointer-events:none;animation:.3s ease-out backwards stage-in;animation-delay:calc(var(--order) * var(--step,.32s));font-size:.86rem;font-weight:900;line-height:1;position:absolute;transform:translate(-50%,-50%)}.box--entity,.box--table{background:#fbfaff;border-radius:12px;padding:0;display:block;overflow:hidden;color:#1c1533!important}.record-title{background:var(--box);white-space:nowrap;text-overflow:ellipsis;justify-content:center;align-items:center;padding-inline:10px;font-size:.95rem;font-weight:900;display:flex;position:relative;overflow:hidden}.box:not(.box--drawn) .record-title{color:#fff;text-shadow:0 1px 2px #00000073}.record-rows{margin:0;padding-inline:8px;list-style:none;position:relative}.record-row{white-space:nowrap;align-items:center;gap:5px;font-size:.78rem;font-weight:700;display:flex}.record-name{text-overflow:ellipsis;min-width:0;overflow:hidden}.record-type{color:#6b6480;margin-inline-start:auto;font-size:.7rem;font-weight:600}.key{color:#fff;border-radius:4px;flex-shrink:0;padding:0 4px;font-size:.62rem;font-weight:900;line-height:1.5}.key--pk{background:#b45309}.key--fk{background:#1d4ed8}.diagram--mono{color:#141414;background:#fff;border-radius:14px}.diagram--mono .arrow{--arrow-ink:#141414}.diagram--mono .arrow-line{stroke-width:1.8px}.diagram--mono .arrow--active .arrow-line{stroke-width:3.4px}.diagram--mono .box-shape-fill{fill:#fff}.diagram--mono .box-shape-line{stroke:#141414;stroke-width:1.5px}.diagram--mono .box--join .box-shape-fill{fill:#141414}.diagram--mono .box--join{color:#fff!important}.diagram--mono .box--active .box-shape-line{stroke:#000;stroke-width:3.2px}.diagram--mono .box--active .box-shape-fill{fill:#f0f0f0}.diagram--mono.diagram--reading .box:not(.box--active){opacity:.4}.diagram--mono .box--entity,.diagram--mono .box--table{background:0 0;overflow:visible;color:#141414!important}.diagram--mono .record-title{background:0 0;border-bottom:1.5px solid #141414}.diagram--mono .record-type{color:#555}.diagram--mono .key{color:#141414;background:#fff;border:1.2px solid #141414}.diagram--mono .arrow-label{color:#141414;background:#fff;border-color:#141414}.diagram--mono .arrow-card{color:#141414}.diagram--mono .lifeline{stroke:#777}.diagram--mono .diagram-zoom button{-webkit-backdrop-filter:none;backdrop-filter:none;color:#141414;background:#fff;border-color:#141414}.diagram-source{z-index:4;border:1px solid var(--panel-line);color:var(--ink);touch-action:auto;-webkit-user-select:text;user-select:text;background:#120c28;border-radius:12px;flex-direction:column;display:flex;position:absolute;inset:8px}.diagram-source-bar{border-bottom:1px solid var(--panel-line);align-items:center;gap:8px;padding:8px 12px;display:flex}.diagram-source-bar strong{flex:1}.diagram-source-bar button{border:1px solid var(--panel-line);background:var(--panel);min-width:36px;height:32px;color:var(--ink);font:inherit;border-radius:8px;padding:0 10px;font-weight:700}.diagram-source pre{text-align:left;flex:1;margin:0;padding:12px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.82rem;line-height:1.5;overflow:auto}.diagram-zoom{z-index:3;bottom:4px;gap:6px;display:flex;position:absolute;inset-inline-end:4px}.diagram-zoom button{border:1px solid var(--panel-line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);width:40px;height:40px;color:var(--ink);background:#0a081e99;border-radius:12px;place-items:center;padding:0;font-size:1.3rem;font-weight:800;line-height:1;display:grid}.note{color:#2b1200;background:linear-gradient(160deg,#fff6c9,#ffe28a);border-radius:8px 8px 44px;flex:1;min-width:0;min-height:0;margin:8px;padding:7vmin 6vmin;animation:.55s cubic-bezier(.2,.9,.3,1.2) backwards note-in;display:flex;transform:rotate(-1.2deg);box-shadow:0 18px 50px #00000073}@keyframes note-in{0%{opacity:0;transform:rotate(-7deg)scale(.8)}}.note-text{font-weight:900}.ticker{color:var(--ink);text-align:center;text-overflow:ellipsis;white-space:nowrap;opacity:.5;flex-shrink:0;font-size:.85rem;line-height:1.5;overflow:hidden}.ticker--empty{visibility:hidden}.controls{flex-direction:column;flex-shrink:0;gap:8px;display:flex}.control-row{gap:8px;display:flex}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{cursor:not-allowed;opacity:.55}.mic{background:linear-gradient(180deg, var(--orange), var(--orange-deep));color:#2b1200;border:0;border-radius:20px;flex:1;justify-content:center;align-items:center;gap:12px;min-width:0;min-height:62px;padding:4px 12px;font-size:1.6rem;font-weight:800;display:flex;box-shadow:0 8px 24px #f26a0066}.mic:active:not(:disabled){transform:scale(.985)}.mic--active{box-shadow:inset 0 0 0 2px var(--orange);color:var(--ink);background:linear-gradient(#ff8a1f52,#f26a0038);font-size:clamp(1rem,4.4vw,1.35rem)}.mic--talk{-webkit-touch-callout:none;touch-action:none;-webkit-user-select:none;user-select:none}.fallback{border:1px solid var(--warn);background:#5a3c08d9;border-radius:14px;flex-direction:column;gap:6px;padding:10px 12px;font-size:.92rem;font-weight:600;line-height:1.5;display:flex}.fallback-retry{border:1px solid var(--warn);color:#fde68a;background:0 0;border-radius:12px;align-self:flex-start;min-height:40px;padding:0 14px;font-weight:700}.keyboard{border:1px solid var(--panel-line);background:var(--panel);width:62px;color:var(--ink);border-radius:20px;flex-shrink:0;place-items:center;display:grid}.keyboard--open{border-color:var(--orange);color:#ffc48a}.composer{gap:8px;display:flex}.composer textarea{resize:none;line-height:1.5}.composer input,.composer textarea{border:1px solid var(--panel-line);min-width:0;min-height:48px;color:var(--ink);background:#ffffff1a;border-radius:14px;flex:1;padding:0 14px;font-size:1.05rem}.composer input::placeholder,.composer textarea::placeholder{color:var(--ink-soft)}.send{border:1px solid var(--orange);color:#ffc48a;background:0 0;border-radius:14px;min-width:74px;min-height:48px;padding:0 14px;font-weight:700}:focus-visible{outline-offset:2px;outline:3px solid #fff}@media (height<=480px){.mic{min-height:46px}.badge--demo-note{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important}}
