.grade-shell{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:20px;align-items:start}
.grade-card,.grade-info{background:#fff;border:1px solid rgba(73,52,35,.12);border-radius:24px;box-shadow:0 18px 48px rgba(89,63,38,.08);padding:22px}
.grade-kicker{font-size:.85rem;color:#75604e;margin:0 0 10px}
.grade-share{margin:0;padding:10px 12px;border-radius:14px 14px 0 0;background:#f7f1e8;border:1px solid rgba(73,52,35,.1);border-bottom:0;color:#5e5348;font-size:.86rem;line-height:1.55;font-weight:650}
.grade-preset-bar{margin:0 0 14px;padding:10px 12px;border-radius:0 0 14px 14px;background:#fffaf0;border:1px solid rgba(73,52,35,.1);display:grid;gap:8px}
.grade-presets{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.grade-presets button{min-width:2.2rem;min-height:2rem;padding:0 8px;border-radius:999px;border:1px solid rgba(73,52,35,.16);background:#fff;color:#5a4636;font:inherit;font-size:.82rem;font-weight:750;cursor:pointer}
.grade-presets button[aria-pressed="true"]{background:#ffe3a8;border-color:#d99c19;color:#5a3d12}
.grade-preset-hint{margin:0;font-size:.78rem;color:#8a7460}
.grade-table{display:grid;gap:10px}
.grade-head,.grade-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr) minmax(0,.8fr) auto;gap:10px;align-items:end}
.grade-head{font-size:.78rem;font-weight:800;color:#735e4a}
.grade-row input,.grade-field input{width:100%;border:1px solid rgba(73,52,35,.18);border-radius:14px;background:#fffdf9;color:inherit;padding:12px 13px;font:inherit}
.grade-row input:focus,.grade-field input:focus,.grade-weight-active{outline:3px solid rgba(255,195,59,.25);border-color:#d99c19}
.grade-name{font-weight:800;padding-bottom:10px}
.grade-remove{min-height:46px;padding-inline:12px}
.grade-final{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}
.grade-field{display:grid;gap:7px;font-weight:800}
.grade-results{display:grid;gap:12px;margin-top:18px}
.grade-primary{padding:16px;border-radius:18px;background:linear-gradient(180deg,#fff6e3,#ffe9bd);border:1px solid rgba(221,133,44,.22)}
.grade-primary-lead{margin:0;font-size:.92rem;color:#735e4a;font-weight:750}
.grade-primary-score{display:block;margin-top:6px;font-size:2.05rem;line-height:1.15}
.grade-primary-detail{margin:8px 0 0;color:#5e5348;line-height:1.55}
.grade-result{padding:12px 14px;border-radius:15px;background:#fff1dc;border:1px solid rgba(221,133,44,.14)}
.grade-result span{display:block;font-size:.8rem;color:#735e4a}
.grade-result strong{display:block;margin-top:3px;font-size:1.35rem;line-height:1.2}
.grade-detail,.grade-weight,.grade-blank,.grade-fixed{margin:0;color:#5e5348;line-height:1.65}
.grade-weight{padding:12px 14px;border-radius:14px;background:#fff7e8;border:1px solid rgba(228,163,56,.28)}
.grade-fixed{padding:12px 14px;border-radius:14px;background:#eef5ff;color:#2e4d72}
.grade-status{margin:0;color:#8b302a;min-height:1.4em}
.grade-more{border-radius:14px;background:#f8fbff;border:1px solid rgba(55,116,173,.12);padding:4px 12px 10px}
.grade-more summary{cursor:pointer;font-weight:750;padding:8px 0;color:#355f86}
.grade-targets{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.grade-targets li{display:flex;justify-content:space-between;gap:12px;align-items:baseline;padding:8px 2px;border-top:1px solid rgba(55,116,173,.1)}
.grade-targets li:first-child{border-top:0}
.grade-targets span{color:#4d433b;font-weight:750}
.grade-targets strong{text-align:right}
.grade-add{margin-top:12px}
.grade-info h2{margin-top:0}
.grade-info ul{padding-left:1.2rem}
.grade-info li+li{margin-top:8px}
.grade-note{margin-top:14px;padding:13px 14px;border-radius:15px;background:#f6f3ef;color:#655545}
@media(max-width:840px){.grade-shell{grid-template-columns:1fr}.grade-final{grid-template-columns:1fr}}
@media(max-width:640px){
.grade-card,.grade-info{padding:16px;border-radius:20px}
.grade-head{display:none}
.grade-row{grid-template-columns:1fr 1fr;grid-template-areas:"name name" "score weight" "remove remove"}
.grade-name,.grade-row input[data-custom-name]{grid-area:name}
.grade-row [data-score]{grid-area:score}
.grade-row [data-weight]{grid-area:weight}
.grade-remove{grid-area:remove}
.grade-targets li{flex-direction:column}
.grade-targets strong{text-align:left}
.grade-primary-score{font-size:1.7rem}
}