@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@400;500;600;700&family=DM+Sans:wght@400;500;600;700&display=swap');
:root {--bg:#090b16;--panel:#131529;--panel2:#1b1d34;--ink:#f4f4ff;--dim:#8e94b3;--teal:#40ffdf;--pink:#f56bbf;--violet:#9a7dfb;--line:rgba(167,177,242,.16);font-family:'DM Sans',-apple-system,BlinkMacSystemFont,sans-serif; color-scheme:dark}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#060812;color:var(--ink)}body{overflow-x:hidden}button,input{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible{outline:2px solid var(--teal);outline-offset:3px}button:disabled{opacity:.45;cursor:not-allowed}a{color:var(--teal)}.noise{position:fixed;inset:0;pointer-events:none;opacity:.055;z-index:10;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.device{position:relative;width:100%;max-width:500px;margin:0 auto;height:100dvh;min-height:100dvh;overflow:hidden;background:radial-gradient(ellipse 110% 45% at 50% 1%,rgba(68,45,111,.3),transparent 78%),var(--bg);display:flex;flex-direction:column;isolation:isolate;border-left:1px solid rgba(155,126,255,.08);border-right:1px solid rgba(155,126,255,.08)}.device:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,transparent 95%,rgba(96,255,230,.035) 96%);background-size:23px 100%}.app-header{display:flex;align-items:center;gap:10px;padding:calc(16px + env(safe-area-inset-top)) 22px 12px;flex-shrink:0}.brand-mark{position:relative;border:1.5px solid var(--teal);height:37px;width:37px;display:grid;place-items:center;transform:skew(-8deg);box-shadow:0 0 22px #40ffdf22}.mark-glyph{font:700 27px/1 'Chakra Petch',sans-serif;color:var(--teal);text-shadow:0 0 10px #40ffdf66}.brand-mark i{position:absolute;height:7px;width:7px;border:1px solid var(--pink);background:var(--bg);right:-4px;top:-4px}.branding{display:flex;flex-direction:column;gap:2px}.branding strong{font:700 23px/.98 'Chakra Petch',sans-serif;letter-spacing:2px}.brand-ai{color:var(--teal)}.eyebrow,.status-block,.hero-rail,.avatar-tag,.hero-bottom,.system-badge,.quick-actions button,.input-hint,.section-title>span,.card-heading,.vault-card h3,.settings-card h3,.settings-card label,.model-label,.outline-btn,.subtle-btn,.fineprint,.nav-btn small{font-family:'Chakra Petch',monospace;letter-spacing:1.1px}.eyebrow{font-size:8px;color:var(--dim);letter-spacing:1.4px;white-space:nowrap}.eyebrow b{color:#7a789f;font-weight:500}.status-block{margin-left:auto;white-space:nowrap;display:flex;align-items:center;gap:6px;font-size:8.5px;color:var(--teal);letter-spacing:.6px}.status-dot{width:6px;height:6px;border-radius:50%;background:var(--teal);box-shadow:0 0 9px var(--teal)}.status-dot.offline{background:#fbad71;box-shadow:0 0 9px #fbad71}.view{display:none;min-height:0;flex:1;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#393b61 transparent}.view.active{display:block}.chat-view.active{display:flex;flex-direction:column;overflow:hidden}.hero{margin:6px 15px 0;border:1px solid #3d3d62;border-radius:16px;position:relative;overflow:hidden;background:linear-gradient(151deg,rgba(42,32,78,.84),rgba(10,18,34,.9) 57%,rgba(12,28,42,.7));box-shadow:0 14px 42px #0006, inset 0 0 25px #6c4ff013;min-height:281px;flex-shrink:0;text-align:center}.hero:before,.hero:after{content:"";position:absolute;width:52px;height:12px;background:var(--bg);transform:rotate(40deg);top:-5px;left:-16px;z-index:3}.hero:after{top:auto;left:auto;bottom:-7px;right:-19px}.hero-rail{display:flex;justify-content:space-between;padding:12px 15px 0;font-size:8px;color:#a6a3c9}.hero-rail span:first-child:before{content:"◆";color:var(--teal);margin-right:5px}.hero-rail span:last-child{color:var(--teal)}.avatar-field{width:228px;height:191px;position:relative;margin:0 auto -3px;display:flex;justify-content:center;align-items:flex-end;overflow:hidden}.avatar-field:before{content:"";position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);background:var(--teal);height:120px;width:120px;filter:blur(70px);opacity:.18}.ring{position:absolute;left:50%;top:49%;transform:translate(-50%,-50%);border:1px solid #6bc6fa5c;border-radius:50%;pointer-events:none}.ring-1{height:178px;width:178px;box-shadow:0 0 20px #40ffdf1a}.ring-2{height:145px;width:145px;border-style:dashed;border-color:#db83ff55;animation:spin 26s linear infinite}.ring-3{height:115px;width:115px;border-color:#40ffdf33}.orbit{position:absolute;border-radius:1px;background:var(--teal);box-shadow:0 0 10px var(--teal);height:5px;width:14px;z-index:2}.orbit-a{top:43px;left:27px;transform:rotate(-50deg)}.orbit-b{right:25px;top:116px;width:6px;height:6px;background:var(--pink)}.avatar-backdrop{position:absolute;bottom:15px;height:60%;width:100%;background:linear-gradient(transparent,#4cf9f108 50%,transparent);border-bottom:1px solid #61f9fc44}.holo-avatar{position:relative;width:207px;z-index:2;transform:translateY(25px);filter:drop-shadow(0 3px 16px #6be6ee4c)}.custom-avatar{position:absolute;bottom:0;width:176px;height:175px;object-fit:cover;object-position:center top;border-radius:45% 45% 12% 12%;z-index:2;border:1px solid #65eae766;mask-image:linear-gradient(black 65%,transparent)}.avatar-scan{position:absolute;left:0;right:0;height:1px;background:#40ffdf77;box-shadow:0 0 9px #40ffdf80;z-index:3;top:90%;animation:scan 4s linear infinite}.avatar-tag{position:absolute;right:7px;bottom:12px;z-index:4;font-size:7.5px;color:#c7f9f3;background:#171d31c9;border:1px solid #42e7e666;padding:4px 6px}.avatar-tag span{color:var(--pink);margin:0 4px}.hero h1{font-family:'Chakra Petch',sans-serif;font-size:26px;margin:1px 0 3px;letter-spacing:-.5px}.hero h1 span:first-child{color:var(--teal)}.period{color:var(--pink)}.hero p{margin:0 12px 10px;font-size:11.2px;color:#b1b3cf}.hero-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #ffffff16;margin:0 15px;padding:10px 1px;color:#8f9bab;font-size:8px}.hero-bottom i{display:inline-block;width:5px;height:5px;background:var(--teal);border-radius:50%;margin-right:3px;box-shadow:0 0 8px var(--teal)}.speech-toggle{background:#ffffff0d;border:1px solid #ffffff1a;color:#d7d8f1;padding:5px 8px;border-radius:6px;font:600 8px 'Chakra Petch',sans-serif;letter-spacing:.6px}.speech-toggle.off{color:#a6a6bc}.chat-panel{min-height:55px;flex:1;overflow-y:auto;margin:14px 15px 0;padding:0 1px 8px;scrollbar-width:thin;scrollbar-color:#3a416b transparent;scroll-behavior:smooth}.system-hello{padding:10px 12px 11px;background:linear-gradient(125deg,#191c32,#111729);border:1px solid #6d6de13d;border-radius:10px 10px 10px 3px}.system-badge{color:var(--teal);font-size:8px}.system-hello p{margin:5px 0 0;font-size:12px;line-height:1.5;color:#c9cae1}.messages{display:flex;flex-direction:column;gap:12px;margin-top:12px}.bubble-row{display:flex;gap:8px;align-items:flex-end}.bubble-row.user{justify-content:flex-end}.bubble-avatar{width:27px;height:27px;flex:0 0 27px;border:1px solid #40ffdf65;background:#10373d;color:var(--teal);display:grid;place-items:center;font:700 16px 'Chakra Petch';border-radius:7px}.bubble{max-width:87%;padding:10px 12px;border-radius:11px;background:#1b1d35;border:1px solid #ffffff1b;color:#edeefb;font-size:12.3px;line-height:1.55;white-space:pre-wrap;word-break:break-word}.user .bubble{background:linear-gradient(110deg,#312b61,#43336c);border-color:#8478c64a;border-radius:12px 12px 3px 12px}.assistant .bubble{border-radius:12px 12px 12px 3px}.bubble-footer{display:flex;align-items:center;justify-content:space-between;margin-top:7px;gap:10px;font:500 8px 'Chakra Petch',sans-serif;color:#9f9dbd;letter-spacing:.5px}.read-aloud{font:500 9px 'Chakra Petch',sans-serif;border:0;background:transparent;color:var(--teal);padding:0}.typing{display:flex;align-items:center;gap:4px;padding:14px 3px}.typing span{width:6px;height:6px;border-radius:50%;background:var(--teal);animation:bounce 1s infinite}.typing span:nth-child(2){animation-delay:.12s}.typing span:nth-child(3){animation-delay:.24s}.typing small{font:8px 'Chakra Petch';letter-spacing:1px;color:var(--dim);padding-left:6px}.quick-actions{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;flex-shrink:0;padding:10px 16px 9px}.quick-actions::-webkit-scrollbar{display:none}.quick-actions button{white-space:nowrap;background:#171a31;color:#c9c7eb;border:1px solid #56517878;border-radius:5px;padding:9px 10px;font-size:9px;letter-spacing:.6px}.quick-actions button:first-child{border-color:#40ffdf4f;color:var(--teal)}.composer{display:flex;align-items:center;gap:9px;margin:0 15px;background:#1b1e36;border:1px solid #4b4b77;border-radius:12px;padding:6px;flex-shrink:0}.composer:focus-within{border-color:#5be8da9c}.composer input,.inline-form input,.settings-card input:not([type=checkbox]):not([type=file]){border:0;outline:0!important;min-width:0;background:transparent;color:white}.composer input{flex:1;height:34px;font-size:13px}.composer input::placeholder{color:#8289aa}.icon-btn{border:0;border-radius:8px;background:#292c4a;color:var(--teal);width:38px;height:38px;font-size:19px;display:grid;place-items:center}.mic-btn.listening{background:#482742;box-shadow:0 0 0 2px #f56bbf;color:var(--pink);animation:pulse 1s infinite}.send-btn{background:var(--teal);border:0;border-radius:8px;color:#051321;font-size:28px;width:40px;height:38px;display:grid;place-items:center;font-weight:700}.input-hint{text-align:center;font-size:8px;color:#747d9f;padding:8px 12px 9px;letter-spacing:.7px;flex-shrink:0}.bottom-nav{height:calc(62px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);display:flex;flex-shrink:0;border-top:1px solid #464060;background:linear-gradient(#111326,#101222);box-shadow:0 -10px 25px #06071370}.nav-btn{position:relative;flex:1;border:0;background:transparent;color:#8c8fab;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}.nav-btn span{font:24px/1 'Chakra Petch',sans-serif}.nav-btn small{font-size:9px;letter-spacing:1px}.nav-btn.active{color:var(--teal)}.nav-btn.active:before{content:"";position:absolute;top:0;width:58%;height:2px;background:var(--teal);box-shadow:0 0 13px var(--teal)}.vault-view,.core-view{padding:18px 17px 30px}.section-title{margin-bottom:21px}.section-title>span{font-size:9px;color:var(--teal)}.section-title h2{font:700 34px 'Chakra Petch',sans-serif;margin:4px 0}.section-title h2 span{color:var(--pink)}.section-title p{font-size:12px;color:var(--dim);line-height:1.6;margin:0}.vault-card,.settings-card{background:#15182b;border:1px solid #4d4b765c;border-radius:12px;padding:17px 15px;margin-bottom:15px}.card-heading{display:flex;justify-content:space-between;align-items:center}.card-heading span{color:var(--teal);font-size:9px}.vault-card h3,.settings-card h3{font-size:12px;color:#f8f7ff;margin:0 0 15px;letter-spacing:1.5px}.card-heading h3{margin:0 0 16px}.inline-form{display:flex;align-items:center;border:1px solid #3a3e66;background:#0d1123;border-radius:8px;padding:5px 6px 5px 11px;gap:8px}.inline-form input{flex:1;font-size:12px;height:35px}.inline-form input::placeholder{color:#7e849e}.inline-form button{width:31px;height:31px;border:0;border-radius:6px;background:#294a55;color:var(--teal);font-size:23px}.vault-list{padding-top:9px}.vault-item{border-bottom:1px solid #ffffff12;padding:11px 0;display:flex;align-items:flex-start;gap:9px}.vault-item:last-child{border-bottom:0}.vault-item .text{font-size:12px;line-height:1.45;flex:1;overflow-wrap:anywhere}.vault-item time{display:block;color:#7a83a1;font-size:9px;margin-top:4px}.vault-item button{border:0;background:transparent;color:#9fa5c7;font-size:17px;padding:0 3px}.vault-item.done .text{text-decoration:line-through;color:#777e9a}.check-btn{width:20px;height:20px;flex-shrink:0;border:1px solid #4db9ae!important;border-radius:4px;background:transparent!important;color:var(--teal)!important;font-size:12px!important}.empty-state{font-size:11px;color:#858aa8;margin:13px 0 2px}.timer-box{display:flex;justify-content:space-between;align-items:center;gap:10px}.timer-box>div{font:600 36px 'Chakra Petch',sans-serif;color:var(--teal);letter-spacing:2px}.outline-btn{background:#20243b;border:1px solid #5d6497;color:var(--teal);font-size:10px;padding:11px 12px;border-radius:7px;letter-spacing:.8px}.small-muted{font-size:11px;line-height:1.6;color:#9ba1bf}.settings-card>label:not(.switch-row){display:block;margin-bottom:9px;font-size:10px;color:#b8bdd6}.settings-card input:not([type=checkbox]):not([type=file]){width:100%;height:42px;background:#0e1325;border:1px solid #45486e;border-radius:7px;font-size:13px;padding:10px;margin-bottom:15px}.settings-card input[type=file]{max-width:100%;font-size:11px;margin:0 0 10px;color:#aab3d1}.upload-label{margin-top:4px}.upload-label span{color:#6f779d;font-size:8px}.subtle-btn{color:var(--pink);font-size:10px;background:transparent;border:0;padding:3px 0}.model-label{display:flex;justify-content:space-between;font-size:10px;margin-bottom:19px;color:#939abd}.model-label strong{color:var(--teal);letter-spacing:.6px}.status-note{font-size:11px;color:#a5ebdd;margin-bottom:0;min-height:14px}.settings-card .switch-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 0 15px;font-size:10px;color:#e3e5ff;line-height:1.3}.switch-row+ .switch-row{border-top:1px solid #ffffff16;padding-top:15px}.switch-row small{display:block;font:11px/1.4 'DM Sans',sans-serif;letter-spacing:0;color:#888fac;margin-top:5px}.switch-row input{appearance:none;width:40px;height:22px;background:#535976;border-radius:11px;position:relative;flex:0 0 40px;outline:0}.switch-row input:before{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#dfe4ff;transition:transform .2s}.switch-row input:checked{background:#298b88}.switch-row input:checked:before{transform:translateX(18px);background:#b7fff4}.button-stack{display:flex;flex-wrap:wrap;gap:8px}.red{color:#ff8d9d;border-color:#ff8d9d55}.fineprint{font-size:9px;color:#6c728d;text-align:center;line-height:1.6;padding:12px}.hero.speaking .ring-1{border-color:var(--teal);box-shadow:0 0 34px #40ffdf55;animation:pulse 1.4s infinite}.hero.speaking .holo-avatar{filter:drop-shadow(0 3px 25px #6be6ee99)}
@keyframes spin{from{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes scan{0%{top:15%;opacity:0}20%,80%{opacity:.65}100%{top:95%;opacity:0}}@keyframes bounce{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}@keyframes pulse{0%,100%{opacity:1}50%{opacity:.65}}
@media(max-height:740px){.hero{min-height:240px}.avatar-field{height:153px;width:190px}.holo-avatar{width:175px}.hero p{margin-bottom:7px}.hero-bottom{padding:8px 1px}.chat-panel{margin-top:10px}.quick-actions{padding-top:7px;padding-bottom:6px}}@media(min-width:501px){.device{min-height:100dvh;box-shadow:0 0 60px #000a}.hero{margin-top:15px}}

[hidden]{display:none!important}
/* CHARACTER EDITION: Capri's red / acid-green effect-entity look */
:root{--teal:#a0ff62;--pink:#fa527f;--violet:#ea4159;--bg:#0e0812;--panel:#21101c;--panel2:#2c1020;--dim:#b6a0b1}
.device{background:radial-gradient(ellipse 90% 40% at 47% 1%,rgba(156,20,50,.23),transparent 85%),#0e0812;border-color:#8d344526}
.hero{background:linear-gradient(160deg,rgba(68,15,36,.92),rgba(14,10,22,.94) 65%,rgba(20,32,12,.55));border-color:#a94a5f77;box-shadow:0 15px 35px #0009,inset 0 0 60px #e71a2710}
.hero-rail span:last-child{color:#b4ff7b}
.avatar-field{width:min(95%,325px);height:213px;margin:0 auto -8px;overflow:visible;isolation:isolate}
.holo-avatar{display:none!important}
.capri-portrait{position:absolute;z-index:2;bottom:-4px;width:205px;height:211px;object-fit:cover;object-position:center 14%;border-radius:38% 38% 3% 3%;filter:drop-shadow(0 0 11px #d5224e66);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 8%,#000 78%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0%,#000 8%,#000 78%,transparent 100%);animation:capri-idle 3.8s ease-in-out infinite;user-select:none;-webkit-user-select:none;pointer-events:auto;touch-action:manipulation}
.custom-avatar{width:204px;height:208px;object-position:center center;border-radius:32% 32% 7% 7%;filter:drop-shadow(0 0 15px #f83a6555)}
.avatar-field:before{background:#ff315b;opacity:.27}
.ring-1{border-color:#ff395b99;box-shadow:0 0 20px #fa3d5e22}
.ring-2{border-color:#b0ff5e99}
.ring-3{border-color:#f43f5d77}
.avatar-backdrop{background:linear-gradient(transparent,#f23f6014 50%,transparent);border-bottom-color:#b5ff5e66}
.avatar-scan{background:#baff81aa;box-shadow:0 0 12px #8df64c99}
.avatar-tag{color:#e8ffc8;border-color:#a7ff7166;background:#270d18df}
.avatar-tag span{color:#ff5a79}
.system-hello{border-color:#a347657d;background:linear-gradient(130deg,#291323,#17101f)}
.user .bubble{background:linear-gradient(125deg,#3c172b,#5c1d35);border-color:#f74b8a55}
.bubble-avatar{color:#ceffad;background:#263318;border-color:#9cff6688}
.quick-actions button:first-child{color:#bdff86;border-color:#8cff6577}
.hero.speaking .capri-portrait{animation:capri-speaking .28s ease-in-out infinite alternate;filter:drop-shadow(0 0 24px #f83d6aa8)}
.avatar-field:active .capri-portrait,.avatar-field.poked .capri-portrait{animation:capri-poke .45s ease-in-out 1}
.settings-select{width:100%;min-height:42px;padding:9px;color:#fff;background:#0e1325;border:1px solid #45486e;border-radius:7px;font:12px 'DM Sans',sans-serif;margin:0 0 16px}
.sample-btn{margin-bottom:17px}
@keyframes capri-idle{0%,100%{transform:translateY(1px) rotate(-.6deg)}50%{transform:translateY(-6px) rotate(.7deg)}}
@keyframes capri-speaking{from{transform:translateY(0) scale(1)}to{transform:translateY(-3px) scale(1.027)}}
@keyframes capri-poke{0%{transform:rotate(0deg)}25%{transform:rotate(-5deg) scale(1.045)}60%{transform:rotate(4deg) scale(.98)}100%{transform:rotate(0deg)}}
@media(max-height:740px){.avatar-field{height:150px}.capri-portrait,.custom-avatar{width:165px;height:155px}}
@media(prefers-reduced-motion:reduce){.capri-portrait{animation:none!important}}
