/* Scoped presentation for the existing changes workflow. */
body.changes-page{background:#f5f6f1}
body.changes-page #app{max-width:1420px;padding-top:28px}
#app .changes-studio{--cs-ink:#203e36;--cs-muted:#718277;--cs-line:#dfe6dc;--cs-green:#255e4b;color:var(--cs-ink);font:14px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
#app .changes-studio *{box-sizing:border-box}
#app .changes-studio [hidden]{display:none!important}
#app .changes-studio button,#app .changes-studio input,#app .changes-studio select,#app .changes-studio textarea{font:inherit}
#app .changes-studio button:focus-visible,#app .changes-studio input:focus-visible,#app .changes-studio select:focus-visible,#app .changes-studio textarea:focus-visible{outline:3px solid #9cbc94;outline-offset:3px}
#app .changes-studio button{transition:background .15s,border-color .15s;cursor:pointer}
#app .changes-studio button:disabled{cursor:default}
#app .changes-studio h1,#app .changes-studio h2,#app .changes-studio h3,#app .changes-studio p{line-height:1.6}
#app .changes-studio .change-intro{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:24px}
#app .changes-studio .eyebrow{color:#819175;font-size:10px;letter-spacing:2.5px;font-weight:700}
#app .changes-studio h1{font-size:32px;line-height:1.25;letter-spacing:-1px;margin:9px 0 9px;font-weight:700}
#app .changes-studio h1>span{color:#a9bb89;margin-left:4px}
#app .changes-studio .change-intro p{margin:0;color:var(--cs-muted);font-size:13px}
#app .changes-studio .change-metrics{display:flex;flex-shrink:0}
#app .changes-studio .change-metrics>div{min-width:94px;padding:0 22px;border-left:1px solid var(--cs-line)}
#app .changes-studio .change-metrics small{display:block;color:var(--cs-muted);font-size:11px;white-space:nowrap}
#app .changes-studio .change-metrics strong{display:block;font-size:29px;line-height:1.3;font-weight:600;margin-top:3px;font-variant-numeric:tabular-nums}
#app .changes-studio .change-metrics .pending strong{color:#a77c32}
#app .changes-studio .change-notice{display:flex;align-items:center;gap:10px;font-size:12px;color:#647969;background:#eaf0e5;border:1px solid #e0e8d8;border-radius:9px;padding:12px 16px;margin-bottom:24px}
#app .changes-studio .change-notice b{font-weight:600;color:#486751}
#app .changes-studio .change-notice-icon{display:grid;place-items:center;flex:none;width:19px;height:19px;border:1px solid #8fa183;border-radius:50%;font-family:Georgia,serif;font-size:12px;font-weight:bold}
#app .changes-studio .change-section-nav{display:flex;align-items:center;gap:28px;padding:0 4px;margin-bottom:18px;border-bottom:1px solid var(--cs-line)}
#app .changes-studio .change-section-nav button{display:flex;align-items:center;gap:8px;border:0;border-bottom:3px solid transparent;border-radius:0;background:transparent;color:var(--cs-muted);padding:0 0 14px;font-size:14px;font-weight:600;white-space:nowrap}
#app .changes-studio .change-section-nav button[aria-selected=true]{color:var(--cs-green);border-bottom-color:var(--cs-green)}
#app .changes-studio .change-section-nav b{font-size:11px;line-height:1.6;font-weight:600;padding:1px 7px;border-radius:5px;background:#e9ede4;color:#758169}
#app .changes-studio .change-section-nav button[aria-selected=true] b{background:#e0eadb;color:#3f6846}
#app .changes-studio .change-nav-month{font-size:11px;color:#87917f;margin-left:auto;padding-bottom:14px}
#app .changes-studio .panel{margin:0;background:#fff;border:1px solid var(--cs-line);border-radius:14px;padding:24px;min-width:0}
#app .changes-studio .change-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}
#app .changes-studio .change-kicker{font-size:9px;font-weight:600;letter-spacing:1.7px;color:#98a08d}
#app .changes-studio h2{font-size:18px;font-weight:650;margin:2px 0 0;letter-spacing:-.3px}
#app .changes-studio h3{font-size:14px;margin:0;font-weight:650}
#app .changes-studio .change-heading-note{font-size:11px;color:#899582}
#app .changes-studio .tabs{display:flex;gap:4px;width:fit-content;padding:4px;border:1px solid #e5eadf;border-radius:8px;background:#f1f4ed;margin:0 0 14px}
#app .changes-studio .tabs button{margin:0;border:0;border-radius:5px;padding:8px 13px;color:#7c8973;font-size:12px;background:transparent}
#app .changes-studio .tabs button.active{color:var(--cs-green);background:#fff;box-shadow:0 1px 4px #203c3510}
#app .changes-studio .change-help{font-size:12px;color:var(--cs-muted);margin:0 0 19px}
#app .changes-studio .change-record{padding:20px 0;border-top:1px solid #e6ebe2;overflow-wrap:anywhere}
#app .changes-studio .change-admin-request{border:1px solid var(--cs-line);border-radius:11px;padding:0;margin:12px 0;overflow:hidden}
#app .changes-studio .change-request-top{padding:17px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px}
#app .changes-studio .change-request-person{display:flex;align-items:center;gap:11px;min-width:0}
#app .changes-studio .change-avatar{display:grid;place-items:center;flex:none;width:37px;height:40px;background:#edf2e6;border-radius:9px;font-size:16px;font-weight:600;color:#698660}
#app .changes-studio .change-request-person h3{font-size:15px;line-height:1.4}
#app .changes-studio .change-request-person small{font-size:11px;color:#89937e}
#app .changes-studio .change-badge{padding:5px 9px;font-size:11px;line-height:1.5;font-weight:600;border-radius:6px;white-space:nowrap}
#app .changes-studio .change-badge.pending{background:#fbefd7;color:#976b23;border:1px solid #efdfbb}
#app .changes-studio .change-badge.approved{background:#e7f1e5;color:#406e46;border:1px solid #d6e6d0}
#app .changes-studio .change-badge.closed{background:#eff0ec;color:#7a8175;border:1px solid #e0e3dc}
#app .changes-studio .change-handoff{display:grid;grid-template-columns:minmax(0,1.3fr) 35px minmax(0,1fr);align-items:center;gap:17px;padding:17px 20px;background:#f8faf5;border-top:1px solid #edf0e8;border-bottom:1px solid #edf0e8}
#app .changes-studio .change-handoff small{font-size:10px;color:#8c9981;display:block;margin-bottom:5px}
#app .changes-studio .change-handoff b{font-size:14px;line-height:1.5;font-weight:600;display:block}
#app .changes-studio .change-handoff p{font-size:12px;color:#74836c;margin:5px 0 0;font-variant-numeric:tabular-nums}
#app .changes-studio .change-handoff p>span{padding:0 5px;color:#a0ac96}
#app .changes-studio .change-handoff-arrow{font-size:21px;color:#9eaf93;text-align:center}
#app .changes-studio .change-request-bottom{padding:13px 20px;display:flex;gap:20px;align-items:center;justify-content:space-between}
#app .changes-studio .change-reason{margin:0;display:flex;gap:12px;font-size:12px;color:#677b65;min-width:0}
#app .changes-studio .change-reason>span{white-space:nowrap;font-size:11px;color:#929d88;flex:none}
#app .changes-studio .actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0}
#app .changes-studio .btn{border:1px solid #dce4d6;border-radius:7px;padding:9px 14px;min-height:40px;background:#fff;color:#4b6550;font-size:12px;font-weight:600}
#app .changes-studio .btn:hover{background:#f0f5eb;border-color:#b7cbb0}
#app .changes-studio .btn.primary{background:var(--cs-green);color:#fff;border-color:var(--cs-green)}
#app .changes-studio .btn.primary:hover{background:#194b3a}
#app .changes-studio [data-decision=approve]{color:#3d774c;border-color:#bfd4bb;background:#f4f9ef}
#app .changes-studio [data-decision=reject]{color:#a65d5b;border-color:#e7d2cd;background:#fffaf8}
#app .changes-studio [data-decision=reject].primary{color:#fff;background:#a45858;border-color:#a45858}
#app .changes-studio [data-decision=""]{border-color:transparent;background:transparent;color:#8f9986;padding-inline:6px;font-weight:400}
#app .changes-studio .change-waiting{font-size:11px;color:#aa874a;margin:0}
#app .changes-studio .change-summary{background:#f6f8f2;border:1px solid #dfe6d7;border-radius:10px;padding:17px 20px;margin-top:22px;display:flex;align-items:center;flex-wrap:wrap;gap:8px 20px}
#app .changes-studio .change-summary-title{display:flex;align-items:baseline;gap:12px;flex:1 1 100%}
#app .changes-studio .change-summary-title>span{font-size:11px;color:#8b997e}
#app .changes-studio .change-summary>h3{flex-basis:100%}
#app .changes-studio .change-summary p{font-size:12px;margin:0;color:#738166;flex:1 1 65%}
#app .changes-studio .change-summary .primary{margin-left:auto;padding-inline:22px}
#app .changes-studio .change-summary [role=status]{flex:1 1 100%;color:#a66535}
#app .changes-studio .change-summary [role=status]:empty{display:none}
#app .changes-studio .change-form{grid-template-columns:200px minmax(160px,1fr);gap:12px;padding:16px;background:#f7f9f3;border:1px solid #e7ecdf;border-radius:9px;margin:0 0 20px}
#app .changes-studio .change-form label,#app .changes-studio .change-teacher{font-size:12px;font-weight:500;color:#6e8165;gap:6px}
#app .changes-studio select,#app .changes-studio input,#app .changes-studio textarea{border:1px solid #dce4d4;color:var(--cs-ink);border-radius:7px;background:#fff;padding:10px 12px;min-height:40px;font-size:13px}
#app .changes-studio input::placeholder,#app .changes-studio textarea::placeholder{color:#99a28f}
#app .changes-studio .change-slots{gap:14px;margin-top:15px}
#app .changes-studio .change-slots small{font-size:11px;color:#819175}
#app .changes-studio .change-slot{border-radius:8px;background:#f5f8f0;padding:12px 14px;margin-top:6px}
#app .changes-studio .change-slot b{font-size:13px}
#app .changes-studio .change-slot p,#app .changes-studio .change-slot span,#app .changes-studio .change-record>p{font-size:12px;color:#79886e;margin:5px 0}
#app .changes-studio .change-record>.section-head{margin:0;display:flex;justify-content:space-between;align-items:center;gap:12px}
#app .changes-studio .change-record>p{margin:14px 0 10px}
#app .changes-studio .change-record details{font-size:12px;color:#7b8c6c;margin:10px 0}
#app .changes-studio .change-record details p{font-size:11px;padding-left:12px}
#app .changes-studio .change-record>[class=""]{margin-top:12px}
#app .changes-studio #change-picker>.actions{padding:12px 0 4px;justify-content:flex-start}
#app .changes-studio #change-picker>.actions>b{font-size:14px;margin:0 4px;font-weight:600;font-variant-numeric:tabular-nums}
#app .changes-studio .change-week-grid{grid-template-columns:repeat(7,minmax(140px,1fr));gap:10px;margin:18px 0 0;padding-bottom:10px;max-width:100%;overflow-x:auto}
#app .changes-studio .change-day{padding:10px;border:1px solid #e5eadf;border-radius:12px;background:#f0f4f2;min-width:0}
#app .changes-studio .change-day h3{font-size:15px;font-weight:600;margin:6px 0 14px;color:#35555c;white-space:nowrap}
#app .changes-studio .change-day>p{font-size:14px;color:#81918a;margin:14px 0}
#app .changes-studio .change-course{background:#fff;border:1px solid #bed4c8;border-radius:10px;font-size:14px;padding:14px 10px;gap:8px;margin:0 0 10px;min-height:100px;overflow-wrap:anywhere;color:#243f48}
#app .changes-studio .change-course strong{font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap}
#app .changes-studio .change-course small{font-size:11px;color:#526c65}
#app .changes-studio .change-course:not(:disabled):hover{background:#eef5e7;border-color:#98b68b}
#app .changes-studio .change-course:disabled{opacity:.6;background:#f1f3ed;border-color:#e0e5d9;color:#738368}
#app .changes-studio .change-course.picked{background:#e7f1df;outline:2px solid #527e4f;outline-offset:-2px}
#app .changes-studio .change-chosen{margin:20px 0;padding:13px 16px;background:#eef4e7;border-radius:0 8px 8px 0;border-color:#739863;font-size:12px;color:#58724b}
#app .changes-studio .change-chosen p{margin:4px 0 0}
#app .changes-studio .change-types{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:13px 0}
#app .changes-studio .change-types .btn{padding:14px 10px}
#app .changes-studio .change-flow{font-size:12px;padding:12px 14px;background:#f0f4f7;color:#637c8c;border-radius:8px;margin-bottom:20px}
#app .changes-studio .change-teacher{margin:18px 0;max-width:650px}
#app .changes-studio .change-teacher textarea{resize:vertical}
#app .changes-studio .muted{color:var(--cs-muted);font-size:12px}
@media(min-width:1450px){#app .changes-studio .change-handoff{grid-template-columns:minmax(0,1.1fr) 35px minmax(0,1fr)}#app .changes-studio .change-request-top{padding:18px 24px}}
@media(max-width:850px){#app .changes-studio .change-metrics>div{padding:0 15px;min-width:75px}#app .changes-studio .change-panel-heading{align-items:flex-start}#app .changes-studio .change-heading-note{max-width:190px;text-align:right}#app .changes-studio .change-request-bottom{align-items:flex-start;flex-direction:column;gap:12px}#app .changes-studio .change-request-bottom>.actions{align-self:flex-end}#app .changes-studio .change-nav-month{display:none}}
@media(max-width:600px){body.changes-page #app{padding-top:20px}#app .changes-studio .change-intro{display:block;margin-bottom:20px}#app .changes-studio h1{font-size:29px}#app .changes-studio .change-metrics{margin-top:20px;background:#fff;border:1px solid var(--cs-line);border-radius:10px;padding:12px 0}#app .changes-studio .change-metrics>div{flex:1;padding:0 18px;min-width:0}#app .changes-studio .change-metrics>div:first-child{border:0}#app .changes-studio .change-metrics strong{font-size:24px}#app .changes-studio .change-notice{align-items:flex-start;padding:12px;font-size:11px;gap:8px;margin-bottom:20px}#app .changes-studio .change-section-nav{gap:0;justify-content:space-between}#app .changes-studio .change-section-nav button{font-size:12px;gap:5px;padding-bottom:12px}#app .changes-studio .change-section-nav b{font-size:10px;padding:1px 5px}#app .changes-studio .panel{padding:16px;border-radius:11px}#app .changes-studio .change-panel-heading{gap:10px;margin-bottom:14px}#app .changes-studio h2{font-size:17px}#app .changes-studio .change-heading-note{font-size:10px;max-width:95px}#app .changes-studio .change-kicker{font-size:8px;letter-spacing:1.3px}#app .changes-studio .tabs{max-width:100%}#app .changes-studio .tabs button{padding:8px 10px;font-size:11px}#app .changes-studio .change-help{font-size:11px;margin-bottom:16px}#app .changes-studio .change-request-top{padding:14px 12px;gap:8px}#app .changes-studio .change-request-person{gap:8px}#app .changes-studio .change-avatar{width:30px;height:34px;font-size:14px}#app .changes-studio .change-badge{font-size:10px;padding:4px 6px}#app .changes-studio .change-handoff{padding:13px 12px;gap:8px;grid-template-columns:minmax(0,1.2fr) 15px minmax(0,1fr)}#app .changes-studio .change-handoff b{font-size:12px}#app .changes-studio .change-handoff p{font-size:10px}#app .changes-studio .change-handoff p>span{padding:0 2px}#app .changes-studio .change-request-bottom{padding:12px;gap:12px}#app .changes-studio .change-request-bottom>.actions{align-self:stretch;flex-wrap:nowrap;gap:5px}#app .changes-studio .change-request-bottom .btn{flex:1;padding:9px 6px;font-size:11px;white-space:nowrap}#app .changes-studio .change-summary{padding:14px;gap:10px;margin-top:16px}#app .changes-studio .change-summary-title{display:block}#app .changes-studio .change-summary-title>span{display:block;margin-top:2px}#app .changes-studio .change-summary p{flex-basis:100%;font-size:11px}#app .changes-studio .change-summary .primary{width:100%;margin:0}#app .changes-studio .change-form{grid-template-columns:1fr;padding:12px}#app .changes-studio .change-form select,#app .changes-studio .change-form input,#app .changes-studio .change-teacher select,#app .changes-studio .change-teacher textarea{font-size:16px}#app .changes-studio .change-week-grid{grid-template-columns:repeat(7,minmax(150px,1fr));overflow-x:auto;gap:10px}#app .changes-studio .change-day{padding:10px}#app .changes-studio .change-course{min-height:80px}#app .changes-studio .change-day h3,#app .changes-studio .change-course strong{font-size:15px}#app .changes-studio #change-picker>.actions{gap:7px}#app .changes-studio #change-picker>.actions>b{order:-1;flex:1 1 100%;font-size:13px;margin:0 0 4px}#app .changes-studio .change-types{grid-template-columns:1fr;gap:6px}#app .changes-studio .change-types .btn{padding:11px}#app .changes-studio .change-slots{grid-template-columns:1fr}#app .changes-studio .change-record>.section-head{align-items:flex-start}}

@media(max-width:600px){#app .changes-studio #change-admin .change-heading-note{max-width:none;white-space:nowrap}}

#app .changes-studio .change-action-status{margin:0;font-size:12px;color:#406e46}
#app .changes-studio .change-action-status.error{color:#a65d5b}
#app .changes-studio [data-decision]:disabled{opacity:.5;cursor:wait}

/* Recipient replies are primary actions, distinct from administrator approval. */
#app .changes-studio .change-peer-tab.has-replies{color:#1e5b46;font-weight:750}
#app .changes-studio .change-peer-tab.has-replies b{background:#205e49;color:white;font-size:13px;min-width:22px;text-align:center}
#app .changes-studio .change-peer-panel{border-color:#9fbea9}
#app .changes-studio .change-peer-panel h2 span{font-size:15px;background:#e6f0e6;padding:4px 9px;border-radius:6px;margin-left:8px}
#app .changes-studio .change-peer-help{font-size:14px;color:#446454;background:#edf4eb;border-radius:8px;padding:14px 16px;line-height:1.7;margin:0 0 20px}
#app .changes-studio .change-peer-actions{display:flex;flex-direction:column;align-items:flex-end;gap:10px;padding:8px 0;min-width:280px}
#app .changes-studio .change-peer-prompt{display:flex;gap:14px;align-items:center;color:#285c45;font-size:14px}
#app .changes-studio .change-peer-prompt span{color:#778776;font-size:12px}
#app .changes-studio .change-peer-actions .btn{min-height:48px;font-size:15px;padding:12px 22px;white-space:nowrap;border-width:1px}
#app .changes-studio .change-peer-accept{min-width:150px}
#app .changes-studio .change-peer-reject{color:#8b4d43;border-color:#dcc0b8}
#app .changes-studio .change-peer-status:empty{display:none}
#app .changes-studio .change-peer-status{font-size:13px;color:#8b5e32;margin:0}
#app .changes-studio #change-results .change-peer-actions{background:#f1f6ed;padding:16px;border-radius:9px;margin-top:14px}
@media(max-width:700px){#app .changes-studio .change-section-nav{overflow-x:auto;justify-content:flex-start;gap:22px}#app .changes-studio .change-section-nav button{font-size:14px;min-height:48px}#app .changes-studio .change-peer-actions{width:100%;min-width:0;align-items:stretch}#app .changes-studio .change-peer-actions .actions{display:flex;width:100%}#app .changes-studio .change-peer-actions .btn{flex:1;padding:12px 10px;font-size:15px;min-width:0}#app .changes-studio .change-peer-prompt{flex-wrap:wrap;gap:6px}}

/* Explicit, reviewable cover replacement plan. */
#app .changes-studio .cr-conflict{margin:20px 22px;padding:20px;border:1px solid #dccba8;border-radius:12px;background:#fbf8f1;color:#173d34;min-width:0}
#app .changes-studio .cr-heading{display:flex;align-items:center;gap:10px;margin-bottom:16px}
#app .changes-studio .cr-heading>span{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:#eee4d0;color:#795522;font-size:20px;flex-shrink:0}
#app .changes-studio .cr-heading h4{font-size:16px;margin:0;line-height:1.5}
#app .changes-studio .cr-plan{display:grid;grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr);align-items:stretch;gap:12px}
#app .changes-studio .cr-plan-item{display:flex;flex-direction:column;gap:8px;min-width:0;border:1px solid #dedfd9;background:#fff;border-radius:10px;padding:16px;overflow-wrap:anywhere}
#app .changes-studio .cr-plan-item>small{font-size:12px;color:#656c66}
#app .changes-studio .cr-plan-item>strong{font-size:17px;line-height:1.5}
#app .changes-studio .cr-plan-item>span{font-size:13px;font-variant-numeric:tabular-nums;color:#52645c}
#app .changes-studio .cr-plan-item>b{font-size:12px;margin-top:auto;padding-top:6px;color:#76531f}
#app .changes-studio .cr-new{border-color:#b2c6bb;border-top:3px solid #28735b}
#app .changes-studio .cr-new>b{color:#226048}
#app .changes-studio .cr-arrow{align-self:center;text-align:center;font-size:21px;color:#8a7148}
#app .changes-studio .cr-conflict>p{margin:16px 0 10px;font-size:14px;color:#3e5148}
#app .changes-studio .cr-footnote{display:block;line-height:1.6;font-size:12px;color:#645b49}
#app .changes-studio .cr-blocked{background:#fbf5f3;border-color:#ddc3b8}
#app .changes-studio .cr-blocked ul{padding:0;list-style:none;display:grid;gap:8px}
#app .changes-studio .cr-blocked li{display:flex;flex-wrap:wrap;gap:6px 16px;padding:10px;border-radius:8px;background:#fff}
#app .changes-studio .cr-blocked li span{color:#655b54;font-size:13px}
#app .changes-studio .cr-warning{font-weight:650;color:#855026}
#app .changes-studio .cr-admin-actions{display:flex;flex-direction:column;align-items:flex-end;gap:8px;min-width:0}
#app .changes-studio .cr-admin-actions>p{color:#77572d;font-size:13px;margin:0}
#app .changes-studio .change-request-bottom{flex-wrap:wrap}
#app .changes-studio .change-request-bottom .actions{flex-wrap:wrap}
#app .changes-studio .cr-admin-actions .btn,#app .changes-studio .change-peer-actions .btn{white-space:normal;line-height:1.5;min-height:44px}
#app .changes-studio .cr-result{display:flex;flex-wrap:wrap;gap:8px 16px;padding:16px;margin-top:16px;border-radius:10px;background:#f4f6f5;color:#244c40;font-size:14px}
#app .changes-studio .change-peer-actions:has(.actions:empty){display:none}
@media(max-width:700px){
 #app .changes-studio .cr-conflict{margin:14px 12px;padding:14px}
 #app .changes-studio .cr-plan{grid-template-columns:minmax(0,1fr);gap:8px}
 #app .changes-studio .cr-arrow{transform:rotate(90deg);height:24px}
 #app .changes-studio .cr-plan-item{padding:14px}
 #app .changes-studio .cr-admin-actions{align-items:stretch;width:100%}
 #app .changes-studio .cr-admin-actions .actions{display:flex;flex-direction:column;width:100%}
 #app .changes-studio .cr-admin-actions .btn{width:100%;font-size:14px}
 #app .changes-studio .change-peer-actions .actions{flex-wrap:wrap}
 #app .changes-studio .change-peer-actions .change-peer-accept{flex-basis:100%}
 #app .changes-studio .change-peer-actions .btn{font-size:14px}
}
