:root{--brand:#ff6600;} body{overflow:hidden;} .hidden,[hidden]{display:none!important;} .icon{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
/* Local ticket draft only. Metrics approximate the PRD screenshot, not Figma tokens. */
.activity{grid-template-rows:54px minmax(0,1fr) auto!important;}
.composer{min-height:115px!important;max-height:245px;overflow-y:auto;}
.comment-meta{flex-wrap:wrap;gap:2px 8px;}
.comment-author{min-width:0;overflow-wrap:anywhere;}
.comment-time{font-variant-numeric:tabular-nums;}
.comment-input:disabled,.upload-button:disabled{cursor:not-allowed;}
    /* 工单列表背景 */
    .workspace { position: relative; grid-column: 2; grid-row: 2; min-width: 0; min-height: 0; margin: 0 8px 8px 4px; overflow: hidden; border-radius: 8px; background: #fff; }
    .ticket-background { position: absolute; z-index: 0; inset: 0; display: grid; grid-template-columns: 202px minmax(0, 1fr); color: #5e6670; background: #fff; }
    .view-sidebar { min-width: 0; padding: 12px 10px; border-right: 1px solid #e9ebee; background: #fff; }
    .view-search { height: 32px; display: flex; align-items: center; gap: 7px; padding: 0 11px; border-radius: 16px; color: #a2a8af; background: #f5f6f8; font-size: 12px; }
    .view-search .icon { width: 14px; height: 14px; }
    .view-heading { height: 39px; display: flex; align-items: center; gap: 7px; padding: 6px 7px 0; color: #303740; font-size: 12px; font-weight: 600; }
    .view-heading .icon { width: 14px; height: 14px; color: #747c85; }
    .tree-branch { position: relative; margin-left: 5px; padding-left: 10px; }
    .tree-branch::before { content: ""; position: absolute; top: 0; bottom: 11px; left: 0; border-left: 1px solid #eceef1; }
    .view-item { width: 100%; height: 34px; display: flex; align-items: center; gap: 8px; padding: 0 11px; border: 0; border-radius: 5px; color: #606871; background: transparent; font-size: 12px; text-align: left; }
    .view-item .icon { width: 13px; height: 13px; color: #8e959d; }
    .view-item.active { color: var(--brand); background: #fff1e8; }
    .view-item.active .icon { color: var(--brand); }
    .view-count { margin-left: auto; color: #a9aeb4; font-size: 10px; }
    .list-main { min-width: 0; display: grid; grid-template-rows: 45px 43px minmax(0, 1fr) 46px; }
    .business-tabs { display: flex; align-items: flex-end; gap: 26px; padding: 0 18px; border-bottom: 1px solid #eceef1; }
    .business-tab { position: relative; height: 45px; padding: 0 2px; border: 0; color: #656d76; background: transparent; font-size: 12px; }
    .business-tab.active { color: var(--brand); }
    .business-tab.active::after { content: ""; position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: var(--brand); }
    .list-toolbar { display: flex; align-items: center; min-width: 0; padding: 0 17px; border-bottom: 1px solid #f0f1f3; }
    .breadcrumb { display: flex; align-items: center; gap: 7px; min-width: 0; color: #343b43; font-size: 12px; }
    .breadcrumb .icon { width: 14px; height: 14px; color: #737b84; }
    .breadcrumb-separator { color: #b7bbc0; }
    .table-actions { display: flex; align-items: center; gap: 18px; margin-left: auto; }
    .table-action { height: 30px; display: flex; align-items: center; gap: 5px; padding: 0; border: 0; color: #59616a; background: transparent; font-size: 11px; white-space: nowrap; }
    .table-action .icon { width: 14px; height: 14px; color: #7f8790; }
    .table-wrap { min-width: 0; min-height: 0; padding: 12px 17px; overflow: hidden; }
    .fake-table { width: 100%; min-width: 850px; border-collapse: collapse; table-layout: fixed; font-size: 11px; }
    .fake-table col:nth-child(1) { width: 55px; }
    .fake-table col:nth-child(2) { width: 112px; }
    .fake-table col:nth-child(3) { width: 128px; }
    .fake-table col:nth-child(4) { width: 165px; }
    .fake-table col:nth-child(5) { width: 170px; }
    .fake-table col:nth-child(6) { width: 88px; }
    .fake-table th, .fake-table td { height: 40px; padding: 0 11px; overflow: hidden; border: 1px solid #eceef1; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
    .fake-table th { color: #858c94; background: #fafbfc; font-weight: 400; }
    .fake-table td { color: #525a63; background: #fff; }
    .fake-table tr:hover td { background: #fffdfb; }
    .status { display: inline-flex; align-items: center; height: 20px; padding: 0 9px; border-radius: 10px; color: #fff; background: #ff8d75; font-size: 10px; line-height: 20px; }
    .status.blue { background: #5aa9ff; }
    .status.green { background: #53bd95; }
    .pagination { display: flex; align-items: center; justify-content: flex-end; gap: 6px; padding: 0 20px; border-top: 1px solid #f2f3f5; }
    .page-button { min-width: 27px; height: 26px; display: grid; place-items: center; padding: 0 7px; border: 1px solid #e4e7ea; border-radius: 4px; color: #777f88; background: #fff; font-size: 11px; }
    .page-button .icon { width: 12px; height: 12px; }
    .page-button.active { color: var(--brand); border-color: var(--brand); }
    .page-total { margin-right: 5px; color: #91979e; font-size: 11px; }

    /* 工作区遮罩和局部详情浮层 */
    .scrim { position: absolute; z-index: 1; inset: 0; background: rgba(35, 43, 52, .29); }
    .ticket-detail { position: absolute; z-index: 2; top: 18px; right: 28px; bottom: 35px; left: 42px; display: grid; grid-template-columns: minmax(0, 71.5fr) minmax(0, 28.5fr); grid-template-rows: 48px minmax(0, 1fr); overflow: visible; background: #fafafa; box-shadow: 0 3px 14px rgba(20, 29, 38, .2); }
    .detail-toolbar { grid-column: 1; grid-row: 1; display: flex; align-items: center; padding: 0 14px; border-bottom: 1px solid #e8eaed; background: #fff; }
    .toolbar-left, .toolbar-right { display: flex; align-items: center; gap: 5px; pointer-events: none; }
    .toolbar-right { margin-left: auto; margin-right: 12px; }
    .tool-icon { width: 28px; height: 28px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 5px; color: #8e959d; background: transparent; cursor: default; }
    .tool-icon .icon { width: 15px; height: 15px; }
    .toolbar-divider { display: none; }
    .close-detail { position: absolute; z-index: 5; top: -9px; right: -9px; width: 20px; height: 20px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; color: #fff; background: #59616a; pointer-events: none; }
    .close-detail .icon { width: 10px; height: 10px; stroke-width: 1.6; }
    .detail-main { grid-column: 1; grid-row: 2; min-width: 0; min-height: 0; overflow: hidden; padding: 14px 22px 20px; border-right: 1px solid #e5e7e9; background: #fafafa; line-height: 1.55; }
    .record-title { min-height: 58px; display: flex; align-items: center; padding: 0 16px; margin-bottom: 12px; border: 1px solid #eff0f2; color: #353c43; background: #fff; font-size: 14px; }
    .record-tabs { height: 40px; display: flex; align-items: flex-end; gap: 24px; border-bottom: 1px solid #e8eaed; pointer-events: none; }
    .record-tab { position: relative; height: 40px; padding: 0 1px 10px; border: 0; color: #535b64; background: transparent; font-size: 13px; cursor: default; }
    .record-tab.active { color: var(--brand); }
    .record-tab.active::after { content: ""; position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: var(--brand); }
    .form-grid { display: block; padding-top: 13px; pointer-events: none; }
    .field { min-width: 0; margin-bottom: 12px; }
    .field label { display: block; margin-bottom: 4px; color: #69727c; font-size: 13px; }
    .required::before { content: "*"; margin-right: 2px; color: #ff4d4f; }
    .control { width: 100%; height: 36px; padding: 7px 11px; border: 1px solid #e4e6e9; border-radius: 3px; outline: 0; color: #424951; background: #fff; font-size: 13px; line-height: 1.55; pointer-events: none; }
    textarea.control { height: 36px; resize: none; overflow: hidden; }
    .control.disabled { color: #7895be; background: #f5f7fa; }
    .control-wrap { position: relative; }
    .control-wrap .control { padding-right: 34px; }
    .control-wrap .icon { position: absolute; top: 11px; right: 11px; width: 14px; height: 14px; color: #a6acb3; pointer-events: none; }
    .control-wrap.calendar-left .control { padding-right: 11px; padding-left: 34px; background: #fff; }
    .control-wrap.calendar-left .icon { right: auto; left: 10px; color: #a6acb3; }
    .field-note { margin: -4px 0 12px; color: #6d747c; font-size: 12px; }

    .activity { position: relative; grid-column: 2; grid-row: 1 / 3; min-width: 0; min-height: 0; display: grid; grid-template-rows: 54px minmax(0, 1fr) 115px; overflow: hidden; border-left: 1px solid #e5e7e9; background: #fafafa; box-shadow: -2px 0 5px rgba(31, 40, 49, .035); line-height: 1.55; }
    .activity-tabs { height: 54px; display: flex; align-items: flex-end; gap: 24px; padding: 0 13px; border-bottom: 1px solid #e6e8ea; background: #fbfbfb; }
    .activity-tab { position: relative; height: 54px; padding: 18px 1px 10px; color: var(--brand); font-size: 13px; }
    .activity-tab::after { content: ""; position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: var(--brand); }
    .activity-log-label { height: 54px; padding: 18px 1px 10px; color: #4a525b; font-size: 13px; user-select: none; pointer-events: none; }
    .comment-list {
      min-height: 0;
      overflow-y: auto;
      padding: 9px 13px 18px;
      background: #fafafa;
      scrollbar-width: thin;
      scrollbar-color: rgba(126, 132, 138, .34) transparent;
    }
    .comment-list::-webkit-scrollbar { width: 9px; }
    .comment-list::-webkit-scrollbar-track { background: transparent; }
    .comment-list::-webkit-scrollbar-thumb {
      min-height: 44px;
      border: 2px solid transparent;
      border-radius: 999px;
      background: rgba(126, 132, 138, .34);
      background-clip: padding-box;
    }
    .comment-list::-webkit-scrollbar-thumb:hover { background-color: rgba(126, 132, 138, .46); }
    .comment { position: relative; display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 8px; padding: 8px 0 13px; }
    .comment-avatar { position: relative; width: 25px; height: 25px; display: block; border-radius: 50%; color: #fff; background: var(--brand); }
    .comment-avatar svg { display: none; }
    .comment-avatar::before { content: ""; position: absolute; top: 5px; left: 9px; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
    .comment-avatar::after { content: ""; position: absolute; left: 5px; bottom: 4px; width: 15px; height: 8px; border-radius: 8px 8px 5px 5px; background: currentColor; }
    .comment-meta { display: flex; align-items: center; min-width: 0; margin-bottom: 3px; }
    .comment-author { color: #343b42; font-size: 13px; font-weight: 500; }
    .comment-time { margin-left: auto; color: #9aa0a6; font-size: 11px; white-space: nowrap; }
    .comment-content { color: #343b42; font-size: 13px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
    .composer { position: relative; min-height: 0; padding: 10px 13px 8px; border-top: 1px solid #e3e5e7; background: #fff; }
    .comment-input { width: 100%; height: 57px; padding: 0 0 8px; border: 0; outline: 0; resize: none; color: #343b42; background: transparent; font-size: 13px; line-height: 1.55; }
    .comment-input::placeholder { color: #c4c8cc; }
    .comment-input:disabled { color: #9da3aa; cursor: wait; }
    .composer-actions { height: 30px; display: flex; align-items: center; justify-content: space-between; }
    .upload-button { height: 26px; padding: 0 12px; border: 0; border-radius: 2px; color: #fff; background: var(--brand); font-size: 11px; }
    .send-comment { height: 26px; padding: 0 3px; border: 0; color: #1b73e8; background: transparent; font-size: 11px; }
    .send-comment:disabled { color: #1b73e8; cursor: default; }
    .detail-loading { position: absolute; z-index: 8; top: 50%; left: 50%; width: 24px; height: 24px; border: 2px solid transparent; border-top-color: var(--brand); border-right-color: var(--brand); border-radius: 50%; pointer-events: none; transform: translate(-50%, -50%); animation: detail-spin .68s linear infinite; }
    @keyframes detail-spin { to { transform: translate(-50%, -50%) rotate(360deg); } }

    @media (max-width: 1279px) {
      .top-controls { gap: 7px; }
      .store-name { max-width: 92px; }
      .ticket-detail { top: 16px; right: 18px; bottom: 16px; left: 20px; grid-template-columns: minmax(0, 71.5fr) minmax(0, 28.5fr); grid-template-rows: 44px minmax(0, 1fr); }
      .detail-main { padding: 10px 18px 12px; }
      .record-title { min-height: 44px; margin-bottom: 8px; }
      .record-tabs { height: 34px; }
      .record-tab { height: 34px; padding-bottom: 7px; }
      .form-grid { padding-top: 8px; }
      .field { margin-bottom: 6px; }
      .field label { margin-bottom: 2px; }
      .control, textarea.control { height: 32px; padding-top: 5px; padding-bottom: 5px; }
      .control-wrap .icon { top: 9px; }
      .field-note { margin: -2px 0 7px; }
      .table-actions { gap: 10px; }
    }

.workspace{position:fixed;left:164px;top:64px;right:8px;bottom:4px;margin:0;} .qc-quickmate-icon{display:inline-block;flex:0 0 18px;width:18px;height:18px;background:url(./assets/quickmate-reference.png) -11px -12px / 115px 40px no-repeat;} .qc-nav-item:has(.qc-quickmate-icon){gap:6px;} .close-detail{pointer-events:auto;cursor:pointer;} .detail-main{overflow-y:auto;} .background-only{pointer-events:none;} .comment-content{white-space:pre-wrap;overflow-wrap:anywhere;} .comment-error{color:#d4380d;font-size:12px;line-height:18px;} .comment-error button{color:#1b73e8;border:0;background:transparent;} .attachment-list{max-height:64px;overflow-y:auto;} .attachment-item{display:flex;gap:8px;align-items:center;color:#3978ff;font-size:12px;} .attachment-item span{overflow-wrap:anywhere;} .attachment-item button{margin-left:auto;border:0;background:transparent;color:#8c8c8c;} .composer:has(.attachment-item){min-height:150px;} .activity:has(.attachment-item){grid-template-rows:54px minmax(0,1fr) auto;} .mock-readonly{font-size:12px;color:#8c8c8c;padding:8px 0;} .ticket-detail{border-radius:2px;} .open-ticket-row{cursor:pointer;} .reopen{position:absolute;top:12px;right:20px;color:#1b73e8;border:1px solid #eee;background:white;padding:6px 12px;}

/* Production 2026-10-13: page-specific patch; shared styles and Golden unchanged. */
:root{--qc-sidebar-width:64px;}
.qc-sidebar{width:64px;}.qc-brand{height:56px;padding:12px 16px;overflow:hidden;}.qc-brand img{width:110px;max-width:none;flex-shrink:0;clip-path:inset(0 80px 0 0);}
.qc-nav{gap:4px;}.qc-nav-item{width:52px;min-height:36px;padding:0;justify-content:center;margin-left:6px;gap:0;}.qc-nav-item>span:not(.qc-quickmate-icon){display:none;}.qc-nav-item .qc-icon{width:18px;height:18px;}.qc-nav-item.active:before{left:0;height:20px;}.qc-settings{margin:0 0 8px 6px;}
.qc-plan{padding:0 22px;}.qc-plan-line{font-size:0;gap:0;}.qc-plan-line img{width:14px;height:14px;}.qc-plan-stats{gap:18px;}.qc-plan-stats>div{font-size:0;}.qc-plan-stats img{width:13px;height:13px;}.qc-quota{display:none;}
.qc-header{left:64px;}.qc-header-title{font-weight:500;}.qc-header-right{gap:10px;}
.workspace{left:64px;top:64px;right:0;bottom:0;border-radius:0;background:#f5f6fa;}
.ticket-background{grid-template-columns:60px 220px minmax(0,1fr);font-family:'Helvetica Neue',Helvetica,'PingFang SC','Microsoft YaHei',sans-serif;}
.ticket-background:before{content:'⠿';font-size:28px;padding:12px 22px;color:#34495e;border-right:1px solid #eceef1;}.view-sidebar{font-size:14px;}.view-item,.view-heading{font-size:14px;}.list-main{grid-template-rows:56px 48px minmax(0,1fr) 40px;}.business-tabs{gap:18px;}.business-tab{font-size:14px;}.business-tab.active{color:#1f2d3d;}.business-tab.active:after{display:none;}.table-wrap{padding:0 16px;}.fake-table{font-size:14px;}.table-actions{gap:20px;}.table-action{font-size:14px;}.pagination{font-size:14px;}.scrim{background:rgba(0,0,0,.2);}
.ticket-detail{top:12px;left:60px;right:60px;bottom:52px;grid-template-columns:minmax(0,69.28fr) minmax(0,30.72fr);grid-template-rows:52px minmax(0,1fr);border-radius:4px;overflow:visible;background:#fafafa;font-family:'Helvetica Neue',Helvetica,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',SimSun,sans-serif;color:#1f2d3d;box-shadow:0 2px 8px #0002;}
.detail-toolbar{padding:0 20px;background:white;border-color:#eef0f3;}.tool-icon{width:32px;height:32px;}.toolbar-right{gap:2px;margin-right:0;}.close-detail{width:20px;height:20px;top:-10px;right:-10px;background:#606266;}
.detail-main{padding:16px 24px 24px;background:#fafafa;overflow-y:auto;border-color:#ebedf0;scrollbar-width:thin;}.record-title{height:83px;min-height:83px;font-size:16px;font-weight:500;padding:0 16px;margin:0 8px 18px;background:#fff;border:1px solid #eef0f3;border-radius:4px;}
.record-tabs{height:40px;gap:16px;margin:0 -8px;border-color:#ebeef5;}.record-tab{font-size:14px;height:40px;padding:10px 0;}.record-tab.active:after{height:2px;}.form-grid{padding-top:20px;}.field{margin-bottom:24px;}.field label{font-size:14px;font-weight:500;line-height:20px;padding-bottom:8px;margin:0;color:rgba(0,0,0,.6);}.control,textarea.control{height:36px;font-size:14px;line-height:20px;border:1px solid #dcdfe6;border-radius:4px;padding:7px 9px;background:white;color:#606266;}.control.disabled{background:#f5f7fa;color:#c0c4cc;}.field-note{margin:-16px 0 24px;font-size:12px;color:#909399;}.control-wrap:not(.calendar-left) .control[placeholder]{padding-left:32px;}.control-wrap:not(.calendar-left):has(.control[placeholder]) .icon{left:9px;right:auto;}.range-control{display:flex;align-items:center;justify-content:space-between;color:#c0c4cc;}.range-control .icon{width:14px;height:14px;}.related-record{padding:16px;border:1px solid #ebeef5;color:#909399;font-size:14px;background:white;}
.activity{grid-template-rows:48px minmax(0,1fr) auto!important;border-left:1px solid #eaecef;background:#fafafa;box-shadow:none;}.activity-tabs{height:48px;padding:0 16px;gap:24px;background:#fafafa;align-items:stretch;border-color:#ebeef5;}.activity-tab,.activity-log-label{height:48px;padding:15px 0 13px;font-size:14px;line-height:20px;}.comment-list{padding:12px 24px;background:#fafafa;}.comment{grid-template-columns:32px minmax(0,1fr);gap:8px;padding:0 0 24px;}.comment-avatar{width:32px;height:32px;}.comment-avatar:before{width:12px;height:12px;top:6px;left:10px;}.comment-avatar:after{width:20px;height:10px;bottom:4px;left:6px;}.comment-author{font-size:14px;font-weight:400;color:#1f2d3d;}.comment-time{font-size:12px;color:#909399;}.comment-content{font-size:14px;line-height:21px;color:#48576a;white-space:pre-wrap;overflow-wrap:anywhere;}
.composer{height:138px;min-height:138px!important;max-height:270px;padding:12px 10px;display:flex;flex-direction:column;border-color:#dcdfe6;background:#fafafa;}.comment-input{height:42px;min-height:42px;flex:1;width:100%;padding:0;font:14px/21px 'Helvetica Neue',Helvetica,'PingFang SC','Microsoft YaHei',sans-serif;color:#1f2d3d;background:transparent;}.comment-input::placeholder{color:#b0b5be;}.composer-actions{height:32px;min-height:32px;flex-shrink:0;}.upload-button{height:32px;padding:8px 15px;border:1px solid #f60;border-radius:4px;font-size:14px;line-height:14px;}.send-comment{height:32px;min-width:60px;padding:8px 15px;border:1px solid transparent;font-size:14px;line-height:14px;color:#409eff;}.send-comment:disabled{color:#409eff;}.composer:has(.attachment-item),.composer:has(.comment-error:not([hidden])),.composer:has(.mock-readonly:not([hidden])){height:auto;min-height:166px!important;}.attachment-list{max-height:64px;flex-shrink:0;}.comment-error{flex-shrink:0;}.detail-loading{width:24px;height:24px;}.reopen{top:20px;right:60px;}
@media(max-width:1279px){.ticket-detail{left:32px;right:32px;bottom:40px;top:12px;grid-template-rows:52px minmax(0,1fr);}.detail-main{padding:16px 24px;}.record-title{height:83px;min-height:83px;margin-bottom:18px;}.field{margin-bottom:24px;}.control,textarea.control{height:36px;}.record-tabs,.record-tab{height:40px;}}
.activity-tabs button{border:0;background:none;cursor:pointer;font-family:inherit;color:#1f2d3d;position:relative;}.activity-tabs button.active{color:#f60;}.activity-tab:not(.active):after{display:none;}.activity-log-label.active:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#f60;}.activity-log-label{pointer-events:auto;}.local-log{padding:18px 24px;white-space:pre-wrap;font-size:14px;line-height:24px;overflow:auto;color:#606266;}.activity.show-log{grid-template-rows:48px minmax(0,1fr)!important;}.composer:has(.comment-error:not([hidden])) .comment-input{flex:none;}
.qc-brand img{width:120px;clip-path:inset(0 94px 0 0);}.qc-nav{padding:2px 0 0;}.qc-nav-item .qc-icon{width:18px!important;height:18px!important;}.detail-main{padding-top:18px;}.record-title{margin-left:0;margin-right:0;align-items:flex-start;padding:37px 16px 0;line-height:24px;}.form-grid{padding-top:16px;}textarea.control{display:block;}.companion-link{position:absolute;right:16px;bottom:12px;z-index:1;color:#909399;font-size:12px;text-decoration:none;}