/* WEBOMONKS cinematic dashboard theme inspired by provided Wafer reference; agency copy and functionality */

    :root{--sans:"Inter Tight","Helvetica Neue",Helvetica,Arial,sans-serif;--mono:"Geist Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;--ease:cubic-bezier(.22,1,.36,1);--rail:200px;--rainbow:conic-gradient(from 210deg,#ff2d9a,#8a3cff 18%,#2b6bff 38%,#19c2ff 50%,#c9d24a 62%,#f2c230 72%,#2b6bff 86%,#ff2d9a)}
    *{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;background:#000;color:#fff;overflow:hidden}body{font-family:var(--sans);-webkit-font-smoothing:antialiased}button,input{font:inherit;color:inherit;border:0;outline:0;background:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}svg{display:block}button:focus-visible,a:focus-visible{outline:2px solid #fff;outline-offset:4px} .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
    /* SCENE 1 */
    .auth{position:fixed;inset:0;z-index:2;background:#000;display:flex;flex-direction:column;opacity:1;visibility:visible;transition:opacity .55s ease,visibility 0s .55s}.auth.leaving{opacity:0;visibility:hidden}.stage{position:relative;flex:1;min-height:0;overflow:hidden;border-radius:0 0 14px 14px;background:#7f9aa3;display:grid;place-items:center;padding:16px;isolation:isolate}.stage>video,.panel>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.stage>video{filter:saturate(.78) contrast(.94) brightness(1.02)}.ascii{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
    .card{position:relative;z-index:2;width:min(384px,calc(100vw - 28px));max-height:100%;overflow:auto;scrollbar-width:none;padding:29px 68px 0;border-radius:20px;text-align:center;background:linear-gradient(180deg,rgba(30,27,24,.9) 0%,rgba(21,19,17,.92) 62%,rgba(12,11,10,.95) 100%);-webkit-backdrop-filter:blur(22px) saturate(1.2);backdrop-filter:blur(22px) saturate(1.2);box-shadow:0 0 0 1px rgba(255,255,255,.06) inset,0 30px 80px -10px rgba(0,0,0,.55),0 8px 24px rgba(0,0,0,.3);opacity:0;transform:scale(.94) translateY(10px);filter:blur(10px);transition:opacity .7s var(--ease),transform .9s var(--ease),filter .7s var(--ease)}.card::-webkit-scrollbar{display:none}.auth.ready .card{opacity:1;transform:none;filter:none}.logo-tile{display:grid;place-items:center;width:45px;height:45px;border-radius:11px;background:#000;margin:0 auto}.logo-tile svg{width:24px;height:24px}.card h2{font-size:20px;line-height:24px;font-weight:500;letter-spacing:-.015em;margin-top:27px}.card-sub{font-size:13px;line-height:16px;color:rgba(255,255,255,.55);margin-top:10px;white-space:nowrap}.oauth{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:17px}.oauth button{height:32px;position:relative;border-radius:10px;background:rgba(255,255,255,.055);font-size:13px;font-weight:600;padding-left:14px;transition:background .2s,transform .15s}.oauth button:hover{background:rgba(255,255,255,.1)}.oauth button:active{transform:scale(.97)}.oauth svg{width:17px;height:17px;position:absolute;top:7.5px;left:9px;opacity:.32;transition:opacity .2s}.oauth button:hover svg{opacity:.8}.or{margin-top:13px;font-size:12px;line-height:16px;color:rgba(255,255,255,.3)}.signup{margin-top:4px}.field{display:block;position:relative;padding:1px;border-radius:10px;margin-bottom:7px;isolation:isolate;background:rgba(255,255,255,.045)}.field::before,.field::after{content:"";position:absolute;pointer-events:none;transition:opacity .3s}.field::before{inset:0;border-radius:10px;background:var(--rainbow);z-index:-1;opacity:0}.field::after{inset:-3px;border-radius:13px;background:var(--rainbow);filter:blur(9px);z-index:-2;opacity:0}.field:focus-within::before{opacity:1}.field:focus-within::after{opacity:.28}.field input{display:block;position:relative;width:100%;height:34px;border-radius:9px;padding:0 34px 0 10px;background:#211f1d;font-size:12.5px;transition:background .2s}.field input::placeholder{color:rgba(255,255,255,.42)}.field:focus-within input{background:#050505}.field input[type=password]:not(:placeholder-shown){font-size:17px;letter-spacing:.12em}.eye{position:absolute;right:5px;top:5px;width:26px;height:26px;display:grid;place-items:center;color:rgba(255,255,255,.28);z-index:2}.eye:hover,.eye:active{color:rgba(255,255,255,.8)}.eye svg{width:15px;height:15px}.create-account{margin-top:13px;height:36px;padding:0 20px;border-radius:999px;background:#fff;color:#0b0b0b;font-size:13px;font-weight:600;transition:transform .2s,box-shadow .2s}.create-account:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(255,255,255,.18)}.create-account:active{transform:scale(.97)}.login{margin-top:46px;padding-bottom:14px;font-size:12px;line-height:16px;color:rgba(255,255,255,.4)}.login button{font-weight:600;color:#fff;font-size:12px}.legal{height:39px;min-height:39px;padding-bottom:env(safe-area-inset-bottom);display:flex;align-items:center;justify-content:center;font-size:11px;color:rgba(255,255,255,.5);opacity:0;transition:opacity .7s ease .15s}.auth.ready .legal{opacity:1}.legal a{font-weight:600;color:#fff;margin-left:3px}
    /* SCENE 2 */
    .app{position:fixed;inset:0;display:flex;background:#000;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility 0s .6s}.app.on{opacity:1;visibility:visible;transition:opacity .6s ease,visibility 0s}.side{position:relative;z-index:3;width:var(--rail);min-width:var(--rail);height:100%;display:flex;flex-direction:column;padding:14px 0 10px;background:#000;overflow:hidden;opacity:0;transition:width .5s var(--ease),min-width .5s var(--ease),opacity .6s ease .35s}.app.on .side{opacity:1}.side-top{position:relative;height:28px;min-height:28px;margin-bottom:20px}.wordmark{position:absolute;left:13px;top:-5px;font-family:"Outfit",sans-serif;font-weight:300;font-size:27px;line-height:34px;letter-spacing:-.05em}.collapse{position:absolute;right:12px;top:1px;width:22px;height:24px;display:grid;place-items:center;color:rgba(255,255,255,.32)}.collapse:hover{color:#fff}.collapse svg{width:15px;height:15px}.mini-open{position:absolute;left:10px;top:3px;width:22px;height:22px;display:grid;place-items:center;opacity:0;pointer-events:none}.mini-open svg{width:17px;height:17px}.side-label,.side-meta,.wordmark,.collapse{transition:opacity .3s}.nav-link{position:relative;display:flex;align-items:center;width:200px;height:43px;min-height:43px;padding-left:44px;padding-right:14px;font-size:13px;font-weight:500;white-space:nowrap;color:#fff;text-align:left}.nav-link .side-icon{width:18px;height:18px;position:absolute;left:12px;top:12px;transition:transform .25s var(--ease)}.nav-link:hover .side-icon{transform:scale(1.12)}.nav-link:hover,.nav-link.active{background:rgba(255,255,255,.055)}.side-footer{margin-top:auto}.side-meta{margin-left:auto;margin-right:14px;font-size:11.5px;color:rgba(255,255,255,.44);font-variant-numeric:tabular-nums}.avatar{position:absolute;left:12px;top:12px;width:18px;height:18px;border-radius:50%;background:conic-gradient(from 200deg,#ff3d6e,#ff9a3c,#ffd84a,#5ad1ff,#7a5cff,#ff3dc0,#ff3d6e)}.mini .side{width:42px;min-width:42px}.mini .wordmark,.mini .collapse,.mini .side-label,.mini .side-meta{opacity:0;pointer-events:none}.mini .mini-open{opacity:1;pointer-events:auto}.mini .nav-link{padding:0;width:42px}.mini .nav-link .side-icon,.mini .nav-link .avatar{left:12px}
    .panel{position:relative;flex:1;min-width:0;margin:2px 4px 4px 0;border-radius:18px;overflow:hidden;background:#93aaa6;isolation:isolate}.panel>video{filter:saturate(.92)}.panel::after{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;background:#000;opacity:1;transition:opacity 1.1s ease .25s}.app.on .panel::after{opacity:0}.search-pill{position:absolute;top:9px;right:12px;z-index:4;height:28px;display:flex;align-items:center;gap:14px;padding:0 6px 0 10px;border-radius:100px;background:rgba(40,58,60,.3);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .2s}.search-pill:hover{background:rgba(40,58,60,.5)}.search-pill svg{width:13px;height:13px}.search-pill kbd{display:grid;place-items:center;width:17px;height:17px;border-radius:5px;background:rgba(20,30,32,.35);font:500 10px var(--mono);color:rgba(255,255,255,.6)}.scroller{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth;scrollbar-width:none;z-index:2}.scroller::-webkit-scrollbar,.code-lines::-webkit-scrollbar{display:none}.column{width:min(100%,808px);max-width:776px;margin:0 auto;padding:97px 16px 120px}.rise{opacity:0;transform:translateY(12px);filter:blur(6px);transition:opacity .9s var(--ease),transform 1s var(--ease),filter .9s var(--ease);transition-delay:calc(var(--i) * 110ms + 250ms)}.app.on .rise{opacity:1;transform:none;filter:none}.hero{text-align:center}.hero h1{font-size:36px;line-height:40px;letter-spacing:-.035em;font-weight:500}.hero p{margin-top:22px;font-size:13px;line-height:16px;color:rgba(255,255,255,.5)}
    .get-wrap{position:relative;margin-top:41px;height:158px;padding:1.5px;border-radius:18px;background:var(--rainbow);isolation:isolate}.get-wrap::before{content:"";position:absolute;inset:-2px;z-index:-1;border-radius:20px;background:var(--rainbow);filter:blur(10px);opacity:.42;animation:border-pulse 6s ease-in-out infinite}.get-inner{position:relative;height:100%;padding:17px 18px;border-radius:16.5px;background:#000;overflow:hidden}.get-header{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;font-size:11.5px;color:rgba(255,255,255,.42)}.get-status{display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.92);font-weight:500}.spinner{width:12px;height:12px;border:1.5px solid rgba(255,255,255,.25);border-top-color:#fff;border-right-color:#fff;border-radius:50%;animation:spin 2.4s linear infinite}.get-list{position:relative;z-index:2;display:grid;gap:0;margin-top:12px;list-style:none}.get-list li{display:flex;align-items:center;height:36px;gap:11px;font-size:13px;color:rgba(255,255,255,.62)}.check-circle{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.1)}.check-circle svg{width:11px;height:11px}.get-list li:last-child{color:#fff}.get-list li:last-child .check-circle{background:#fff;color:#000}.get-list button{display:flex;align-items:center;gap:11px;font-size:13px;text-align:left;color:#fff;max-width:100%;width:100%}.get-list button .chev{height:12px;width:12px;margin-left:0;opacity:.45;transition:transform .2s,opacity .2s}.get-list button:hover .chev{transform:translateX(3px);opacity:1}.burst{position:absolute;left:76%;top:69%;width:400px;height:300px;transform:translate(-50%,-50%);pointer-events:none;z-index:1}.burst-dots{position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.28) .7px,transparent .9px);background-size:6px 6px;mask-image:radial-gradient(ellipse,black 4%,transparent 66%);-webkit-mask-image:radial-gradient(ellipse,black 4%,transparent 66%)}.burst-rays{position:absolute;inset:0;width:100%;height:100%}.burst-tile{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:44px;height:44px;background:#fff;color:#000;box-shadow:0 0 40px rgba(255,255,255,.35)}.burst-tile svg{width:24px;height:24px}@keyframes border-pulse{50%{opacity:.24}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes ray-pulse{50%{opacity:.45}}
    .model-block{margin-top:31px}.model-block.first{margin-top:42px}.model-name{height:26px;display:flex;align-items:center;gap:11px;font-size:14px;color:rgba(255,255,255,.82)}.badge{position:relative;width:25px;height:25px;display:grid;place-items:center;flex:none;border-radius:7px;background:#000;color:#fff;font-size:15px;font-weight:600}.badge.k::after{content:"";position:absolute;top:4px;right:3px;width:3px;height:3px;border-radius:50%;background:#4aa8ff}.badge.deep{background:#fff}.badge.deep svg{width:18px;height:18px;color:#4d6bfe}.model-card{position:relative;margin-top:14px;border-radius:18px;background:rgba(86,104,104,.56);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);transition:background .3s}.model-card:hover{background:rgba(80,98,98,.64)}.model-summary{display:block;position:relative;width:100%;padding:17px 18px 16px;text-align:left;border-radius:18px;cursor:pointer}.model-desc{padding-right:44px;font-size:14px;line-height:18px;font-weight:400;letter-spacing:-.01em}.tags{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:9px;font:400 12px/18px var(--mono);color:rgba(255,255,255,.78)}.tag{display:inline-flex;align-items:center;gap:7px}.tag svg{width:12px;height:12px;opacity:.45}.stats{display:grid;grid-template-columns:142px 152px 1fr auto;margin-top:16px}.stat-label{font-size:11.5px;color:rgba(255,255,255,.36)}.stat-value{font-size:20px;line-height:24px;letter-spacing:-.02em;margin-top:9px;font-variant-numeric:tabular-nums}.stat:last-child{text-align:right}.toggle-pill{position:absolute;top:12px;right:12px;width:36px;height:30px;border-radius:999px;background:rgba(255,255,255,.035);display:grid;place-items:center}.toggle-pill svg{width:12px;height:12px;transition:transform .5s var(--ease)}.model-card.open .toggle-pill svg{transform:rotate(180deg)}.expanded{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease)}.model-card.open .expanded{grid-template-rows:1fr}.expanded-clip{min-height:0;overflow:hidden}.code-box{position:relative;margin:0 4px 4px;border-radius:15px;padding:12px 14px 14px;background:rgba(62,74,75,.94);opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s}.model-card.open .code-box{opacity:1;transform:none;transition-delay:.22s}.code-toolbar{display:flex;align-items:center;gap:8px;min-height:28px;font-size:12px;flex-wrap:wrap}.code-toolbar>span:first-child{font-weight:500}.code-dropdown,.reasoning{display:flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:100px;background:rgba(255,255,255,.06);font-size:11px}.code-dropdown svg,.reasoning svg{width:10px;height:10px}.toolbar-space{flex:1}.zdr-label{display:flex;align-items:center;gap:7px;white-space:nowrap}.switch{position:relative;width:30px;height:18px;border-radius:30px;background:#2fc48d;transition:background .2s}.switch::before{content:"✓";position:absolute;display:grid;place-items:center;top:2px;left:14px;height:14px;width:14px;border-radius:50%;background:#fff;color:#2fc48d;font-size:9px;transition:left .2s}.switch.off{background:rgba(255,255,255,.2)}.switch.off::before{left:2px;color:transparent}.reason-label{margin-left:6px}.code-lines{margin-top:12px;overflow-x:auto;scrollbar-width:none;font:400 12.5px/23px var(--mono);white-space:pre}.code-lines .line{counter-increment:line;display:block;white-space:pre}.code-lines{counter-reset:line}.code-lines .line::before{content:counter(line);display:inline-block;width:18px;margin-right:22px;text-align:right;color:rgba(255,255,255,.28)}.c-purple{color:#8f8ff0}.c-green{color:#6fdcb4}.c-string{color:#ecd9a0}.c-blue{color:#7db7ff}.copy-row{display:flex;justify-content:flex-end;align-items:center;gap:8px;min-height:24px}.copied{font-size:11px;opacity:0;transition:opacity .2s}.copied.show{opacity:1}.copy{width:24px;height:24px;display:grid;place-items:center;color:rgba(255,255,255,.4)}.copy:hover{color:#fff}.copy svg{width:15px;height:15px}
    @media(max-width:1100px){.column{max-width:712px}}
    @media(max-width:760px){.app .side{position:absolute;left:0;top:0;bottom:0;width:42px;min-width:42px;box-shadow:none}.app:not(.mini) .side{width:200px;min-width:200px;box-shadow:30px 0 60px rgba(0,0,0,.5)}.app.mini .side{width:42px;min-width:42px}.app .panel{margin:2px 4px 4px 42px;border-radius:16px}.column{padding:72px 12px 96px}.hero h1{font-size:28px;line-height:32px}.hero h1 br{display:none}.hero p{margin-top:16px;line-height:18px}.get-wrap{margin-top:30px;height:auto}.get-inner{padding:15px 14px 12px}.get-list li{height:auto;min-height:36px;padding:5px 0;line-height:17px;text-shadow:0 1px 5px rgba(0,0,0,.65)}.get-list button{line-height:17px;text-shadow:0 1px 5px rgba(0,0,0,.65)}.burst{left:86%;top:60%;opacity:.5}.burst-tile{display:none}.stats{grid-template-columns:1fr 1fr 1fr auto;column-gap:10px}.stat-value{font-size:17px}.model-summary{padding:15px 14px 14px}.code-toolbar{row-gap:8px}.code-lines{font-size:11.5px;line-height:21px}.code-lines .line::before{margin-right:14px}.model-card.first{margin-top:30px}}
    @media(max-width:440px){.card{padding:26px 26px 0;border-radius:18px}.card-sub{white-space:normal}.login{margin-top:34px}.stage{padding:12px;border-radius:0 0 12px 12px}.hero h1{font-size:25px;line-height:29px}.stat-value{font-size:15px}.tags{gap:2px 12px;font-size:11.5px}.get-list li,.get-list button{font-size:12px}.burst{opacity:.35}.model-desc{font-size:13px}}
    @media(max-height:560px){.card{padding-top:18px}.card h2{margin-top:14px}.login{margin-top:18px}}
    @media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition-duration:0s!important;scroll-behavior:auto!important}.rise{filter:none!important}}
  

/* WEBOMONKS adaptations to the cinematic WAFER-style reference */
:root{--sans:"Inter Tight","Helvetica Neue",Helvetica,Arial,sans-serif;--rail:200px}
html,body{background:#000}
.auth{z-index:30}
.stage{background:#0c111d url('../assets/webomonks-orb.webp') center / cover no-repeat}
.stage::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#04070c7d,#03071117),linear-gradient(0deg,#0007,transparent 45%);z-index:1}
.stage .ascii{z-index:1}
.stage .card{z-index:3}
.stage video{background:transparent}
.auth .card{padding:28px 34px 0;width:min(384px,calc(100vw - 28px))}
.auth .card-sub{white-space:normal;line-height:1.6}
.auth .card h2{font-size:21px;white-space:normal}
.auth .logo-tile{background:#080711;border:1px solid #ffffff19;box-shadow:0 0 28px #ab7bf544}
.auth .logo-tile svg{width:28px;height:28px;color:#d1aeff}
.auth .oauth{margin-top:23px}
.auth .oauth a{height:36px;border-radius:10px;background:#ffffff10;font-size:12px;font-weight:600;display:flex;justify-content:center;align-items:center;gap:9px;transition:background .25s,transform .2s}
.auth .oauth a:hover{background:#ffffff23;transform:translateY(-2px)}
.auth .oauth a svg{position:static;opacity:1;width:18px;height:18px}
.auth .or{margin:17px 0 11px}
.auth .create-account{height:39px;min-width:180px;margin-top:0}
.auth .login{margin-top:26px;padding-bottom:21px}
.auth .login a{font-weight:600;color:#fff}
.brand-glyph{display:block}
.side-top .wordmark{font-family:"Outfit",sans-serif;font-weight:300;font-size:25px;letter-spacing:-.09em}
.side{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#ffffff1c transparent}
.side .side-top{position:sticky;top:0;z-index:5;background:#000}
.side .side-footer{padding-top:9px;border-top:1px solid #ffffff1a;margin-top:auto}
.side .nav-link{font-size:12.5px;text-decoration:none}
.side .nav-link.active{background:#ffffff13;box-shadow:inset 2px 0 #ad89ff}
.side .nav-link .side-icon svg{width:19px;height:19px}
.side .nav-link .side-label{opacity:1}
.side .side-meta{font-size:10px}
.side .mini-open{color:#fff}
.side:has(.side-footer){scrollbar-color:#ffffff23 transparent}
.panel{background:#141b26 url('../assets/webomonks-orb.webp') center / cover no-repeat}
.panel:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#0c17226e,#080e19a4 50%,#04040acc),linear-gradient(90deg,#02090d51,#1b143339)}
.panel>video{opacity:.84;filter:saturate(.83) contrast(1.1) brightness(.7)}
.panel>.ascii{z-index:1;opacity:.58}
.panel .search-pill{border:1px solid #ffffff30;background:#13242a79;color:#fff;backdrop-filter:blur(12px)}
.scroller{z-index:2}
.column{max-width:776px;padding-top:92px;isolation:isolate}
.hero{max-width:790px;margin:0 auto;text-align:center;position:relative}
.hero h1{font-size:clamp(30px,4.3vw,43px);line-height:1.12;text-shadow:0 2px 23px #070a1399}
.hero p{font-size:13px;line-height:1.7;color:#f0eaf0c2;max-width:550px;margin:20px auto 0;text-shadow:0 1px 14px #0007}
.hero-badge{display:inline-flex;align-items:center;gap:8px;margin-bottom:17px;border:1px solid #ffffff3b;background:#08152281;border-radius:999px;padding:6px 12px;font:500 10px var(--mono);letter-spacing:.06em;color:#e8d9ff}
.hero-badge svg{width:17px;height:17px}
.hero-orbit{width:100px;height:90px;position:absolute;right:-10px;top:-36px;pointer-events:auto;opacity:.58;filter:drop-shadow(0 0 12px #9e73ea);animation:orbFloat 6s ease-in-out infinite alternate}
.hero-orbit canvas{width:100%;height:100%;display:block}
@keyframes orbFloat{to{transform:translateY(12px) rotate(5deg)}}
.get-wrap{margin-top:36px}
.get-inner{background:#05060b;min-height:155px}
.get-header{font-size:11.5px}
.get-list button{color:#fff}
.get-list li{color:#d8d0ebba}
.get-list a{display:inline-flex;align-items:center;gap:10px;min-height:35px;color:#fff}
.get-list a:hover{text-decoration:underline}
.get-wrap .burst{left:75%}
.get-wrap .burst-tile{border-radius:0}
.brand-mark{width:22px;height:22px;display:inline-grid;place-items:center;flex:none}
.brand-mark svg{width:100%;height:100%;display:block}
.brand-cluster{display:flex;align-items:center;gap:6px}
.brand-cluster .brand-mark:nth-child(2){margin-left:-3px}
.channel-strip{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin:20px auto 0}
.channel-pill{display:inline-flex;align-items:center;gap:7px;border:1px solid #ffffff3d;background:#14202885;border-radius:100px;padding:7px 11px;font-size:11px;color:#fff;backdrop-filter:blur(9px);transition:background .2s,transform .2s}
.channel-pill:hover{background:#ffffff22;transform:translateY(-3px)}
.channel-pill svg{width:15px;height:15px}
.model-block{margin-top:30px}
.model-block.first{margin-top:39px}
.model-name{font-size:14px;color:white;font-weight:500;text-shadow:0 1px 12px #0009}
.model-name .badge{overflow:hidden;border:1px solid #ffffff22}
.model-name .badge svg{height:19px;width:19px}
.model-card{background:rgba(45,62,73,.7);border:1px solid #ffffff24;box-shadow:0 10px 30px #03060a28}
.model-card:hover{background:rgba(50,64,76,.8);border-color:#ffffff3d}
.model-desc{font-size:14px;line-height:1.45;text-shadow:0 1px 7px #0207107d}
.model-summary{border:none;background:none;outline-offset:3px}
.model-summary:hover .toggle-pill{background:#ffffff23}
.tags{font-size:11px;color:#f0eaf0bf;gap:5px 15px}
.tag svg{width:14px;height:14px;opacity:.88}
.stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.stat:last-child{text-align:left}
.stat-value{font-size:15px;line-height:1.3;color:#fff;overflow-wrap:anywhere;margin-top:7px}
.stat-label{color:#ffffff80;font-size:11px}
.expanded .code-box{background:rgba(14,20,30,.9);border:1px solid #ffffff23;padding:19px}
.service-points{list-style:none;padding:0;display:grid;gap:10px}
.service-points li{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;line-height:1.65;color:#eeeaf4}
.service-points li:before{content:"✓";color:#91ffc9;font-weight:600}
.service-action{display:inline-flex;background:#fff;color:#13121b;padding:10px 17px;border-radius:999px;font-size:12px;font-weight:600;margin-top:18px;transition:transform .2s,box-shadow .2s}
.service-action:hover{transform:translateY(-2px);box-shadow:0 5px 24px #f8e5ff3d}
.subhead{font:500 12px var(--sans);letter-spacing:.06em;text-transform:uppercase;color:#fff;margin:29px 0 6px}
.detail-intro{font-size:12px;line-height:1.7;color:#dfd9e5b9;margin-bottom:8px}
.closing{margin-top:42px;padding:28px 22px;background:#060b119a;border:1px solid #ffffff29;border-radius:18px;text-align:center;backdrop-filter:blur(16px)}
.closing h3{font-size:23px;font-weight:500;letter-spacing:-.03em;margin-bottom:11px}
.closing p{font-size:13px;line-height:1.7;color:#cdd1d9;max-width:510px;margin:0 auto 18px}
.closing a{display:inline-flex;padding:12px 20px;background:#fff;color:#08060f;border-radius:999px;font-weight:600;font-size:12px}
.closing a:hover{box-shadow:0 6px 25px #b77aff57}
.wm-faq{margin-top:10px;display:grid;gap:9px}
.wm-faq details{border:1px solid #ffffff30;border-radius:13px;background:#162530a6;padding:13px 16px;backdrop-filter:blur(10px)}
.wm-faq summary{cursor:pointer;color:white;font-size:13px;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:12px}
.wm-faq summary::after{content:"+";font-size:19px;font-weight:400}
.wm-faq details[open] summary::after{content:"−"}
.wm-faq p{color:#ecedf0d4;font-size:12.5px;line-height:1.7;margin:12px 0 0}
.studio-search{position:absolute;right:12px;top:46px;z-index:10;width:min(360px,calc(100% - 24px));background:#10151de8;border:1px solid #d5c4ff5c;box-shadow:0 18px 60px #000a;border-radius:15px;padding:13px;backdrop-filter:blur(24px)}
.studio-search[hidden]{display:none}
.studio-search input{height:39px;padding:0 13px;width:100%;background:#ffffff0c;border:1px solid #ffffff3f;border-radius:9px;color:#fff;outline-offset:3px}
.studio-search small{font-size:11px;color:#fff9;display:block;margin-top:10px}
.studio-search-results{max-height:260px;overflow-y:auto;margin-top:7px;display:grid;gap:3px}
.studio-search-results a{display:flex;align-items:center;gap:10px;font-size:12px;padding:9px;border-radius:9px}
.studio-search-results a:hover{background:#ffffff1a}
.studio-search-results svg{width:20px;height:20px}
.contact-card{margin-top:40px;background:#102029c9;border:1px solid #ffffff3d;border-radius:19px;padding:24px;backdrop-filter:blur(20px)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.contact-card label{display:grid;gap:7px;font-size:12px;color:#fffc}
.contact-card input,.contact-card select,.contact-card textarea{background:#080e14b0;border:1px solid #ffffff47;border-radius:9px;color:#fff;padding:12px;outline-offset:3px;width:100%;font-family:var(--sans);font-size:13px}
.contact-card textarea{min-height:130px;resize:vertical}
.contact-card option{color:#121418}
.contact-grid .wide{grid-column:1/-1}
.contact-actions{display:flex;flex-wrap:wrap;gap:10px}
.contact-actions button{background:#fff;color:#08080c;border-radius:999px;border:none;padding:12px 18px;font-size:12px;font-weight:600;cursor:pointer}
.contact-actions button.ghost{background:#ffffff1a;color:#fff;border:1px solid #ffffff35}
.contact-note{font-size:11px;color:#eef4ffab;line-height:1.7;margin-top:15px}
#formStatus{font-size:12px;line-height:1.5;color:#ddc8ff;margin-top:11px}
.insight-search{margin-top:24px;display:flex;gap:10px}
.insight-search input{width:100%;padding:13px;background:#ffffff13;border:1px solid #ffffff3e;border-radius:10px;color:#fff}
.insight-card[hidden]{display:none}
.insight-card .model-desc{padding-right:42px}
.studio-footnote{margin-top:45px;padding-top:16px;border-top:1px solid #ffffff31;color:#eff8ff80;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px}
.studio-footnote a{color:#fff}
.compact-home .model-block.first{margin-top:30px}
@media(max-width:1000px){.hero-orbit{right:-8px;top:-45px;width:78px;height:78px}}
@media(max-width:760px){.hero h1{font-size:28px;line-height:1.15}.column{padding-top:80px}.hero-orbit{display:none}.stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.stat-value{font-size:12px}.model-desc{font-size:13px}.contact-card{padding:15px}.channel-strip{gap:6px}.channel-pill{font-size:10px;padding:6px 9px}.get-wrap .burst{opacity:.3}.stage .card{padding:24px 24px 0}}
@media(max-width:440px){.hero h1{font-size:25px}.contact-grid{grid-template-columns:1fr}.contact-grid .wide{grid-column:auto}.model-summary{padding:15px 12px 14px}.tags{gap:6px 8px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.stat:last-child{text-align:left}.hero .channel-strip{margin-top:14px}}
@media(prefers-reduced-motion:reduce){.hero-orbit{animation:none}.model-card,.channel-pill{transition:none}}


/* Final logo sizing so multi-channel badges stay readable */
.model-name .badge:has(.brand-cluster){width:51px;flex:none;overflow:visible;padding:0 2px}
.model-name .badge .brand-cluster{gap:2px}
.model-name .badge .brand-cluster .brand-mark{width:21px;height:21px;margin:0}
.side .side-icon .brand-cluster .brand-mark:nth-child(2){display:none}
.side .side-icon .brand-cluster{gap:0}
.brand-mark:has(svg[viewBox="0 0 48 24"]){width:27px}
.brand-mark svg[viewBox="0 0 48 24"]{width:100%;height:100%}
.panel .search-pill svg{width:14px;height:14px}
.wm-faq summary:focus-visible,.model-summary:focus-visible{outline:2px solid #e0c0ff;outline-offset:4px}

/* WEBOMONKS customer contact channels: live mailto + WhatsApp */
.wm-contact-methods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0 22px}
.wm-contact-method{display:flex;align-items:center;gap:12px;min-width:0;min-height:70px;padding:13px;background:#ffffff0b;border:1px solid #ffffff35;border-radius:13px;color:white;text-decoration:none;transition:background .2s,border-color .2s,transform .2s}
.wm-contact-method:hover{background:#ffffff17;border-color:#b993fc80;transform:translateY(-2px)}
.wm-contact-icon{display:flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;border-radius:9px;background:#07081185}
.wm-contact-icon svg{width:22px;height:22px}
.wm-contact-method>span:nth-child(2){display:grid;gap:6px;min-width:0}
.wm-contact-method strong{font-weight:600;font-size:12px}
.wm-contact-method>span:nth-child(2)>span{font-size:11.5px;color:#e7e1f0cd;overflow-wrap:anywhere}
.wm-method-arrow{margin-left:auto;color:#c5aaf5}
.wm-wa-form-btn{display:inline-flex;align-items:center;gap:8px;background:#25D366!important;color:#082d18!important}
.wm-wa-form-btn svg{width:18px;height:18px}
.wm-wa-form-btn:hover{box-shadow:0 8px 22px #25d3663b}
.wm-closing-whatsapp{display:inline-flex!important;align-items:center;gap:7px;margin-left:8px;background:#25D366!important;color:#07371a!important}
.wm-closing-whatsapp svg{width:17px;height:17px}
.side .wm-wa-nav svg{width:18px;height:18px}
.side .wm-mail-nav svg{width:18px;height:18px}
@media(max-width:540px){.wm-contact-methods{grid-template-columns:1fr}.wm-closing-whatsapp{margin-left:0;margin-top:9px}}

/* Site audit: semantic headings, mobile contact conversion and accessibility */
.wm-skip-link{position:fixed;z-index:1000;top:-100px;left:16px;background:#fff;color:#080612;padding:12px 17px;border-radius:12px;font-size:13px;font-weight:600}
.wm-skip-link:focus{top:12px}
.hero h1{font-family:var(--sans);font-weight:500;letter-spacing:-.035em}
.studio-footnote{flex-wrap:wrap;row-gap:12px}
.studio-footnote nav{display:flex;flex-wrap:wrap;align-items:center;gap:18px}
.studio-footnote nav a{color:#fcfbffdf;transition:color .2s}
.studio-footnote nav a:hover,.studio-footnote nav a:focus-visible{color:#fff;text-decoration:underline}
.side .nav-link{min-height:44px}
.wm-floating-wa{position:fixed;z-index:24;right:19px;bottom:calc(19px + env(safe-area-inset-bottom));height:49px;padding:8px 15px;display:flex;align-items:center;gap:8px;background:#128C4A;border:1px solid #ffffff5a;box-shadow:0 8px 28px #020d079e,0 0 30px #1ece8045;border-radius:999px;color:#fff;font:600 12px var(--sans);transition:transform .2s,box-shadow .2s}
.wm-floating-wa svg{width:24px;height:24px}
.wm-floating-wa:hover{transform:translateY(-3px);box-shadow:0 9px 34px #20c56b80}
.wm-policy{margin-top:32px;display:grid;gap:15px}
.wm-policy section{padding:20px;background:#0c1825c7;border:1px solid #ffffff32;border-radius:16px;backdrop-filter:blur(12px)}
.wm-policy h3{margin:0 0 10px;font:600 17px var(--sans);color:#fff}
.wm-policy p,.wm-policy li{font-size:13px;line-height:1.8;color:#e3ebf3dc}
.wm-policy ul{padding-left:17px;margin-top:10px}
.wm-policy a{color:#cbb6ff;text-decoration:underline}
@media(max-width:760px){.wm-floating-wa{right:12px;bottom:calc(12px + env(safe-area-inset-bottom));height:46px;padding:8px 12px}.wm-floating-wa span{display:none}.wm-floating-wa svg{width:25px;height:25px}.studio-footnote nav{gap:12px}.hero h1{font-size:28px;line-height:32px}}
@media(max-width:440px){.hero h1{font-size:25px;line-height:29px}}
@media(prefers-reduced-motion:reduce){.stage>video,.panel>video,.stage>.ascii,.panel>.ascii{display:none!important}.wm-floating-wa,.studio-footnote a{transition:none!important}.hero h1{animation:none}}


/* iPhone/mobile navigation rail repair — collapsed labels must never bleed into content.
   Keep accessible names in JS so icon-only links remain screen-reader friendly. */
.app.mini .side{overflow-x:hidden!important}
.app.mini .side .nav-link{
  width:42px!important;max-width:42px!important;padding:0!important;
  overflow:hidden!important;white-space:nowrap!important;
}
.app.mini .side .nav-link .side-label,
.app.mini .side .nav-link .side-meta,
.app.mini .side .side-label,
.app.mini .side .side-meta{
  opacity:0!important;visibility:hidden!important;display:none!important;
  pointer-events:none!important;
}
.app.mini .side .wordmark,
.app.mini .side .collapse{
  opacity:0!important;visibility:hidden!important;pointer-events:none!important;
}
.app.mini .side .mini-open{
  opacity:1!important;visibility:visible!important;pointer-events:auto!important;
}
.app.mini .side .nav-link .side-icon{
  position:absolute!important;left:12px!important;top:12px!important;
  width:18px!important;height:18px!important;
}
.app:not(.mini) .side .nav-link .side-label{
  opacity:1;visibility:visible;display:inline;
}
@media(max-width:760px){
  .app .side{overflow-x:hidden!important}
  .app:not(.mini) .side{width:200px!important;min-width:200px!important}
  .app:not(.mini) .side .nav-link{width:200px!important}
  .app.mini .side{width:42px!important;min-width:42px!important}
  .app.mini .side .side-top{width:42px!important}
  .app .hero h1{
    font-size:clamp(24px,6.5vw,28px);
    line-height:1.18;
    letter-spacing:-.035em;
    overflow-wrap:break-word;
    text-wrap:balance;
  }
}
@media(max-width:440px){
  .app .hero h1{font-size:clamp(23px,6.35vw,26px)}
}


/* WEBOMONKS luminous aurora front animation v1: soft cyan/lilac motion,
   separate decorative layers to preserve the original sky and page overlay. */
.panel > .wm-light-field{
  position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;
  opacity:.94;mix-blend-mode:screen;contain:paint;
}
.wm-light-drift{
  display:block;position:absolute;aspect-ratio:1;border-radius:50%;
  width:min(65vw,530px);filter:blur(50px);will-change:transform;
}
.wm-light-drift-cyan{
  top:-180px;right:-110px;
  background:radial-gradient(circle,rgba(105,220,255,.27) 0%,rgba(86,166,255,.15) 33%,rgba(61,125,255,.035) 61%,transparent 72%);
  animation:wmAuroraWander 18s ease-in-out infinite alternate;
}
.wm-light-drift-lilac{
  left:-220px;top:20%;width:min(75vw,640px);
  background:radial-gradient(circle,rgba(190,142,255,.22) 0%,rgba(136,98,246,.095) 38%,transparent 72%);
  animation:wmAuroraWander 23s ease-in-out infinite alternate-reverse;
}
.wm-light-drift-rose{
  right:-180px;bottom:0;width:min(68vw,560px);
  background:radial-gradient(circle,rgba(244,173,255,.15) 0%,rgba(100,204,255,.09) 41%,transparent 75%);
  animation:wmAuroraWander 26s ease-in-out infinite alternate;
}
.wm-light-halo{
  display:block;position:absolute;width:340px;height:340px;
  right:-125px;top:9%;border-radius:50%;
  background:conic-gradient(from 90deg,transparent 0deg,rgba(133,232,255,.10) 85deg,transparent 175deg,rgba(191,150,255,.12) 275deg,transparent 360deg);
  filter:blur(24px);opacity:.6;will-change:transform;
  animation:wmHaloOrbit 32s linear infinite;
}
@keyframes wmAuroraWander{
  0%{transform:translate3d(-5%,2%,0) scale(.93)}
  45%{transform:translate3d(8%,9%,0) scale(1.1)}
  100%{transform:translate3d(-2%,-8%,0) scale(1.03)}
}
@keyframes wmHaloOrbit{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
/* Soft spinning 3D orb — bright center with two independent moving rings. */
.hero .wm-luminous-orbit{
  display:block;position:absolute;width:128px;height:128px;
  top:-40px;right:-17px;margin:0;
  opacity:1;pointer-events:auto;isolation:isolate;
  filter:drop-shadow(0 0 20px rgba(141,217,255,.38));
  animation:wmOrbHover 6.5s ease-in-out infinite alternate;
}
.hero .wm-luminous-orbit:before{
  content:"";position:absolute;inset:13%;border-radius:50%;z-index:0;
  background:
    radial-gradient(circle at 31% 26%,rgba(246,255,255,.96) 0%,rgba(173,243,255,.87) 9%,rgba(133,195,255,.68) 25%,rgba(170,146,249,.37) 45%,rgba(75,82,167,.22) 64%,rgba(23,38,80,.15) 74%,transparent 78%),
    radial-gradient(circle at 73% 72%,rgba(179,132,255,.5),transparent 56%);
  box-shadow:0 0 18px rgba(150,210,255,.3),0 0 47px rgba(165,137,255,.24),inset 0 -8px 14px rgba(75,52,153,.36);
  animation:wmOrbBreathe 7s ease-in-out infinite alternate;
}
.hero .wm-luminous-orbit:after{
  content:"";position:absolute;inset:12%;z-index:1;
  border-radius:50%;border:1px solid rgba(197,244,255,.74);
  box-shadow:0 0 13px rgba(122,227,255,.45),inset 0 0 10px rgba(172,142,255,.22);
  animation:wmOrbRingA 16s linear infinite;
}
.hero .wm-luminous-orbit .wm-orb-sheen{
  position:absolute;z-index:1;inset:20%;border-radius:50%;
  background:radial-gradient(ellipse at 33% 30%,rgba(255,255,255,.7),transparent 30%),
    linear-gradient(120deg,transparent 30%,rgba(187,243,255,.15) 42%,transparent 66%);
  mix-blend-mode:screen;transform:rotate(-15deg);
}
.hero .wm-luminous-orbit .wm-orbit-trail{
  position:absolute;inset:1%;z-index:3;border-radius:50%;
  border:2px solid transparent;pointer-events:none;
}
.hero .wm-luminous-orbit .wm-orbit-trail-one{
  border-top-color:rgba(183,243,255,.95);border-left-color:rgba(160,213,255,.44);
  box-shadow:0 -3px 13px rgba(92,222,255,.24);
  animation:wmOrbRingB 19s linear infinite;
}
.hero .wm-luminous-orbit .wm-orbit-trail-two{
  inset:-7%;border-width:1px;
  border-bottom-color:rgba(203,169,255,.83);border-right-color:rgba(187,225,255,.38);
  animation:wmOrbRingC 23s linear infinite reverse;
}
.hero .wm-luminous-orbit canvas{
  position:absolute;inset:0;z-index:2;width:100%;height:100%;display:block;
  opacity:.94;filter:drop-shadow(0 0 4px rgba(193,233,255,.35));
}
@keyframes wmOrbHover{from{transform:translateY(-4px)}to{transform:translateY(9px)}}
@keyframes wmOrbBreathe{from{transform:scale(.93);opacity:.82}to{transform:scale(1.09);opacity:1}}
@keyframes wmOrbRingA{from{transform:rotate(0deg) scaleY(.65)}to{transform:rotate(360deg) scaleY(.65)}}
@keyframes wmOrbRingB{from{transform:rotate(30deg) scaleY(.68)}to{transform:rotate(390deg) scaleY(.68)}}
@keyframes wmOrbRingC{from{transform:rotate(-25deg) scaleY(.86)}to{transform:rotate(335deg) scaleY(.86)}}
@media(max-width:760px){
  .panel > .wm-light-field{opacity:.8}
  .wm-light-drift{width:350px;filter:blur(46px)}
  .wm-light-drift-cyan{top:-160px;right:-150px}
  .wm-light-drift-lilac{top:20%;left:-185px;width:400px}
  .wm-light-drift-rose{right:-180px;bottom:15%;width:380px}
  .wm-light-halo{width:260px;height:260px;right:-120px;top:0}
  .hero .wm-luminous-orbit{
    display:block!important;position:relative!important;
    top:auto!important;right:auto!important;left:auto!important;
    width:136px;height:136px;margin:0 auto 23px;
  }
  .hero .wm-luminous-orbit .wm-orbit-trail{border-width:1.5px}
}
@media(max-width:420px){
  .hero .wm-luminous-orbit{width:124px;height:124px;margin-bottom:19px}
}
@media(prefers-reduced-motion:reduce){
  .wm-light-drift,.wm-light-halo,.hero .wm-luminous-orbit,
  .hero .wm-luminous-orbit:before,.hero .wm-luminous-orbit:after,
  .hero .wm-luminous-orbit .wm-orbit-trail{animation:none!important;will-change:auto!important}
}
