:root{color-scheme:dark;font-family:system-ui,-apple-system,sans-serif;background:#0b1020;color:#f4f6ff}*{box-sizing:border-box}body{margin:0}main{max-width:560px;margin:auto;padding:24px 18px 40px}header,.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px}small,.section-head span{font-size:10px;letter-spacing:.14em;color:#939ec2;font-weight:700}h1{font-size:23px;margin:5px 0 0}h2{font-size:18px;margin:0}.badge{font-size:12px;background:#262e47;border-radius:30px;padding:8px 12px}.hero{margin:26px 0;padding:23px;border-radius:24px;background:linear-gradient(125deg,#6657dd,#388bd0)}.hero span{font-size:13px}.hero h2{font-size:26px;margin:12px 0 7px}.hero p,.note{font-size:13px;line-height:1.5;color:#b3bedc}.hero p{color:#e9e8ff;margin:0}section{margin-bottom:27px}.section-head{margin-bottom:13px}.card{background:#161d32;border:1px solid #29324c;border-radius:18px;padding:17px}label{display:block;font-size:13px;color:#bdc7de;margin-bottom:9px}select,button{width:100%;font:inherit;border:0;border-radius:11px;padding:13px}select{color:#fff;background:#242d47}button{margin-top:10px;color:white;background:#6c68e9;font-weight:650}button:disabled{opacity:.5}.text-button{margin:0;padding:5px;width:auto;background:transparent;color:#a4acff;font-size:13px}.list{display:grid;gap:9px}.row{display:flex;justify-content:space-between;gap:10px}.row strong{font-size:14px;overflow-wrap:anywhere}.row span{font-size:12px;color:#9ce9c8;white-space:nowrap}.row p{margin:6px 0 0;font-size:12px;color:#a9b4d2}.error{color:#ffb9bd}footer{font-size:11px;text-align:center;color:#7d88a9;margin-top:30px}

.office{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.agent-tile{background:#19243c;border:1px solid #35466a;border-radius:12px;margin:0;padding:12px 4px;min-width:0;color:#eef2ff}.agent-tile .sprite{display:block;font-size:27px;filter:drop-shadow(3px 3px 0 #273752)}.agent-tile strong{display:block;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:6px}.agent-tile small{display:block;letter-spacing:0;margin-top:4px;font-size:10px;color:#9aa8c4}.agent-tile.working{border-color:#63dcaa;background:#183a39}.agent-tile.working .sprite{animation:bob 1s steps(2,end) infinite}@keyframes bob{50%{transform:translateY(-3px)}}#agent-details:not(:empty){margin-top:10px}#agent-details .note{overflow-wrap:anywhere}@media(prefers-reduced-motion:reduce){.agent-tile.working .sprite{animation:none}}

.pixel-person{position:relative;display:block;width:34px;height:40px;margin:0 auto;image-rendering:pixelated}.pixel-person i{display:block;position:absolute}.pixel-head{top:4px;left:10px;width:14px;height:14px;background:#ffd3a4;box-shadow:0 -4px #7050a6,4px -4px #7050a6,-4px 0 #7050a6}.pixel-body{top:20px;left:6px;width:22px;height:12px;background:#879af8;box-shadow:-4px 2px #879af8,4px 2px #879af8}.pixel-legs{top:32px;left:9px;width:7px;height:7px;background:#bbc8f9;box-shadow:10px 0 #bbc8f9}.agent-tile:nth-child(4n+2) .pixel-body{background:#f097b4;box-shadow:-4px 2px #f097b4,4px 2px #f097b4}.agent-tile:nth-child(4n+3) .pixel-body{background:#80d4b5;box-shadow:-4px 2px #80d4b5,4px 2px #80d4b5}.agent-tile.working .pixel-person{animation:bob 1s steps(2,end) infinite}@media(prefers-reduced-motion:reduce){.agent-tile.working .pixel-person{animation:none}}

.agent-light{display:block;width:10px;height:10px;border-radius:50%;margin:0 auto 7px;background:#556076;border:1px solid #758197}.agent-light.is-on{background:#62f5ac;border-color:#b5ffd8;box-shadow:0 0 5px #51ffad,0 0 14px #49e99a}.sessions-accordion{background:#161d32;border:1px solid #29324c;border-radius:18px;overflow:hidden}.sessions-accordion summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;padding:17px;font-size:18px;font-weight:700}.sessions-accordion summary::-webkit-details-marker{display:none}.accordion-arrow{color:#b4b9ff;font-size:25px;line-height:1;transition:transform .15s}.sessions-accordion[open] .accordion-arrow{transform:rotate(180deg)}.accordion-content{padding:0 17px 17px}.accordion-content .section-head{align-items:center}.accordion-content .text-button{white-space:nowrap}.sessions-accordion summary:focus-visible{outline:2px solid #a4acff;outline-offset:-3px}

.agent-progress{display:block;height:5px;margin:7px 6px 0;border-radius:3px;background:#2a3654;overflow:hidden}.agent-progress-fill{display:block;height:100%;width:0;background:#62f5ac;transition:width .6s}.agent-eta{display:block;min-height:12px;margin-top:3px;font-size:10px;color:#9aa8c4}

/* The guild: pixel portraits and an accessible native dialog. */
.office{gap:10px}.agent-tile{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;padding:12px 5px 10px;background:linear-gradient(155deg,#263451,#141b30);border:1px solid #3b4a69;box-shadow:inset 0 1px #ffffff0d;cursor:pointer;transition:transform .15s,border-color .15s}.agent-tile:hover{transform:translateY(-2px);border-color:#8995d8}.agent-tile:focus-visible,.modal-close:focus-visible{outline:2px solid #c4b6ff;outline-offset:2px}.agent-tile.working{border-color:#54cda1;background:linear-gradient(155deg,#234b45,#18273a)}.portrait{position:relative;display:flex;align-items:center;justify-content:center;width:78px;height:78px;border-radius:16px;background:radial-gradient(circle,var(--glow),transparent 72%);background-color:#202844}.gnome{width:62px;height:72px;image-rendering:pixelated;shape-rendering:crispEdges;filter:drop-shadow(2px 4px 0 #0c1020aa)}.agent-tile.working .gnome{animation:bob 1s steps(2,end) infinite}.status-dot{position:absolute;right:4px;bottom:4px;width:10px;height:10px;border:2px solid #263148;border-radius:50%;background:#76819c}.status-dot.on{background:#62f5ac;box-shadow:0 0 9px #62f5ac}.agent-tile strong{width:100%;font-size:12px;margin-top:5px}.agent-tile small{width:100%;white-space:normal;min-height:26px;line-height:1.3;color:#bdc8de}.agent-state{font-size:10px;color:#a3b0cb}.working .agent-state{color:#83e6bb}
.agent-dialog{width:min(92vw,440px);max-height:min(88vh,780px);padding:0;border:1px solid #4b587d;border-radius:22px;background:#151d31;color:#f4f6ff;box-shadow:0 20px 90px #000b}.agent-dialog::backdrop{background:#070b18c9;backdrop-filter:blur(4px)}.modal-body{padding:20px}.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.modal-title small{color:#a9a4f3}.modal-title h2{margin-top:6px;overflow-wrap:anywhere}.modal-close{flex:none;width:38px;height:38px;margin:0;padding:0;font-size:26px;line-height:1;color:#dce4ff;background:#29334d}.modal-hero{display:flex;align-items:center;gap:18px;padding:12px 16px;margin:17px 0 20px;border-radius:16px;background:radial-gradient(circle at 35px 40px,var(--glow),transparent 110px),#222b43}.modal-hero .gnome{width:75px;height:88px;flex:none}.modal-hero p{margin:5px 0}.agent-dialog form label{margin:16px 0 7px}.agent-dialog input{width:100%;font:inherit;color:white;background:#242d47;border:1px solid #42506e;border-radius:11px;padding:12px}.agent-dialog select{border:1px solid #42506e}.agent-dialog button.secondary{background:#39476e}.agent-dialog button.danger{background:#ad4054}.modal-message{min-height:38px}.agent-dialog .note{overflow-wrap:anywhere}@media(max-width:360px){.office{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(prefers-reduced-motion:reduce){.agent-tile.working .gnome{animation:none}}
