* { box-sizing: border-box; margin: 0; padding: 0; }
body {
    font-family: "Microsoft YaHei", "Segoe UI", sans-serif;
    background: linear-gradient(135deg, #2d1f15 0%, #4a2c1e 40%, #5c3d2e 100%);
    min-height: 100vh;
    color: #f5ebe0;
    padding: 2rem;
}
.container { max-width: 900px; margin: 0 auto; }
h1 { text-align: center; margin-bottom: 2rem; font-size: 1.8rem; color: #ff9f43; }
.nav-line { text-align: right; margin: -1rem 0 1rem; }
.nav-line a { color: #ffb347; text-decoration: none; }
.nav-line a:hover { text-decoration: underline; }
.stepper { display: flex; justify-content: center; gap: 1rem; margin-bottom: 2rem; }
.stepper .dot {
    width: 36px; height: 36px; border-radius: 50%;
    background: rgba(255,255,255,0.15);
    display: flex; align-items: center; justify-content: center;
    font-weight: bold;
}
.stepper .dot.active { background: linear-gradient(135deg, #ff9f43, #f39c12); color: #2d1f15; }
.stepper .dot.done { background: rgba(255,159,67,0.5); color: #fff; }
.stepper .line { width: 40px; height: 3px; background: rgba(255,255,255,0.2); align-self: center; }
.stepper .line.done { background: rgba(255,159,67,0.5); }
.card {
    background: rgba(255,248,240,0.08);
    border: 1px solid rgba(255,180,71,0.2);
    border-radius: 12px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}
.card h2 {
    font-size: 1.1rem; margin-bottom: 1rem; color: #ff9f43;
    border-bottom: 1px solid rgba(255,159,67,0.35); padding-bottom: 0.5rem;
}
label { display: block; margin-top: 0.8rem; margin-bottom: 0.3rem; font-size: 0.9rem; color: #e8d5c4; }
input[type="text"], input[type="number"], textarea {
    width: 100%; padding: 0.6rem 0.8rem;
    border: 1px solid rgba(255,180,71,0.3); border-radius: 6px;
    background: rgba(45,31,21,0.5); color: #f5ebe0; font-size: 0.9rem;
}
textarea { min-height: 200px; font-family: Consolas, Monaco, monospace; font-size: 0.85rem; resize: vertical; }
input:focus, textarea:focus { outline: none; border-color: #ff9f43; }
.hint { font-size: 0.8rem; color: #c4a77d; margin-top: 0.2rem; }
button {
    background: linear-gradient(135deg, #ff9f43, #e67e22);
    color: #2d1f15; border: none; padding: 0.7rem 1.5rem;
    border-radius: 6px; cursor: pointer; font-size: 0.95rem; font-weight: bold; margin-top: 1rem;
}
button:hover { opacity: 0.92; }
.btn-back { background: rgba(255,180,71,0.25); color: #f5ebe0; margin-right: 0.5rem; }
.message { padding: 0.8rem; border-radius: 6px; margin-bottom: 1rem; }
.message.success { background: rgba(46,204,113,0.2); border: 1px solid #2ecc71; }
.message.error { background: rgba(231,76,60,0.2); border: 1px solid #e74c3c; }
.task-list { margin-top: 1rem; }
.task-item {
    background: rgba(45,31,21,0.4); padding: 0.8rem; border-radius: 8px;
    margin-bottom: 0.6rem; display: flex; justify-content: space-between;
    align-items: center; flex-wrap: wrap; gap: 0.5rem;
    border: 1px solid rgba(255,180,71,0.15);
}
.task-item .info { flex: 1; min-width: 200px; }
.task-item .info a, .task-link { color: #ffb347; text-decoration: none; }
.task-item .info a:hover, .task-link:hover { text-decoration: underline; }
.task-item button { margin: 0; padding: 0.4rem 0.8rem; font-size: 0.85rem; }
.btn-del { background: linear-gradient(135deg, #e74c3c, #c0392b); color: #fff; }
.btn-run { display: inline-block; margin-left: 0.5rem; padding: 0.3rem 0.6rem; font-size: 0.8rem; background: linear-gradient(135deg, #ff9f43, #e67e22); color: #2d1f15; text-decoration: none; border-radius: 4px; font-weight: bold; }
.btn-run:hover { opacity: 0.92; color: #2d1f15; }
.btn-new { margin-bottom: 1rem; }
.btn-edit { background: rgba(255,180,71,0.2); color: #f5ebe0; border: 1px solid rgba(255,180,71,0.4); padding: 0.3rem 0.6rem; border-radius: 4px; cursor: pointer; font-size: 0.85rem; }
.btn-edit:hover { background: rgba(255,180,71,0.35); }
