.hrma-app{max-width:1180px;margin:32px auto;color:#142033;font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif}.hrma-app *{box-sizing:border-box}.hrma-app-header{display:flex;justify-content:space-between;gap:30px;align-items:flex-start;padding:30px 34px;background:linear-gradient(130deg,#123e69,#176c79);color:#fff;border-radius:16px}.hrma-eyebrow,.hrma-section-heading>span{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.07em}.hrma-eyebrow{opacity:.8}.hrma-app h1{margin:5px 0 8px;font-size:30px}.hrma-app-header p{margin:0;opacity:.9}.hrma-status{background:rgba(255,255,255,.12);padding:13px 16px;border-radius:10px;min-width:215px}.hrma-status span{display:block;font-size:12px;opacity:.75;margin-bottom:5px}.hrma-status strong{font-size:14px}.hrma-progress-summary{margin:20px 0;display:grid;grid-template-columns:170px 190px minmax(300px,1fr);gap:14px;align-items:center;background:#fff;border:1px solid #d8e2ea;border-radius:14px;padding:18px 20px;box-shadow:0 4px 15px rgba(26,45,67,.06)}.hrma-summary-metric{border-left:4px solid #157080;padding:7px 0 7px 12px}.hrma-summary-metric span{display:block;color:#597083;font-size:12px}.hrma-summary-metric strong{font-size:24px;color:#123e69}.hrma-stepper{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}.hrma-stepper span{display:inline-flex;align-items:center;border-radius:99px;background:#eef3f7;color:#667c8e;padding:7px 10px;font-size:12px;font-weight:800}.hrma-stepper .is-active{background:#126b78;color:#fff}.hrma-wizard-panel{display:none;background:#fff;border:1px solid #d8e2ea;border-radius:14px;padding:28px;margin:20px 0}.hrma-wizard-panel.is-active{display:block}.hrma-section-heading{margin-bottom:20px}.hrma-section-heading>span{color:#126b78}.hrma-section-heading h2{margin:4px 0 6px;font-size:22px;color:#123e69}.hrma-section-heading p{margin:0;color:#526779;line-height:1.7}.hrma-skill-screen{display:none}.hrma-skill-screen.is-active{display:block}.hrma-skill-card{border:1px solid #d6e0e9;border-radius:12px;overflow:hidden;background:#fff}.hrma-skill-card-header{display:flex;justify-content:space-between;gap:18px;padding:20px 22px;background:#f7fafc;border-bottom:1px solid #dce6ee}.hrma-skill-context{display:flex;align-items:center;gap:9px;margin:0 0 7px}.hrma-skill-context span{display:inline-flex;border-radius:99px;background:#e1eff1;color:#0c5f6c;padding:4px 9px;font-size:12px;font-weight:800}.hrma-skill-context strong{color:#5a7081;font-size:13px}.hrma-skill-card h3{font-size:22px;margin:0;color:#123e69}.hrma-definition{color:#364c61;line-height:1.8;margin:9px 0 0;max-width:880px}.hrma-weight{white-space:nowrap;color:#506678;font-size:13px;padding-top:2px}.hrma-weight strong{color:#123e69}.hrma-level-list{padding:0 22px}.hrma-level-row{display:grid;grid-template-columns:110px minmax(0,1fr) 104px;gap:18px;align-items:center;padding:16px 0;border-bottom:1px solid #dfe8ee}.hrma-level-row:last-child{border-bottom:0}.hrma-level-title{align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding:9px 11px;border-radius:8px;border:1px solid #d9e2eb}.hrma-level-title strong{font-size:24px;line-height:1;color:#123e69}.hrma-level-title span{font-size:11px;color:#126b78;font-weight:800;margin-top:5px;overflow-wrap:anywhere}.hrma-level-a .hrma-level-title{background:#eff2fa}.hrma-level-b .hrma-level-title{background:#eef7f3}.hrma-level-c .hrma-level-title{background:#eff6f8}.hrma-level-d .hrma-level-title{background:#f6f2ed}.hrma-level-e .hrma-level-title{background:#f7f7f7}.hrma-level-description{line-height:1.75;margin:0;color:#223e57;font-size:14px}.hrma-grade-radios{display:flex;flex-direction:column;gap:6px}.hrma-grade-option{display:grid;grid-template-columns:16px 1fr auto;align-items:center;gap:6px;border:1px solid #c4d2dd;border-radius:6px;background:#fff;padding:6px 8px;cursor:pointer;transition:.15s}.hrma-grade-option:hover{border-color:#126b78;background:#f3fafb}.hrma-grade-option.is-selected{border-color:#126b78;background:#e8f5f6;box-shadow:inset 0 0 0 1px #126b78}.hrma-grade-option input{width:14px;height:14px;margin:0;accent-color:#126b78}.hrma-grade-option span{font-size:13px;font-weight:800;color:#123e69}.hrma-grade-option small{color:#607789;font-size:10px}.hrma-skill-navigation,.hrma-panel-navigation{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:22px}.hrma-current-score{color:#126b78;font-weight:800;font-size:13px;text-align:center}.hrma-button{display:inline-block;text-decoration:none;border:0;border-radius:8px;padding:12px 19px;font-weight:800;cursor:pointer;font-size:14px;transition:.15s}.hrma-button[disabled]{opacity:.4;cursor:not-allowed}.hrma-button-primary{background:#126b78;color:#fff}.hrma-button-primary:hover{background:#0e5a65}.hrma-button-secondary{background:#fff;border:1px solid #758fa2;color:#244763}.hrma-button-secondary:hover{background:#f4f8fa}.hrma-review-overview{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:18px;align-items:stretch}.hrma-radar-panel,.hrma-review-score-panel,.hrma-review-score-list{border:1px solid #d6e0e9;border-radius:11px;background:#fff}.hrma-radar-panel{padding:18px}.hrma-radar-panel h3,.hrma-review-score-panel h3,.hrma-review-score-list h3{color:#123e69;font-size:16px;margin:0 0 12px}.hrma-radar-canvas-wrap{min-height:430px;display:flex;align-items:center;justify-content:center}.hrma-radar-canvas-wrap canvas{display:block;width:100%;max-width:720px;height:auto}.hrma-review-score-panel{padding:20px;background:#f7fafc}.hrma-review-total{border-left:4px solid #157080;padding:10px 0 10px 12px}.hrma-review-total span{display:block;color:#597083;font-size:12px}.hrma-review-total strong{font-size:34px;color:#123e69;line-height:1.2}.hrma-review-help{color:#526779;font-size:12px;line-height:1.7;margin:16px 0 0}.hrma-review-score-list{margin-top:18px;padding:18px}.hrma-review-score-table-wrap{overflow-x:auto}.hrma-review-score-list table{width:100%;border-collapse:collapse;min-width:640px}.hrma-review-score-list th,.hrma-review-score-list td{padding:10px;border-top:1px solid #dce6ee;text-align:left;font-size:13px}.hrma-review-score-list th{background:#f3f7fa;color:#4e667a}.hrma-review-grade{font-weight:800;color:#123e69}.hrma-review-points{color:#126b78;font-weight:800}.hrma-awareness-label{display:block;margin:22px 0 7px;font-size:17px;font-weight:800;color:#123e69}.hrma-large-text,.hrma-plan-fields textarea{width:100%;border:1px solid #aebfcd;border-radius:8px;padding:12px;line-height:1.7;font:inherit;color:#142033;background:#fff}.hrma-large-text:focus,.hrma-plan-fields textarea:focus,.hrma-plan-title select:focus{outline:2px solid rgba(18,107,120,.22);outline-offset:1px;border-color:#126b78}.hrma-plan-card{border:1px solid #d6e0e9;border-radius:10px;padding:16px;margin:12px 0}.hrma-plan-title{display:flex;align-items:center;gap:13px}.hrma-plan-title>span{display:inline-block;border-radius:99px;background:#123e69;color:#fff;padding:5px 10px;font-size:12px;font-weight:800;white-space:nowrap}.hrma-plan-title select{border:1px solid #8fa5b6;border-radius:6px;padding:9px;min-width:280px;background:#fff;font:inherit}.hrma-plan-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}.hrma-plan-fields label{font-weight:800;color:#314a61}.hrma-plan-fields textarea{margin-top:6px;font-weight:400}.hrma-final-navigation{align-items:flex-end}.hrma-actions{display:flex;gap:12px;justify-content:flex-end}.hrma-front-notice,.hrma-alert{border-radius:8px;padding:13px 16px;margin-bottom:16px}.hrma-notice-success{background:#e8f6ee;color:#176338}.hrma-notice-error,.hrma-alert{background:#fff0f0;color:#a33535}.hrma-submitted-card{background:#fff;border:1px solid #d8e2ea;border-radius:16px;padding:40px;text-align:center;box-shadow:0 4px 15px rgba(26,45,67,.06)}.hrma-submitted-card h1{color:#123e69}@media(max-width:850px){.hrma-app{margin:16px}.hrma-app-header{padding:24px;display:block}.hrma-status{margin-top:18px}.hrma-progress-summary{grid-template-columns:1fr 1fr}.hrma-stepper{grid-column:1/-1;justify-content:flex-start}.hrma-level-row{grid-template-columns:92px minmax(0,1fr) 96px;gap:12px}.hrma-review-overview{grid-template-columns:1fr}.hrma-review-score-panel{display:flex;align-items:flex-start;gap:20px}.hrma-review-help{margin:0}.hrma-radar-canvas-wrap{min-height:390px}.hrma-plan-fields{grid-template-columns:1fr}}@media(max-width:620px){.hrma-app{margin:10px}.hrma-app-header,.hrma-wizard-panel{padding:18px}.hrma-app h1{font-size:24px}.hrma-progress-summary{grid-template-columns:1fr;padding:16px}.hrma-stepper{grid-column:auto;justify-content:flex-start}.hrma-stepper span{font-size:11px;padding:6px 8px}.hrma-skill-card-header{display:block;padding:18px}.hrma-weight{margin-top:10px}.hrma-level-list{padding:0 16px}.hrma-level-row{display:grid;grid-template-columns:1fr 92px;gap:10px;padding:13px 0}.hrma-level-title{grid-column:1/-1;display:flex;flex-direction:row;align-items:center;gap:8px;padding:7px 9px}.hrma-level-title strong{font-size:20px}.hrma-level-title span{margin:0}.hrma-level-description{font-size:13px}.hrma-grade-radios{gap:5px}.hrma-grade-option{grid-template-columns:14px 1fr;padding:6px}.hrma-grade-option small{display:none}.hrma-skill-navigation,.hrma-panel-navigation,.hrma-final-navigation{align-items:stretch;flex-direction:column}.hrma-current-score{order:-1;min-height:22px}.hrma-skill-navigation .hrma-button,.hrma-panel-navigation>.hrma-button{width:100%;text-align:center}.hrma-review-score-panel{display:block}.hrma-review-help{margin-top:12px}.hrma-radar-canvas-wrap{min-height:300px}.hrma-plan-title{display:block}.hrma-plan-title select{width:100%;margin-top:8px;min-width:0}.hrma-actions{flex-direction:column;width:100%}.hrma-actions .hrma-button{width:100%;text-align:center}}


/* v0.3.0: Step 2 combines reflection and priority-skill planning. */
.hrma-priority-section{margin-top:30px;padding-top:24px;border-top:1px solid #d6e0e9}.hrma-priority-heading{margin-bottom:14px}.hrma-priority-heading>span{display:inline-block;color:#126b78;font-size:12px;font-weight:800;letter-spacing:.07em}.hrma-priority-heading h3{margin:4px 0 6px;font-size:20px;color:#123e69}.hrma-priority-heading p{margin:0;color:#526779;line-height:1.7}

/* v0.3.1: Reduce the instructional text and skill definition in Step 1. */
[data-wizard-step="step-1"] .hrma-section-heading p {
    font-size: 16px;
    line-height: 1.65;
}

.hrma-definition {
    font-size: 16px;
    line-height: 1.7;
}

@media (max-width: 620px) {
    [data-wizard-step="step-1"] .hrma-section-heading p,
    .hrma-definition {
        font-size: 14px;
        line-height: 1.7;
    }
}


/* v0.3.2: Tighten the vertical gap between adjacent A–E level blocks. */
.hrma-level-row {
    padding-top: 8px;
    padding-bottom: 8px;
}

@media (max-width: 620px) {
    .hrma-level-row {
        padding-top: 8px;
        padding-bottom: 8px;
    }
}

/* v0.3.4: 前回評価を、自己評価の左にグレーアウト表示する。 */
.hrma-evaluation-column-headings {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr) 104px 104px;
    gap: 18px;
    align-items: end;
    padding: 10px 0 7px;
    border-bottom: 1px solid #dfe8ee;
}

.hrma-evaluation-column-headings > span:nth-child(3),
.hrma-evaluation-column-headings > span:nth-child(4) {
    color: #506678;
    font-size: 11px;
    font-weight: 800;
    text-align: center;
    line-height: 1.4;
}

.hrma-evaluation-column-headings > span:nth-child(4) {
    color: #126b78;
}

.hrma-level-list .hrma-level-row {
    grid-template-columns: 110px minmax(0, 1fr) 104px 104px;
}

.hrma-previous-grade-radios {
    justify-content: center;
}

.hrma-previous-grade-option {
    background: #f5f6f7;
    border-color: #d5dce1;
    color: #7c8992;
    cursor: default;
    opacity: 1;
}

.hrma-previous-grade-option:hover {
    background: #f5f6f7;
    border-color: #d5dce1;
}

.hrma-previous-grade-option input {
    accent-color: #9ba8b1;
}

.hrma-previous-grade-option span {
    color: #71808a;
}

.hrma-previous-grade-option small {
    color: #8d989f;
}

.hrma-previous-grade-option.is-selected {
    background: #e9edef;
    border-color: #aeb9c0;
    box-shadow: inset 0 0 0 1px #aeb9c0;
}

.hrma-no-previous-score {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 31px;
    border: 1px dashed #d5dce1;
    border-radius: 6px;
    background: #f7f8f9;
    color: #8a969e;
    font-size: 10px;
    text-align: center;
    padding: 5px;
}

@media (max-width: 850px) {
    .hrma-evaluation-column-headings,
    .hrma-level-list .hrma-level-row {
        grid-template-columns: 92px minmax(0, 1fr) 96px 96px;
        gap: 12px;
    }
}

@media (max-width: 620px) {
    .hrma-evaluation-column-headings {
        grid-template-columns: 1fr 92px 92px;
        gap: 10px;
        padding: 9px 0 5px;
    }

    .hrma-evaluation-column-headings > span:nth-child(1),
    .hrma-evaluation-column-headings > span:nth-child(2) {
        display: none;
    }

    .hrma-evaluation-column-headings > span:nth-child(3) {
        grid-column: 2;
    }

    .hrma-evaluation-column-headings > span:nth-child(4) {
        grid-column: 3;
    }

    .hrma-level-list .hrma-level-row {
        grid-template-columns: minmax(0, 1fr) 92px 92px;
        gap: 10px;
    }

    .hrma-level-list .hrma-level-title {
        grid-column: 1 / -1;
    }

    .hrma-level-list .hrma-level-description {
        grid-column: 1;
    }

    .hrma-level-list .hrma-previous-grade-radios {
        grid-column: 2;
    }

    .hrma-level-list .hrma-level-row > .hrma-grade-radios:last-child {
        grid-column: 3;
    }

    .hrma-no-previous-score {
        font-size: 9px;
        min-height: 29px;
    }
}


/* v0.3.5: 前回評価がない場合も、自己評価と同じ15段階のラジオ表示をグレーアウトして保持する。 */
.hrma-skill-navigation {
    margin-top: 12px;
}

@media (max-width: 620px) {
    .hrma-skill-navigation {
        margin-top: 10px;
    }
}


/* v0.3.6: 操作ボタンを評価カードの枠線から離し、独立したフッターとして見せる。 */
.hrma-skill-navigation {
    margin: 0;
    padding: 12px 22px 16px;
    border-top: 1px solid #dfe8ee;
}

@media (max-width: 620px) {
    .hrma-skill-navigation {
        margin: 0;
        padding: 10px 16px 14px;
    }
}


/* v0.3.7: Step 2の説明文と「評価して気づいたこと」入力欄を小さくする。 */
[data-wizard-step="step-2"] .hrma-section-heading p,
.hrma-priority-heading p {
    font-size: 14px;
    line-height: 1.65;
}

#hrma-awareness {
    font-size: 14px;
    line-height: 1.7;
}

