:root{--ink:#2b2240;--purple:#7c5cff;--pink:#ff8ed1;--cyan:#72e6ed;--cream:#fff7dc;--paper:#fffdf7;--green:#58d39b;--red:#ff667a}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#e8dcff;color:var(--ink)}body,button,input,textarea{font-family:"Courier New",monospace}button{cursor:pointer}[hidden]{display:none!important}.boot{min-height:100dvh;display:grid;place-content:center;text-align:center;background:var(--cream);font-weight:900;letter-spacing:.12em}.boot span{font-size:30px;color:var(--pink);animation:blink .7s steps(1) infinite}.boot p{font-size:12px}@keyframes blink{50%{opacity:.2}}noscript{position:fixed;inset:0;display:grid;place-content:center;background:var(--cream);z-index:99;padding:20px;text-align:center}
.login-screen{min-height:100dvh;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:22px;background-color:#d9c8ff;background-image:linear-gradient(rgba(124,92,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(124,92,255,.12) 1px,transparent 1px);background-size:18px 18px}.login-screen:before,.login-screen:after{content:"";position:absolute;width:180px;height:180px;border:3px solid var(--ink);background:var(--cyan);box-shadow:8px 8px 0 var(--ink);transform:rotate(16deg);left:-110px;top:-70px}.login-screen:after{background:var(--pink);left:auto;top:auto;right:-120px;bottom:-70px;transform:rotate(-18deg)}.stars span{position:absolute;font:900 26px Arial;color:#ff5bb8;text-shadow:2px 2px 0 #fff}.stars span:nth-child(1){top:11%;left:12%}.stars span:nth-child(2){top:18%;right:13%;color:var(--purple)}.stars span:nth-child(3){bottom:13%;left:9%;color:var(--purple)}.stars span:nth-child(4){bottom:19%;right:11%;color:var(--cyan)}
.login-window{position:relative;z-index:1;width:min(100%,390px);border:3px solid var(--ink);background:var(--paper);box-shadow:9px 9px 0 var(--ink)}.window-bar{height:35px;padding:0 9px;display:flex;align-items:center;justify-content:space-between;border-bottom:3px solid var(--ink);background:var(--purple);color:#fff;font-size:11px;font-weight:900;letter-spacing:.04em}.window-bar div{display:flex;gap:5px}.window-bar i{display:block;width:11px;height:11px;border:2px solid var(--ink);background:var(--cream)}.window-bar i:nth-child(2){background:var(--pink)}.window-bar i:nth-child(3){background:var(--cyan)}.login-content{padding:30px 25px 27px;text-align:center}.pixel-computer{width:92px;margin:0 auto 25px}.screen-face{width:92px;height:68px;border:4px solid var(--ink);border-radius:5px;background:var(--cyan);box-shadow:5px 5px 0 var(--pink);display:flex;align-items:center;justify-content:center;gap:9px;font:900 18px Arial}.screen-face em{font-style:normal;transform:translateY(4px)}.computer-neck{width:14px;height:10px;background:var(--ink);margin:auto}.computer-foot{width:50px;height:7px;background:var(--ink);margin:auto}.tiny-label{display:inline-block;padding:5px 8px;background:#ffe5f6;color:#9c337a;font-size:10px;font-weight:900}.login-content h1{font:900 28px Arial;margin:10px 0 24px;letter-spacing:-.04em}.login-content form{text-align:left;display:grid;gap:15px}.login-content label{font-size:10px;font-weight:900;letter-spacing:.08em}.login-content input{display:block;margin-top:6px;width:100%;height:46px;border:3px solid var(--ink);border-radius:0;background:#fff;padding:0 12px;outline:none;font-size:15px;box-shadow:3px 3px 0 #cfc1ff}.login-content input:focus{background:#fffdf0;box-shadow:3px 3px 0 var(--pink)}.login-button{height:47px;border:3px solid var(--ink);background:var(--pink);color:var(--ink);font-weight:900;box-shadow:4px 4px 0 var(--ink);display:grid;place-items:center;margin-top:4px}.login-button:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}.login-error{margin:0;color:#c22c55;font-size:11px;font-weight:900}
.app-screen{min-height:100dvh;background:#cfc0f5;display:grid;place-items:center}.phone-app{width:100%;height:100dvh;background:var(--paper);display:flex;flex-direction:column;overflow:hidden}.app-header{height:66px;flex:0 0 auto;border-bottom:3px solid var(--ink);background:var(--purple);color:#fff;display:flex;align-items:center;padding:0 14px;gap:11px;box-shadow:0 4px 0 #ffb1dc}.mini-face{width:40px;height:40px;display:grid;place-items:center;border:3px solid var(--ink);background:var(--cyan);color:var(--ink);font:900 12px Arial;box-shadow:3px 3px 0 var(--ink)}.app-title{display:flex;flex-direction:column;gap:3px}.app-title strong{font-size:14px;letter-spacing:.02em}.app-title span{display:flex;align-items:center;gap:5px;font-size:9px;font-weight:900}.status-dot{display:block;width:8px;height:8px;border:1px solid var(--ink);background:#aaa}.status-dot.on{background:var(--green);box-shadow:0 0 0 2px rgba(88,211,155,.2)}.status-dot.off{background:var(--red)}.status-dot.checking{animation:blink .7s steps(1) infinite}.icon-button{margin-left:auto;width:36px;height:36px;border:2px solid var(--ink);background:#fff;color:var(--ink);display:grid;place-items:center;box-shadow:2px 2px 0 var(--ink);font-size:20px}
.chat{flex:1;min-height:0;overflow-y:auto;padding:24px 14px;display:flex;flex-direction:column;gap:14px;background-color:#fffaf0;background-image:radial-gradient(#e9ddff 1.2px,transparent 1.2px);background-size:14px 14px}.welcome-bubble{align-self:center;margin:auto 0;text-align:center;border:3px solid var(--ink);background:#fff;padding:23px 25px;box-shadow:6px 6px 0 var(--pink);font-weight:900;line-height:1.6;position:relative}.welcome-bubble>span{position:absolute;right:-10px;top:-15px;color:var(--purple);font-size:22px}.welcome-bubble p{margin:0;font-size:13px}.bubble{max-width:86%;border:3px solid var(--ink);padding:11px 12px;font:600 13px/1.5 Arial;box-shadow:4px 4px 0 var(--ink);white-space:pre-wrap}.bubble p{margin:0}.bubble.user{align-self:flex-end;background:#dcd1ff}.bubble.assistant{align-self:flex-start;background:#fff}.bubble img{display:block;width:100%;max-height:280px;object-fit:cover;border:2px solid var(--ink);margin-bottom:9px}.typing{display:flex;gap:5px;padding:14px}.typing span{width:7px;height:7px;background:var(--pink);border:1px solid var(--ink);animation:bounce .8s steps(2) infinite}.typing span:nth-child(2){animation-delay:.15s}.typing span:nth-child(3){animation-delay:.3s}@keyframes bounce{50%{transform:translateY(-5px)}}
.chat-input{flex:0 0 auto;padding:11px 12px calc(12px + env(safe-area-inset-bottom));border-top:3px solid var(--ink);background:#fff}.api-off-banner{border:2px solid var(--ink);background:#ffd6dc;color:#a51f3b;padding:7px 9px;margin-bottom:9px;font-size:10px;font-weight:900;text-align:center}.api-off-banner span{display:inline-grid;place-items:center;width:15px;height:15px;border:1px solid var(--ink);background:var(--red);color:#fff;margin-right:5px}.image-preview{height:54px;border:2px solid var(--ink);background:#fff2fa;display:flex;align-items:center;gap:8px;padding:5px;margin-bottom:8px;font-size:10px;font-weight:900}.image-preview img{width:48px;height:40px;object-fit:cover;border:2px solid var(--ink)}.image-preview button{margin-left:auto;border:2px solid var(--ink);background:#fff;width:28px;height:28px;display:grid;place-items:center}.photo-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}.camera-button,.gallery-button{height:43px;border:3px solid var(--ink);color:var(--ink);font-size:10px;font-weight:900;display:flex;align-items:center;justify-content:center;gap:6px;box-shadow:3px 3px 0 var(--ink)}.camera-button{background:var(--cyan)}.gallery-button{background:var(--cream)}.camera-button span,.gallery-button span{font-size:17px}.camera-button:active,.gallery-button:active,.send-button:active:not(:disabled){transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}.text-row{display:grid;grid-template-columns:1fr 48px;gap:8px}.text-row textarea{height:48px;max-height:100px;resize:none;border:3px solid var(--ink);border-radius:0;background:#fff;padding:12px;outline:none;font:600 14px Arial}.text-row textarea:focus{background:#fffcdf}.text-row textarea:disabled{background:#eee;color:#999}.send-button{height:48px;border:3px solid var(--ink);background:var(--pink);color:var(--ink);display:grid;place-items:center;box-shadow:3px 3px 0 var(--ink);font-size:20px}.send-button:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.chat-error{margin:7px 0 0;color:#bb244c;font-size:10px;font-weight:900;text-align:center}
@media(min-width:600px){.app-screen{padding:28px;background-color:#cfc0f5;background-image:linear-gradient(rgba(43,34,64,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(43,34,64,.09) 1px,transparent 1px);background-size:22px 22px}.phone-app{max-width:430px;height:min(840px,calc(100dvh - 56px));border:4px solid var(--ink);box-shadow:12px 12px 0 var(--ink)}}