/* Approved input-to-dashboard illustration. HTML/CSS only. */
#input-dashboard { width:100%; min-width:0; container-type:inline-size; container-name:desk-illustration; }
#input-dashboard .desk-proposal { --desk-ink:#2d343f; --desk-muted:#6a7c96; --desk-line:#d9dee4; color-scheme:light; font-family:inherit; color:var(--desk-ink); margin:0; background:#eceff2; border-radius:9px; padding:30px 20px 25px; box-sizing:border-box; }
#input-dashboard .desk-proposal * { box-sizing:border-box; }
#input-dashboard p, #input-dashboard h3, #input-dashboard h4 { margin:0; }
#input-dashboard .floating-inputs { display:flex; flex-direction:column; gap:11px; list-style:none; margin:2px 0 0; padding:0; }
#input-dashboard .floating-input { display:grid; grid-template-columns:28px 82px minmax(0,1fr); align-items:center; gap:11px; min-height:52px; padding:11px 16px; border:1px solid #dadee4; border-radius:9px; background:#fafafb; box-shadow:0 9px 20px -14px #48546540,0 2px 4px #48546504; }
#input-dashboard .input-paste { width:77%; margin-left:16%; background:#f4f6f8; }
#input-dashboard .input-jira { width:83%; margin-left:3%; background:#f8f9fa; }
#input-dashboard .input-api { width:84%; margin-left:12%; }
#input-dashboard .input-email { width:96%; margin-left:1%; grid-template-columns:28px 82px minmax(0,1fr) auto; background:#fff; border-color:#cdd3dc; box-shadow:0 16px 25px -15px #404b5b50,0 3px 6px #48546508; }
#input-dashboard .floating-icon { display:grid; place-items:center; width:28px; height:28px; color:#5d6d83; background:#e9ecf0; border-radius:7px; }
#input-dashboard .input-jira .floating-icon { color:#6a889b; background:#eff3f5; }
#input-dashboard .input-api .floating-icon { color:#61738a; background:#eff1f3; }
#input-dashboard .input-email .floating-icon { color:#5d6d84; background:#e6eaf0; }
#input-dashboard .floating-source { font-size:11px; line-height:1.5; color:#5d6d83; white-space:nowrap; }
#input-dashboard .floating-subject { min-width:0; font-size:12px; line-height:1.5; font-weight:400; color:#5d6d83; }
#input-dashboard .input-paste .floating-source, #input-dashboard .input-paste .floating-subject { color:#677790; }
#input-dashboard .input-email .floating-source { color:#5d6d83; }
#input-dashboard .input-email .floating-subject { color:#536174; }
#input-dashboard .arrival-label { font-size:9px; line-height:1.5; border-radius:20px; padding:3px 8px; color:#5d6d83; background:#eef1f5; border:1px solid #d8dde5; white-space:nowrap; }
#input-dashboard .arrival-connector { height:32px; display:flex; justify-content:center; align-items:center; color:#6f8199; }
#input-dashboard .arrival-connector .desk-icon { width:17px; height:24px; }
#input-dashboard .dashboard-window { background:#fff; border:1px solid #d6dbe2; border-radius:12px; box-shadow:0 22px 40px -27px #45516140; padding:0 23px 7px; }
#input-dashboard .dashboard-header { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:21px 0 18px; border-bottom:1px solid #e3e6eb; }
#input-dashboard .dashboard-title { display:flex; align-items:center; gap:9px; font-size:16px; line-height:1.4; font-weight:400; letter-spacing:-.3px; color:#495668; }
#input-dashboard .desk-symbol { width:19px; height:20px; display:inline-block; position:relative; flex-shrink:0; background:linear-gradient(#7e8ea4,#7e8ea4) 0 3px/19px 4px no-repeat; }
#input-dashboard .desk-symbol::before, #input-dashboard .desk-symbol::after { content:''; position:absolute; top:10px; height:9px; width:4px; background:#7e8ea4; }
#input-dashboard .desk-symbol::before { left:0; }
#input-dashboard .desk-symbol::after { right:0; }
#input-dashboard .team-label { display:flex; align-items:center; gap:6px; font-size:10px; line-height:1.5; color:#607189; }
#input-dashboard .case-overview { display:grid; grid-template-columns:repeat(3,1fr); padding:20px 0; border-bottom:1px solid #e3e6eb; }
#input-dashboard .case-total { display:flex; align-items:baseline; justify-content:center; gap:8px; }
#input-dashboard .case-total + .case-total { border-left:1px solid #e0e4e9; }
#input-dashboard .case-total strong { font-size:23px; line-height:1.2; font-weight:400; color:#4e5c6f; font-variant-numeric:tabular-nums; }
#input-dashboard .case-total span { font-size:10px; line-height:1.5; color:#5d6d83; }
#input-dashboard .case-list-heading { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:20px 0 12px; }
#input-dashboard .case-list-heading h4 { font-size:12px; line-height:1.5; color:#58677c; font-weight:400; }
#input-dashboard .case-list-heading span { font-size:9px; line-height:1.5; color:#64758d; }
#input-dashboard .case-list { list-style:none; margin:0; padding:0; }
#input-dashboard .case-list > li + li { border-top:1px solid #e9ebef; }
#input-dashboard .case-row { display:flex; align-items:center; gap:11px; padding:16px 4px; }
#input-dashboard .case-source-icon { display:grid; place-items:center; width:29px; height:31px; border-radius:5px; background:#f1f3f5; color:#65778e; flex-shrink:0; }
#input-dashboard .case-title-group { flex:1; min-width:0; }
#input-dashboard .case-title-group strong { display:block; font-size:12px; line-height:1.55; font-weight:400; color:#65768e; }
#input-dashboard .case-title-group p, #input-dashboard .case-subline { display:block; font-size:10px; line-height:1.6; margin-top:3px; color:#697a94; }
#input-dashboard .case-status { display:flex; align-items:center; gap:5px; font-size:9px; line-height:1.5; color:#5f7087; white-space:nowrap; }
#input-dashboard .case-status i { width:5px; height:5px; border-radius:50%; background:#929fb2; }
#input-dashboard .case-status.waiting { color:#82775e; }
#input-dashboard .case-status.waiting i { background:#c4b38d; }
#input-dashboard .case-status.approval { color:#5d6d83; }
#input-dashboard .case-status.approval i { background:#9ba7b8; }
#input-dashboard .case-list > li.new-case { border:1px solid #d1d7e0; border-left:3px solid #909db0; background:#f0f2f6; border-radius:7px; margin:0 -7px 7px; }
#input-dashboard .new-case + li { border-top:0; }
#input-dashboard .new-case summary { list-style:none; padding:15px 12px; }
#input-dashboard .new-case summary::-webkit-details-marker { display:none; }
#input-dashboard .new-case .case-source-icon { color:#5d6d83; background:#dfe4ec; }
#input-dashboard .new-case .case-title-group strong { color:#4c596b; }
#input-dashboard .new-case .case-subline { color:#5d6d83; }
#input-dashboard .new-label { display:inline-block; color:#64768e; font-size:9px; line-height:1.5; margin-right:7px; }
#input-dashboard .case-open { display:flex; align-items:center; gap:6px; font-size:10px; line-height:1.5; color:#5d6d83; white-space:nowrap; }
#input-dashboard .case-open .desk-icon { width:14px; height:14px; }
#input-dashboard details[open] .case-open .desk-icon { transform:rotate(90deg); }
#input-dashboard .case-peek { border-top:1px solid #d8dde4; padding:15px 16px 18px; margin:0 12px; }
#input-dashboard .case-peek p { font-size:12px; line-height:1.8; color:#63748b; }
#input-dashboard .case-peek p + p { margin-top:8px; }
#input-dashboard .case-peek span { display:block; margin-top:13px; font-size:10px; line-height:1.6; color:#5d6d84; }
#input-dashboard .proposal-caption { display:flex; align-items:center; justify-content:center; gap:7px; padding-top:22px; font-size:9px; line-height:1.5; letter-spacing:1.2px; color:#667890; text-align:center; }
#input-dashboard .desk-icon { width:15px; height:15px; flex-shrink:0; stroke-width:1.5; }
@container desk-illustration (max-width:380px) {
#input-dashboard .desk-proposal { padding:23px 16px 21px; }
#input-dashboard .floating-inputs { gap:10px; }
#input-dashboard .floating-input { grid-template-columns:28px minmax(0,1fr) auto; gap:2px 10px; padding:10px 12px; }
#input-dashboard .floating-icon { grid-column:1; grid-row:1 / 3; }
#input-dashboard .floating-source { grid-column:2; grid-row:1; font-size:10px; }
#input-dashboard .floating-subject { grid-column:2; grid-row:2; font-size:11px; }
#input-dashboard .arrival-label { grid-column:3; grid-row:1 / 3; padding-inline:6px; font-size:8px; }
#input-dashboard .input-paste { width:88%; margin-left:10%; }
#input-dashboard .input-jira { width:90%; margin-left:0; }
#input-dashboard .input-api { width:91%; margin-left:8%; }
#input-dashboard .input-email { width:98%; margin-left:0; }
#input-dashboard .dashboard-window { padding:0 16px 5px; }
#input-dashboard .case-total { flex-direction:column; align-items:center; gap:4px; }
#input-dashboard .case-list-heading { padding-top:17px; }
#input-dashboard .case-row { flex-wrap:wrap; gap:8px; }
#input-dashboard .case-title-group { flex-basis:calc(100% - 42px); }
#input-dashboard .case-status, #input-dashboard .case-open { margin-left:37px; }
#input-dashboard .new-case summary { padding:13px 10px; }
#input-dashboard .case-peek { margin-inline:10px; padding-inline:0; }
#input-dashboard .team-label { font-size:9px; }
}
@container desk-illustration (max-width:320px) {
#input-dashboard .floating-input { padding-inline:10px; gap:2px 8px; }
#input-dashboard .dashboard-header { gap:8px; }
#input-dashboard .dashboard-title { font-size:15px; }
#input-dashboard .team-label .desk-icon { display:none; }
}
#inputs .landing-copy { min-width:0; padding:24px 0; }
#inputs .copy-eyebrow { font-size:10px; line-height:1.5; font-weight:400; letter-spacing:.2em; color:var(--body); margin:0 0 28px; }
#inputs .landing-copy h3 { font-size:clamp(32px,4.15vw,47px); line-height:1.25; font-weight:var(--font-weight-heading); letter-spacing:-.02em; margin:0 0 28px; color:var(--ink); }
#inputs .landing-copy > p:not(.copy-eyebrow) { font-size:14px; line-height:1.95; font-weight:400; color:#5d6d83; margin:0; }
#inputs .landing-copy > p + p:not(.copy-eyebrow) { margin-top:17px; }
#inputs .input-explanation { border-top:1px solid #d5dae2; padding-top:25px; margin-top:31px; }
#inputs .input-explanation .input-label { font-size:8px; line-height:1.5; letter-spacing:1.4px; color:#677790; margin:0 0 13px; }
#inputs .input-methods { display:flex; flex-wrap:wrap; align-items:center; gap:8px 0; list-style:none; padding:0; margin:0; color:#5d6d83; font-size:12px; line-height:1.6; }
#inputs .input-methods li + li::before { content:'ยท'; display:inline-block; padding:0 11px; color:#6c7d96; }
#inputs .document-note { font-size:11px; line-height:1.9; color:#63748c; margin:14px 0 0; }
#inputs .copy-takeaway { display:flex; align-items:center; gap:10px; margin-top:31px; color:#5d6d84; font-size:11px; line-height:1.7; }
#inputs .copy-takeaway .desk-icon { width:19px; height:19px; flex-shrink:0; stroke-width:1.5; }
#input-dashboard .new-case summary { cursor: pointer; }
#inputs { scroll-margin-top: 30px; }
@media (max-width: 760px) {
#inputs { grid-template-columns: 1fr; gap: 10px; }
#inputs .landing-copy { padding: 28px 0 7px; }
#inputs .landing-copy h3 { font-size: 38px; }
#inputs .copy-eyebrow { margin-bottom: 20px; }
}
@media (max-width: 480px) {
#inputs .landing-copy h3 { font-size: 34px; }
#inputs .landing-copy > p:not(.copy-eyebrow) { font-size: 13px; }
#inputs .input-methods { font-size: 11px; }
#inputs .input-methods li + li::before { padding-inline: 8px; }
}