:root{--bg: #f3ecdf;--panel: rgba(255, 251, 245, .92);--panel-strong: #fffdf9;--line: rgba(34, 32, 28, .1);--line-strong: rgba(34, 32, 28, .18);--text: #1f1a16;--muted: #6a6156;--accent: #cb5a2b;--accent-deep: #7f2419;--accent-soft: rgba(203, 90, 43, .14);--ok: #176d48;--warn: #9a6a12;--fail: #ad3027;--ink: #113247;--shadow: 0 18px 50px rgba(74, 52, 31, .12);--radius-xl: 28px;--radius-lg: 20px;--radius-md: 14px;--mono: "SF Mono", "JetBrains Mono", "Fira Code", "Source Code Pro", monospace;--sans: "Avenir Next", "PingFang SC", "Hiragino Sans GB", "Noto Sans CJK SC", "Microsoft YaHei", sans-serif;--serif: "Iowan Old Style", "Songti SC", "STSong", serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;color:var(--text);background:radial-gradient(circle at top left,rgba(203,90,43,.22),transparent 30%),radial-gradient(circle at 85% 12%,rgba(18,91,109,.16),transparent 24%),linear-gradient(155deg,#f7f1e8,#ede3d3 55%,#faf7f0);font-family:var(--sans)}body:before,body:after{content:"";position:fixed;pointer-events:none;z-index:0;border-radius:999px;filter:blur(10px)}body:before{width:340px;height:340px;right:-80px;bottom:8%;background:#cb5a2b14}body:after{width:220px;height:220px;left:-60px;top:20%;background:#11324714}.app-shell{position:relative;z-index:1;display:grid;grid-template-columns:290px minmax(0,1fr);gap:22px;min-height:100vh;padding:22px}.sidebar,.panel,.hero-panel{background:var(--panel);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.55);box-shadow:var(--shadow)}.sidebar{position:sticky;top:22px;height:calc(100vh - 44px);border-radius:var(--radius-xl);padding:24px 18px;display:flex;flex-direction:column;gap:18px;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}.brand{padding:4px 6px 18px;border-bottom:1px solid var(--line)}.brand-kicker{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:var(--accent-soft);color:var(--accent-deep);font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.brand h1{margin:16px 0 8px;font-size:32px;line-height:1;letter-spacing:-.04em;font-family:var(--serif)}.brand p{margin:0;color:var(--muted);line-height:1.7;font-size:14px}.nav{display:grid;gap:10px}.nav-button{all:unset;cursor:pointer;padding:14px 16px;border-radius:16px;background:#ffffff7a;border:1px solid transparent;transition:transform .18s ease,background .18s ease,border-color .18s ease}.nav-button:hover,.nav-button.active{transform:translate(4px);background:linear-gradient(135deg,#cb5a2b29,#11324714);border-color:#cb5a2b38}.nav-title{display:block;margin-bottom:5px;font-size:15px;font-weight:700}.nav-desc{display:block;color:var(--muted);font-size:12px;line-height:1.4}.status-strip{margin-top:auto;background:#22201c0a;border:1px solid var(--line);border-radius:18px;padding:14px}.status-strip h2{margin:0 0 10px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.status-row{display:flex;align-items:center;gap:8px}.status-dot{width:10px;height:10px;border-radius:999px;background:var(--warn);box-shadow:0 0 0 7px #9a6a121a}.status-strip.ok .status-dot{background:var(--ok);box-shadow:0 0 0 7px #176d481a}.status-strip.fail .status-dot{background:var(--fail);box-shadow:0 0 0 7px #ad30271f}.status-label{font-size:14px;font-weight:700}.status-meta{margin-top:6px;color:var(--muted);font-size:12px;line-height:1.5}.status-stack{margin-top:12px;display:grid;gap:10px}.status-block{display:grid;gap:8px;padding-top:10px;border-top:1px solid var(--line)}.status-block-title{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.status-kv{display:grid;gap:4px}.status-kv-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.status-k{font-size:11px;color:var(--muted);text-transform:lowercase}.status-copy{border:1px solid var(--line);background:#ffffffad;color:var(--muted);border-radius:999px;padding:4px 9px;font-size:11px;line-height:1;cursor:pointer;transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease}.status-copy:hover{transform:translateY(-1px);border-color:#cb5a2b38;color:var(--accent-deep)}.status-copy.copied{border-color:#176d4838;background:#176d4814;color:var(--ok)}.status-v{display:block;padding:8px 10px;border-radius:10px;border:1px solid var(--line);background:#ffffff85;white-space:normal;word-break:break-all;color:var(--ink);font-size:11px;line-height:1.45}.main{display:grid;gap:22px}.hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:22px}.hero-panel,.panel{border-radius:var(--radius-xl);padding:24px}.hero-panel h2{margin:0;font-size:29px;letter-spacing:-.04em;font-family:var(--serif)}.panel-title h3{margin:0;font-size:22px;letter-spacing:-.03em}.hero-intro,.panel-title p,.card-meta,.inline-meta,.muted{color:var(--muted)}.hero-intro{margin:12px 0 0;max-width:72ch;font-size:14px;line-height:1.7}.toolbar,.hero-actions,.pill-row,.chips{display:flex;flex-wrap:wrap;gap:10px}.hero-actions{margin-top:20px}.metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}.metric-card,.detail-box,.list-card,.directory-card,.download-row,.mini-stat,.form-card,.empty-state{border:1px solid var(--line);background:#ffffff9e;border-radius:18px}.metric-card{padding:16px}.metric-label,.mini-stat-label{font-size:11px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}.metric-value,.mini-stat-value{margin-top:10px;font-size:30px;line-height:1;font-weight:800;letter-spacing:-.05em}.section-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.layout-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:22px}.span-5{grid-column:span 5}.span-4{grid-column:span 4}.span-6{grid-column:span 6}.span-7{grid-column:span 7}.span-8{grid-column:span 8}.span-12{grid-column:span 12}.form-grid,.detail-shell,.list,.directory-list,.download-list,.filter-stack,.builder-grid{display:grid;gap:14px}.builder-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field{display:grid;gap:8px}.field.full{grid-column:1 / -1}.field label{font-size:12px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}input,textarea,select,button{font:inherit}input,textarea,select{width:100%;padding:14px 15px;border-radius:16px;border:1px solid var(--line);background:#ffffffc7;color:var(--text);outline:none;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;font-family:var(--mono);font-size:14px;line-height:1.6}textarea{min-height:150px;resize:vertical}input:focus,textarea:focus,select:focus{border-color:#cb5a2b66;box-shadow:0 0 0 5px #cb5a2b1a;transform:translateY(-1px)}.button,.pill-button,.link-button{border-radius:999px;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease}.button{border:none;padding:12px 18px;background:linear-gradient(135deg,var(--accent),var(--accent-deep));color:#fff7f3;font-weight:700;box-shadow:0 12px 28px #7f241933}.button:hover,.pill-button:hover,.link-button:hover{transform:translateY(-1px)}.button.secondary{background:#ffffffbd;color:var(--text);border:1px solid var(--line);box-shadow:none}.button.ghost{background:transparent;color:var(--muted);border:1px dashed var(--line-strong);box-shadow:none}.button:disabled{cursor:not-allowed;opacity:.55;transform:none}.pill-button{border:1px solid var(--line);background:#ffffffb3;padding:8px 12px;font-size:12px;color:var(--text)}.pill-button.active{border-color:#cb5a2b4d;background:linear-gradient(135deg,#cb5a2b24,#ffffffeb);color:var(--accent-deep)}.detail-box,.form-card{padding:18px}.detail-box h4,.form-card h4{margin:0 0 12px;font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.detail-box pre,.json-block{margin:0;white-space:pre-wrap;word-break:break-word;font-size:12px;line-height:1.6;font-family:var(--mono)}.guide-card{gap:14px}.guide-intro{margin:0;color:var(--muted);font-size:13px;line-height:1.7}.guide-intro code,.guide-row-head code{font-family:var(--mono);font-size:12px}.guide-disclosure-list{display:grid;gap:10px}.guide-disclosure{border:1px solid var(--line);border-radius:16px;background:#ffffff8f;overflow:hidden}.guide-disclosure summary{cursor:pointer;list-style:none;padding:12px 14px;font-size:13px;font-weight:800;color:var(--text)}.guide-disclosure summary::-webkit-details-marker{display:none}.guide-disclosure[open] summary{border-bottom:1px solid var(--line);background:#cb5a2b14}.guide-rows{display:grid;gap:10px;padding:12px 14px 14px}.guide-row{display:grid;gap:4px}.guide-row+.guide-row{padding-top:10px;border-top:1px dashed var(--line)}.guide-row-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.guide-row-meta,.guide-row-desc,.guide-example-title{color:var(--muted)}.guide-row-meta{font-size:11px;font-family:var(--mono)}.guide-row-desc{font-size:12px;line-height:1.6}.guide-example{display:grid;gap:8px;padding-top:4px}.guide-example-title{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.list-card,.directory-card{padding:16px 18px;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease}.list-card:hover,.directory-card:hover{transform:translateY(-1px);border-color:#cb5a2b3d;background:#ffffffdb}.list-card.active,.directory-card.active{border-color:#cb5a2b52;background:linear-gradient(135deg,#cb5a2b1a,#ffffffe0)}.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.card-title{margin:0;font-size:15px;line-height:1.5;font-weight:700}.card-meta,.inline-meta{font-size:12px;line-height:1.6}.inline-meta{margin-top:8px}.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#22201c0f;color:var(--text);font-size:12px;font-weight:700}.chip.ok{background:#176d481a;color:var(--ok)}.chip.warn{background:#9a6a121f;color:var(--warn)}.chip.fail{background:#ad30271f;color:var(--fail)}.chip.soft{background:#11324714;color:var(--ink)}.checkbox-line{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;background:#ffffffb3;border:1px solid var(--line);font-size:13px}.checkbox-line input{width:auto;margin:0}.split-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.schedule-guide-card{grid-column:1 / -1;background:linear-gradient(135deg,#cb5a2b14,#1132470f);border:1px solid rgba(203,90,43,.16)}.stats-inline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}.mini-stat{padding:12px 14px}.download-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px}.selector-row{width:100%;text-align:left;color:inherit}button.selector-row{border:1px solid var(--line);background:#ffffff9e}.selector-row.active,button.selector-row.active{border-color:#cb5a2b52;background:linear-gradient(135deg,#cb5a2b1a,#ffffffe0)}.download-meta{min-width:0}.site-selector-button{all:unset;min-width:0;flex:1;cursor:pointer}.download-name{font-size:13px;font-weight:700;line-height:1.5;word-break:break-word}.download-sub{margin-top:4px;color:var(--muted);font-size:11px;line-height:1.5;word-break:break-word}.link-button{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);background:#ffffffc7;color:var(--text);padding:9px 14px;text-decoration:none;font-size:12px;font-weight:700}.empty-state{padding:20px;border-style:dashed;color:var(--muted);line-height:1.7}.trace-list{display:grid;gap:14px}.trace-card{border:1px solid var(--line);background:#ffffff9e;border-radius:18px;padding:16px 18px}.trace-actions{margin-top:12px}.builder-output,.builder-result-grid{margin-top:14px}.observability-hero{background:linear-gradient(145deg,#1132470f,#cb5a2b14),#ffffffa8}.observability-stat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}.observability-kpi-grid{margin-top:0}.observability-stat{padding:14px 16px;border-radius:16px;border:1px solid var(--line);background:#ffffffc7}.observability-stat.soft{background:linear-gradient(180deg,#1132470d,#ffffffd6)}.observability-stat.ok{background:linear-gradient(180deg,#176d4814,#ffffffd6)}.observability-stat.warn{background:linear-gradient(180deg,#9a6a1214,#ffffffd6)}.observability-stat-label{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.observability-stat-value{margin-top:10px;font-size:32px;line-height:1;font-weight:800;letter-spacing:-.05em}.observability-stat-meta{margin-top:8px;color:var(--muted);font-size:12px;line-height:1.5}.observability-grid{align-items:start}.observability-breakdown{display:grid;gap:12px}.observability-breakdown-row{display:grid;gap:8px}.observability-breakdown-head{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px}.observability-breakdown-track{height:10px;border-radius:999px;background:#22201c14;overflow:hidden}.observability-breakdown-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--ink))}.trend-card{display:grid;gap:10px}.trend-bars{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:end;gap:8px;min-height:160px;padding:14px 10px 10px;border-radius:16px;background:linear-gradient(to top,rgba(34,32,28,.04) 1px,transparent 1px),linear-gradient(180deg,#1132470a,#ffffffd1);background-size:100% 25%;border:1px solid var(--line)}.trend-bar{all:unset;cursor:pointer;width:100%;min-height:10px;border-radius:999px 999px 8px 8px;background:linear-gradient(180deg,#11324785,#113247f0);transition:transform .16s ease,filter .16s ease}.trend-bar:hover{transform:translateY(-2px);filter:saturate(1.2)}.trend-bar.ok{background:linear-gradient(180deg,#176d4880,#176d48f0)}.trend-bar.warn{background:linear-gradient(180deg,#9a6a127a,#9a6a12f0)}.trend-bar.soft{background:linear-gradient(180deg,#11324770,#113247e6)}.trend-axis{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--muted);font-size:11px;font-family:var(--mono)}.manifest-table{display:grid;gap:8px}.manifest-table-head,.manifest-table-row{display:grid;grid-template-columns:2.2fr .7fr .7fr .7fr .7fr .9fr;gap:10px;align-items:center}.manifest-table-head{padding:0 10px 8px;color:var(--muted);font-size:11px;letter-spacing:.08em;text-transform:uppercase}.manifest-table-row{all:unset;cursor:pointer;padding:12px 10px;border-radius:14px;border:1px solid var(--line);background:#ffffffb8;font-size:12px;line-height:1.5;transition:transform .16s ease,border-color .16s ease,background .16s ease}.manifest-table-row:hover,.manifest-table-row.active{transform:translateY(-1px);border-color:#cb5a2b3d;background:linear-gradient(135deg,#cb5a2b1a,#ffffffe6)}.site-monitor-detail-box{margin-top:14px}.completion-toast{position:fixed;right:22px;bottom:22px;z-index:20;width:min(420px,calc(100vw - 32px));border:1px solid var(--line);border-radius:18px;background:#fffbf5f5;backdrop-filter:blur(18px);box-shadow:0 24px 60px #3524162e;padding:14px 16px}.completion-toast.ok{border-color:#176d4838}.completion-toast.warn{border-color:#9a6a1238}.completion-toast.fail{border-color:#ad302738}.completion-toast-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.completion-toast-body{margin-top:8px;color:var(--muted);font-size:13px;line-height:1.6;word-break:break-word}.comparison-block{margin-top:12px}.job-detail-box,.pager-box{margin-top:14px}.directory-name{font-size:14px;font-weight:700}.directory-meta{margin-top:8px;color:var(--muted);font-size:12px;line-height:1.6}.preview-frame,.preview-image{width:100%;min-height:420px;border:1px solid var(--line);border-radius:16px;background:#ffffffd1}.preview-image{display:block;min-height:0;object-fit:contain}.mono{font-family:var(--mono)}.panel.hidden{display:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:1180px){.app-shell,.hero-grid,.layout-grid,.split-grid,.stats-inline,.metrics,.observability-stat-grid{grid-template-columns:1fr}.sidebar{position:static;height:auto}.span-5,.span-6,.span-7,.span-12{grid-column:span 1}.builder-grid{grid-template-columns:1fr}}