:root{--font-family: ui-sans-serif, -apple-system, "Inter", "Segoe UI", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;--font-family-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;--font-size-xs: 11px;--font-size-sm: 12px;--font-size-base: 14px;--font-size-read: 15px;--font-size-md: 16px;--font-size-lg: 20px;--font-size-xl: 24px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.3;--line-height-base: 1.55;--line-height-relaxed: 1.75;--letter-spacing-label: .09em;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-7: 32px;--space-8: 40px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 20px;--radius-pill: 999px;--duration-fast: .15s;--duration-base: .2s;--easing-standard: cubic-bezier(.22, .61, .21, 1);--sidebar-width: 268px;--content-width: 880px;--chat-width: 768px;--focus-ring-width: 2px;--focus-ring-offset: 2px}:root,:root[data-theme=dark]{color-scheme:dark;--gradient-app: radial-gradient(1100px 560px at 12% -10%, rgb(125 125 240 / .08), transparent 60%), radial-gradient(900px 640px at 105% 110%, rgb(125 125 240 / .05), transparent 55%), linear-gradient(180deg, #0a0a11 0%, #08080d 100%);--gradient-sidebar: linear-gradient(180deg, rgb(255 255 255 / .025), rgb(255 255 255 / 0) 42%);--gradient-accent: linear-gradient(135deg, #6a6df2 0%, #7d5ff0 100%);--gradient-surface: linear-gradient(180deg, rgb(255 255 255 / .045), rgb(255 255 255 / .02));--color-bg: #08080d;--color-surface: rgb(255 255 255 / .03);--color-surface-raised: rgb(255 255 255 / .055);--color-surface-hover: rgb(255 255 255 / .075);--color-composer: rgb(19 19 27 / .82);--color-sidebar: #0a0a10;--color-border: rgb(255 255 255 / .08);--color-border-strong: rgb(255 255 255 / .15);--color-text: #f4f4f7;--color-text-muted: #a2a2b0;--color-text-faint: #71717f;--color-accent: #8f8ff7;--color-accent-hover: #a5a5ff;--color-accent-fill: #6366e8;--color-accent-soft: rgb(125 125 240 / .13);--color-accent-contrast: #ffffff;--color-danger: #f28b8b;--color-danger-soft: rgb(242 139 139 / .12);--color-success: #3ecf8e;--color-success-soft: rgb(62 207 142 / .12);--color-success-text: #7fe3b6;--color-warning-soft: rgb(251 191 36 / .12);--color-warning-text: #fcd34d;--color-user-panel: rgb(255 255 255 / .04);--color-focus: #a5a5ff;--color-selection: rgb(125 125 240 / .35);--shadow-sm: 0 1px 2px rgb(0 0 0 / .35);--shadow-md: 0 2px 6px rgb(0 0 0 / .3), 0 12px 28px rgb(0 0 0 / .28);--shadow-lg: 0 4px 12px rgb(0 0 0 / .35), 0 24px 56px rgb(0 0 0 / .4);--shadow-highlight: inset 0 1px 0 rgb(255 255 255 / .05);--focus-ring-shadow: 0 0 0 3px rgb(125 125 240 / .28)}:root[data-theme=light]{color-scheme:light;--gradient-app: radial-gradient(1100px 560px at 12% -10%, rgb(84 87 214 / .06), transparent 60%), radial-gradient(900px 640px at 105% 110%, rgb(84 87 214 / .04), transparent 55%), linear-gradient(180deg, #f8f8fa 0%, #f1f1f4 100%);--gradient-sidebar: linear-gradient(180deg, rgb(255 255 255 / .65), rgb(255 255 255 / 0) 42%);--gradient-accent: linear-gradient(135deg, #5457d6 0%, #6d4fd0 100%);--gradient-surface: linear-gradient(180deg, #ffffff, #fdfdfe);--color-bg: #f1f1f4;--color-surface: #ffffff;--color-surface-raised: #ffffff;--color-surface-hover: #ececf1;--color-composer: rgb(255 255 255 / .88);--color-sidebar: #ececf0;--color-border: rgb(23 23 40 / .09);--color-border-strong: rgb(23 23 40 / .18);--color-text: #17171d;--color-text-muted: #565664;--color-text-faint: #83838f;--color-accent: #5457d6;--color-accent-hover: #4346bd;--color-accent-fill: #5457d6;--color-accent-soft: rgb(84 87 214 / .1);--color-accent-contrast: #ffffff;--color-danger: #b4232a;--color-danger-soft: #fdecec;--color-success: #067647;--color-success-soft: #dcfae6;--color-success-text: #065f46;--color-warning-soft: #fef3c7;--color-warning-text: #92400e;--color-user-panel: rgb(84 87 214 / .05);--color-focus: #5457d6;--color-selection: rgb(84 87 214 / .22);--shadow-sm: 0 1px 2px rgb(16 24 40 / .07);--shadow-md: 0 2px 6px rgb(16 24 40 / .07), 0 12px 28px rgb(16 24 40 / .09);--shadow-lg: 0 4px 12px rgb(16 24 40 / .09), 0 24px 56px rgb(16 24 40 / .13);--shadow-highlight: inset 0 1px 0 rgb(255 255 255 / .6);--focus-ring-shadow: 0 0 0 3px rgb(84 87 214 / .22)}*{box-sizing:border-box}body{margin:0;font-family:var(--font-family);font-size:var(--font-size-base);line-height:var(--line-height-base);background:var(--gradient-app),var(--color-bg);background-attachment:fixed;color:var(--color-text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;transition:background var(--duration-base) var(--easing-standard),color var(--duration-base) var(--easing-standard)}::selection{background:var(--color-selection)}*{scrollbar-width:thin;scrollbar-color:var(--color-border-strong) transparent}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-border-strong);border-radius:var(--radius-pill);border:3px solid transparent;background-clip:padding-box}::-webkit-scrollbar-thumb:hover{background:var(--color-text-faint);background-clip:padding-box}:focus-visible{outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes rise-in{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-delay:0ms!important}}.icon{display:block;flex-shrink:0}button,.btn{cursor:pointer;font:inherit;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);padding:var(--space-2) var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-raised);box-shadow:var(--shadow-highlight);color:var(--color-text);transition:background var(--duration-fast) var(--easing-standard),border-color var(--duration-fast) var(--easing-standard),transform var(--duration-fast) var(--easing-standard),filter var(--duration-fast) var(--easing-standard)}button:hover{background:var(--color-surface-hover);border-color:var(--color-border-strong)}button:active{transform:scale(.98)}button:disabled{opacity:.45;cursor:not-allowed;transform:none}button.small,.btn.small{padding:var(--space-1) var(--space-3);font-size:var(--font-size-sm);border-radius:var(--radius-sm)}button[type=submit],.btn-primary{background:var(--gradient-accent);border-color:transparent;color:var(--color-accent-contrast);font-weight:var(--font-weight-semibold);box-shadow:var(--shadow-sm),var(--shadow-highlight)}button[type=submit]:hover,.btn-primary:hover{background:var(--gradient-accent);border-color:transparent;filter:brightness(1.1)}.btn-ghost{background:transparent;border-color:transparent;box-shadow:none}.btn-ghost:hover{background:var(--color-surface-hover);border-color:transparent}.btn-danger{color:var(--color-danger)}.btn-danger:hover{background:var(--color-danger-soft);border-color:var(--color-danger)}.icon-btn{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;border:none;background:transparent;box-shadow:none;padding:0;border-radius:var(--radius-sm);color:var(--color-text-faint)}.icon-btn:hover{background:var(--color-surface-hover);border-color:transparent;color:var(--color-text)}.icon-btn.danger:hover{background:var(--color-danger-soft);color:var(--color-danger)}input,textarea,select{width:100%;font:inherit;font-size:var(--font-size-base);padding:var(--space-2) var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);transition:border-color var(--duration-fast) var(--easing-standard),box-shadow var(--duration-fast) var(--easing-standard),background var(--duration-fast) var(--easing-standard)}input:hover,textarea:hover,select:hover{border-color:var(--color-border-strong)}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--color-accent);box-shadow:var(--focus-ring-shadow)}input::placeholder,textarea::placeholder{color:var(--color-text-faint)}input[type=checkbox]{width:17px;height:17px;accent-color:var(--color-accent-fill);cursor:pointer}.layout{display:flex;height:100vh}.main{flex:1;padding:var(--space-7) var(--space-6) var(--space-6);overflow-y:auto;display:flex;flex-direction:column}.main>*{width:100%;max-width:var(--content-width);margin-inline:auto}.main.view-chat>*{max-width:var(--chat-width)}.main h2{margin:0 0 var(--space-5);font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);letter-spacing:-.01em;display:flex;align-items:center;gap:var(--space-3)}.main h2:not(:first-child){margin-top:var(--space-7)}.h2-icon{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-md);background:var(--gradient-surface);border:1px solid var(--color-border);box-shadow:var(--shadow-highlight);color:var(--color-accent)}.hint{color:var(--color-text-muted);font-size:var(--font-size-sm);line-height:var(--line-height-base)}.empty{color:var(--color-text-muted);padding:var(--space-5) 0}.empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-2);padding:var(--space-8) var(--space-5);animation:fade-in var(--duration-base) var(--easing-standard)}.empty-icon{width:56px;height:56px;margin-bottom:var(--space-2);display:flex;align-items:center;justify-content:center;border-radius:var(--radius-pill);background:var(--gradient-surface);border:1px solid var(--color-border);box-shadow:var(--shadow-highlight);color:var(--color-text-faint)}.empty-state h3{margin:0;font-size:var(--font-size-md);font-weight:var(--font-weight-semibold)}.empty-state p{margin:0;max-width:400px;color:var(--color-text-muted);font-size:var(--font-size-sm);line-height:var(--line-height-base)}.sidebar{width:var(--sidebar-width);flex-shrink:0;background:var(--gradient-sidebar),var(--color-sidebar);border-right:1px solid var(--color-border);padding:var(--space-5) var(--space-3) var(--space-4);display:flex;flex-direction:column;gap:var(--space-4);overflow-y:auto}.brand{display:flex;align-items:center;gap:var(--space-3);padding:0 var(--space-2)}.brand-mark{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);background:var(--gradient-accent);color:var(--color-accent-contrast);box-shadow:var(--shadow-md),var(--shadow-highlight)}.brand-text{display:flex;flex-direction:column;line-height:var(--line-height-tight)}.brand-name{font-weight:var(--font-weight-semibold);font-size:var(--font-size-read);letter-spacing:-.01em}.brand-sub{font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-label);text-transform:uppercase;color:var(--color-text-faint);margin-top:2px}.nav{display:flex;flex-direction:column;gap:2px}.nav-item{display:flex;align-items:center;gap:var(--space-3);text-align:left;border:1px solid transparent;background:transparent;box-shadow:none;border-radius:var(--radius-pill);padding:var(--space-2) var(--space-3);color:var(--color-text-muted);font-weight:var(--font-weight-medium)}.nav-item .icon{color:var(--color-text-faint);transition:color var(--duration-fast) var(--easing-standard)}.nav-item:hover{background:var(--color-surface-hover);border-color:transparent;color:var(--color-text)}.nav-item:hover .icon{color:var(--color-text-muted)}.nav-item.active{background:var(--color-surface-raised);border-color:var(--color-border);box-shadow:var(--shadow-highlight);color:var(--color-text);font-weight:var(--font-weight-semibold)}.nav-item.active .icon{color:var(--color-accent)}.chat-list-head{display:flex;justify-content:space-between;align-items:center;padding:0 var(--space-2);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:var(--letter-spacing-label);text-transform:uppercase;color:var(--color-text-faint)}.chat-list-head button{display:inline-flex;align-items:center;gap:var(--space-1);letter-spacing:normal;text-transform:none}.chat-list{display:flex;flex-direction:column;gap:2px}.chat-item{display:flex;gap:2px;align-items:center;border-radius:var(--radius-md);padding:2px;border:1px solid transparent;transition:background var(--duration-fast) var(--easing-standard)}.chat-item:hover{background:var(--color-surface-hover)}.chat-item.active{background:var(--color-surface-raised);border-color:var(--color-border)}.chat-open{flex:1;text-align:left;border:none;background:transparent;box-shadow:none;padding:var(--space-1) var(--space-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--color-text-muted);font-weight:var(--font-weight-normal)}.chat-item.active .chat-open{color:var(--color-text);font-weight:var(--font-weight-medium)}.chat-open:hover{background:transparent;border-color:transparent}.chat-item .icon-btn{opacity:0;transition:opacity var(--duration-fast) var(--easing-standard)}.chat-item:hover .icon-btn,.chat-item:focus-within .icon-btn{opacity:1}.mode-badge{display:flex;align-items:center;gap:var(--space-2);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);border:1px solid var(--color-border)}.mode-badge:before{content:"";width:7px;height:7px;border-radius:var(--radius-pill);background:currentColor;flex-shrink:0}.mode-badge.demo{background:var(--color-warning-soft);color:var(--color-warning-text);border-color:transparent}.mode-badge.ok{background:var(--color-success-soft);color:var(--color-success-text);border-color:transparent}.demo-tag{background:var(--color-warning-soft);color:var(--color-warning-text);border-radius:var(--radius-sm);padding:1px var(--space-1);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);letter-spacing:normal;text-transform:none}.status-dot{display:inline-block;width:8px;height:8px;border-radius:var(--radius-pill);background:var(--color-text-faint);margin-right:var(--space-2);vertical-align:1px}.status-dot.on{background:var(--color-success);box-shadow:0 0 0 3px var(--color-success-soft)}.card{background:var(--gradient-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm),var(--shadow-highlight);padding:var(--space-4);margin-bottom:var(--space-3);display:flex;flex-direction:column;gap:var(--space-3);animation:fade-in var(--duration-base) var(--easing-standard);transition:border-color var(--duration-fast) var(--easing-standard)}.card.row{flex-direction:row;align-items:center;padding:var(--space-3) var(--space-4)}.card.grid{gap:var(--space-4)}.card.grid label{display:flex;flex-direction:column;gap:var(--space-2);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-muted)}.card-title{font-weight:var(--font-weight-semibold);font-size:var(--font-size-read)}.card-body{white-space:pre-wrap;font-size:var(--font-size-base);line-height:var(--line-height-base);color:var(--color-text-muted)}.card-actions{display:flex;gap:var(--space-2);flex-wrap:wrap}.list{margin-top:var(--space-2)}.list .card:hover{border-color:var(--color-border-strong)}.task-label{display:flex;gap:var(--space-3);align-items:center;flex:1;cursor:pointer}.done{text-decoration:line-through;color:var(--color-text-faint)}.prompt-preview{width:100%;font-family:var(--font-family-mono);font-size:var(--font-size-sm);line-height:var(--line-height-base);white-space:pre-wrap;word-break:break-word;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);max-height:320px;overflow-y:auto;color:var(--color-text-muted)}.theme-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}.theme-toggle{display:inline-flex;align-items:center;gap:var(--space-2)}.chat-head{display:flex;gap:var(--space-3);align-items:center;flex-wrap:wrap;padding-bottom:var(--space-4);border-bottom:1px solid var(--color-border)}.chat-title{font-weight:var(--font-weight-semibold);font-size:var(--font-size-md);letter-spacing:-.01em}.server-select{display:flex;gap:var(--space-2);align-items:center;margin-left:auto;font-size:var(--font-size-sm);color:var(--color-text-muted)}.server-select select{width:auto;padding:var(--space-1) var(--space-2);font-size:var(--font-size-sm);border-radius:var(--radius-sm)}.messages{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--space-6);padding:var(--space-6) var(--space-1)}.messages .empty-state{margin:auto}.msg{animation:rise-in .24s var(--easing-standard)}.msg.user{background:var(--gradient-surface);background-color:var(--color-user-panel);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-highlight);padding:var(--space-3) var(--space-4)}.msg.assistant{padding:0 var(--space-1)}.msg-role{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:var(--letter-spacing-label);text-transform:uppercase;color:var(--color-text-faint);margin-bottom:var(--space-2);display:flex;align-items:center;gap:var(--space-2)}.msg.assistant .msg-role:before{content:"";width:7px;height:7px;border-radius:var(--radius-pill);background:var(--gradient-accent)}.msg-body{white-space:pre-wrap;font-size:var(--font-size-read);line-height:var(--line-height-relaxed)}.msg.user .msg-role{margin-bottom:var(--space-1)}.msg-body code{font-family:var(--font-family-mono);font-size:var(--font-size-sm);background:var(--color-surface-hover);padding:1px var(--space-1);border-radius:var(--radius-sm)}.composer{display:flex;gap:var(--space-2);align-items:flex-end;margin-top:var(--space-3);padding:var(--space-2);background:var(--color-composer);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg),var(--shadow-highlight);transition:border-color var(--duration-fast) var(--easing-standard),box-shadow var(--duration-fast) var(--easing-standard)}.composer:focus-within{border-color:var(--color-accent);box-shadow:var(--shadow-lg),var(--focus-ring-shadow)}.composer textarea{flex:1;resize:none;max-height:180px;border:none;background:transparent;padding:var(--space-2) var(--space-3);line-height:var(--line-height-base)}.composer textarea:hover,.composer textarea:focus{border:none;box-shadow:none}.send-btn{width:38px;height:38px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;padding:0;border-radius:var(--radius-pill)}.send-btn:disabled{background:var(--color-surface-hover);color:var(--color-text-faint);filter:none}.trace{display:flex;flex-direction:column;gap:var(--space-1);margin-top:var(--space-3)}.trace-row{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);font-size:var(--font-size-sm)}.trace-row summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);color:var(--color-text-muted)}.trace-row summary::-webkit-details-marker{display:none}.trace-name{font-family:var(--font-family-mono);font-size:var(--font-size-sm);color:var(--color-text)}.trace-args{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trace-status{font-weight:var(--font-weight-semibold);flex-shrink:0}.trace-status.ok{color:var(--color-success-text)}.trace-status.ng{color:var(--color-danger)}.trace-status.wait{color:var(--color-warning-text)}.trace-dur{color:var(--color-text-faint);flex-shrink:0}.trace-detail{padding:0 var(--space-3) var(--space-2);color:var(--color-text-muted);white-space:pre-wrap;word-break:break-word}.trace-note{font-size:var(--font-size-sm);color:var(--color-text-muted);padding:var(--space-1) var(--space-2)}.trace-note.error{color:var(--color-danger)}.approval-card{border:1px solid var(--color-border-strong);background:var(--color-warning-soft);border-radius:var(--radius-lg);padding:var(--space-4);margin-top:var(--space-3);display:flex;flex-direction:column;gap:var(--space-2);animation:rise-in .24s var(--easing-standard)}.approval-title{font-weight:var(--font-weight-semibold)}.approval-body{font-size:var(--font-size-sm);line-height:var(--line-height-base)}.widget-card{border:1px solid var(--color-border);background:var(--gradient-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm),var(--shadow-highlight);padding:var(--space-4)}.widget-card-title{font-weight:var(--font-weight-semibold);margin-bottom:var(--space-2);display:flex;align-items:center;gap:var(--space-2)}.widget-card-title:before{content:"";width:7px;height:7px;border-radius:var(--radius-pill);background:var(--gradient-accent)}.widget-card-body{white-space:pre-wrap;font-size:var(--font-size-base);line-height:var(--line-height-base)}.live-status{display:flex;align-items:center;gap:var(--space-2);margin-top:var(--space-2);font-size:var(--font-size-sm);color:var(--color-text-faint)}.live-dot{width:7px;height:7px;border-radius:var(--radius-pill);background:var(--color-accent);animation:live-pulse 1.2s ease-in-out infinite}@keyframes live-pulse{0%,to{opacity:.35}50%{opacity:1}}.check-label{flex-direction:row!important;align-items:flex-start;gap:var(--space-2)!important;cursor:pointer}.check-label input[type=checkbox]{margin-top:2px;flex-shrink:0}.check-label span{color:var(--color-text);font-size:var(--font-size-base);font-weight:var(--font-weight-normal)}.view-search{margin-bottom:var(--space-3)}.meta-line{font-size:var(--font-size-sm);color:var(--color-text-faint)}.row-line{display:flex;align-items:center;gap:var(--space-2);justify-content:space-between}.pin-mark{display:inline-flex;vertical-align:-2px;margin-right:var(--space-1);color:var(--color-accent)}.expand summary{cursor:pointer;font-size:var(--font-size-sm);color:var(--color-text-muted)}.expand summary:hover{color:var(--color-text)}.expand .card-body,.expand .meta-line{margin-top:var(--space-2)}.warn-card{border-color:var(--color-warning-text);background:var(--color-warning-soft)}@media (max-width: 760px){.layout{flex-direction:column;height:auto;min-height:100vh}.sidebar{width:100%;border-right:none;border-bottom:1px solid var(--color-border);overflow:visible;padding:var(--space-4) var(--space-3)}.nav{flex-direction:row;flex-wrap:wrap}.main{overflow:visible;padding:var(--space-5) var(--space-4)}.messages{overflow:visible;padding:var(--space-5) 0}.chat-list{max-height:40vh;overflow-y:auto}.chat-item .icon-btn{opacity:1}.server-select{margin-left:0}}