:root{
    --ink:#0b1730;
    --ink2:#15264a;
    --muted:#66758b;
    --line:#dbe3ec;
    --soft:#f5f8fc;
    --white:#fff;
    --cyan:#22d7ee;
    --blue:#3e78ff;
    --purple:#b242ff;
    --deep:#071326;
    --gradient:linear-gradient(100deg,#1fcfea 0%,#3d7bff 48%,#bd42ff 100%);
    --shadow:0 22px 70px rgba(7,19,38,.12)
}
*{
    box-sizing:border-box
}
html{
    scroll-behavior:smooth
}
body{
    margin:0;
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    background:#fff;
    color:var(--ink);
    -webkit-font-smoothing:antialiased
}
a{
    text-decoration:none;
    color:inherit
}
button,input,textarea{
    font:inherit
}
.shell{
    width:min(1180px,calc(100% - 48px));
    margin:auto
}
.narrow{
    width:min(820px,100%)
}
.hidden{
    display:none!important
}
.site-header{
    position:sticky;
    top:0;
    z-index:60;
    background:rgba(255,255,255,.92);
    backdrop-filter:blur(16px);
    border-bottom:1px solid rgba(219,227,236,.9)
}
.nav{
    height:78px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px
}
.brand{
    display:flex;
    align-items:center;
    gap:10px
}
.brand-mark{
    width:31px;
    height:31px
}
.brand-word{
    font-size:18px;
    font-weight:900;
    letter-spacing:.18em;
    color:var(--ink)
}
.desktop-nav{
    display:flex;
    align-items:center;
    gap:23px;
    font-size:13px;
    font-weight:700;
    color:#4f6074
}
.desktop-nav a:hover{
    color:var(--ink)
}
.nav-login{
    color:var(--ink)!important
}
.mobile-menu-btn{
    display:none;
    border:0;
    background:transparent;
    font-size:22px
}
.mobile-menu{
    display:none
}
.mobile-menu.open{
    display:grid;
    padding:14px 24px 20px;
    border-top:1px solid var(--line);
    gap:12px;
    background:#fff
}
.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:0;
    border-radius:11px;
    background:var(--ink);
    color:#fff;
    padding:14px 21px;
    font-weight:850;
    cursor:pointer;
    transition:transform .18s,box-shadow .18s
}
.btn:hover{
    transform:translateY(-1px);
    box-shadow:0 10px 28px rgba(7,19,38,.16)
}
.btn-small{
    padding:10px 15px
}
.btn-gradient{
    background:var(--gradient);
    box-shadow:0 10px 26px rgba(61,123,255,.18)
}
.btn-light{
    background:#fff;
    color:var(--ink)
}
.full{
    width:100%
}
.text-link{
    font-weight:850;
    color:#244fae
}
.eyebrow{
    font-size:10px;
    letter-spacing:.18em;
    color:#4f66a0;
    font-weight:900;
    margin-bottom:18px
}
.eyebrow.light{
    color:#93b5d4
}
.lead{
    font-size:19px;
    line-height:1.68;
    color:var(--muted);
    max-width:680px
}
.lead-sm{
    font-size:16px;
    line-height:1.75;
    color:var(--muted)
}
.hero-v3{
    position:relative;
    overflow:hidden;
    padding:105px 0 100px;
    background:linear-gradient(180deg,#fff 0%,#f7faff 100%);
    isolation:isolate
}
.hero-grid-bg{
    position:absolute;
    inset:0;
    z-index:-4;
    opacity:.45;
    background-image:linear-gradient(rgba(62,120,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(62,120,255,.05) 1px,transparent 1px);
    background-size:58px 58px;
    mask-image:linear-gradient(#000,transparent 90%)
}
.hero-grid{
    display:grid;
    grid-template-columns:1.03fr .97fr;
    gap:70px;
    align-items:center
}
.hero h1{
    font-size:66px;
    line-height:1.02;
    letter-spacing:-.055em;
    margin:0;
    color:var(--ink)
}
.hero h1 span{
    background:var(--gradient);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent
}
.hero-actions{
    display:flex;
    align-items:center;
    gap:24px;
    margin-top:31px
}
.hero-proof{
    display:flex;
    align-items:center;
    gap:10px;
    margin-top:36px;
    color:#8290a2;
    font-size:8px;
    font-weight:900;
    letter-spacing:.12em;
    flex-wrap:wrap
}
.hero-proof i{
    width:27px;
    height:1px;
    background:linear-gradient(90deg,var(--line),var(--cyan))
}
.hero-stage{
    position:relative;
    perspective:1200px
}
.hero-product-card{
    position:relative;
    transform-style:preserve-3d;
    background:#fff;
    border:1px solid var(--line);
    border-radius:19px;
    overflow:hidden;
    box-shadow:0 35px 90px rgba(7,19,38,.16);
    transition:transform .17s ease-out
}
.look-glare{
    position:absolute;
    inset:-30%;
    z-index:4;
    pointer-events:none;
    opacity:.55;
    background:radial-gradient(circle at center,rgba(255,255,255,.9),rgba(255,255,255,0) 34%);
    mix-blend-mode:soft-light
}
.browser-top{
    height:46px;
    background:#eef3f8;
    border-bottom:1px solid var(--line);
    display:flex;
    align-items:center;
    gap:12px;
    padding:0 16px
}
.browser-dots{
    display:flex;
    gap:6px
}
.browser-dots i{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#b7c4d0
}
.browser-top small{
    font-size:9px;
    color:#7f8da0
}
.demo-doc{
    padding:37px
}
.demo-meta{
    font-size:9px;
    letter-spacing:.13em;
    color:#8492a3;
    font-weight:900
}
.demo-doc h3{
    font-size:23px;
    margin:9px 0 17px
}
.demo-doc>p{
    font:17px/1.82 Georgia,serif;
    color:#415065
}
.demo-doc mark,.story-body mark{
    background:#d9f4f3;
    padding:2px 3px;
    border-radius:2px
}
.action-demo{
    margin:17px 0
}
.knovali-action{
    height:44px;
    border:1px solid rgba(83,123,241,.32);
    background:#08172e;
    color:#fff;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:5px 14px 5px 6px;
    cursor:pointer;
    box-shadow:0 9px 26px rgba(53,94,255,.18);
    transition:transform .2s,box-shadow .2s,width .25s
}
.knovali-action:hover{
    transform:translateY(-1px);
    box-shadow:0 12px 33px rgba(69,93,255,.27)
}
.action-mark{
    width:32px;
    height:32px
}
.knovali-action span{
    font-size:10px;
    font-weight:900;
    letter-spacing:.08em;
    white-space:nowrap
}
.knovali-action.clicked .action-mark,.active-demo.clicked .action-mark{
    animation:markPulse .65s ease
}
.demo-answer{
    border-left:3px solid var(--cyan);
    background:#f5f8fc;
    border-radius:0 10px 10px 0;
    padding:16px 17px
}
.answer-label{
    font-size:8px;
    color:#4164ae;
    font-weight:900;
    letter-spacing:.14em
}
.demo-answer strong{
    display:block;
    margin-top:5px;
    font-size:13px
}
.demo-answer p{
    font-size:12px;
    line-height:1.6;
    color:var(--muted)
}
.answer-actions{
    display:flex;
    gap:7px;
    flex-wrap:wrap
}
.answer-actions span{
    border:1px solid var(--line);
    background:#fff;
    border-radius:999px;
    padding:6px 9px;
    font-size:9px;
    font-weight:800
}
.float-tag{
    position:absolute;
    background:#fff;
    border:1px solid var(--line);
    box-shadow:0 12px 34px rgba(7,19,38,.1);
    border-radius:999px;
    padding:8px 11px;
    font-size:7px;
    font-weight:900;
    letter-spacing:.14em;
    color:#4664a0
}
.tag-one{
    right:-16px;
    top:58px;
    animation:floaty 5.2s ease-in-out infinite
}
.tag-two{
    left:-22px;
    bottom:112px;
    animation:floaty 6.1s ease-in-out infinite reverse
}
.tag-three{
    right:30px;
    bottom:-15px;
    animation:floaty 7s ease-in-out infinite
}
.hero-orbit{
    position:absolute;
    border:1px solid rgba(74,103,206,.12);
    border-radius:50%;
    z-index:-3
}
.orbit-a{
    width:540px;
    height:540px;
    right:-200px;
    top:-220px;
    animation:slowSpin 34s linear infinite
}
.orbit-b{
    width:340px;
    height:340px;
    right:95px;
    top:80px;
    border-style:dashed;
    animation:slowSpinR 28s linear infinite
}
.signal-band{
    background:var(--deep);
    color:#fff;
    padding:25px 0
}
.signal-grid{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px
}
.signal-grid>div{
    display:flex;
    flex-direction:column
}
.signal-grid small{
    font-size:7px;
    color:#7188a5;
    letter-spacing:.16em;
    font-weight:900
}
.signal-grid strong{
    font-size:11px;
    margin:3px 0
}
.signal-grid span{
    font-size:9px;
    color:#96a7ba
}
.signal-grid>b{
    color:#4f74ff
}
.signal-feature strong{
    display:flex;
    align-items:center;
    gap:6px
}
.mini-mark{
    width:18px;
    height:18px
}
.section{
    padding:95px 0
}
.section-soft{
    background:var(--soft)
}
.section-head{
    max-width:760px;
    margin-bottom:44px
}
.section-head.centered{
    text-align:center;
    margin:0 auto 44px
}
.section h2,.cta h2{
    font-size:43px;
    line-height:1.12;
    letter-spacing:-.04em;
    margin:0 0 18px
}
.section-head p{
    font-size:16px;
    line-height:1.7;
    color:var(--muted)
}
.icon-story{
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:55px;
    align-items:center;
    border:1px solid var(--line);
    border-radius:18px;
    padding:46px;
    background:linear-gradient(135deg,#fbfdff,#f5f7ff)
}
.icon-story-left{
    text-align:center
}
.icon-halo{
    width:235px;
    height:235px;
    margin:0 auto 25px;
    border-radius:44px;
    display:grid;
    place-items:center;
    background:radial-gradient(circle at 50% 45%,rgba(73,126,255,.18),rgba(7,19,38,.98) 68%);
    box-shadow:inset 0 0 0 1px rgba(87,113,255,.28),0 28px 60px rgba(27,54,111,.2)
}
.giant-mark{
    width:160px;
    height:160px
}
.icon-story-left h3{
    font-size:24px;
    margin:0
}
.icon-story-left p{
    font-size:13px;
    line-height:1.65;
    color:var(--muted);
    max-width:380px;
    margin:11px auto 20px
}
.icon-meaning{
    display:flex;
    justify-content:center;
    gap:12px;
    flex-wrap:wrap
}
.icon-meaning span{
    font-size:9px;
    color:#69798c
}
.dot{
    display:inline-block;
    width:7px;
    height:7px;
    border-radius:50%;
    margin-right:4px
}
.cyan{
    background:var(--cyan)
}
.blue{
    background:var(--blue)
}
.purple{
    background:var(--purple)
}
.navy{
    background:var(--ink)
}
.icon-story-right{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px
}
.button-state{
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
    padding:22px;
    min-height:130px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center
}
.button-state small{
    font-size:7px;
    letter-spacing:.14em;
    color:#8896a7;
    font-weight:900;
    margin-bottom:15px
}
.icon-only{
    width:52px;
    padding:5px
}
.icon-only span{
    display:none
}
.expanded{
    min-width:145px
}
.click-sequence{
    grid-column:1/-1;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
    padding:20px
}
.click-sequence div{
    display:flex;
    align-items:center;
    gap:7px;
    color:#67778a;
    font-size:9px;
    font-weight:800
}
.seq-mark{
    width:36px;
    height:36px
}
.click-sequence b{
    color:#627af1
}
.story-experience{
    border:1px solid var(--line);
    border-radius:18px;
    background:#fff;
    overflow:hidden;
    box-shadow:0 24px 70px rgba(7,19,38,.08)
}
.story-tabs{
    display:flex;
    gap:3px;
    padding:12px;
    border-bottom:1px solid var(--line);
    background:#f9fbfd;
    overflow-x:auto
}
.story-tab{
    border:0;
    background:transparent;
    padding:10px 14px;
    border-radius:8px;
    color:#758596;
    font-weight:850;
    font-size:10px;
    cursor:pointer;
    white-space:nowrap
}
.story-tab.active{
    background:var(--ink);
    color:#fff
}
.story-stage{
    display:grid;
    grid-template-columns:205px 1fr;
    min-height:510px
}
.story-rail{
    border-right:1px solid var(--line);
    padding:34px 25px;
    background:#fbfdff
}
.rail-kicker{
    font-size:7px;
    letter-spacing:.18em;
    color:#91a0af;
    font-weight:900;
    margin-bottom:28px
}
.rail-step{
    display:grid;
    grid-template-columns:28px 1fr;
    column-gap:8px
}
.rail-step span{
    grid-row:1/3;
    width:28px;
    height:28px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#eaf0ff;
    color:#4264c2;
    font-size:8px;
    font-weight:900
}
.rail-step strong{
    font-size:11px
}
.rail-step small{
    font-size:9px;
    color:#8b99a7;
    margin-top:2px
}
.rail-line{
    width:1px;
    height:33px;
    background:linear-gradient(var(--cyan),var(--line));
    margin:5px 0 5px 14px
}
.story-device-wrap{
    position:relative;
    display:grid;
    place-items:center;
    padding:45px;
    overflow:hidden;
    background:radial-gradient(circle at 75% 18%,rgba(82,104,247,.08),transparent 36%),linear-gradient(#fff,#f9fbff)
}
.story-device{
    width:min(720px,100%);
    border:1px solid var(--line);
    border-radius:16px;
    background:#fff;
    box-shadow:0 28px 75px rgba(7,19,38,.12);
    overflow:hidden;
    transition:transform .35s,opacity .3s
}
.story-device.switching{
    transform:translateY(7px) scale(.993);
    opacity:.56
}
.story-device-top{
    height:44px;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    padding:0 16px;
    background:#eef3f8;
    border-bottom:1px solid var(--line)
}
.story-dots{
    display:flex;
    gap:6px
}
.story-dots i{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#b8c4ce
}
.story-source{
    font-size:8px;
    font-weight:900;
    letter-spacing:.12em;
    color:#778796
}
.story-status{
    justify-self:end;
    font-size:7px;
    font-weight:900;
    color:#78909e
}
.story-status span{
    display:inline-block;
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--cyan);
    margin-right:4px
}
.story-document{
    padding:36px 40px
}
.story-doc-meta{
    font-size:8px;
    letter-spacing:.12em;
    color:#8a99a8;
    font-weight:900;
    margin-bottom:9px
}
.story-document h3{
    font-size:23px;
    margin:0 0 18px
}
.story-body{
    font:17px/1.8 Georgia,serif;
    color:#3f4e5d
}
.story-knovali{
    margin-top:20px
}
.story-answer{
    margin-top:17px;
    border-left:3px solid var(--cyan);
    border-radius:0 10px 10px 0;
    background:#f4f7fc;
    padding:16px 17px;
    transition:opacity .35s,transform .35s
}
.story-answer.is-thinking{
    opacity:.32;
    transform:translateY(6px)
}
.story-answer-label{
    font-size:8px;
    letter-spacing:.14em;
    font-weight:900;
    color:#4665b1
}
.story-answer strong{
    display:block;
    font-size:13px
}
.story-answer p{
    font-size:12px;
    line-height:1.55;
    color:var(--muted)
}
.story-answer-actions{
    display:flex;
    gap:7px;
    flex-wrap:wrap
}
.story-answer-actions span{
    border:1px solid var(--line);
    background:#fff;
    border-radius:999px;
    padding:6px 9px;
    font-size:9px;
    font-weight:850
}
.story-side-note{
    position:absolute;
    background:#fff;
    border:1px solid var(--line);
    box-shadow:0 12px 34px rgba(7,19,38,.1);
    padding:10px 12px;
    border-radius:10px
}
.story-side-note small{
    display:block;
    font-size:7px;
    letter-spacing:.14em;
    color:#91a0af;
    font-weight:900
}
.story-side-note strong{
    font-size:9px
}
.note-context{
    right:18px;
    top:72px;
    animation:floaty 6s ease-in-out infinite
}
.note-person{
    left:18px;
    bottom:54px;
    animation:floaty 6.8s ease-in-out infinite reverse
}
.knowledge-section{
    background:#fff
}
.knowledge-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;
    align-items:center
}
.knowledge-points{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top:24px
}
.knowledge-points span{
    border:1px solid var(--line);
    border-radius:999px;
    padding:8px 11px;
    font-size:9px;
    font-weight:800;
    color:#647487
}
.knowledge-orbit{
    position:relative;
    min-height:430px;
    display:grid;
    place-items:center
}
.orbit-core{
    position:relative;
    z-index:4;
    width:165px;
    height:165px;
    border-radius:50%;
    background:var(--ink);
    color:#fff;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    box-shadow:0 22px 55px rgba(7,19,38,.2)
}
.orbit-brand{
    width:58px;
    height:58px
}
.orbit-core strong{
    font-size:11px;
    letter-spacing:.08em;
    margin-top:4px
}
.orbit-ring{
    position:absolute;
    border:1px solid rgba(62,120,255,.18);
    border-radius:50%
}
.ring-a{
    width:305px;
    height:305px
}
.ring-b{
    width:400px;
    height:400px;
    border-style:dashed;
    animation:slowSpin 30s linear infinite
}
.orbit-node{
    position:absolute;
    z-index:5;
    background:#fff;
    border:1px solid var(--line);
    border-radius:999px;
    padding:9px 12px;
    font-size:8px;
    font-weight:900;
    color:#536ba9;
    box-shadow:0 10px 28px rgba(7,19,38,.08)
}
.n1{
    top:50px
}
.n2{
    right:35px;
    top:143px
}
.n3{
    right:55px;
    bottom:85px
}
.n4{
    left:58px;
    bottom:82px
}
.n5{
    left:32px;
    top:147px
}
.audience-section{
    background:var(--deep);
    color:#fff
}
.audience-section h2{
    color:#fff
}
.audience-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border:1px solid rgba(255,255,255,.13);
    border-radius:16px;
    overflow:hidden
}
.audience-grid a{
    padding:27px 23px;
    border-right:1px solid rgba(255,255,255,.1);
    min-height:180px;
    transition:background .2s
}
.audience-grid a:last-child{
    border-right:0
}
.audience-grid a:hover{
    background:rgba(255,255,255,.055)
}
.audience-grid small{
    font-size:7px;
    color:#7d99bd;
    letter-spacing:.16em;
    font-weight:900
}
.audience-grid strong{
    display:block;
    font-size:15px;
    margin:9px 0
}
.audience-grid span{
    font-size:11px;
    line-height:1.55;
    color:#9eb0c4
}
.cta{
    background:var(--ink);
    color:#fff;
    padding:65px 0
}
.cta h2{
    color:#fff
}
.cta p{
    color:#aebdcd
}
.cta-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:40px
}
.footer{
    background:#050f20;
    color:#fff;
    padding:48px 0 22px
}
.footer-grid{
    display:flex;
    justify-content:space-between;
    gap:50px
}
.footer-brand{
    color:#fff
}
.footer p{
    color:#7e91a6;
    font-size:12px
}
.footer-columns{
    display:grid;
    grid-template-columns:repeat(2,150px);
    gap:25px
}
.footer-columns div{
    display:grid;
    gap:9px
}
.footer-columns strong{
    font-size:9px;
    letter-spacing:.12em
}
.footer-columns a{
    color:#93a4b7;
    font-size:11px
}
.footer-bottom{
    margin-top:35px;
    padding-top:20px;
    border-top:1px solid rgba(255,255,255,.08);
    display:flex;
    justify-content:space-between;
    color:#6f8195;
    font-size:8px;
    letter-spacing:.1em
}
.inner-hero{
    padding:90px 0 60px;
    background:linear-gradient(180deg,#fff,#f6f9fe)
}
.inner-hero h1{
    font-size:50px;
    line-height:1.08;
    letter-spacing:-.04em;
    margin:0
}
.prose p{
    font-size:17px;
    line-height:1.8;
    color:var(--muted)
}
.pricing-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:17px
}
.price-card{
    border:1px solid var(--line);
    border-radius:16px;
    padding:27px
}
.price-card.featured{
    box-shadow:var(--shadow);
    border-color:#becbf5
}
.price-card small{
    font-size:8px;
    letter-spacing:.15em;
    font-weight:900;
    color:#516aa8
}
.price-card h2{
    font-size:34px;
    margin:8px 0
}
.price-card h2 span{
    font-size:12px;
    color:var(--muted)
}
.price-card p,.price-card li{
    font-size:12px;
    line-height:1.55;
    color:var(--muted)
}
.price-card ul{
    padding-left:18px;
    min-height:120px
}
.form-card,.auth-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    padding:30px;
    box-shadow:var(--shadow)
}
label{
    display:block;
    font-size:11px;
    font-weight:850;
    color:#41517a;
    margin-bottom:17px
}
input,textarea{
    width:100%;
    margin-top:7px;
    border:1px solid #cad5e0;
    border-radius:9px;
    padding:13px 14px;
    color:var(--ink);
    background:#fff
}
textarea{
    resize:vertical
}
.notice{
    background:#edf8f6;
    border:1px solid #c6ebe5;
    padding:13px 15px;
    border-radius:9px;
    margin-bottom:18px
}
.notice.error{
    background:#fff2f2;
    border-color:#efcece
}
.auth-page{
    min-height:720px;
    background:#f5f8fc;
    padding:75px 24px
}
.auth-shell{
    width:min(980px,100%);
    margin:auto;
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:0;
    border-radius:20px;
    overflow:hidden;
    box-shadow:var(--shadow)
}
.auth-brand-side{
    background:var(--deep);
    color:#fff;
    padding:55px
}
.auth-brand-side h2{
    font-size:36px;
    letter-spacing:-.04em
}
.auth-brand-side p{
    color:#9dafc3;
    line-height:1.7
}
.auth-mark{
    width:88px;
    height:88px;
    margin-bottom:35px
}
.auth-card{
    border-radius:0;
    box-shadow:none;
    padding:55px
}
.auth-card h1{
    font-size:36px;
    margin-top:0
}
.auth-alt{
    text-align:center;
    font-size:12px;
    color:var(--muted)
}
.auth-alt a{
    color:#3357b3;
    font-weight:850
}
.auth-card-single{
    width:min(470px,100%);
    margin:auto;
    border-radius:18px
}
.login-mark{
    width:70px;
    height:70px;
    margin-bottom:18px
}
.workspace{
    background:#f3f6fa;
    min-height:780px;
    padding:43px 0
}
.workspace-grid{
    display:grid;
    grid-template-columns:210px minmax(0,1fr);
    gap:32px
}
.workspace-nav{
    display:flex;
    flex-direction:column;
    gap:6px
}
.workspace-brand{
    display:flex;
    align-items:center;
    gap:8px;
    padding:6px 10px 20px
}
.workspace-brand-mark{
    width:28px;
    height:28px
}
.workspace-brand span{
    font-size:11px;
    font-weight:900;
    letter-spacing:.14em
}
.workspace-nav a,.workspace-user{
    padding:11px 13px;
    border-radius:9px;
    font-size:12px
}
.workspace-nav a.active{
    background:#fff;
    border:1px solid var(--line);
    font-weight:850
}
.workspace-user{
    color:var(--muted);
    margin-bottom:7px
}
.workspace-main{
    min-width:0
}
.workspace-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start
}
.workspace-head h1,.workspace-main>h1{
    font-size:38px;
    line-height:1.1;
    letter-spacing:-.035em;
    margin:0 0 25px
}
.workspace-head h1 span{
    color:#5269ad
}
.plan-badge{
    border:1px solid #c3cff5;
    background:#eef1ff;
    color:#4f62ac;
    font-size:8px;
    font-weight:900;
    border-radius:999px;
    padding:7px 10px
}
.workspace-launcher{
    background:#fff;
    border:1px solid var(--line);
    border-radius:15px;
    padding:14px;
    box-shadow:0 12px 35px rgba(7,19,38,.05)
}
.mode-tabs{
    display:flex;
    gap:6px;
    margin-bottom:10px
}
.mode-tab{
    border:1px solid var(--line);
    background:#fff;
    padding:9px 13px;
    border-radius:8px;
    font-weight:850;
    color:var(--muted);
    cursor:pointer;
    font-size:11px
}
.mode-tab.active{
    background:var(--ink);
    color:#fff
}
.mode-panel{
    display:none;
    padding:12px 4px 4px
}
.mode-panel.active{
    display:block
}
.helper{
    font-size:10px;
    color:var(--muted)
}
.upload-zone{
    min-height:188px;
    border:1.5px dashed #c8d2dd;
    border-radius:13px;
    background:#fafcff;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:17px;
    padding:29px
}
.upload-zone.dragging{
    border-color:#647cf1;
    background:#f4f6ff
}
.upload-zone input{
    position:absolute;
    width:1px;
    height:1px;
    opacity:0
}
.upload-orb{
    width:52px;
    height:52px;
    border-radius:14px;
    background:#07162e;
    padding:8px
}
.upload-mark{
    width:100%;
    height:100%
}
.upload-zone strong{
    display:block;
    font-size:14px
}
.upload-zone small{
    display:block;
    font-size:10px;
    color:var(--muted);
    margin-top:4px
}
.upload-zone .btn{
    margin-left:auto
}
.upload-progress{
    margin-top:10px;
    padding:11px 13px;
    border-radius:8px;
    background:#eef7f7;
    display:flex;
    gap:8px;
    align-items:center;
    font-size:10px;
    color:#4f6871
}
.upload-progress span{
    width:8px;
    height:8px;
    border-radius:50%;
    background:var(--cyan);
    animation:pulseRing 1.5s infinite
}
.url-row{
    display:flex;
    gap:9px
}
.url-row input{
    margin-top:0
}
.reader-shell{
    margin-top:24px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:15px;
    position:relative;
    overflow:visible
}
.reader-toolbar{
    height:63px;
    padding:0 17px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid var(--line)
}
.reader-file{
    display:flex;
    align-items:center;
    gap:10px
}
.reader-file-icon{
    width:36px;
    height:36px;
    border-radius:8px;
    background:#ebf0fb;
    color:#5268aa;
    display:grid;
    place-items:center;
    font-size:8px;
    font-weight:900
}
.reader-file div{
    display:flex;
    flex-direction:column
}
.reader-file strong{
    font-size:11px
}
.reader-file small{
    font-size:8px;
    color:var(--muted);
    margin-top:3px
}
.text-button{
    border:0;
    background:transparent;
    color:#3855a2;
    font-weight:850;
    cursor:pointer
}
.reader-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 390px;
    min-height:580px
}
.reader-content{
    padding:44px 52px;
    white-space:pre-wrap;
    line-height:1.85;
    font:16px/1.85 Georgia,serif;
    min-height:580px;
    max-height:760px;
    overflow:auto;
    border-right:1px solid var(--line)
}
.reader-content::selection{
    background:#c9edf4
}
.knovali-panel{
    background:#fbfcff;
    max-height:760px;
    overflow:auto
}
.panel-empty{
    min-height:500px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:36px;
    color:var(--muted)
}
.panel-orb{
    width:70px;
    height:70px;
    border-radius:22px;
    background:#06152b;
    padding:9px;
    margin-bottom:18px;
    box-shadow:0 16px 36px rgba(7,19,38,.18)
}
.panel-mark{
    width:100%;
    height:100%
}
.panel-empty strong{
    font-size:14px;
    color:var(--ink)
}
.panel-empty p{
    font-size:11px;
    line-height:1.6;
    max-width:250px
}
.panel-top-v3{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:17px 19px;
    border-bottom:1px solid var(--line);
    background:#fff
}
.panel-top-v3>div{
    display:flex;
    align-items:center;
    gap:9px
}
.panel-head-mark{
    width:31px;
    height:31px
}
.panel-top-v3 span{
    display:flex;
    flex-direction:column
}
.panel-top-v3 small{
    font-size:7px;
    letter-spacing:.15em;
    color:#4b66b0;
    font-weight:900
}
.panel-top-v3 strong{
    font-size:11px;
    margin-top:2px
}
.panel-top-v3 button{
    border:0;
    background:transparent;
    font-size:22px;
    color:#92a0af
}
.selected-quote{
    padding:13px 18px;
    background:#f3f6fb;
    font:italic 12px/1.5 Georgia,serif;
    color:#607084;
    max-height:110px;
    overflow:auto
}
.result-tabs{
    display:flex;
    padding:9px 11px 0;
    gap:3px;
    background:#fff;
    border-bottom:1px solid var(--line);
    overflow-x:auto
}
.result-tab{
    border:0;
    background:transparent;
    padding:9px 7px 10px;
    font-size:8px;
    font-weight:900;
    color:#8391a0;
    border-bottom:2px solid transparent;
    white-space:nowrap
}
.result-tab.active{
    color:var(--ink);
    border-bottom-color:#647cf1
}
.analysis-result{
    background:#fff
}
.analysis-block-v3{
    padding:19px
}
.analysis-block-v3 p{
    font-size:12px;
    line-height:1.7;
    margin:0;
    color:#344557
}
.analysis-thinking{
    display:flex;
    gap:8px;
    align-items:center;
    padding:20px;
    font-size:10px;
    color:#71808f
}
.analysis-thinking span{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#647cf1;
    animation:pulseRing 1.4s infinite
}
.key-terms-wrap,.connections-wrap,.result-extra{
    padding:15px 19px;
    border-top:1px solid var(--line);
    background:#fff
}
.key-terms-wrap>label,.connections-wrap>label,.result-extra>label,.followup-box>label{
    font-size:7px;
    letter-spacing:.14em;
    color:#4e65ab;
    font-weight:900;
    margin:0 0 9px
}
.key-term{
    display:grid;
    grid-template-columns:95px 1fr;
    gap:10px;
    padding:7px 0;
    border-bottom:1px solid #eef2f5
}
.key-term strong{
    font-size:9px
}
.key-term span{
    font-size:9px;
    line-height:1.45;
    color:var(--muted)
}
.connections-wrap div{
    display:flex;
    gap:6px;
    flex-wrap:wrap
}
.connections-wrap span{
    border:1px solid var(--line);
    border-radius:999px;
    padding:6px 8px;
    background:#f8faff;
    color:#5a6d8b;
    font-size:8px;
    font-weight:800
}
.result-extra p{
    font-size:10px;
    line-height:1.55;
    color:var(--muted);
    margin:0
}
.result-extra.caution{
    background:#fffaf1
}
.panel-actions-row{
    padding:12px 18px;
    border-top:1px solid var(--line);
    background:#fff
}
.panel-actions-row button{
    border:1px solid var(--line);
    background:#fff;
    border-radius:9px;
    padding:8px 10px;
    display:flex;
    align-items:center;
    gap:7px;
    font-size:9px;
    font-weight:850
}
.remember-mark{
    width:22px;
    height:22px
}
.panel-actions-row button.saved{
    background:#effaf7;
    border-color:#c6e9df
}
.followup-box{
    padding:16px 19px;
    border-top:1px solid var(--line)
}
.followup-row{
    display:grid;
    grid-template-columns:1fr 38px;
    gap:7px;
    align-items:end
}
.followup-row textarea{
    margin:0;
    min-height:60px;
    font-size:11px
}
.followup-row button{
    height:38px;
    border:0;
    border-radius:8px;
    background:var(--ink);
    color:#fff;
    font-size:17px
}
.followup-answer{
    margin-top:9px;
    padding:11px;
    border-radius:8px;
    background:#eef3fb;
    color:#344557;
    font-size:10px;
    line-height:1.55
}
.selection-knovali{
    position:absolute;
    z-index:75;
    height:44px;
    border:1px solid rgba(83,123,241,.32);
    background:#08172e;
    color:#fff;
    border-radius:999px;
    padding:5px 13px 5px 6px;
    display:flex;
    align-items:center;
    gap:8px;
    box-shadow:0 10px 26px rgba(54,82,197,.22);
    cursor:pointer
}
.selection-mark{
    width:31px;
    height:31px
}
.selection-knovali span{
    font-size:9px;
    font-weight:900;
    letter-spacing:.07em
}
.history-list,.knowledge-list{
    display:grid;
    gap:13px
}
.history-card,.empty-state,.knowledge-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:12px;
    padding:19px
}
.history-meta,.knowledge-card small{
    font-size:8px;
    color:var(--muted);
    text-transform:uppercase;
    letter-spacing:.08em
}
.history-card blockquote{
    font-family:Georgia,serif;
    border-left:2px solid #637af1;
    padding-left:13px;
    margin-left:0;
    color:#435365
}
.history-card p,.knowledge-card p{
    font-size:11px;
    color:var(--muted);
    line-height:1.6
}
.knowledge-card-top{
    display:flex;
    align-items:center;
    justify-content:space-between
}
.knowledge-card-mark{
    width:30px;
    height:30px
}
.knowledge-card-top span{
    font-size:7px;
    color:#5a6fae;
    font-weight:900;
    letter-spacing:.1em
}
.knowledge-card h3{
    font-size:16px;
    margin:12px 0 6px
}
.error-inline{
    padding:16px;
    color:#9b3c3c;
    background:#fff1f1;
    font-size:10px
}
.reveal{
    animation:reveal .8s cubic-bezier(.2,.7,.2,1) both
}
.hero-stage.reveal{
    animation-delay:.12s
}
.reveal-section{
    opacity:0;
    transform:translateY(22px);
    transition:opacity .7s,transform .7s
}
.reveal-section.visible{
    opacity:1;
    transform:none
}
@keyframes reveal{
    from{
        opacity:0;
        transform:translateY(20px)
    }
    to{
        opacity:1;
        transform:none
    }
}
@keyframes floaty{
    0%,100%{
        transform:translateY(0)
    }
    50%{
        transform:translateY(-9px)
    }
}
@keyframes slowSpin{
    to{
        transform:rotate(360deg)
    }
}
@keyframes slowSpinR{
    to{
        transform:rotate(-360deg)
    }
}
@keyframes markPulse{
    0%{
        transform:scale(1)
    }
    45%{
        transform:scale(.82) rotate(24deg)
    }
    100%{
        transform:scale(1) rotate(0)
    }
}
@keyframes pulseRing{
    0%{
        box-shadow:0 0 0 0 rgba(70,105,235,.36)
    }
    70%{
        box-shadow:0 0 0 8px rgba(70,105,235,0)
    }
    100%{
        box-shadow:0 0 0 0 rgba(70,105,235,0)
    }
}
@media(max-width:1000px){
    .desktop-nav{
        display:none
    }
    .mobile-menu-btn{
        display:block
    }
    .hero-grid,.knowledge-grid,.auth-shell{
        grid-template-columns:1fr
    }
    .hero{
        padding-top:72px
    }
    .hero h1{
        font-size:54px
    }
    .icon-story{
        grid-template-columns:1fr
    }
    .story-stage{
        grid-template-columns:1fr
    }
    .story-rail{
        display:none
    }
    .audience-grid{
        grid-template-columns:repeat(2,1fr)
    }
    .reader-layout{
        grid-template-columns:1fr
    }
    .reader-content{
        border-right:0;
        border-bottom:1px solid var(--line);
        max-height:620px
    }
    .knovali-panel{
        max-height:none
    }
    .workspace-grid{
        grid-template-columns:1fr
    }
    .workspace-nav{
        flex-direction:row;
        overflow:auto
    }
    .workspace-brand,.workspace-user{
        display:none
    }
    .pricing-grid{
        grid-template-columns:1fr
    }
    .auth-brand-side{
        display:none
    }
    .auth-card{
        border-radius:18px
    }
    .story-side-note{
        display:none
    }
}
@media(max-width:650px){
    .shell{
        width:min(100% - 28px,1180px)
    }
    .hero h1{
        font-size:42px
    }
    .section{
        padding:70px 0
    }
    .section h2{
        font-size:34px
    }
    .hero-actions{
        align-items:flex-start;
        flex-direction:column
    }
    .signal-grid{
        overflow-x:auto;
        justify-content:flex-start
    }
    .signal-grid>div{
        min-width:120px
    }
    .icon-story{
        padding:25px 16px
    }
    .icon-story-right{
        grid-template-columns:1fr
    }
    .click-sequence{
        grid-column:auto;
        overflow-x:auto
    }
    .story-device-wrap{
        padding:20px 10px 34px
    }
    .story-document{
        padding:27px 22px
    }
    .audience-grid{
        grid-template-columns:1fr
    }
    .audience-grid a{
        border-right:0;
        border-bottom:1px solid rgba(255,255,255,.1)
    }
    .footer-grid,.footer-bottom,.cta-inner{
        flex-direction:column;
        align-items:flex-start
    }
    .footer-columns{
        grid-template-columns:repeat(2,1fr);
        width:100%
    }
    .upload-zone{
        flex-direction:column;
        text-align:center
    }
    .upload-zone .btn{
        margin-left:0
    }
    .url-row{
        flex-direction:column
    }
    .reader-content{
        padding:28px 20px
    }
    .workspace-head h1{
        font-size:31px
    }
    .key-term{
        grid-template-columns:1fr
    }
    .orbit-node{
        display:none
    }
    .knowledge-orbit{
        min-height:320px;
        transform:scale(.85)
    }
}
@media(prefers-reduced-motion:reduce){
    *,*:before,*:after{
        scroll-behavior:auto!important;
        animation:none!important;
        transition:none!important
    }
    .reveal-section{
        opacity:1;
        transform:none
    }
}
/* PDF reliability update */
.pdf-notice{
    margin-top:10px;
    border:1px solid var(--line);
    border-radius:10px;
    padding:12px 14px;
    display:flex;
    flex-direction:column;
    gap:4px;
    background:#fff;
}
.pdf-notice strong{
    font-size:11px;
    color:var(--ink)
}
.pdf-notice span{
    font-size:10px;
    line-height:1.5;
    color:var(--muted)
}
.pdf-notice.info{
    background:#f3f7ff;
    border-color:#cfdbfb
}
.pdf-notice.scan{
    background:#fff9ed;
    border-color:#efdcae
}
.pdf-notice.error{
    background:#fff2f2;
    border-color:#efcccc
}
/* ===== KNOVALI AI / USAGE / PERFORMANCE UPDATE ===== */
/* Let the browser skip layout/paint for distant sections until needed. */
@supports (content-visibility:auto){
    .section,
    .signal-band,
    .cta,
    .footer{
        content-visibility:auto;
        contain-intrinsic-size:1px 700px
    }
}
/* Continuous decorative motion was visually strong but expensive.
Keep those elements composed and premium, but static by default. */
.hero-orbit,.float-tag,.note-context,.note-person,.ring-b{
    animation:none!important
}
.hero-product-card{
    will-change:auto
}
.hero-stage:hover .hero-product-card{
    will-change:transform
}
/* Faster, subtler one-time reveals. */
.reveal-section{
    transition:opacity .42s ease,transform .42s ease;
    transform:translateY(12px)
}
.reveal-section.visible{
    opacity:1;
    transform:none
}
/* AI architecture */
.ai-platform-section{
    background:linear-gradient(180deg,#fff,#f7f9ff)
}
.ai-pipeline{
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1.08fr;
    gap:10px;
    align-items:stretch
}
.ai-pipeline>i{
    font-style:normal;
    display:grid;
    place-items:center;
    color:#7b8fca
}
.ai-pipe-item{
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
    padding:21px 17px;
    min-width:0
}
.ai-pipe-item>span{
    font-size:8px;
    letter-spacing:.14em;
    color:#8291a4;
    font-weight:900
}
.ai-pipe-item strong{
    display:block;
    font-size:13px;
    margin:9px 0 5px;
    color:var(--ink)
}
.ai-pipe-item small{
    display:block;
    font-size:9px;
    line-height:1.45;
    color:var(--muted)
}
.ai-pipe-item.featured{
    background:var(--deep);
    color:#fff;
    border-color:transparent;
    text-align:center
}
.ai-pipe-item.featured strong{
    color:#fff;
    letter-spacing:.08em
}
.ai-pipe-item.featured small{
    color:#9fb1c8
}
.ai-pipe-mark{
    width:48px;
    height:48px;
    margin:auto
}
.ai-principles{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
    margin-top:17px
}
.ai-principles article{
    padding:20px;
    border:1px solid var(--line);
    border-radius:13px;
    background:#fff
}
.ai-principles strong{
    font-size:12px
}
.ai-principles p{
    font-size:10px;
    line-height:1.55;
    color:var(--muted);
    margin-bottom:0
}
/* Pricing transparency */
.pricing-note{
    max-width:860px;
    margin:24px auto 0;
    text-align:center;
    font-size:10px;
    line-height:1.6;
    color:var(--muted)
}
/* Workspace AI usage */
.workspace-account-tools{
    display:flex;
    align-items:flex-start;
    gap:10px
}
.usage-meter-card{
    width:185px;
    border:1px solid var(--line);
    border-radius:11px;
    background:#fff;
    padding:10px 11px
}
.usage-meter-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px
}
.usage-meter-top span{
    font-size:7px;
    letter-spacing:.14em;
    font-weight:900;
    color:#74849a
}
.usage-meter-top strong{
    font-size:10px;
    color:var(--ink)
}
.usage-track{
    height:4px;
    background:#e9eef5;
    border-radius:999px;
    overflow:hidden;
    margin:8px 0 6px
}
.usage-track i{
    display:block;
    height:100%;
    width:0;
    background:linear-gradient(90deg,var(--cyan),var(--blue));
    border-radius:999px;
    transition:width .3s ease
}
.usage-meter-card small{
    display:block;
    font-size:7px;
    color:var(--muted);
    line-height:1.35
}
.usage-meter-card.near-limit .usage-track i{
    background:linear-gradient(90deg,#e1ad48,#d9853d)
}
.usage-meter-card.at-limit .usage-track i{
    background:#c44d5b
}
@media(max-width:1100px){
    .ai-pipeline{
        grid-template-columns:1fr 1fr
    }
    .ai-pipeline>i{
        display:none
    }
    .ai-pipe-item.featured{
        grid-column:1/-1
    }
}
@media(max-width:720px){
    .ai-pipeline,.ai-principles{
        grid-template-columns:1fr
    }
    .ai-pipe-item.featured{
        grid-column:auto
    }
    .workspace-account-tools{
        flex-direction:column;
        align-items:flex-end
    }
    .usage-meter-card{
        width:160px
    }
}
.memory-stat-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin:24px 0
}
.memory-stat-grid article,.memory-source-card,.concept-memory-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:12px;
    padding:14px
}
.memory-stat-grid span{
    display:block;
    font-size:26px;
    font-weight:900
}
.memory-stat-grid small,.memory-section-head small,.memory-source-card small{
    font-size:8px;
    color:var(--muted)
}
.memory-two-col{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px
}
.memory-section-head{
    display:flex;
    justify-content:space-between;
    gap:10px;
    margin-bottom:10px
}
.memory-source-list,.concept-cloud{
    display:grid;
    gap:9px
}
.memory-source-card{
    display:flex;
    align-items:center;
    gap:10px
}
.memory-source-card>div{
    min-width:0;
    display:flex;
    flex-direction:column
}
.memory-source-card strong{
    font-size:10px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis
}
.concept-memory-card>div{
    display:flex;
    justify-content:space-between
}
.concept-memory-card strong{
    font-size:10px
}
.concept-memory-card span{
    font-size:8px;
    font-weight:900;
    color:#556cad
}
.concept-memory-card p{
    font-size:9px;
    line-height:1.5;
    color:var(--muted)
}
.memory-privacy-note{
    margin-top:18px;
    display:flex;
    gap:12px;
    background:#f7f9ff;
    border:1px solid #d5def5;
    border-radius:12px;
    padding:15px
}
.memory-privacy-note svg{
    width:34px;
    height:34px
}
.memory-privacy-note strong{
    font-size:10px
}
.memory-privacy-note p{
    font-size:9px;
    color:var(--muted);
    margin:4px 0 0
}
@media(max-width:800px){
    .memory-two-col{
        grid-template-columns:1fr
    }
}
@media(max-width:520px){
    .memory-stat-grid{
        grid-template-columns:1fr
    }
}
/* ===== SELECTION BUTTON FIX ===== */
.selection-knovali{
    position:fixed!important;
    z-index:9999!important;
    margin:0!important;
    transform:none!important;
    pointer-events:auto;
}
/* ===== RECALL + MASTERY ===== */
.recall-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin:24px 0
}
.recall-stats article{
    background:#fff;
    border:1px solid var(--line);
    border-radius:13px;
    padding:18px
}
.recall-stats span{
    display:block;
    font-size:25px;
    font-weight:900;
    color:var(--ink)
}
.recall-stats small{
    display:block;
    margin-top:5px;
    font-size:7px;
    letter-spacing:.14em;
    color:var(--muted);
    font-weight:900
}
.recall-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:15px;
    padding:28px;
    min-height:330px
}
.recall-empty{
    min-height:270px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:var(--muted)
}
.recall-empty strong{
    color:var(--ink);
    font-size:14px
}
.recall-empty p{
    font-size:11px;
    line-height:1.6;
    max-width:380px
}
.recall-orb{
    width:70px;
    height:70px;
    margin-bottom:15px
}
.recall-kicker{
    font-size:8px;
    letter-spacing:.16em;
    color:#5267ae;
    font-weight:900
}
.recall-active h2{
    font-size:28px;
    margin:10px 0
}
.recall-active>p{
    font-size:13px;
    color:var(--muted)
}
.recall-active textarea{
    margin-top:12px
}
.recall-reveal{
    margin-top:14px;
    padding:12px;
    border-radius:9px;
    background:#f5f8ff;
    border:1px solid #d6def5;
    font-size:10px;
    line-height:1.5;
    color:#53647c
}
.recall-actions{
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:15px;
    flex-wrap:wrap
}
.recall-ratings{
    display:flex;
    gap:7px;
    flex-wrap:wrap
}
.recall-ratings button{
    border:1px solid var(--line);
    background:#fff;
    border-radius:999px;
    padding:8px 11px;
    font-size:9px;
    font-weight:850;
    cursor:pointer
}
.recall-ratings button:hover{
    border-color:#8fa2df;
    background:#f8f9ff
}
@media(max-width:600px){
    .recall-stats{
        grid-template-columns:1fr
    }
    .recall-card{
        padding:20px
    }
}
/* ===== CONNECTION ENGINE ===== */
.connection-wrap{
    padding:15px 19px;
    border-top:1px solid var(--line);
    background:#fff
}
.connection-wrap-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-bottom:9px
}
.connection-wrap-head label{
    font-size:7px;
    letter-spacing:.14em;
    color:#4f65aa;
    font-weight:900;
    margin:0
}
.connection-wrap-head a{
    font-size:8px;
    color:#4f65aa;
    font-weight:850
}
.connection-cards{
    display:grid;
    gap:8px
}
.connection-card{
    border:1px solid #dbe3f2;
    border-radius:10px;
    background:#f9fbff;
    padding:11px
}
.connection-card-top{
    display:flex;
    justify-content:space-between;
    gap:10px;
    margin-bottom:5px
}
.connection-card-top span,.connection-card-top b{
    font-size:7px;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:#78879a
}
.connection-card>strong{
    font-size:10px
}
.connection-card>p{
    font-size:9px;
    line-height:1.45;
    color:var(--muted);
    margin:5px 0
}
.connection-card blockquote{
    margin:7px 0;
    padding-left:10px;
    border-left:2px solid #8aa0dd;
    font:italic 9px/1.5 Georgia,serif;
    color:#58687b
}
.connection-card button,.connection-history-card button{
    border:1px solid var(--line);
    background:#fff;
    border-radius:999px;
    padding:7px 9px;
    font-size:8px;
    font-weight:850;
    cursor:pointer
}
.connections-page{
    display:grid;
    gap:12px;
    margin-top:24px
}
.connection-history-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:13px;
    padding:16px
}
.connection-history-top{
    display:flex;
    justify-content:space-between;
    gap:12px
}
.connection-history-top span{
    font-size:7px;
    font-weight:900;
    letter-spacing:.13em;
    color:#4f65aa
}
.connection-history-top small{
    font-size:8px;
    color:var(--muted)
}
.connection-history-card h3{
    margin:8px 0 5px;
    font-size:14px
}
.connection-history-card .connection-why{
    font-size:10px;
    color:var(--muted);
    line-height:1.5
}
.connection-history-card blockquote{
    margin:10px 0;
    border-left:2px solid #8399db;
    padding-left:12px;
    font:italic 11px/1.6 Georgia,serif;
    color:#4b5b70
}
.connection-modal{
    position:fixed;
    inset:0;
    z-index:10000;
    background:rgba(4,12,26,.72);
    display:grid;
    place-items:center;
    padding:24px
}
.connection-modal-card{
    position:relative;
    width:min(760px,100%);
    max-height:82vh;
    overflow:auto;
    background:#fff;
    border-radius:16px;
    padding:28px;
    box-shadow:0 32px 90px rgba(0,0,0,.3)
}
.connection-modal-card h2{
    font-size:25px;
    margin:0 0 10px
}
.connection-modal-card>p{
    font-size:11px;
    color:var(--muted);
    line-height:1.55
}
.connection-modal-card blockquote{
    white-space:pre-wrap;
    margin:18px 0 0;
    padding:18px;
    border-radius:10px;
    background:#f6f8fc;
    font:14px/1.7 Georgia,serif;
    color:#425268
}
.connection-modal-close{
    position:absolute;
    right:13px;
    top:10px;
    border:0;
    background:transparent;
    font-size:24px;
    color:#748297;
    cursor:pointer
}
/* ===== SOURCE MEMORY CONTROLS ===== */
.memory-settings-grid{
    display:grid;
    grid-template-columns:1.4fr .8fr;
    gap:14px;
    margin-top:24px
}
.memory-settings-card,.memory-danger-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:18px
}
.memory-settings-card h2,.memory-danger-card h2{
    font-size:14px;
    margin-top:0
}
.setting-toggle{
    display:flex;
    align-items:center;
    gap:9px;
    padding:9px 0;
    font-size:10px
}
.setting-toggle input{
    width:16px;
    height:16px
}
.setting-field{
    display:grid;
    gap:6px;
    margin:13px 0
}
.setting-field span{
    font-size:8px;
    font-weight:900;
    letter-spacing:.1em;
    color:#67778d
}
.setting-field select,.managed-source-actions select{
    border:1px solid var(--line);
    border-radius:8px;
    background:#fff;
    padding:8px;
    font-size:9px
}
.memory-danger-card{
    background:#fff8f8;
    border-color:#efdada
}
.memory-danger-card p{
    font-size:10px;
    line-height:1.55;
    color:var(--muted)
}
.memory-source-manager{
    margin-top:18px
}
.managed-source{
    display:flex;
    justify-content:space-between;
    gap:14px;
    align-items:center;
    background:#fff;
    border:1px solid var(--line);
    border-radius:11px;
    padding:12px
}
.managed-source-main{
    display:flex;
    gap:10px;
    align-items:center;
    min-width:0
}
.managed-source-main>div{
    min-width:0;
    display:flex;
    flex-direction:column
}
.managed-source-main strong{
    font-size:10px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis
}
.managed-source-main small{
    font-size:8px;
    color:var(--muted);
    margin-top:3px
}
.managed-source-actions{
    display:flex;
    gap:6px;
    align-items:center;
    flex-wrap:wrap
}
.managed-source-actions button{
    border:1px solid var(--line);
    background:#fff;
    border-radius:999px;
    padding:7px 9px;
    font-size:8px;
    font-weight:850;
    cursor:pointer
}
.managed-source-actions button.danger{
    color:#a13f4c;
    border-color:#e3c0c5
}
@media(max-width:800px){
    .memory-settings-grid{
        grid-template-columns:1fr
    }
    .managed-source{
        align-items:flex-start;
        flex-direction:column
    }
    .managed-source-actions{
        width:100%
    }
}
/* ===== ENTERPRISE KNOWLEDGE SPACES ===== */
.spaces-toolbar{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin:22px 0
}
.spaces-layout{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:16px
}
.spaces-list-panel,.space-detail-panel{
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:14px;
    min-width:0
}
.space-list{
    display:grid;
    gap:7px
}
.space-list-item{
    width:100%;
    text-align:left;
    border:1px solid var(--line);
    background:#fff;
    border-radius:10px;
    padding:11px;
    cursor:pointer
}
.space-list-item.active{
    border-color:#879bd6;
    background:#f5f8ff
}
.space-list-item strong{
    display:block;
    font-size:10px
}
.space-list-item small{
    display:block;
    font-size:8px;
    color:var(--muted);
    margin-top:3px
}
.space-detail-head{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:flex-start
}
.space-detail-head h2{
    font-size:24px;
    margin:4px 0 0
}
.space-search{
    display:flex;
    gap:8px;
    margin:16px 0
}
.space-search input{
    flex:1
}
.space-search-results{
    display:grid;
    gap:8px
}
.space-result{
    border:1px solid #dbe3f2;
    background:#f9fbff;
    border-radius:10px;
    padding:11px
}
.space-result>div{
    display:flex;
    justify-content:space-between;
    gap:10px
}
.space-result strong{
    font-size:10px
}
.space-result span{
    font-size:8px;
    color:#5267ae;
    font-weight:900
}
.space-result p{
    font-size:9px;
    line-height:1.5;
    color:var(--muted)
}
.space-add-source{
    margin:18px 0;
    padding:15px;
    background:#f8f9fc;
    border:1px solid var(--line);
    border-radius:11px
}
.space-add-source h3{
    font-size:12px;
    margin-top:0
}
.space-add-source input,.space-add-source textarea{
    width:100%;
    margin-bottom:8px
}
@media(max-width:900px){
    .spaces-layout{
        grid-template-columns:1fr
    }
    .spaces-list-panel{
        order:1
    }
    .space-detail-panel{
        order:2
    }
}
/* ===== ENTERPRISE ADMIN ===== */
.admin-org-picker{
    display:grid;
    gap:6px;
    max-width:360px;
    margin:22px 0
}
.admin-org-picker label{
    font-size:8px;
    font-weight:900;
    letter-spacing:.12em;
    color:#63748b
}
.admin-org-picker select{
    border:1px solid var(--line);
    border-radius:9px;
    padding:10px;
    background:#fff
}
.enterprise-admin-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px
}
.enterprise-admin-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:16px
}
.enterprise-admin-card h2{
    font-size:14px;
    margin-top:0
}
.invite-row{
    display:grid;
    grid-template-columns:1fr 120px auto;
    gap:7px;
    margin-bottom:12px
}
.admin-list,.audit-list{
    display:grid;
    gap:8px
}
.admin-member{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:center;
    border:1px solid var(--line);
    border-radius:10px;
    padding:10px
}
.admin-member>div:first-child{
    display:flex;
    flex-direction:column;
    min-width:0
}
.admin-member strong{
    font-size:10px
}
.admin-member small{
    font-size:8px;
    color:var(--muted);
    margin-top:2px
}
.admin-member-actions{
    display:flex;
    gap:6px;
    align-items:center
}
.admin-member-actions select,.admin-member-actions button{
    font-size:8px;
    border:1px solid var(--line);
    background:#fff;
    border-radius:8px;
    padding:7px
}
.audit-list article{
    display:flex;
    flex-direction:column;
    border-bottom:1px solid var(--line);
    padding:8px 0
}
.audit-list strong{
    font-size:9px
}
.audit-list span{
    font-size:8px;
    color:var(--muted);
    margin-top:2px
}
@media(max-width:850px){
    .enterprise-admin-grid{
        grid-template-columns:1fr
    }
    .invite-row{
        grid-template-columns:1fr
    }
    .admin-member{
        align-items:flex-start;
        flex-direction:column
    }
}
/* ===== ENTERPRISE IDENTITY ===== */
.identity-add-row{
    display:grid;
    grid-template-columns:1fr 180px auto;
    gap:7px;
    margin-bottom:12px
}
.identity-provider-form{
    display:grid;
    grid-template-columns:1fr 120px;
    gap:7px;
    margin-bottom:12px
}
.identity-provider-form input:nth-of-type(2),.identity-provider-form input:nth-of-type(3),.identity-provider-form button{
    grid-column:1/-1
}
.identity-row{
    border:1px solid var(--line);
    border-radius:10px;
    padding:10px;
    background:#fff
}
.identity-row div{
    display:flex;
    flex-direction:column
}
.identity-row strong{
    font-size:10px
}
.identity-row small,.small-note{
    font-size:8px;
    color:var(--muted);
    line-height:1.5
}
.auth-card .muted{
    color:var(--muted);
    font-size:10px
}
@media(max-width:760px){
    .identity-add-row,.identity-provider-form{
        grid-template-columns:1fr
    }
}
.identity-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px
}
.identity-row button{
    border:1px solid var(--line);
    background:#fff;
    border-radius:999px;
    padding:7px 9px;
    font-size:8px;
    font-weight:850
}
.identity-verify-panel,.scim-block{
    margin-top:12px;
    border:1px solid #d8e1f5;
    background:#f7f9ff;
    border-radius:10px;
    padding:12px
}
.identity-verify-panel code,.scim-block code{
    display:block;
    word-break:break-all;
    background:#0d1829;
    color:#dce8ff;
    border-radius:7px;
    padding:10px;
    font-size:8px;
    margin:8px 0
}
.scim-block input{
    width:100%;
    margin:7px 0
}
/* ===== PROVISIONING + SECURITY ENFORCEMENT ===== */
.identity-row>span{
    display:flex;
    gap:6px;
    flex-wrap:wrap
}
.identity-row>span button{
    border:1px solid var(--line);
    background:#fff;
    border-radius:999px;
    padding:7px 9px;
    font-size:8px;
    font-weight:850;
    cursor:pointer
}
/* ===== FOOTER BRAND CONTRAST =====
Keeps the standard KNOVALI mark unchanged everywhere else.
The footer receives a warm bone treatment for stronger contrast
against the deep navy footer background.
*/
.footer .footer-brand,
.footer-brand {
    color: #F2EFE7;
}
.footer .footer-brand .brand-word,
.footer-brand .brand-word {
    color: #F2EFE7;
}
/* Support inline SVG marks generated by knovali_mark(). */
.footer .footer-brand .brand-mark,
.footer-brand .brand-mark {
    color: #F2EFE7;
}
.footer .footer-brand .brand-mark svg,
.footer-brand .brand-mark svg {
    color: #F2EFE7;
}
.footer .footer-brand .brand-mark svg path,
.footer .footer-brand .brand-mark svg circle,
.footer .footer-brand .brand-mark svg polygon,
.footer .footer-brand .brand-mark svg rect,
.footer .footer-brand .brand-mark svg line,
.footer .footer-brand .brand-mark svg polyline,
.footer-brand .brand-mark svg path,
.footer-brand .brand-mark svg circle,
.footer-brand .brand-mark svg polygon,
.footer-brand .brand-mark svg rect,
.footer-brand .brand-mark svg line,
.footer-brand .brand-mark svg polyline {
    fill: #F2EFE7 !important;
    stroke: #F2EFE7 !important;
}