:root{--bg:#0d0d0d;--surface:#1c1c1c;--raised:#292929;--border:#323232;--ink:#f7f7f7;--muted:#a8a8ad;--accent:#0660fa;--accent-text:#5a9aff;--green:#69d69a;--negative:#ff9b9b;--font:Arial,Helvetica,sans-serif;--radius:16px;color-scheme:dark;font-family:var(--font);color:var(--ink);background:var(--bg);font-size:16px}
*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:wait;color:var(--muted);background:var(--raised)}[hidden]{display:none!important}.symbols{position:absolute;width:0;height:0;overflow:hidden}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}a{color:var(--accent-text);text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent-text);outline-offset:3px}.topbar{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 max(20px,calc((100vw - 920px)/2));background:#080808;border-bottom:1px solid #202020;gap:16px}.brand{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:600}.brand svg{color:var(--accent-text)}.personal{color:var(--muted);font-size:13px}
/* One column: available width minus equal 16px gutters; max 680px for a task form. */
.app-shell{max-width:720px;margin:auto;padding:24px 16px 150px;min-height:calc(100dvh - 64px)}.utility{display:flex;gap:10px;align-items:center;padding-bottom:18px;margin-bottom:20px;border-bottom:1px solid var(--border);flex-wrap:wrap}.utility-button{height:40px;padding:0 16px;background:transparent;color:var(--ink);border:1px solid var(--border);border-radius:9px;font-size:14px;font-weight:600}.connection{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:7px;margin-left:auto}.connection::before,.status-dot{content:"";width:6px;height:6px;border-radius:50%;background:var(--muted);display:inline-block;flex:none}.connection.online::before{background:var(--green)}.panel{padding:24px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);margin-bottom:20px}.panel h1,.panel h2{font-size:21px;line-height:1.35;font-weight:600;margin:0 0 18px;display:flex;align-items:center;gap:10px;letter-spacing:-.015em}.panel h1 svg,.panel h2 svg{color:var(--accent-text)}p{color:var(--muted);line-height:1.55;margin:0 0 18px}strong{color:var(--ink)}.facts{margin:8px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:22px 16px}.facts div{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}.facts dt{color:var(--muted);font-size:15px}.facts dd{margin:0;font-weight:600;font-size:15px;font-variant-numeric:tabular-nums}.button{min-height:48px;display:flex;align-items:center;justify-content:center;gap:10px;border-radius:10px;width:100%;padding:12px 16px;font-weight:600;font-size:16px;border:1px solid transparent;margin-top:12px;text-align:center;transition:background-color .15s,transform .15s}.button:active,.utility-button:active{transform:translateY(1px)}.primary{background:var(--accent);color:white}.primary:hover{background:#0052df}.secondary{background:transparent;border-color:var(--border);color:var(--ink)}.secondary:hover,.utility-button:hover{background:var(--raised)}.text{background:transparent;color:var(--muted);font-size:14px}.compact{width:auto;min-height:40px;padding:8px 12px;margin:0;font-size:14px}.footnote{font-size:13px;margin:14px 0 0;line-height:1.55}.field-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--raised);padding:18px;border-radius:10px;margin:20px 0;color:var(--muted);font-size:14px}.field-summary strong{font-variant-numeric:tabular-nums}.connected-row{display:flex;align-items:center;gap:14px;padding:12px 0}.connected-row>svg{width:36px;height:36px;color:var(--green)}.connected-row p{margin:4px 0 0;font-size:14px}.tabs{display:flex;background:var(--raised);padding:4px;border-radius:11px;gap:4px;margin-bottom:22px}.tabs button{min-height:44px;min-width:0;flex:1;color:var(--muted);background:transparent;border:0;border-radius:8px;font-size:15px;font-weight:600;padding:8px}.tabs button[aria-selected=true]{background:var(--surface);color:var(--ink)}label{display:block;font-size:14px;color:var(--muted);margin:18px 0 8px;line-height:1.4}input,select,textarea{display:block;width:100%;min-width:0;border:1px solid transparent;background:var(--raised);color:var(--ink);border-radius:10px;padding:15px 16px;font-size:16px;min-height:54px}input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}input:hover,select:hover,textarea:hover{border-color:#454545}textarea{resize:vertical;line-height:1.5}select{padding-right:24px}form .primary{margin-top:22px}.qr-frame{width:min(100%,320px);aspect-ratio:1;margin:20px auto 12px;background:white;border-radius:10px;padding:12px;display:flex;align-items:center;justify-content:center;color:#333}.qr-frame img{width:100%;height:auto;display:block;image-rendering:pixelated}.qr-caption{text-align:center;font-size:13px;font-variant-numeric:tabular-nums}.file-picker{position:relative;display:flex;align-items:center;justify-content:space-between;background:var(--raised);border-radius:10px;padding:16px;margin-top:8px;overflow:hidden;gap:12px;font-size:16px;cursor:pointer}.file-picker input{position:absolute;inset:0;opacity:0;cursor:pointer}.browse{padding:8px 16px;background:var(--accent);color:white;border-radius:8px;font-size:14px;font-weight:600}.workload{display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:9px 13px;border:1px solid #35694c;border-radius:24px;font-size:13px;color:var(--muted);margin-bottom:20px}.workload .status-dot{background:var(--green)}.task-toolbar{display:flex;gap:10px;margin-bottom:20px}.task-toolbar select{font-size:14px;padding:10px;min-height:44px}.empty{padding:48px 10px 32px;text-align:center}.empty>svg{width:32px;height:32px;color:var(--muted);margin-bottom:12px}.empty .button{max-width:260px;margin:18px auto 0}.task{padding:18px 0;border-top:1px solid var(--border)}.task:first-child{border-top:0}.task-head{display:flex;gap:12px;justify-content:space-between;align-items:flex-start}.task-name{font-size:16px;font-weight:600;overflow-wrap:anywhere;margin:0}.task-state{font-size:12px;white-space:nowrap;color:var(--muted);padding-top:3px}.task-state.done{color:var(--green)}.task-state.error{color:var(--negative)}.task-meta{color:var(--muted);font-size:13px;line-height:1.6;margin-top:7px;font-variant-numeric:tabular-nums}.task-result{margin:12px 0 0;font-size:14px}.task-actions{display:flex;gap:10px;flex-wrap:wrap}.task-actions .button{flex:1;width:auto;font-size:14px;min-height:42px}.task-error{font-size:13px;color:var(--negative);margin-top:10px;margin-bottom:0}.notice{font-size:14px;line-height:1.55;padding:16px;border-radius:9px;background:var(--raised);color:var(--muted);margin-bottom:20px}.notice p{margin:6px 0 0;font-size:14px}.notice.error{background:#302020;color:#ffc0c0;border:1px solid #714343}.tip{border-left:3px solid var(--green);background:#202b25;margin-top:24px;margin-bottom:0}.tip strong{color:var(--green)}.guide-list{padding-left:22px;margin:0}.guide-list li{padding-left:6px;margin:24px 0}.guide-list li::marker{color:var(--accent-text);font-weight:600}.guide-list p{font-size:14px;margin:8px 0 0}.setting-account{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:14px}.checkbox{display:flex;align-items:center;gap:12px;color:var(--ink);margin:22px 0}.checkbox input{width:20px;height:20px;min-height:20px;flex:none;padding:0;accent-color:var(--accent)}.bottom-nav{position:fixed;bottom:36px;left:50%;transform:translateX(-50%);width:min(100%,720px);display:grid;grid-template-columns:repeat(6,minmax(0,1fr));padding:10px 8px 12px;background:var(--surface);border:1px solid var(--border);border-bottom:0;z-index:10}.bottom-nav button{border:0;background:transparent;color:var(--muted);min-height:54px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:0;font-size:11px;font-weight:600}.bottom-nav button svg{width:25px;height:25px}.bottom-nav button[aria-current=page]{color:var(--accent-text)}footer{position:fixed;bottom:0;left:0;right:0;height:36px;display:flex;justify-content:center;align-items:center;background:#080808;z-index:11;font-size:13px}footer a{color:var(--muted)}.help-button{position:fixed;bottom:132px;right:max(20px,calc((100vw - 680px)/2));width:56px;height:56px;border:0;border-radius:50%;background:var(--accent);color:white;display:flex;align-items:center;justify-content:center;z-index:9}.help-button svg{width:30px;height:30px}.muted{color:var(--muted)}
@media(min-width:1000px){.app-shell{max-width:720px}.topbar{padding-left:calc((100vw - 680px)/2);padding-right:calc((100vw - 680px)/2)}}
@media(max-width:500px){.topbar{height:54px;padding:0 16px}.brand{font-size:17px}.personal{font-size:12px}.app-shell{padding:20px 14px 150px}.panel{padding:22px 20px}.utility{gap:8px}.utility-button{padding:0 12px;font-size:13px}.connection{margin-left:0;flex-basis:100%;margin-top:4px}.facts{gap:20px 12px}.facts div{display:block}.facts dd{margin-top:6px}.panel h1,.panel h2{font-size:20px}.tabs button{font-size:14px;padding:8px 4px}.help-button{width:52px;height:52px;right:18px}.bottom-nav{padding:8px 5px 10px}.bottom-nav button{font-size:11px}.personal{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.bottom-nav{padding-left:16px;padding-right:16px}.help-button{position:static;margin:0 0 0 auto}.bottom-nav button span{white-space:nowrap}.panel .task-name{font-size:16px;margin-bottom:0}
