/* 卓洛纪任务托管 — original, dependency-free forest / amber theme. */
:root {
 --bg:#0b211b; --bg-soft:#102a22; --card:#143128; --card-2:#1c3b30; --line:#c8dcc226;
 --text:#f1efdc; --text-dim:#afc4b4; --accent:#e3bd76; --accent-2:#a8d2ae; --danger:#f2a09a;
 --warn:#e3bd76; --radius:16px; --shadow:0 20px 55px #02100b45; color-scheme:dark; font-size:15px;
}
[data-theme="light"] { --bg:#f4f2e7; --bg-soft:#eaeedf; --card:#fffef6; --card-2:#e7eddf; --line:#27473630; --text:#193526; --text-dim:#516957; --accent:#765010; --accent-2:#2e673d; --danger:#ac3232; --warn:#805c13; --shadow:0 12px 40px #1935260d; color-scheme:light; }
*,*::before,*::after { box-sizing:border-box; }
* { margin:0; padding:0; }
[hidden] { display:none!important; }
html,body { min-height:100%; }
body { background:var(--bg); color:var(--text); font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif; line-height:1.65; -webkit-font-smoothing:antialiased; }
a { color:var(--accent); text-decoration:none; }
a:hover { text-decoration:underline; text-underline-offset:4px; }
h1,h2,h3 { font-weight:600; letter-spacing:-.025em; line-height:1.4; }
h2 { font-size:1.7rem; }
p { overflow-wrap:anywhere; }
.muted { color:var(--text-dim); font-size:.88rem; }
.mono { font-family:Consolas,monospace; overflow-wrap:anywhere; }
.eyebrow { display:block; color:var(--accent); font-size:.63rem; font-weight:600; letter-spacing:.18em; margin-bottom:10px; }
.skip-link { position:fixed; left:16px; top:-100px; z-index:1000; background:var(--accent); color:var(--bg); padding:12px 18px; border-radius:8px; }
.skip-link:focus { top:10px; }
:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.brand { display:flex; align-items:center; gap:12px; color:var(--text); text-decoration:none!important; }
.brand img { flex-shrink:0; border-radius:12px; }
.brand span { display:flex; flex-direction:column; gap:2px; }
.brand strong { font-size:1.5rem; line-height:1.35; letter-spacing:.1em; font-weight:600; }
.brand small { font-size:.53rem; color:var(--text-dim); letter-spacing:.11em; }
.auth-wrap { max-width:1260px; margin:auto; padding:34px 44px 20px; min-height:100vh; display:flex; flex-direction:column; }
.auth-header { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.store-link { color:var(--text-dim); font-size:.8rem; }
.store-link span { color:var(--accent); margin-left:12px; }
.auth-stage { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(330px,.85fr); gap:70px; align-items:center; flex:1; padding-block:52px; }
.auth-story { min-width:0; }
.auth-story h1 { font-size:clamp(28px,3.15vw,44px); line-height:1.5; letter-spacing:-.04em; }
.auth-story h1 em { font-style:normal; color:var(--accent); }
.auth-story>p { max-width:460px; color:var(--text-dim); font-size:.87rem; line-height:1.95; margin-top:18px; }
.auth-landscape { width:100%; height:auto; max-width:570px; margin:3px 0 -9px; }
.journey-steps { display:flex; gap:25px; flex-wrap:wrap; color:var(--text-dim); font-size:.7rem; }
.journey-steps b { color:var(--accent); font-size:.67rem; font-weight:500; margin-right:8px; }
.auth-card { background:var(--card); border:1px solid var(--line); border-radius:22px; padding:32px; box-shadow:var(--shadow); }
.auth-card h2 { font-size:1.55rem; margin-bottom:6px; }
.auth-card .sub { margin-bottom:20px; font-size:.8rem; }
.auth-tabs { display:flex; gap:6px; padding:5px; background:var(--bg-soft); border:1px solid var(--line); border-radius:10px; margin-bottom:22px; }
.auth-tabs button { flex:1; border:0; background:transparent; min-height:38px; }
.auth-tabs button.primary { background:var(--card-2); color:var(--accent); }
.auth-note { border-top:1px solid var(--line); color:var(--text-dim); font-size:.7rem; line-height:1.85; margin-top:23px; padding-top:17px; }
.auth-footer { display:flex; justify-content:space-between; gap:12px; font-size:.68rem; color:var(--text-dim); border-top:1px solid var(--line); padding-top:18px; }
.shell { display:flex; min-height:100vh; }
.side { width:230px; flex:0 0 230px; background:var(--bg-soft); border-right:1px solid var(--line); padding:28px 16px 16px; display:flex; flex-direction:column; gap:6px; position:sticky; top:0; height:100vh; overflow-y:auto; }
.side .brand { padding:0 10px 14px; gap:10px; }
.side .brand strong { font-size:1.35rem; }
.side-label { padding:7px 14px 17px; font-size:.68rem; color:var(--text-dim); }
.side nav { display:flex; flex-direction:column; gap:7px; flex:1; }
.side nav a { display:flex; gap:12px; align-items:center; min-height:44px; color:var(--text-dim); padding:11px 14px; border:1px solid transparent; border-radius:10px; font-size:.86rem; text-decoration:none; }
.side nav a:hover { background:var(--card); color:var(--text); }
.side nav a.active { background:var(--card-2); border-color:var(--line); color:var(--accent); }
.nav-icon { width:19px; text-align:center; font-size:1rem; color:var(--accent); }
.side-store { display:flex; justify-content:space-between; gap:8px; font-size:.74rem; padding:15px 13px; margin-top:30px; color:var(--text-dim); }
.side .foot { padding:15px 12px 0; border-top:1px solid var(--line); }
.side .foot .muted { font-size:.77rem; overflow-wrap:anywhere; }
.main { flex:1; min-width:0; max-width:1440px; padding:24px 36px 36px; outline:none; }
.workspace-head { display:flex; justify-content:space-between; gap:18px; border-bottom:1px solid var(--line); padding-bottom:18px; margin-bottom:22px; color:var(--text-dim); font-size:.65rem; letter-spacing:.08em; }
.workspace-wordmark { color:var(--accent); }
.page-head { display:flex; align-items:center; justify-content:space-between; margin:23px 0; gap:16px; flex-wrap:wrap; }
.page-head h2+p { margin-top:8px; font-size:.8rem; }
.card { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:22px; margin-bottom:18px; min-width:0; }
.card h3 { font-size:1rem; margin-bottom:16px; }
.card-description { margin:-6px 0 18px; font-size:.77rem; }
.grid { display:grid; gap:16px; margin-bottom:18px; }
.grid.c2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid.c3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid.c4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.grid>.card { margin-bottom:0; }
.stat { display:flex; flex-direction:column; gap:12px; padding:20px; }
.stat .num { font-size:1.65rem; font-weight:650; line-height:1.3; color:var(--accent); overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.stat .lbl { color:var(--text-dim); font-size:.76rem; }
.expedition-banner { display:flex; justify-content:space-between; align-items:center; overflow:hidden; background:linear-gradient(100deg,var(--card-2),var(--card)); border:1px solid var(--line); border-radius:var(--radius); margin-bottom:22px; padding:26px 28px; gap:10px; }
.expedition-banner h3 { font-size:1.23rem; }
.expedition-banner p { font-size:.77rem; color:var(--text-dim); max-width:360px; margin:10px 0 15px; }
.expedition-banner a { font-size:.78rem; }
.expedition-banner img { max-width:39%; height:auto; flex-shrink:0; }
button,.btn { background:var(--card-2); color:var(--text); border:1px solid var(--line); border-radius:9px; padding:10px 16px; min-height:42px; font-size:.82rem; cursor:pointer; font-family:inherit; font-weight:500; transition:background .16s,border-color .16s; }
button:hover,.btn:hover { border-color:var(--accent); }
button.primary { background:var(--accent); border-color:var(--accent); color:var(--bg); font-weight:600; }
button.primary:hover { filter:brightness(1.06); }
button.good { background:var(--accent-2); border-color:var(--accent-2); color:var(--bg); }
button.danger { background:transparent; border-color:var(--danger); color:var(--danger); }
button.ghost { background:transparent; }
button:disabled { opacity:.52; cursor:not-allowed; }
button.sm,.btn.sm { padding:7px 11px; min-height:36px; font-size:.76rem; }
.full { width:100%; }
input,select,textarea { background:var(--bg-soft); color:var(--text); border:1px solid var(--line); border-radius:9px; padding:11px 12px; min-height:44px; font-size:.85rem; font-family:inherit; width:100%; max-width:100%; }
input::placeholder,textarea::placeholder { color:var(--text-dim); opacity:.77; }
input:focus,select:focus,textarea:focus { outline:2px solid var(--accent); outline-offset:1px; }
input[type="checkbox"] { width:20px; height:20px; min-height:0; accent-color:var(--accent); }
textarea { resize:vertical; }
label.field { display:block; margin-bottom:17px; }
label.field .t { display:block; font-size:.79rem; color:var(--text-dim); margin-bottom:8px; }
.row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; min-width:0; }
.right { margin-left:auto; }
.card>.field { max-width:580px; }
table { width:100%; border-collapse:collapse; font-size:.8rem; }
th,td { text-align:left; padding:13px 12px; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--text-dim); font-weight:500; font-size:.72rem; white-space:nowrap; background:var(--bg-soft); }
th:first-child { border-radius:8px 0 0 8px; } th:last-child { border-radius:0 8px 8px 0; }
tr:last-child td { border-bottom:0; }
td .sub { color:var(--text-dim); font-size:.75rem; }
td .sm { margin:0 3px 4px 0; white-space:nowrap; }
.tbl-wrap { overflow-x:auto; max-width:100%; overscroll-behavior-inline:contain; scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
.badge { display:inline-block; padding:4px 10px; border-radius:7px; font-size:.7rem; font-weight:500; white-space:nowrap; line-height:1.5; }
.badge.queued,.badge.unused { background:#a3c6bd18; color:var(--text-dim); }
.badge.running,.badge.pending,.badge.review_required { background:#e3bd7619; color:var(--warn); }
.badge.done,.badge.paid,.badge.ok,.badge.used,.badge.active { background:#99c8a418; color:var(--accent-2); }
.badge.failed { background:#f2a09a18; color:var(--danger); }
.badge.cancelled,.badge.refunded,.badge.expired,.badge.disabled,.badge.banned { background:#b2c5b414; color:var(--text-dim); }
.plan { border:1px solid var(--line); border-radius:var(--radius); padding:24px; background:var(--card); display:flex; flex-direction:column; gap:12px; }
.plan .price { font-size:1.55rem; font-weight:650; color:var(--accent); }
.plan ul { list-style:none; color:var(--text-dim); font-size:.82rem; display:grid; gap:4px; }
.plan>button { margin-top:auto; }
.service-card { display:flex; flex-direction:column; gap:9px; }
.service-card h3 { margin:0; }
.service-card .service-price { color:var(--accent); }
.empty { color:var(--text-dim); text-align:center; padding:34px 12px; font-size:.83rem; overflow-wrap:anywhere; }
.empty::before { content:""; display:block; width:25px; height:32px; margin:0 auto 13px; border-radius:52% 52% 46% 46%; border:1px solid var(--accent); background:linear-gradient(155deg,transparent 45%,#e3bd762b 46%,#e3bd762b 52%,transparent 53%); transform:rotate(-12deg); opacity:.8; }
.runtime-notice,.page-feedback,.form-feedback { background:#e3bd760b; border:1px solid #e3bd763d; color:var(--accent); border-radius:10px; padding:11px 14px; font-size:.75rem; margin-bottom:18px; line-height:1.8; overflow-wrap:anywhere; }
.page-feedback { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.page-feedback.error,.form-feedback.error { color:var(--danger); border-color:var(--danger); }
.runtime-notice[data-mode="live"] { background:#99c8a410; border-color:#99c8a435; color:var(--text-dim); }
.toast-wrap { position:fixed; right:18px; bottom:18px; display:flex; flex-direction:column; gap:8px; z-index:999; pointer-events:none; }
.toast { background:var(--card-2); border:1px solid var(--line); border-left:3px solid var(--accent); color:var(--text); border-radius:10px; padding:13px 17px; box-shadow:var(--shadow); animation:slide-in .2s ease-out; max-width:min(400px,calc(100vw - 36px)); font-size:.84rem; overflow-wrap:anywhere; }
.toast.err { border-left-color:var(--danger); }
.toast.good { border-left-color:var(--accent-2); }
.modal-mask { position:fixed; inset:0; background:#03110bd6; display:none; align-items:center; justify-content:center; z-index:500; padding:20px; }
.modal-mask.show { display:flex; }
.modal { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); width:480px; max-width:100%; max-height:86vh; overflow:auto; padding:26px; }
.modal h3 { margin-bottom:19px; }
.modal .acts { display:flex; gap:10px; justify-content:flex-end; margin-top:24px; }
.task-report { font-size:.88rem; overflow-wrap:anywhere; }
.task-report .rew { display:flex; gap:10px; flex-wrap:wrap; margin:14px 0; }
.task-report .rew span { background:var(--card-2); border-radius:8px; padding:7px 11px; }
.spin { display:inline-block; width:13px; height:13px; border:2px solid var(--line); border-top-color:var(--accent); border-radius:50%; animation:rot .8s linear infinite; vertical-align:-2px; }
@keyframes rot { to { transform:rotate(360deg); } }
@keyframes slide-in { from { transform:translateY(8px); opacity:0; } to { transform:none; opacity:1; } }
@media(max-width:1150px) { .auth-stage { gap:35px; } .side { width:205px; flex-basis:205px; padding-inline:12px; } .main { padding-inline:25px; } .grid.c4 { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:800px) {
 .auth-wrap { padding:23px 25px; } .auth-stage { grid-template-columns:1fr; padding-block:32px; gap:30px; } .auth-story { text-align:center; } .auth-story>p { margin-inline:auto; } .auth-landscape { max-width:340px; display:block; margin:0 auto; } .journey-steps { justify-content:center; } .auth-card { width:min(100%,480px); margin:auto; } .auth-story h1 { font-size:30px; }
 .shell { flex-direction:column; } .side { position:relative; width:100%; height:auto; flex:0 0 auto; padding:18px 20px 12px; border-right:0; border-bottom:1px solid var(--line); display:grid; grid-template-columns:1fr auto; gap:8px; overflow:visible; }
 .side .brand { padding:0; } .side .brand img { width:38px; height:38px; } .side .brand strong { font-size:1.2rem; } .side-label { display:none; }
 .side nav { grid-column:1/-1; grid-row:2; flex-direction:row; overflow-x:auto; padding:8px 0 0; gap:5px; scrollbar-width:thin; }
 .side nav a { padding:9px 13px; flex-shrink:0; gap:7px; min-height:44px; font-size:.77rem; } .nav-icon { font-size:.85rem; width:14px; }
 .side .foot { border:0; padding:0; grid-column:2; grid-row:1; text-align:right; } .side .foot .row { justify-content:flex-end; margin-top:3px!important; gap:5px; } .side .foot .sm { margin-top:3px!important; min-height:32px; font-size:.7rem; padding:5px 8px; } .side-store { display:none; }
 .main { padding:20px; } .workspace-head { font-size:.59rem; margin-bottom:18px; } .page-head { margin:19px 0; } .page-head h2 { font-size:1.45rem; }
 .grid.c3 { grid-template-columns:1fr; } .card { padding:19px; } .expedition-banner { padding:22px; } .expedition-banner h3 { font-size:1.08rem; }
 table { min-width:640px; } .task-report table { min-width:0; } .task-report { overflow-x:auto; } #services-table { min-width:540px; }
}
@media(max-width:480px) {
 .auth-header .brand strong { font-size:1.3rem; } .auth-header .brand small { font-size:.45rem; } .auth-header .brand img { width:40px; height:40px; } .store-link { font-size:.68rem; } .store-link span { margin-left:4px; } .auth-wrap { padding:20px 18px; } .auth-story h1 { font-size:27px; } .auth-story>p { font-size:.8rem; } .auth-card { padding:24px; } .auth-footer { flex-direction:column; align-items:center; font-size:.62rem; } .journey-steps { gap:17px; }
 .main { padding:16px; } .side { padding:16px 16px 10px; } .workspace-wordmark { display:none; } .grid { gap:10px; } .grid.c2 { grid-template-columns:1fr; } .stat { padding:16px; gap:9px; } .stat .num { font-size:1.38rem; } .stat .lbl { font-size:.7rem; }
 .expedition-banner { padding:20px; } .expedition-banner img { display:none; } .expedition-banner p { font-size:.76rem; } .card { padding:17px; border-radius:12px; } .row>select,.row>input { max-width:100%!important; } .modal { padding:21px; } .modal-mask { padding:14px; } input,select,textarea { font-size:16px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }

/* Daily hosting additions keep the forest/amber visual system. */
.support-strip { display:flex; align-items:center; gap:12px; flex-wrap:wrap; border-top:1px solid var(--line); padding:20px 0 6px; margin-top:28px; font-size:.78rem; color:var(--text-dim); }
.support-strip strong { color:var(--accent); letter-spacing:.04em; }
.page-head.compact { margin-top:0; margin-bottom:14px; }
.grow { flex:1; min-width:180px; }
.notice-box { margin:14px 0; padding:12px 15px; border:1px solid var(--line); border-left:3px solid var(--accent-2); border-radius:9px; background:var(--card-2); color:var(--text-dim); font-size:.8rem; line-height:1.7; overflow-wrap:anywhere; }
.notice-box.attention { border-left-color:var(--accent); }
.hosting-summary { font-size:.84rem; line-height:1.8; border-left:3px solid var(--accent); }
.hosting-list { display:grid; gap:15px; }
.hosting-card { margin-bottom:0; }
.hosting-card-head,.hosting-actions { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.hosting-card-head h3 { overflow-wrap:anywhere; margin:4px 0 0; }
.hosting-details { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:20px 0 6px; }
.hosting-details dt { font-size:.71rem; color:var(--text-dim); margin-bottom:6px; }
.hosting-details dd { margin:0; font-size:.88rem; font-weight:500; overflow-wrap:anywhere; }
.hosting-details dd small { font-size:.67rem; color:var(--text-dim); font-weight:400; }
.hosting-actions>.muted { font-size:.75rem; }
.check-line { display:flex; gap:10px; align-items:flex-start; font-size:.84rem; margin:16px 0; }
.check-line input { width:18px; min-height:18px; margin:2px 0 0; flex-shrink:0; }
.health-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 18px; font-size:.83rem; margin-top:15px; color:var(--text-dim); }
.report-status { display:flex; gap:10px; align-items:center; flex-wrap:wrap; font-size:.75rem; margin:14px 0; }
.report-actions { margin-top:16px; }
#export-codes { width:100%; font-family:var(--mono,monospace); font-size:.8rem; resize:vertical; }
#card-list-summary { overflow-wrap:anywhere; }
.badge.enabled { color:var(--accent-2); border-color:var(--accent-2); }
.badge.paused { color:var(--accent); border-color:var(--accent); }
.good-text { color:var(--accent-2); }
@media(max-width:800px) { .hosting-details { grid-template-columns:repeat(2,minmax(0,1fr)); } .hosting-actions { align-items:flex-start; } }
@media(max-width:480px) { .health-grid { grid-template-columns:1fr; } .hosting-actions .row { gap:7px; } .support-strip { gap:7px; } .hosting-details { gap:15px 10px; } }