@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;font-family:Manrope,sans-serif;color:#eee;background:#181818;font-size:14px;line-height:20px}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:4px}button,input,textarea{font:inherit}button{cursor:pointer;border:1px solid #444;border-radius:8px;padding:8px 12px;color:#eee;background:#272727;transition:background .3s cubic-bezier(.32,.72,0,1),transform .3s cubic-bezier(.32,.72,0,1)}button:hover{background:#313131}button:active{transform:scale(.98)}button:disabled{opacity:.4;cursor:default}button:focus-visible,input:focus-visible,textarea:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #cff288;outline-offset:4px}header{max-width:1440px;margin:auto;padding:24px 40px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;gap:12px;align-items:center;font-size:18px;font-weight:600;text-decoration:none}.mark{background:#cff288;color:#181818;border-radius:8px;width:32px;height:32px;display:grid;place-items:center}.muted,.hint,.source,.footnote{color:#aaa}main{max-width:1440px;margin:24px auto 0;padding:0 40px;display:grid;grid-template-columns:320px minmax(0,1fr);gap:48px}aside{padding-top:16px}.eyebrow{font-size:12px;letter-spacing:.12em;color:#cff288;font-weight:600}h1{font-size:36px;line-height:40px;font-weight:600;letter-spacing:-.04em;max-width:680px;margin:16px 0;background:linear-gradient(90deg,#fff,#9b9b9b);background-clip:text;color:transparent;text-wrap:balance}p{text-wrap:pretty}.intro{font-size:16px;line-height:24px;color:#bbb;margin-bottom:32px}.facts{display:flex;gap:24px;margin-bottom:32px}.facts div{display:flex;flex-direction:column;gap:4px}.facts strong{font-weight:600;font-size:18px;line-height:28px}.facts span{font-size:12px;color:#999;line-height:16px}details{border:1px solid #393939;border-radius:12px;padding:16px;margin-bottom:12px}summary{cursor:pointer;font-weight:600;list-style-position:outside;margin-left:16px}.hint{font-size:12px;line-height:16px;margin:12px 0 0}label{display:block;font-size:12px;margin:16px 0 8px}input:not([type=range]),textarea{display:block;width:100%;border:1px solid #444;background:#1f1f1f;color:#eee;border-radius:8px;padding:12px;resize:vertical}input[type=range]{width:100%;accent-color:#cff288}output{float:right}.source{font-size:12px;line-height:20px;margin:24px 0}.workspace{border:1px solid #3b3b3b;border-radius:16px;background:#1f1f1f;display:flex;flex-direction:column;height:calc(100dvh - 176px);min-height:600px;max-height:1000px;overflow:hidden}.toolbar{padding:16px 24px;display:flex;justify-content:space-between;align-items:center;gap:12px;background:#272727}.toolbar>div{display:flex;gap:8px}#status{font-size:12px;color:#bbb;display:flex;align-items:center;gap:8px}i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#aaa}#status.live i{background:#cff288}.quiet{font-size:12px;padding:4px 8px;background:transparent}#conversation{flex:1;overflow-y:auto;padding:24px;scroll-behavior:smooth}#empty{max-width:480px;margin:64px auto 24px;text-align:center}.empty-mark{display:inline-grid;place-items:center;background:#313131;color:#cff288;width:48px;height:48px;border-radius:12px;font-size:24px;line-height:32px}h2{font-size:24px;line-height:32px;font-weight:500;letter-spacing:-.03em;margin:24px 0 12px}#empty p{color:#aaa;line-height:24px}.examples{display:flex;flex-direction:column;gap:8px;margin:32px auto 0;text-align:left;max-width:400px}.examples button{text-align:left;font-size:14px;padding:12px 16px;background:#272727}.message{margin-bottom:24px;max-width:100%;animation:reveal .4s cubic-bezier(.32,.72,0,1)}.message strong{font-size:12px;color:#cff288;font-weight:600}.message.user strong{color:#aaa}.message pre{white-space:pre-wrap;overflow-wrap:anywhere;font-family:inherit;font-size:14px;line-height:24px;margin:8px 0 0}.message.user{padding:16px;background:#272727;border-radius:12px}.message.pending pre:empty{height:48px;background:#313131;border-radius:8px;animation:pulse 1.5s infinite}#composer{margin:0 24px 0;padding:12px;border:1px solid #555;border-radius:12px;background:#272727}#composer textarea{padding:4px;border:0;background:transparent;resize:none;min-height:80px;max-height:240px}#composer textarea:focus{outline-offset:4px}.composer-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:8px}.composer-bottom>span{font-size:12px;color:#999}#send{background:#cff288;color:#181818;border-color:#cff288;font-size:16px;font-weight:600;white-space:nowrap}#send:hover{background:#ddffa3}.footnote{font-size:12px;line-height:16px;text-align:center;margin:12px 24px 16px}#error{margin:0 24px 16px;padding:12px;border:1px solid #b47d70;border-radius:8px;color:#ffd2c7;background:#272727;overflow-wrap:anywhere}footer{max-width:1440px;margin:24px auto;padding:0 40px 24px;display:flex;gap:24px;justify-content:space-between;font-size:12px;line-height:20px;color:#999}.sr-only,.skip:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip:focus{display:block;padding:12px}.source a{display:inline}button[hidden],[hidden]{display:none!important}@keyframes reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{50%{opacity:.5}}@media(max-width:900px){header{padding:16px 24px}main{grid-template-columns:1fr;gap:24px;margin-top:8px;padding:0 24px}aside{padding:0}h1 br{display:none}h1{font-size:30px;line-height:36px}.intro{margin-bottom:16px}.facts{margin-bottom:24px}.workspace{height:720px;min-height:560px}footer{padding:0 24px 24px;flex-direction:column;gap:8px}}@media(max-width:520px){header{padding:16px}.brand{font-size:16px;gap:8px}.brand .muted{display:none}main{padding:0 16px;gap:16px}.toolbar{padding:12px}.workspace{height:680px}#conversation{padding:16px}#empty{margin-top:32px}#composer{margin:0 12px}.composer-bottom>span{display:none}.composer-bottom{justify-content:flex-end}.footnote{margin:12px}.facts{gap:24px}footer{padding:0 16px 24px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
