*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Arial,Helvetica,sans-serif;color:#111}
body{background:#fff}
.page-shell{min-height:100vh;margin-left:168px}
.page-shell.full-width{margin-left:0}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:168px;background:#004aac;display:flex;flex-direction:column;z-index:5}
.sidebar nav{padding-top:18px}
.nav-item{display:block;text-decoration:none;color:#fff;font-weight:700;font-size:29px;line-height:1.05;text-align:left;padding:12px 10px 12px 38px}
.account-label{margin-top:auto;color:#ff7d16;font-size:20px;padding:0 0 22px 18px;white-space:nowrap}
.topbar{height:112px;display:flex;align-items:center;justify-content:space-between;padding:0 35px;font-weight:700;font-size:42px}
.home-topbar{background:linear-gradient(to bottom,#10b778 0%,#5a8fcd 55%,#8854ef 100%);color:#ddd}
.red-topbar{background:#ff2c32}
.cyan-topbar{background:#58d4dc}
.purple-topbar{background:#1f0bbd;color:#ddd}
.yellow-topbar{background:#ffe066}
.header-home{color:inherit;text-decoration:none;font-weight:700}

.home-panel{margin:23px 35px 0;background:#d9d9d9;min-height:260px;display:grid;grid-template-columns:45% 55%;padding:17px 28px;gap:20px}
.progress-stream,.part-stream{font-size:22px;line-height:1.55;min-height:220px}
.progress-line,.part-row{display:grid;align-items:center;margin-bottom:8px;min-height:34px}
.progress-line{grid-template-columns:1fr auto;gap:16px}
.part-row{grid-template-columns:1fr 1.2fr 1.4fr auto;gap:18px;font-size:24px}
.part-row a{color:#111;text-decoration:none}
.empty-progress{color:#555;font-size:20px;padding-top:8px}
.status-dot{width:18px;height:18px;border-radius:50%;display:inline-block;vertical-align:middle}
.status-dot.ok{background:#7fda50}
.status-dot.work{background:#ff3a3e}

.master-box-wrap{display:flex;align-items:center;gap:10px;margin:330px 90px 0 70px}
.master-input{height:62px;background:#d9d9d9;display:flex;align-items:center;flex:1}
.upload-label{display:flex;align-items:center;justify-content:center;width:56px;font-size:31px;cursor:pointer;color:#777}
.upload-label input{display:none}
.prompt-input{border:0;outline:none;background:transparent;flex:1;font-size:20px;padding:0 10px}
.go-button{border:0;background:transparent;font-weight:700;font-size:28px;cursor:pointer}
.working-indicator{display:flex;justify-content:center;gap:8px;margin-top:11px;min-height:22px}
.working-indicator span{width:10px;height:10px;border-radius:50%;background:#005bb9;animation:dotPulse 1.1s infinite ease-in-out}
.working-indicator span:nth-child(2){animation-delay:.18s}.working-indicator span:nth-child(3){animation-delay:.36s}
.working-indicator.idle span{animation:none;opacity:.35}
@keyframes dotPulse{0%,80%,100%{transform:translateY(0);opacity:.35}40%{transform:translateY(-7px);opacity:1}}

.api-labels{display:grid;grid-template-columns:1fr 1fr;text-align:center;font-size:21px;padding:10px 0 17px}
.agent-grid{border:2px solid #111;margin:0 25px;display:grid;grid-template-columns:1fr 1fr}
.agent-slot{height:79px;border-right:2px solid #111;border-bottom:2px solid #111;display:grid;grid-template-columns:78px 42px 1fr;align-items:center}
.agent-slot:nth-child(2n){border-right:0}.agent-slot:nth-last-child(-n+2){border-bottom:0}
.slot-id{font-size:16px;font-weight:700;text-align:center}.agent-slot input{height:100%;border:0;border-left:2px solid #111;outline:none;font-size:17px;padding:0 12px}
.go-small{border:0;background:transparent;font-size:27px;font-weight:700;cursor:pointer}
.dot{display:inline-block;width:28px;height:28px;border-radius:50%;vertical-align:middle}
.dot.green{background:#7fda50}.dot.red{background:#ff3a3e}.dot.blue{background:#0667c8}.dot.purple{background:#b84ee6}.dot.off{background:#bbb}

.total-box{font-size:28px;margin-left:160px}.total-box small{font-size:16px;font-weight:700;margin-left:10px}
.api-title{display:flex;align-items:center;gap:10px}
.key-row{min-height:40px;background:#d8d8d8;display:flex;align-items:center;padding:0 38px;gap:5px;font-size:20px}
.key-row-note{margin-left:14px;color:#555;font-size:15px}
.box-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-left:2px solid #111;border-top:2px solid #111}
.box-cell{min-height:88px;border-right:2px solid #111;border-bottom:2px solid #111;padding:7px 9px;display:grid;grid-template-columns:48px 18px 1fr;grid-template-rows:24px 1fr;column-gap:7px;align-items:center}
.box-number{grid-row:1 / span 2;font-size:16px;font-weight:700;text-align:center}
.box-cell .dot{width:16px;height:16px;justify-self:center;grid-column:2}
.box-cell input{grid-column:3;grid-row:1 / span 2;width:100%;height:40px;border:0;outline:none;font-size:14px;background:#f4f4f4;padding:5px 7px}

.folder-grid{padding:42px 65px;display:grid;grid-template-columns:repeat(6,1fr);gap:52px}
.folder-card{font-size:80px;text-align:center;cursor:pointer}.folder-card span{display:block;font-size:23px;font-weight:700;margin-top:5px}
.empty-folder-state{grid-column:1/-1;color:#555;font-size:20px;padding:15px}
.raw-space{min-height:calc(100vh - 112px);background:#fff;padding:24px 32px}
.raw-list{display:flex;flex-direction:column;gap:7px}.raw-row{display:grid;grid-template-columns:90px 1fr 110px;align-items:center;border-bottom:1px solid #ddd;padding:8px 4px;font-size:17px}.raw-row strong{font-size:15px}.raw-row small{color:#555;text-align:right}.empty-raw-state{color:#555;font-size:20px}

@media(max-width:1100px){
  .topbar{font-size:33px}.total-box{margin-left:20px}.home-panel{grid-template-columns:1fr}.part-stream{margin-top:15px}.master-box-wrap{margin:110px 20px 0}.box-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.folder-grid{grid-template-columns:repeat(3,1fr);padding:30px}
}
@media(max-width:900px){
  .page-shell{margin-left:0}.sidebar{position:relative;width:100%;height:auto;min-height:0;display:block}.sidebar nav{display:flex;flex-wrap:wrap;padding:8px}.nav-item{font-size:18px;padding:9px 12px}.account-label{display:none}
  .topbar{font-size:28px;padding:0 18px}.home-panel{margin:15px; padding:12px}.part-row{grid-template-columns:1fr;gap:2px}.master-box-wrap{margin:80px 15px 0}.agent-grid{margin:0 8px;grid-template-columns:1fr}.agent-slot{border-right:0}.agent-slot:nth-last-child(-n+2){border-bottom:2px solid #111}.agent-slot:last-child{border-bottom:0}.api-labels{display:none}.box-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.key-row{padding:0 15px}.key-row-note{display:none}.total-box{margin-left:10px;font-size:18px}.total-box small{display:block;font-size:12px}.api-title{font-size:21px}.folder-grid{grid-template-columns:repeat(2,1fr);padding:25px 15px;gap:25px}.raw-space{padding:15px}.raw-row{grid-template-columns:70px 1fr 80px}
}

/* Connected runtime controls */
.app-message{min-height:22px;margin:10px 18px;padding:8px 12px;border:1px solid rgba(255,255,255,.12);border-radius:8px;font-size:13px;opacity:.92}
.app-message:empty{display:none}.app-message.error{border-color:#ff5f6d;color:#ff9aa3}.app-message.info{border-color:#4dd0e1}
.project-meta{margin:8px 18px 0;padding:8px 12px;font-size:13px;opacity:.85}
.duration-control{display:flex;align-items:center;gap:6px;white-space:nowrap;font-size:12px}.duration-control input{width:72px;padding:7px;background:#111;color:#fff;border:1px solid #555;border-radius:6px}
.command-row{display:flex;align-items:center;gap:10px;margin:12px 18px;flex-wrap:wrap}.command-row button:disabled{opacity:.35;cursor:not-allowed}.command-row span{font-size:12px;opacity:.7}
.folder-card button{margin-top:6px;padding:5px 8px;border-radius:5px;border:1px solid rgba(255,255,255,.2);background:#111;color:#fff;cursor:pointer}.folder-card small{display:block;max-width:220px;overflow-wrap:anywhere}
.dot.work{background:#f1c40f}.dot.red{background:#e74c3c}

.open-project-row,.credential-meta-row{display:flex;align-items:center;gap:10px;margin:10px 18px;flex-wrap:wrap}.open-project-row label,.credential-meta-row label{display:flex;align-items:center;gap:6px;font-size:12px}.open-project-row input,.credential-meta-row input{padding:7px 9px;border:1px solid #777;border-radius:6px;min-width:100px}.open-project-row span,.credential-meta-row span{font-size:12px;color:#555}.credential-meta-row{padding:8px 12px;background:#eee}.credential-meta-row input{min-width:180px;background:#fff;color:#111}