@media (max-width: 620px) {
    [data-wizard-step="step-2"] .hrma-section-heading p,
    .hrma-priority-heading p,
    #hrma-awareness {
        font-size: 13px;
    }
}

/* v0.3.8: 重点スキルの選択欄・課題／行動入力欄の文字をStep 2の説明文と揃えて小さくする。 */
.hrma-plan-title select,
.hrma-plan-fields textarea {
    font-size: 14px;
    line-height: 1.7;
}

@media (max-width: 620px) {
    .hrma-plan-title select,
    .hrma-plan-fields textarea {
        font-size: 13px;
    }
}

/* v0.3.9: STEP 1の各スキル画面からも途中経過を下書き保存できるようにする。 */
.hrma-skill-navigation-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

@media (max-width: 620px) {
    .hrma-skill-navigation-actions {
        flex-direction: column;
        width: 100%;
    }

    .hrma-skill-navigation-actions .hrma-button {
        width: 100%;
        text-align: center;
    }
}


/* v0.4.0: アプリ上部を年度・自己評価期間だけのコンパクトな表示へ変更。 */
.hrma-app-header {
    display: inline-flex;
    width: auto;
    max-width: 100%;
    padding: 14px 18px;
    border-radius: 14px;
    align-items: center;
}

.hrma-header-meta {
    display: flex;
    align-items: stretch;
    gap: 0;
}

.hrma-header-meta-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 145px;
    padding: 0 18px;
    border-left: 1px solid rgba(255, 255, 255, .22);
}

.hrma-header-meta-item:first-child {
    min-width: 105px;
    padding-left: 0;
    border-left: 0;
}

.hrma-header-meta-item:last-child {
    padding-right: 0;
}

.hrma-header-meta-item span {
    display: block;
    margin-bottom: 4px;
    color: rgba(255, 255, 255, .76);
    font-size: 11px;
    font-weight: 800;
}

.hrma-header-meta-item strong {
    color: #fff;
    font-size: 14px;
    line-height: 1.35;
    white-space: nowrap;
}

@media (max-width: 620px) {
    .hrma-app-header {
        display: flex;
        width: 100%;
        padding: 13px 15px;
    }

    .hrma-header-meta {
        width: 100%;
    }

    .hrma-header-meta-item {
        flex: 1;
        min-width: 0;
        padding: 0 12px;
    }

    .hrma-header-meta-item:first-child {
        min-width: 86px;
    }

    .hrma-header-meta-item strong {
        font-size: 12px;
    }
}