:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;color:#172033;background:#f4f7fb;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;background:#f4f7fb}button{font:inherit}.shell{width:min(100%,720px);margin:0 auto;padding:calc(18px + env(safe-area-inset-top)) 16px calc(24px + env(safe-area-inset-bottom));min-height:100dvh}.topbar{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.eyebrow{margin:0 0 5px;color:#65728a;font-size:12px;letter-spacing:.04em}h1{margin:0;font-size:25px;letter-spacing:0;line-height:1.2}.connection{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border:1px solid #d9e0ea;border-radius:999px;background:#fff;color:#3b4a61;font-size:13px;white-space:nowrap}.connection.online{color:#17734b;border-color:#b9e4cf}.connection.offline{color:#a13d3d;border-color:#efc2c2}.connection.syncing{color:#6b7280}.spin{animation:spin 1.2s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.offline-banner{display:flex;gap:8px;align-items:center;margin-top:14px;padding:10px 12px;border-radius:8px;color:#8d3939;background:#fff1f1;border:1px solid #f2d0d0;font-size:13px}.sync-meta{display:flex;justify-content:space-between;align-items:center;margin:19px 2px 12px;color:#65728a;font-size:12px}.sync-meta span{display:inline-flex;align-items:center;gap:5px}.server-mark{color:#8792a6}.indicators{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:8px 0 20px}.indicator-wrap{min-width:0;border:0;background:transparent;color:inherit;padding:0;cursor:pointer;text-align:center}.indicator-light{position:relative;isolation:isolate;width:86px;height:86px;margin:0 auto 9px;border-radius:50%;display:grid;place-items:center;border:1px solid currentColor;background:color-mix(in srgb,currentColor 5%,#fff);transition:box-shadow .28s ease,border-color .28s ease,background-color .28s ease}.indicator-light>svg,.indicator-light>.badge{position:relative;z-index:2}.indicator-wrap.error{color:#c75454}.indicator-wrap.running{color:#2e9d71}.indicator-wrap.succeeded{color:#3976c7}.badge{position:absolute;right:-4px;top:-4px;min-width:25px;height:25px;padding:0 6px;border-radius:14px;display:grid;place-items:center;color:#fff;font-size:12px;line-height:1;box-shadow:0 0 0 3px #f4f7fb}.indicator-wrap.error .badge{background:#c75454}.indicator-wrap.running .badge{background:#2e9d71}.indicator-wrap.succeeded .badge{background:#3976c7}.indicator-label{display:block;font-size:15px;font-weight:700}.indicator-detail{display:block;margin-top:3px;color:#78849a;font-size:11px;line-height:1.3}@keyframes breathe{0%,to{opacity:.12;transform:scale(1.01)}50%{opacity:.52;transform:scale(1.18)}}@keyframes liveIcon{0%,to{opacity:.78}50%{opacity:1}}.demo-bar{display:flex;align-items:center;gap:8px;padding:10px 11px;margin-bottom:16px;border:1px dashed #e4b86c;border-radius:8px;background:#fff9ec;color:#865e1e;font-size:13px}.demo-bar span{display:inline-flex;align-items:center;gap:5px;font-weight:700}.demo-bar button{min-height:36px;display:inline-flex;align-items:center;gap:5px;padding:0 9px;border:1px solid #e2bf7d;border-radius:6px;background:#fff;color:#765018;cursor:pointer}.demo-bar small{color:#a87e3a;margin-left:auto}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 2px 9px}.section-heading>div{display:flex;align-items:baseline;gap:8px;min-width:0}.section-heading h2{margin:0;font-size:18px}.section-heading span{color:#78849a;font-size:13px;white-space:nowrap}.select-mode-button{min-width:76px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid #d8e0eb;border-radius:7px;background:#fff;color:#43526a;cursor:pointer;transition:background .18s ease,border-color .18s ease,color .18s ease}.select-mode-button.active{border-color:#aebdd1;background:#eef3f9;color:#244a77}.selection-bar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;margin:0 0 10px;padding:8px;border:1px solid #dce4ee;border-radius:8px;background:#edf3f9;color:#56657a;animation:reveal .2s ease-out}.selection-bar button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 10px;border:1px solid #d4dee9;border-radius:7px;background:#fff;color:#40516a;cursor:pointer}.selection-bar span{min-width:0;font-size:12px;text-align:center}.selection-bar .hide-button{border-color:#e2bcbc;color:#a34646}.selection-bar button:disabled{opacity:.5;cursor:wait}.task-list{display:grid;gap:9px}.task-row{position:relative;display:flex;min-height:76px;border:1px solid #dfe5ee;border-radius:8px;background:#fff;overflow:hidden;animation:reveal .24s ease-out both;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}.task-row:hover{border-color:#cbd5e2;box-shadow:0 5px 16px #253a5610}.task-row.alert-active{border-left:4px solid currentColor}.task-row.error{color:#a64949}.task-row.running{color:#237a59}.task-row.succeeded{color:#2f65ac}@keyframes reveal{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.task-main{display:flex;align-items:center;min-width:0;flex:1;gap:10px;padding:12px;border:0;background:transparent;text-align:left;cursor:pointer;color:inherit}.task-icon{flex:0 0 auto;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:color-mix(in srgb,currentColor 11%,transparent)}.task-copy{min-width:0;flex:1}.task-copy strong{display:block;overflow:hidden;color:#172033;text-overflow:ellipsis;white-space:nowrap;font-size:15px}.task-meta{display:flex;flex-wrap:wrap;gap:7px;margin-top:4px;color:#78849a;font-size:11px}.task-meta em{font-style:normal;color:currentColor;font-weight:700}.error-summary{display:block;overflow:hidden;margin-top:5px;color:#9c4e4e;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.chevron{flex:0 0 auto;color:#9ba6b7}.demo-actions{display:flex;gap:3px;align-items:center;padding-right:8px}.demo-actions button,.icon-button{width:40px;height:40px;display:grid;place-items:center;border:1px solid #dfe5ee;border-radius:6px;background:#fff;color:inherit;cursor:pointer}.demo-actions button:first-child{color:#237a59}.demo-actions button:last-child{color:#a64949}.row-selector{flex:0 0 48px;width:48px;min-height:76px;display:grid;place-items:center;border:0;border-right:1px solid #e5eaf1;background:#f8fafc;color:#50647f;cursor:pointer}.pagination{display:flex;justify-content:center;gap:6px;margin:15px 0 2px}.pagination button{flex:0 0 44px;width:44px;height:44px;display:grid;place-items:center;border:1px solid #d8e0ea;border-radius:7px;background:#fff;color:#46556b;cursor:pointer;transition:background .16s ease,color .16s ease,border-color .16s ease,box-shadow .16s ease}.pagination button.current{border-color:#4779b5;background:#eaf2fc;color:#225a9d;font-weight:800;box-shadow:inset 0 0 0 1px #77a0d1}.pagination button:disabled{opacity:.36;cursor:default}.no-tasks{display:grid;place-items:center;gap:6px;min-height:155px;border:1px dashed #ccd5e2;border-radius:8px;color:#718096}.no-tasks p{margin:0;font-size:14px}.bottom-space{height:80px}.bottom-action{position:fixed;z-index:5;bottom:0;left:50%;width:min(100%,720px);padding:10px 16px calc(10px + env(safe-area-inset-bottom));transform:translate(-50%);background:color-mix(in srgb,#f4f7fb 92%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.reset-button{width:100%;min-height:48px;display:flex;justify-content:center;align-items:center;gap:8px;border:0;border-radius:8px;background:#1f5ea8;color:#fff;font-weight:700;cursor:pointer;box-shadow:0 5px 18px #234a7626}.reset-button:disabled{opacity:.55;cursor:wait}.feedback{display:block;margin-top:6px;text-align:center;color:#357255;font-size:12px}.empty-state{display:grid;place-content:center;justify-items:center;min-height:100dvh;text-align:center}.empty-state h1{margin-top:12px}.empty-state p{margin:9px 0 0;color:#536176}.muted{color:#8290a5!important;font-size:13px}.modal-backdrop{position:fixed;inset:0;z-index:10;display:flex;align-items:flex-end;justify-content:center;background:#17203366}.details-panel{width:min(100%,720px);max-height:min(88dvh,700px);overflow:auto;padding:20px 16px calc(24px + env(safe-area-inset-bottom));border-radius:15px 15px 0 0;background:#fff;box-shadow:0 -10px 30px #17203330}.details-head{display:flex;justify-content:space-between;gap:12px}.details-head h2{margin:9px 0 0;color:#172033;font-size:20px}.pill{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:99px;font-size:12px;font-weight:700}.pill.error{color:#9a4040;background:#fff0f0}.pill.running{color:#176d4a;background:#eaf8f1}.pill.succeeded{color:#2e62a9;background:#edf4ff}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;margin:21px 0}.detail-grid div.wide{grid-column:1 / -1}.detail-grid dt{color:#7b8799;font-size:11px}.detail-grid dd{overflow-wrap:anywhere;margin:4px 0 0;color:#253047;font-size:13px}.details-panel h3{margin:22px 0 8px;font-size:15px}.event-log{display:grid;gap:7px}.event-line{display:grid;grid-template-columns:1fr auto;gap:4px 8px;padding:8px 10px;border-radius:6px;background:#f4f7fb;color:#45536b;font-size:12px}.event-line time{color:#7d8a9f}.event-line small{grid-column:1 / -1;color:#a36f36}.privacy-note{display:flex;align-items:center;gap:5px;margin:18px 0 0;color:#7b8799;font-size:11px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}@media(max-width:380px){.shell{padding-left:12px;padding-right:12px}.indicator-light{width:76px;height:76px}.indicator-detail{font-size:10px}.demo-bar small{display:none}}@media(max-width:360px){h1{font-size:22px}}.indicator-wrap.is-selected .indicator-light{border-width:3px;box-shadow:0 0 0 5px color-mix(in srgb,currentColor 14%,transparent)}.indicator-wrap.is-selected .indicator-label{text-decoration:underline;text-underline-offset:4px}.indicator-wrap.is-live .indicator-light{border-width:2px;background:color-mix(in srgb,currentColor 10%,#fff);box-shadow:0 0 18px color-mix(in srgb,currentColor 27%,transparent)}.indicator-wrap.is-live .indicator-light:after,.indicator-wrap.is-live .indicator-light:before{content:"";display:block;position:absolute;z-index:0;inset:0;border:2px solid currentColor;border-radius:50%;opacity:.2;animation:breathe 2s cubic-bezier(.4,0,.2,1) infinite;box-shadow:0 0 12px currentColor,0 0 25px color-mix(in srgb,currentColor 60%,transparent)}.indicator-wrap.is-live .indicator-light:before{animation-delay:-1s}.indicator-wrap.is-live .indicator-light>svg{animation:liveIcon 2s ease-in-out infinite}.indicator-wrap:not(.is-live) .indicator-light{opacity:.88}.demo-actions button,.icon-button{width:44px;height:44px}.demo-bar button{min-height:44px}@media(prefers-reduced-motion:reduce){.indicator-wrap.is-live .indicator-light{box-shadow:0 0 0 4px color-mix(in srgb,currentColor 76%,transparent),0 0 0 8px color-mix(in srgb,currentColor 20%,transparent)}.indicator-wrap.is-live .indicator-light:before,.indicator-wrap.is-live .indicator-light:after{animation:none!important;opacity:.24;transform:scale(1.1)}.indicator-wrap.is-live .indicator-light>svg{animation:none!important;opacity:1}}@media(max-width:430px){.selection-bar{grid-template-columns:1fr 1fr}.selection-bar span{grid-column:1 / -1;grid-row:2;padding:2px 0}.selection-bar .hide-button{grid-column:2;grid-row:1}}@media(max-width:340px){.pagination{gap:4px}.pagination button{flex-basis:42px;width:42px;height:44px}}
