@import url("assets/system/color-tokens.css");@import url("assets/system/typography-tokens.css");
.checklist-page .checklist-shell{padding:20px 24px 64px}.checklist-page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}.back-overview{display:inline-flex;align-items:center;gap:8px;color:var(--color-text-secondary);text-decoration:none;font-size:14px;line-height:20px;font-weight:400}.checklist-page-head h1{margin:4px 0 0;font-size:20px;line-height:28px;font-weight:700}.checklist-page-head p{margin:0;font-size:16px;line-height:20px;color:var(--color-text-secondary);font-weight:400}.step-count{font-size:16px;line-height:20px;color:var(--color-text-secondary);padding-top:4px}.step-count strong{font-weight:500}.stepper{height:40px;margin:4px auto 12px;max-width:960px;display:grid;grid-template-columns:auto 1fr auto 1fr auto;align-items:center;gap:12px}.stepper i{height:2px;background:var(--color-border)}.step{border:0;background:transparent;display:flex;align-items:center;gap:12px;padding:0;color:var(--color-text-secondary);font-size:14px;line-height:20px;cursor:pointer}.step span{width:32px;height:32px;border-radius:16px;background:var(--gray-100);display:grid;place-items:center;color:var(--color-text-primary);font-weight:500}.step b{font-weight:500;white-space:nowrap}.step.is-active{color:var(--color-text-primary)}.step.is-active span{background:var(--highlight-selected-bg);color:var(--highlight-selected-fg)}
.checklist-layout{display:grid;grid-template-columns:minmax(0,1fr) 352px;gap:20px;align-items:start}.checklist-main{display:grid;gap:12px}.form-section,.summary-panel{border:1px solid var(--color-border);border-radius:12px;background:var(--brand-white)}.form-section{padding:12px 16px}.form-section>header{display:flex;align-items:center;gap:12px;margin-bottom:8px}.section-number{width:32px;height:32px;border-radius:16px;background:var(--gray-100);display:grid;place-items:center;font-size:16px;line-height:20px;font-weight:600}.form-section h2,.summary-panel h2{margin:0;font-size:20px;line-height:28px;font-weight:600}.field-grid{display:grid;gap:12px 16px}.field-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.field-grid label,.side-field{font-size:14px;line-height:20px;font-weight:500;color:var(--color-text-secondary)}.field-grid select,.readonly-control,.segmented{width:100%;height:40px;margin-top:4px;border:1px solid var(--color-border-strong);border-radius:8px;background:var(--brand-white);font-size:16px;line-height:24px;font-weight:400;color:var(--color-text-primary)}.field-grid select{padding:0 16px}.side-field{border:0;margin:0;padding:0}.side-field legend{padding:0}.segmented{display:grid;grid-template-columns:1fr 1fr;overflow:hidden}.segmented button{border:0;background:transparent;font-size:14px;line-height:20px;font-weight:500;cursor:pointer}.segmented button.is-selected{background:var(--highlight-selected-bg);color:var(--highlight-selected-fg);border-radius:8px}.readonly-control{display:flex;align-items:center;justify-content:space-between;padding:0 12px;background:var(--gray-050)}.readonly-control img{width:20px;height:20px}.field-grid label small{display:block;margin-top:4px;font-size:12px;line-height:16px;font-weight:400;color:var(--color-text-secondary)}.helper{margin:8px 0 0;font-size:12px;line-height:16px;font-weight:400;color:var(--color-text-secondary)}
.image-block{margin-top:8px}.image-block h3{margin:0 0 8px;font-size:16px;line-height:20px;font-weight:500}.image-block h3 span{font-weight:400;color:var(--color-text-secondary)}.image-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.image-slot{height:80px;border:1px dashed var(--color-border-strong);border-radius:8px;display:grid;place-items:center;align-content:center;gap:0;cursor:pointer;color:var(--color-text-secondary)}.image-slot span,.image-slot em{font-size:12px;line-height:16px;font-style:normal;font-weight:400}.image-slot strong{font-size:24px;line-height:24px;font-weight:400;color:var(--color-text-primary)}.image-slot input{position:absolute;width:1px;height:1px;opacity:0}.checklist-section{padding-bottom:12px}.checklist-section>header{margin-bottom:4px}.check-row{display:flex;align-items:center;gap:8px;font-size:14px;line-height:20px;margin-top:4px;cursor:pointer}.check-row input{appearance:none;width:20px;height:20px;border:1px solid var(--gray-700);border-radius:4px;margin:0;display:grid;place-items:center}.check-row input:checked{background:var(--highlight-selected-bg);border-color:var(--highlight-selected-bg)}.check-row input:checked::after{content:"";width:20px;height:20px;background:url("assets/trade-journal/ui/checkbox-checked.svg") center/20px 20px no-repeat}.check-row input:focus-visible,.field-grid select:focus-visible,.segmented button:focus-visible,.image-slot:focus-within,.ready-button:focus-visible,.back-overview:focus-visible{outline:2px solid var(--brand-black);outline-offset:2px}
.summary-panel{position:sticky;top:76px;padding:16px 20px}.summary-panel h2{padding-bottom:12px;border-bottom:1px solid var(--color-border)}.summary-group{padding:12px 0;border-bottom:1px solid var(--color-border);display:grid;gap:8px}.summary-group>div{display:flex;justify-content:space-between;gap:16px;font-size:14px;line-height:20px}.summary-group span{color:var(--color-text-secondary)}.summary-group strong{text-align:right;font-weight:500}.info-box{margin-top:12px;padding:12px;border-radius:8px;background:var(--gray-050);display:flex;gap:8px;align-items:flex-start}.info-box>span{width:24px;height:24px;flex:0 0 24px;display:grid;place-items:center}.info-box>span img{display:block;width:24px;height:24px}.info-box p{margin:0;font-size:12px;line-height:16px;color:var(--color-text-secondary)}.ready-button{width:100%;height:40px;margin-top:12px;border:0;border-radius:20px;background:var(--brand-yellow);color:var(--brand-black);font-size:14px;line-height:20px;font-weight:500;cursor:pointer}.ready-button:disabled{opacity:.55;cursor:default}.no-order{margin:4px 0 0;text-align:center;font-size:12px;line-height:16px;color:var(--color-text-secondary)}
@media(max-width:1279px){html,body,.trade-journal-canvas{min-width:1280px}.checklist-layout{grid-template-columns:minmax(0,1fr) 352px}}

