:root{color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display",Inter,system-ui,sans-serif;background:#05020d;color:#f6efff}
*{box-sizing:border-box}body{margin:0}
.app{min-height:100dvh;padding:max(24px,env(safe-area-inset-top)) 20px max(18px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:15px;background:radial-gradient(ellipse at 50% 30%,#2c1556,#130728 48%,#05020d 88%)}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px}.topbar strong{font-size:18px;letter-spacing:.35em;color:#e7d5ff}.topbar span{letter-spacing:.15em;color:#a99ac1;font-size:10px;text-align:right}
.core{flex:1;min-height:240px;display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center}
.core h1{font-weight:700;font-size:clamp(26px,8vw,39px);letter-spacing:-.04em;margin:22px 0 3px}.core p{margin:0;font-size:14px;color:#c5b4e0}
.halo{width:min(49vw,206px);aspect-ratio:1;border:1px solid #a06bee77;border-radius:50%;padding:11px;box-shadow:0 0 32px #6c32b9bb,0 0 87px #7f38d73b,inset 0 0 22px #dfb6ff33;animation:pulse 4s ease-in-out infinite}
.orb{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;border:1px solid #eac8ff98;background:radial-gradient(circle at 33% 28%,#c999ff,#8641e8 28%,#39117e 58%,#0c0523 85%);box-shadow:inset -12px -22px 36px #140729,0 0 19px #a15df9}
.orb span{font-size:63px;font-weight:250;text-shadow:0 0 18px white}
.conversation{border:1px solid #ac7bec3d;border-radius:23px;background:#130a2cbf;box-shadow:0 12px 38px #0004;padding:18px;max-height:38dvh;overflow:auto}
.conversation label{font-size:11px;font-weight:800;letter-spacing:.18em;color:#d09dff;display:flex;justify-content:space-between;gap:12px}
.conversation label span{color:#8e80a9;font-size:10px;font-weight:500}
#response{font-size:16px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere;margin-top:10px}
.action{margin-top:12px;text-align:center;display:block;padding:14px;border:0;border-radius:13px;background:#8650ed;color:white;text-decoration:none;font-size:15px;font-weight:750;cursor:pointer;width:100%}
.action.secondary{background:#44246c}
.hidden{display:none!important}
.records{display:flex;flex-direction:column;gap:9px}
.record{border-radius:12px;background:#ffffff0a;border:1px solid #ffffff14;padding:11px;margin-top:7px}
.record strong{display:block;color:#eadcff}.record small{display:block;color:#b7a7d0;overflow-wrap:anywhere;margin-top:4px}
.command{display:flex;align-items:center;gap:9px;padding:8px;background:#1a0d37;border:1px solid #bc8bff59;border-radius:18px}
.command input{min-width:0;flex:1;padding:10px 0;border:0;outline:0;background:transparent;color:#fff;font-size:16px}
.command input::placeholder{color:#9986b0}
.command button{flex:0 0 44px;width:44px;height:44px;border:0;border-radius:12px;background:#4b287d;color:#fff;font-size:22px;cursor:pointer}
.command button:last-child{background:#7c3be2}.command button:disabled{opacity:.4}
.hint{margin:0;text-align:center;color:#a999c3;font-size:12px;line-height:1.5}
footer{text-align:center;color:#847695;font-size:11px}
@keyframes pulse{50%{box-shadow:0 0 44px #8247daaa,0 0 100px #a347ff4d,inset 0 0 35px #dfb6ff44;transform:scale(1.025)}}
@media(prefers-reduced-motion:reduce){.halo{animation:none}}
@media(max-height:680px){.core{min-height:160px}.halo{width:120px}.app{gap:10px}.core h1{margin-top:8px}}

.studio{margin-top:16px;border-top:1px solid #9c76c23f;padding-top:14px}.studio-title{display:flex;justify-content:space-between;gap:12px;font-size:11px;letter-spacing:.15em;font-weight:800;color:#d3a7ff}.studio-title span{font-weight:500;color:#ac9bbb;font-size:10px}.studio iframe{display:block;width:100%;height:390px;border:1px solid #bd9fea5f;border-radius:10px;background:#f5f5ee;margin:15px 0 0}.studio small{line-height:1.5;display:block;color:#b8a5ce;margin-top:9px}.studio .action{color:#fff}

.dialog-history{display:flex;flex-direction:column;gap:9px;border-bottom:1px solid #bc8bff30;padding-bottom:14px;margin-bottom:14px;max-height:175px;overflow-y:auto}
.dialog-history[hidden]{display:none}
.dialog-turn{padding:10px 12px;border-radius:14px;background:#ffffff0a;overflow-wrap:anywhere}
.dialog-turn.from-owner{margin-left:20px;background:#6937ac32}
.dialog-role{display:block;font-size:10px;letter-spacing:.12em;color:#c9abf0;font-weight:700;margin-bottom:4px}
.dialog-turn p{font-size:13px;line-height:1.48;color:#dfd2ef;margin:0;white-space:pre-wrap}
#response{min-height:48px}

.orb{appearance:none;color:white;cursor:pointer;font-family:inherit}
.orb:focus-visible{outline:3px solid #d8adff;outline-offset:9px}