/* Generated by tools/split-subpage-css.php. Edit assets/css/source/subpage-modern.full.css instead. */
.cagr-page-heading { margin-bottom: 0; }
.cagr-page-heading h1 { margin-bottom: 14px; color: #172033; }
.cagr-page-heading > p:last-child { max-width: 780px; margin: 0; color: #536277; line-height: 1.75; }
.cagr-eyebrow { margin: 0 0 8px; color: #2563eb; font-size: .84rem; font-weight: 800; }
.cagr-calculator { margin-top: 28px; border: 1px solid #d9e1eb; border-radius: 8px; background: #fff; }
.cagr-workspace { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(250px, .9fr); gap: 24px; padding: 24px; align-items: start; }
.cagr-form-panel, .cagr-mode-fieldset { margin: 0; }
.cagr-mode-fieldset { padding: 0 0 22px; border: 0; border-bottom: 1px solid #e3e8ef; }
.cagr-mode-fieldset legend { width: 100%; margin-bottom: 12px; color: #172033; font-size: 1rem; font-weight: 800; }
.cagr-mode-control { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.cagr-mode-control label { position: relative; margin: 0; cursor: pointer; }
.cagr-mode-control input { position: absolute; opacity: 0; pointer-events: none; }
.cagr-mode-control span { min-height: 46px; display: flex; align-items: center; justify-content: center; border: 1px solid #d9e1eb; border-radius: 7px; background: #fff; color: #3b4a60; font-weight: 800; }
.cagr-mode-control input:checked + span { border-color: #2563eb; background: #eef4ff; color: #1d4ed8; box-shadow: inset 0 0 0 1px #2563eb; }
.cagr-mode-control input:focus-visible + span { outline: 2px solid #2563eb; outline-offset: 2px; }
.cagr-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.cagr-value-grid { padding: 22px 0 14px; }
.cagr-period-panel { padding-bottom: 8px; }
.cagr-period-panel[hidden] { display: none; }
.cagr-field { display: grid; gap: 7px; min-width: 0; margin: 0; }
.cagr-field > span { color: #334155; font-size: .84rem; font-weight: 800; }
.cagr-field input { width: 100%; min-width: 0; height: 48px; margin: 0; border: 1px solid #d5deea; border-radius: 7px; background: #fff; color: #172033; }
.cagr-field small { min-height: 18px; color: #c2413b; font-size: .75rem; }
.cagr-input-unit { display: grid; grid-template-columns: minmax(0, 1fr) 42px; align-items: center; border: 1px solid #d5deea; border-radius: 7px; overflow: hidden; }
.cagr-input-unit input { border: 0; border-radius: 0; }
.cagr-input-unit > span { color: #65748a; text-align: center; }
.cagr-actions { display: flex; gap: 10px; padding-top: 14px; }
.cagr-actions button:first-child { flex: 1; }
.cagr-actions button[type="reset"] { background: #e8edf4; color: #314158; }
.cagr-result-panel { position: sticky; top: 18px; padding: 22px; border: 1px solid #d9e1eb; border-radius: 8px; background: #f8fafc; }
.cagr-result-label { margin: 0 0 5px; color: #64748b; font-size: .8rem; font-weight: 800; }
.cagr-primary-result { display: block; color: #172033; font-size: 2.15rem; line-height: 1.2; }
.cagr-result-message { min-height: 22px; margin: 8px 0 16px; color: #64748b; font-size: .78rem; }
.cagr-result-panel.is-growth .cagr-primary-result, .cagr-result-panel.is-growth .cagr-result-message { color: #047857; }
.cagr-result-panel.is-decline .cagr-primary-result, .cagr-result-panel.is-decline .cagr-result-message { color: #b42318; }
.cagr-result-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.cagr-result-grid > div { min-width: 0; padding: 11px; border: 1px solid #e2e7ee; border-radius: 6px; background: #fff; }
.cagr-result-grid > .is-wide { grid-column: 1 / -1; }
.cagr-result-grid span { display: block; margin-bottom: 5px; color: #748198; font-size: .68rem; }
.cagr-result-grid strong { display: block; color: #29384d; font-size: .84rem; overflow-wrap: anywhere; }
.cagr-result-note { margin: 14px 0 0; color: #778397; font-size: .72rem; line-height: 1.55; }
.cagr-visualization { margin-top: 28px; padding: 24px; border: 1px solid #d9e1eb; border-radius: 8px; background: #fff; }
.cagr-visualization[hidden] { display: none; }
.cagr-visualization header { margin-bottom: 20px; }
.cagr-visualization h2 { margin-bottom: 8px; color: #172033; font-size: 1.45rem; }
.cagr-visualization header > p:last-child { margin: 0; color: #64748b; font-size: .88rem; line-height: 1.65; }
.cagr-chart-shell { width: 100%; overflow-x: auto; padding: 52px 12px 4px; border: 1px solid #dce3ec; border-radius: 7px; background: #f8fafc; }
.cagr-chart-bars { display: flex; align-items: flex-end; gap: 10px; min-width: 100%; min-height: 300px; border-bottom: 1px solid #bac5d2; }
.cagr-chart-item { position: relative; flex: 1 0 44px; max-width: 74px; height: 278px; display: grid; grid-template-rows: minmax(0, 1fr) 28px; align-items: end; justify-items: center; }
.cagr-chart-bar { position: relative; width: min(46px, 82%); height: var(--bar-height); min-height: 5px; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 5px 5px 0 0 !important; background: #64748b !important; box-shadow: none !important; cursor: pointer; transition: background-color .15s ease; }
.cagr-chart-item:first-child .cagr-chart-bar { background: #8b98aa !important; }
.cagr-chart-item:last-child .cagr-chart-bar { background: #16806a !important; }
.cagr-visualization.is-decline .cagr-chart-item:last-child .cagr-chart-bar { background: #b4534b !important; }
.cagr-chart-bar:hover, .cagr-chart-bar:focus-visible { background: #2563eb !important; outline: 2px solid #2563eb; outline-offset: 2px; }
.cagr-chart-tooltip { position: absolute; z-index: 2; left: 50%; bottom: calc(100% + 8px); min-width: 94px; padding: 7px 8px; border: 1px solid #d6dee8; border-radius: 6px; background: #fff; color: #27364c; font-size: .7rem; font-weight: 700; line-height: 1.35; text-align: center; transform: translateX(-50%); opacity: 0; pointer-events: none; box-shadow: 0 5px 16px rgba(34, 48, 67, .12); }
.cagr-chart-bar:hover .cagr-chart-tooltip, .cagr-chart-bar:focus-visible .cagr-chart-tooltip { opacity: 1; }
.cagr-chart-label { color: #65748a; font-size: .7rem; white-space: nowrap; }
.cagr-series-table-wrap { max-height: 340px; overflow: auto; margin-top: 18px; border: 1px solid #dce3ec; border-radius: 7px; }
.cagr-series-table { width: 100%; margin: 0; border-collapse: collapse; }
.cagr-series-table th, .cagr-series-table td { padding: 10px 12px; border-bottom: 1px solid #e5eaf0; text-align: left; }
.cagr-series-table th { position: sticky; top: 0; z-index: 1; background: #f2f5f9; color: #526177; font-size: .72rem; }
.cagr-series-table td { color: #35445a; font-size: .8rem; }
.cagr-series-table tbody tr:last-child td { border-bottom: 0; }
.cagr-guide { margin-top: 44px; padding-top: 30px; border-top: 1px solid #dde4ed; }
.cagr-guide-heading h2 { margin-bottom: 12px; color: #172033; }
.cagr-guide-heading > p:last-child { max-width: 780px; margin: 0; color: #5a687b; line-height: 1.75; }
.cagr-guide-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 26px; margin-top: 24px; }
.cagr-guide-grid section { padding: 22px 0; border-bottom: 1px solid #e2e7ee; }
.cagr-guide-grid h3 { margin-bottom: 8px; color: #1f2c40; font-size: 1rem; }
.cagr-guide-grid p { margin: 0; color: #5f6d80; font-size: .88rem; line-height: 1.75; }
@media screen and (max-width: 980px) {
.cagr-workspace { grid-template-columns: 1fr; }
.cagr-result-panel { position: static; }
}
@media screen and (max-width: 620px) {
.cagr-workspace, .cagr-visualization { padding: 16px; }
.cagr-field-grid, .cagr-guide-grid { grid-template-columns: 1fr; }
.cagr-value-grid { gap: 8px; }
.cagr-actions { flex-direction: column; }
.cagr-chart-bars { min-width: 620px; }
}
.revolving-field-grid .is-wide { grid-column: 1 / -1; }
.revolving-result-grid > .is-wide { grid-column: 1 / -1; }
@media screen and (max-width: 620px) {
.revolving-field-grid .is-wide, .revolving-result-grid > .is-wide { grid-column: auto; }
}
.qrcode-field-grid .is-wide { grid-column: 1 / -1; }
@media screen and (max-width: 620px) {
.qrcode-field-grid .is-wide { grid-column: auto; }
}
.ip-convert-result-card.wide { grid-column: 1 / -1; }