.back-overview .inline-ui-icon,.image-slot strong img{width:24px;height:24px;display:block}

/* State 3.2 — System / Strategy / Event / Checklist loading. Page-local only. */
.checklist-select-shell{position:relative;margin-top:4px}.checklist-select-shell .field-grid select,.checklist-select-shell select{margin-top:0}.checklist-select-shell select:disabled{opacity:1;background:var(--gray-050);cursor:default}.checklist-select-shell.is-loading select{color:transparent}.checklist-select-skeleton{position:absolute;left:16px;right:40px;top:12px;height:16px;border-radius:8px;background:var(--gray-100);pointer-events:none;user-select:none}.checklist-select-skeleton[hidden]{display:none}.checklist-template-skeleton{display:grid;gap:8px;pointer-events:none;user-select:none}.checklist-template-skeleton span{display:block;height:20px;border-radius:8px;background:var(--gray-100)}.checklist-template-skeleton span:nth-child(2){width:88%}.checklist-template-skeleton span:nth-child(3){width:76%}.checklist-content[aria-busy="true"]{min-height:76px}.checklist-load-feedback{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:8px}.checklist-load-status{margin:0;font-size:12px;line-height:16px;font-weight:400;color:var(--color-text-secondary)}.checklist-load-status.is-error{color:var(--color-text-primary)}.checklist-load-retry{height:32px;border:1px solid var(--color-border-strong);border-radius:16px;padding:0 12px;background:var(--brand-white);color:var(--color-text-primary);font-size:14px;line-height:20px;font-weight:500;cursor:pointer}.checklist-load-retry:disabled{opacity:.55;cursor:default}.checklist-message-state{min-height:76px;display:flex;align-items:center;font-size:14px;line-height:20px;color:var(--color-text-secondary)}

.checklist-template-error{min-height:76px;display:grid;align-content:center;gap:8px;padding:12px 0;color:var(--color-text-primary)}
.checklist-template-error strong{font-size:16px;line-height:20px;font-weight:500}
.checklist-template-error p{margin:0;font-size:14px;line-height:20px;font-weight:400;color:var(--color-text-secondary)}
.checklist-template-error .checklist-load-retry{justify-self:start}
.checklist-template-error:focus{outline:2px solid var(--brand-black);outline-offset:2px}

/* State 3.8 — field-level validation. Page-local only; uses existing neutral tokens. */
.field-error{display:block;margin-top:4px;font-size:14px;line-height:20px;font-weight:400;color:var(--color-text-primary)}
.field-error[hidden]{display:none}
.field-grid label.has-error select,.side-field.has-error .segmented{border-color:var(--color-text-primary);box-shadow:0 0 0 1px var(--color-text-primary)}
.field-grid select[aria-invalid="true"]:focus-visible,.segmented[aria-invalid="true"] button:focus-visible{outline:2px solid var(--brand-black);outline-offset:2px}
#system,#strategy,#event,#symbol,#sideGroup,#timeframe,#session,#news{scroll-margin-top:64px}
/* State 3.9 — per-image upload state. Page-local only. */
.image-slot.is-uploading{cursor:default;background:var(--gray-050)}
.image-slot.is-uploading strong img{animation:checklist-image-upload-spin 1s linear infinite}
.image-slot.is-uploading input:disabled{pointer-events:none}
.image-slot.is-uploaded{border-style:solid}
.image-slot.is-upload-error{border-style:solid}
.image-slot em[role="progressbar"]{min-width:64px;text-align:center}
@keyframes checklist-image-upload-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.image-slot.is-uploading strong img{animation:none}}

