*{margin:0;padding:0;box-sizing:border-box}
body{background:#0C0C0C;color:#CCC;font-family:'Consolas','Courier New',monospace;font-size:13px;padding:12px}
.terminal{max-width:960px;margin:0 auto;border:1px solid #444;border-radius:6px;overflow:hidden}
.titlebar{background:#2D2D2D;padding:8px 14px;font-size:12px;display:flex;justify-content:space-between;align-items:center}
.dots span{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px}
.dot-red{background:#FF5F56}.dot-yellow{background:#FFBD2E}.dot-green{background:#27C93F}
.content{padding:14px;line-height:1.7}
.section-title{color:#569CD6;margin:14px 0 8px;font-weight:bold;font-size:13px}
.line-label{font-weight:bold;margin-bottom:4px;font-size:12px}

.cookie-bar{padding:8px 12px;background:#1E1E1E;border-left:3px solid #9CDCFE;margin-bottom:12px;display:flex;align-items:center;gap:12px}
.cookie-bar .label{color:#9CDCFE}
.cookie-status{padding:2px 8px;border-radius:3px;font-size:11px}
.cookie-ok{color:#4EC9B0}.cookie-expired{color:#F44747}.cookie-unknown{color:#808080}

.action-bar{margin-bottom:12px}
.btn,.task-btn{background:#2D2D2D;color:#DCDCAA;border:1px solid #555;padding:6px 14px;cursor:pointer;font-family:inherit;font-size:12px;border-radius:3px}
.btn:hover,.task-btn:hover{background:#3D3D3D;color:#fff}
.task-btn{padding:5px 10px;font-size:11px;margin:2px 0;width:100%;text-align:left}
.btn-sm{background:#333;color:#9CDCFE;border:1px solid #555;padding:3px 10px;cursor:pointer;font-family:inherit;font-size:11px;border-radius:3px}
.btn-sm:hover{background:#444}
.btn-danger{color:#F44747;border-color:#F44747}

.task-grid{display:flex;gap:12px}
.task-column{flex:1;min-width:180px}

.calc-section{display:flex;flex-wrap:wrap;gap:8px}
.calc-btn{background:#1E1E1E;color:#569CD6;border:1px solid #3A3A3A;padding:8px 14px;cursor:pointer;font-family:inherit;font-size:12px;border-radius:4px}
.calc-btn:hover{background:#2D2D2D;border-color:#569CD6}

.cron-section{padding:8px 12px;background:#1E1E1E}
.cron-row{display:flex;align-items:center;gap:8px;padding:3px 0;font-size:11px}
.cron-row input{width:60px;padding:2px 6px;background:#0C0C0C;color:#DCDCAA;border:1px solid #444;font-family:inherit;font-size:11px;border-radius:2px}
.cron-row label{width:160px;color:#9CDCFE}
.cron-row button{padding:2px 8px;font-size:10px}

.progress-panel,.card-panel{margin-bottom:12px}
.summary{padding:10px 12px;background:#1E1E1E;border-left:3px solid #569CD6;margin-bottom:8px;display:flex;flex-wrap:wrap;gap:16px;font-size:12px}
.summary .num{color:#DCDCAA;font-weight:bold}
.progressbar{margin:6px 0;font-size:11px;color:#4EC9B0;font-family:monospace}
.steps{font-size:11px}
.row{display:flex;align-items:center;gap:6px;padding:1px 0}
.icon{width:48px;text-align:center;font-weight:bold;flex-shrink:0}
.group{width:36px;color:#9CDCFE;flex-shrink:0;font-size:10px}
.desc{flex:1}
.suffix{color:#6A9955;font-size:10px;width:80px;text-align:right;flex-shrink:0}
.ts{color:#666;font-size:10px;width:110px;text-align:right;flex-shrink:0}
.queue-info{border-top:1px solid #333;margin-top:8px;padding-top:6px;font-size:11px;color:#808080}

.card-list{display:flex;flex-wrap:wrap;gap:8px}
.card{background:#1E1E1E;border:1px solid #333;border-radius:6px;padding:10px;width:260px;font-size:11px}
.card-title{font-weight:bold;margin-bottom:4px}
.card-bar{height:4px;background:#333;border-radius:2px;margin:4px 0}
.card-bar-fill{height:4px;background:#4EC9B0;border-radius:2px}
.card-info{color:#808080;font-size:10px}
.card-running{border-color:#DCDCAA}.card-running .card-bar-fill{background:#DCDCAA}
.card-fail{border-color:#F44747}.card-fail .card-bar-fill{background:#F44747}
.card-done{border-color:#4EC9B0}
.card-pending{border-color:#808080}
.card-cancel-btn{color:#F44747;cursor:pointer;font-size:10px;float:right}

.view-switch{margin-top:8px;font-size:11px;color:#666}
.view-switch span{cursor:pointer;padding:2px 6px}
.switch-active{color:#9CDCFE}
.row-manual{background:rgba(206,145,120,0.06);border-left:2px solid #CE9178;padding-left:4px}
.card-scheduled{border-color:#569CD6!important;background:rgba(86,156,214,0.05)}
.footer{margin-top:12px;padding-top:8px;border-top:1px solid #333;color:#666;font-size:10px}

.modal-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.7);z-index:100;justify-content:center;align-items:center}
.modal-overlay.show{display:flex}
.modal{background:#1E1E1E;border:1px solid #444;border-radius:8px;padding:20px;max-width:480px;width:90%}
.modal h3{color:#569CD6;margin-bottom:12px;font-size:13px}
.modal p{font-size:12px;color:#CCC;margin-bottom:10px}
.modal input,.modal select{padding:6px 10px;background:#0C0C0C;color:#DCDCAA;border:1px solid #666;font-family:inherit;font-size:12px;border-radius:4px;margin:6px 0;width:100%;box-sizing:border-box}
.modal input:focus,.modal select:focus{outline:none;border-color:#569CD6}
.modal select{appearance:auto;-webkit-appearance:auto;cursor:pointer}
.modal select option{background:#1E1E1E;color:#CCC}
.modal input[type="date"],.modal input[type="month"]{color-scheme:dark;padding:6px 10px}
.modal label{color:#9CDCFE;font-size:12px;display:block;margin-top:10px}
.modal .hint{color:#6A9955;font-size:10px}
.modal-actions{margin-top:14px;display:flex;gap:8px;justify-content:flex-end}
.multiselect{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:6px}
.multiselect label{display:inline-flex!important;align-items:center;gap:3px;margin-top:0!important;cursor:pointer;font-size:12px;color:#CCC}
.multiselect label:hover{color:#9CDCFE}
.multiselect input[type=checkbox]{width:auto!important;margin:0!important;accent-color:#569CD6}
