.zp{--ink:#0f2a33;--ink-soft:#557079;--glass:rgba(250,252,252,.74);--glass-edge:rgba(255,255,255,.7);--rule:rgba(15,42,51,.1);--chip:rgba(255,255,255,.62);--ground:#5d8442;--aqua:#00a3b5;--zenn:#6a5cff;--opera:#c74634;--simphony:#1f7f96;--ok:#21976a;--warn:#c98a12;--bad:#c94f45;--display:"Sora", "Avenir Next", "Segoe UI", sans-serif;--mono:"IBM Plex Mono", ui-monospace, Menlo, monospace}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .zp{--ink:#e7f3f5;--ink-soft:#93adb4;--glass:rgba(10,24,30,.72);--glass-edge:rgba(120,200,215,.22);--rule:rgba(231,243,245,.1);--chip:rgba(255,255,255,.06);--ground:#1c2a24;color-scheme:dark}}:root[data-theme=dark] .zp{--ink:#e7f3f5;--ink-soft:#93adb4;--glass:rgba(10,24,30,.72);--glass-edge:rgba(120,200,215,.22);--rule:rgba(231,243,245,.1);--chip:rgba(255,255,255,.06);--ground:#1c2a24;color-scheme:dark}[hidden]{display:none!important}.zp{background:var(--ground);color:var(--ink);font:400 14px/1.5 var(--display);-webkit-font-smoothing:antialiased}.zp{position:relative;height:100%;overflow:hidden}.zp #stage{position:absolute;inset:0;background:#0e1a1f}.zp #cv{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}.zp .zoom{position:absolute;left:20px;top:16px;display:flex;gap:4px;z-index:3}.zp .zoom button{min-width:34px;padding:5px 10px;background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.zp #tip{position:absolute;pointer-events:none;background:var(--glass);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);color:var(--ink);border:1px solid var(--glass-edge);border-radius:14px;padding:9px 12px;font-size:13px;box-shadow:0 10px 30px #00141e40;display:none;max-width:260px;z-index:3}.zp #tip b{font-weight:500;font-size:14.5px}.zp #notice{position:absolute;left:20px;bottom:126px;background:var(--glass);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:var(--ink);border:1px solid var(--glass-edge);border-radius:14px;padding:9px 14px;font-size:13px;z-index:3}.zp aside{position:absolute;top:16px;right:16px;bottom:16px;width:356px;display:flex;flex-direction:column;min-height:0;background:var(--glass);backdrop-filter:blur(22px) saturate(1.5);-webkit-backdrop-filter:blur(22px) saturate(1.5);border:1px solid var(--glass-edge);border-radius:24px;box-shadow:0 24px 60px #00192347;overflow:hidden;z-index:2}.zp header{padding:18px 20px 12px}.zp .brand{display:flex;justify-content:space-between;align-items:center;gap:8px;font-weight:500;font-size:15px;letter-spacing:.2px}.zp #brand-name{min-width:0;flex:1}.zp #hotel-pick{field-sizing:content;font:500 15px var(--display);color:var(--ink);background:transparent;border:0;padding:2px 18px 2px 0;max-width:100%;cursor:pointer;appearance:none;-webkit-appearance:none;text-overflow:ellipsis;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 9px) 55%,calc(100% - 4px) 55%;background-size:5px 5px;background-repeat:no-repeat}.zp #hotel-pick:focus-visible{outline:2px solid var(--aqua);outline-offset:2px;border-radius:4px}.zp #hotel-pick option{color:#0f2a33}.zp .settings-link{font-size:12px;color:var(--ink-soft);text-decoration:none;border:1px solid var(--rule);border-radius:999px;padding:2px 10px}.zp .settings-link:hover{color:var(--ink);border-color:var(--ink-soft)}.zp .live{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-soft);font-weight:400}.zp .live i{width:7px;height:7px;border-radius:50%;background:var(--aqua);box-shadow:0 0 #00a3b580;animation:ping 2s infinite}@keyframes ping{0%{box-shadow:0 0 #00a3b580}70%{box-shadow:0 0 0 8px #00a3b500}to{box-shadow:0 0 #00a3b500}}.zp .clock{display:flex;align-items:baseline;gap:12px;margin:8px 0 10px}.zp #time{font:300 56px/1 var(--display);letter-spacing:-1.5px;font-variant-numeric:tabular-nums}.zp #day{color:var(--ink-soft);font-size:14px}.zp .controls{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.zp button{font:500 13px var(--display);color:var(--ink);background:var(--chip);border:1px solid var(--rule);border-radius:999px;padding:6px 12px;cursor:pointer;transition:background .15s,border-color .15s}.zp button:hover{border-color:var(--ink-soft)}.zp button:focus-visible{outline:2px solid var(--aqua);outline-offset:2px}.zp button[aria-pressed=true]{background:var(--ink);color:var(--glass-solid, #fff);border-color:var(--ink)}.zp #play{min-width:74px}.zp #speedNote{font-size:12px;color:var(--ink-soft);margin-top:8px}.zp .size{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:10px}.zp .size>span{font-size:12px;color:var(--ink-soft);margin-right:2px}.zp .size button{padding:5px 11px}.zp .kpis{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}.zp .kpi{padding:9px 12px 10px 20px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule)}.zp .kpi:nth-child(3n){border-right:0}.zp .kpi:nth-last-child(-n+3){border-bottom:0}.zp .kpi span{display:block;font-size:11.5px;color:var(--ink-soft)}.zp .kpi b{font-weight:500;font-size:18px;font-variant-numeric:tabular-nums}.zp .tabs{display:flex;gap:6px;padding:12px 20px 6px}.zp .tabs button{flex:1;padding:6px 8px}.zp .feeds{flex:1;min-height:0;position:relative}.zp .feed{list-style:none;margin:0;padding:0 12px 12px 20px;overflow-y:auto;position:absolute;inset:0}.zp .feed li{display:grid;grid-template-columns:40px 22px minmax(0,1fr);gap:4px;padding:7px 0;border-bottom:1px solid var(--rule);font-size:13px;line-height:1.45;animation:pop .5s ease-out}.zp .feed li time{color:var(--ink-soft);font-variant-numeric:tabular-nums;font-size:12px;padding-top:1px}.zp .feed li.api{grid-template-columns:40px minmax(0,1fr);font-size:12px}.zp .feed li.api code{font:11.5px var(--mono);word-break:break-all}.zp .tag{display:inline-block;border-radius:6px;padding:0 6px;margin-right:4px;font-size:11px;font-weight:500;color:#fff}.zp .tag.opera{background:var(--opera)}.zp .tag.simphony{background:var(--simphony)}.zp .tag.zenn{background:var(--zenn)}.zp .tag.external{background:#6f7880}.zp .st{font-weight:600;font-family:var(--mono)}.zp .st.bad{color:var(--bad)}.zp .cat-zenn span:last-child{color:var(--zenn)}@keyframes pop{0%{background:#00a3b529}to{background:transparent}}.zp footer{padding:10px 20px 14px;border-top:1px solid var(--rule);display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--ink-soft)}.zp .opt{display:flex;gap:6px;align-items:center}.zp .legend{display:flex;gap:10px;flex-wrap:wrap}.zp .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px}@media(max-width:900px){.zp{height:auto;overflow:visible}.zp #stage{position:relative;inset:auto;aspect-ratio:var(--plan-ratio, 1536/2018);width:100%}.zp aside{position:relative;inset:auto;width:auto;margin:12px max(12px,env(safe-area-inset-right,0px)) 16px max(12px,env(safe-area-inset-left,0px));border-radius:20px}.zp .feeds{height:440px;flex:none}.zp #time{font-size:44px}}@media(prefers-reduced-motion:reduce){.zp .feed li,.zp .live i{animation:none}}:root[data-theme=dark] .zp button[aria-pressed=true]{color:#0b1a20}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .zp button[aria-pressed=true]{color:#0b1a20}}:root{--bg: #eef3f3;--surface: #ffffff;--surface-2: #f6f9f9;--ink: #0f2a33;--ink-soft: #557079;--rule: rgba(15, 42, 51, .12);--accent: #00808c;--accent-ink: #ffffff;--accent-soft: rgba(0, 128, 140, .1);--zenn: #6a5cff;--zenn-soft: rgba(106, 92, 255, .12);--ok: #1c8a60;--warn: #a8740a;--bad: #c0463c;--ok-soft: rgba(28, 138, 96, .12);--warn-soft: rgba(168, 116, 10, .12);--bad-soft: rgba(192, 70, 60, .12);--font: "Sora", "Avenir Next", "Segoe UI", sans-serif;--radius: 10px}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #0b1619;--surface: #11232a;--surface-2: #0e1d22;--ink: #e7f3f5;--ink-soft: #93adb4;--rule: rgba(231, 243, 245, .12);--accent: #3fc3d1;--accent-ink: #062126;--accent-soft: rgba(63, 195, 209, .14);--zenn: #9b91ff;--zenn-soft: rgba(155, 145, 255, .16);--ok: #4cc597;--warn: #e2b04a;--bad: #ef7f74;--ok-soft: rgba(76, 197, 151, .14);--warn-soft: rgba(226, 176, 74, .14);--bad-soft: rgba(239, 127, 116, .14);color-scheme:dark}}:root[data-theme=dark]{--bg: #0b1619;--surface: #11232a;--surface-2: #0e1d22;--ink: #e7f3f5;--ink-soft: #93adb4;--rule: rgba(231, 243, 245, .12);--accent: #3fc3d1;--accent-ink: #062126;--accent-soft: rgba(63, 195, 209, .14);--zenn: #9b91ff;--zenn-soft: rgba(155, 145, 255, .16);--ok: #4cc597;--warn: #e2b04a;--bad: #ef7f74;--ok-soft: rgba(76, 197, 151, .14);--warn-soft: rgba(226, 176, 74, .14);--bad-soft: rgba(239, 127, 116, .14);color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:var(--bg);color:var(--ink);font:400 14px/1.5 var(--font);-webkit-font-smoothing:antialiased}h1,h2,h3{margin:0;font-weight:600;text-wrap:balance}h1{font-size:22px;letter-spacing:-.01em}h2{font-size:15px}a{color:var(--accent)}.num{font-variant-numeric:tabular-nums}.soft{color:var(--ink-soft)}.btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border-radius:8px;border:1px solid var(--rule);background:var(--surface);color:var(--ink);font:500 13px var(--font);cursor:pointer;text-decoration:none;white-space:nowrap}.btn:hover:not(:disabled){border-color:var(--accent)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn.danger{color:var(--bad)}.btn.go{background:var(--ok);border-color:var(--ok);color:#fff}.btn.small{height:28px;padding:0 10px;font-size:12px}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}input[type=text],input[type=number],select{height:34px;padding:0 10px;border:1px solid var(--rule);border-radius:8px;background:var(--surface);color:var(--ink);font:400 13px var(--font);width:100%;min-width:0}input[type=text]:disabled,input[type=number]:disabled,select:disabled{opacity:.55}label.field{display:grid;gap:4px;font-size:12px;color:var(--ink-soft);min-width:0}.segmented{display:inline-flex;flex-wrap:wrap;border:1px solid var(--rule);border-radius:9px;padding:3px;gap:2px;background:var(--surface-2)}.segmented button{border:0;background:transparent;color:var(--ink-soft);font:500 13px var(--font);padding:6px 12px;border-radius:6px;cursor:pointer}.segmented button[aria-pressed=true]{background:var(--surface);color:var(--ink);box-shadow:0 0 0 1px var(--rule)}.segmented button:disabled{cursor:not-allowed;opacity:.5}.status{display:inline-flex;align-items:center;gap:6px;padding:2px 10px 2px 8px;border-radius:999px;font-size:12px;font-weight:500}.status:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}.status.running{color:var(--ok);background:var(--ok-soft)}.status.starting{color:var(--warn);background:var(--warn-soft)}.status.error{color:var(--bad);background:var(--bad-soft)}.status.draft,.status.stopped{color:var(--ink-soft);background:var(--rule)}