/* State 3.10 — per-image upload error/retry. Page-local only. */
.image-slot{position:relative}
.image-slot.is-upload-error{gap:4px;cursor:pointer}
.image-slot.is-upload-error>span,.image-slot.is-upload-error>strong,.image-slot.is-upload-error>em{display:none}
.image-upload-error-detail{position:absolute;inset:4px;display:grid;align-content:center;gap:4px;justify-items:center;text-align:center;padding:0 4px;box-sizing:border-box}
.image-upload-error-detail[hidden]{display:none}
.image-upload-error-detail b{font-size:12px;line-height:16px;font-weight:500;color:var(--color-text-primary)}
.image-upload-error-detail small{font-size:12px;line-height:16px;font-weight:400;color:var(--color-text-secondary);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.image-upload-error-actions{display:flex;align-items:center;justify-content:center;gap:8px}
.image-upload-retry,.image-upload-cancel{height:32px;border-radius:16px;padding:0 12px;font-size:14px;line-height:20px;font-weight:500;cursor:pointer}
.image-upload-retry{border:0;background:var(--brand-yellow);color:var(--brand-black)}
.image-upload-cancel{border:1px solid var(--color-border-strong);background:var(--brand-white);color:var(--color-text-primary)}
.image-upload-retry:disabled,.image-upload-cancel:disabled{opacity:.55;cursor:default}

/* State 3.11 — Trade Plan creating. Page-local only. */
.trade-plan-creating-state{margin-top:12px;display:grid;grid-template-columns:20px minmax(0,1fr);gap:8px;align-items:start}
.trade-plan-creating-state[hidden]{display:none}
.trade-plan-creating-state>img{width:20px;height:20px;display:block;animation:checklist-trade-plan-saving-spin 1s linear infinite}
.trade-plan-creating-state strong{display:block;font-size:16px;line-height:20px;font-weight:500;color:var(--color-text-primary)}
.trade-plan-creating-state p{margin:4px 0 0;font-size:14px;line-height:20px;font-weight:400;color:var(--color-text-secondary)}
.step.is-complete{color:var(--color-text-primary)}
.image-slot.is-plan-locked{cursor:default}
@keyframes checklist-trade-plan-saving-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.trade-plan-creating-state>img{animation:none}}
/* State 3.12 — Trade Plan created. Page-local only. */
.trade-plan-success-state{margin-top:12px;display:grid;grid-template-columns:20px minmax(0,1fr);gap:8px;align-items:start}
.trade-plan-success-state[hidden]{display:none}
.trade-plan-success-state>img{width:20px;height:20px;display:block}
.trade-plan-success-state strong{display:block;font-size:16px;line-height:20px;font-weight:500;color:var(--color-text-primary)}
.trade-plan-success-state p{margin:4px 0 0;font-size:14px;line-height:20px;font-weight:400;color:var(--color-text-secondary)}
.trade-plan-success-state dl{margin:8px 0 0;display:grid;gap:4px}
.trade-plan-success-state dl>div{display:flex;justify-content:space-between;gap:16px;font-size:14px;line-height:20px}
.trade-plan-success-state dt{color:var(--color-text-secondary)}
.trade-plan-success-state dd{margin:0;text-align:right;font-weight:500;overflow-wrap:anywhere}
.trade-plan-error-state{margin-top:12px;padding:12px;border:1px solid var(--color-border-strong);border-radius:8px;background:var(--gray-050)}
.trade-plan-error-state[hidden]{display:none}
.trade-plan-error-state strong{display:block;font-size:16px;line-height:20px;font-weight:500;color:var(--color-text-primary)}
.trade-plan-error-state p{margin:4px 0 0;font-size:14px;line-height:20px;font-weight:400;color:var(--color-text-secondary)}
.trade-plan-error-state .trade-plan-error-detail:empty{display:none}

/* State 3.14 — Session expired / Draft recovery. Page-local only. */
.session-draft-state{margin-top:12px;padding:12px;border:1px solid var(--color-border-strong);border-radius:8px;background:var(--gray-050);display:grid;grid-template-columns:20px minmax(0,1fr);gap:8px;align-items:start}
.session-draft-state[hidden]{display:none}
.session-draft-state>img{width:20px;height:20px;display:block}
.session-draft-state strong{display:block;font-size:16px;line-height:20px;font-weight:500;color:var(--color-text-primary)}
.session-draft-state p{margin:4px 0 0;font-size:14px;line-height:20px;font-weight:400;color:var(--color-text-secondary)}
.session-draft-state .session-draft-saved{color:var(--color-text-primary)}
.session-draft-state .session-draft-warning{color:var(--color-text-primary)}
.session-draft-primary,.session-draft-retry{height:36px;margin-top:12px;border-radius:18px;padding:0 16px;font-size:14px;line-height:20px;font-weight:500;cursor:pointer}
.session-draft-primary{border:0;background:var(--brand-yellow);color:var(--brand-black)}
.session-draft-retry{border:1px solid var(--color-border-strong);background:var(--brand-white);color:var(--color-text-primary)}
.session-draft-primary:disabled,.session-draft-retry:disabled{opacity:.55;cursor:default}
.session-draft-state.is-recovered>img{display:none}
.session-draft-state.is-recovered{grid-template-columns:minmax(0,1fr)}