/* v16: Use the same category names and tones throughout the learning journey. */
.tone-foundation{--category:#826020;--category-soft:#f8f1df;--category-line:#d9c38e}
.tone-first{--category:#315b7b;--category-soft:#edf4f9;--category-line:#b7cbdc}
.tone-second{--category:#79384c;--category-soft:#f8edf0;--category-line:#d6b1bd}
.tone-third{--category:#326555;--category-soft:#eaf3ee;--category-line:#b0cdbd}
.tone-guide{--category:#4c5a63;--category-soft:#f0f3f4;--category-line:#c8d0d4}
.tone-support{--category:#426354;--category-soft:#f0f5ef;--category-line:#b8cbbb}
.tone-proof{--category:#80613a;--category-soft:#f8f3e9;--category-line:#d8c9ad}
.tone-fees{--category:#514556;--category-soft:#f3eff4;--category-line:#ccc1d1}
.readable .category-section{border-top:8px solid var(--category-line);position:relative}
.readable .category-section .category-label{display:flex;align-items:center;gap:12px;color:var(--category);font-family:var(--sans);letter-spacing:.06em;margin-bottom:22px;font-weight:700}
.category-label:before{content:'';width:7px;align-self:stretch;min-height:22px;background:var(--category);flex-shrink:0}
.readable #exam-guide,.readable #why-vinoteras,.readable #school-info,.readable #faq{background:#fffefa}
.readable #route,.readable #online-learning{background:var(--category-soft)}
.readable #support{background:#fffefa}
.readable #trial{background:var(--category-soft)}
.readable #results{background:var(--category-soft);padding-block:52px}
.readable #textbook{background:linear-gradient(180deg,#edf4f9 0,#fffefa 650px)}
.readable #tasting{background:linear-gradient(180deg,#f8edf0 0,#fffefa 850px)}
.readable #courses{background:#f5f4f0}
.readable #fees{background:#fffefa}
.readable .page-category-nav{background:#fffefa;border-block:1px solid #d9d3c7;padding:25px 0}
.page-category-nav .wrap>p{font-weight:600;color:#56534b;margin:0 0 14px}
.page-category-nav .wrap>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px 25px}
.page-category-nav a{display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid #d9d3c7;padding:9px 0;min-height:44px;font-size:14px}
.page-category-nav a:hover{color:var(--wine);border-color:var(--wine)}
.page-category-nav a>span{color:var(--wine)}
.readable .annual-grid{gap:18px;background:none;border:0;align-items:stretch}
.readable .annual-step{background:var(--category-soft);border:1px solid var(--category-line);border-top:7px solid var(--category);color:var(--ink);min-width:0}
.readable .annual-step:after{display:none}
.readable .annual-step .annual-phase{display:inline-block;color:var(--category);font-weight:700;letter-spacing:0}
.readable .annual-step :is(.annual-date strong,.annual-purpose,.text-link){color:var(--category)}
.readable .annual-step .annual-target{border-color:var(--category-line);color:var(--category)}
.readable .annual-sommelier.route-highlight{background:var(--category-soft);border-color:var(--category)}
.readable .beginner-recommendation{background:var(--category-soft);color:var(--ink);border-left:6px solid var(--category)}
.readable .beginner-recommendation>span{color:var(--category);font-weight:600}
.readable .spring-tasting-note{background:var(--category-soft);border-color:var(--category-line)}
.readable .spring-tasting-note>span,.readable .spring-tasting-note .text-link{color:var(--category)}
.readable .quick-start-list li{border-top:4px solid var(--category);padding-top:13px}
.readable .quick-start-list :is(.quick-number,.quick-date){color:var(--category)}
.readable .qualification-stages li{background:var(--category-soft);border-left:4px solid var(--category)}
.readable .qualification-stages li>span{color:var(--category);white-space:nowrap;flex-basis:2.5em;flex-shrink:0;font-weight:700}
.readable .course-row{grid-template-columns:100px minmax(0,1fr) 210px;padding:32px;background:var(--category-soft);border:1px solid var(--category-line);border-top:7px solid var(--category);margin-top:28px;align-items:center}
.readable .course-id{display:flex;flex-direction:column;align-items:flex-start;gap:9px;color:var(--category);font-family:var(--sans)}
.readable .course-id .stage-name{font-size:30px;font-weight:700;line-height:1.4;writing-mode:horizontal-tb;margin:0;white-space:nowrap}
.readable .course-id .stage-short{font-size:13px;writing-mode:horizontal-tb;margin:0;letter-spacing:0}
.readable .course-body h3{font-weight:600}
.readable .course-body .stage-purpose{margin-top:12px;color:var(--category);font-weight:600}
.readable .course-row .course-button{background:var(--category);border-color:var(--category);color:white}
.readable .course-row .new-pill{background:white;color:var(--category);border:1px solid var(--category-line)}
.readable .course-row .course-tags span{background:white;border-color:var(--category-line);color:var(--category)}
.readable .course-detail{margin:0 0 28px;padding:22px 32px;background:var(--category-soft);border:1px solid var(--category-line);border-top:0}
.readable .course-detail details{background:#fffefa}
.readable .stage-plan{margin-top:48px;border:1px solid var(--category-line);padding:30px;background:var(--category-soft)}
.readable .stage-plan .plan-heading{margin:-30px -30px 0;padding:28px 30px;background:var(--category);color:white;align-items:center;border:0}
.readable .stage-plan .plan-heading :is(.mini-label,h3,span){color:white}
.readable .plan-heading .mini-label{font-weight:700;letter-spacing:.03em}
.readable .plan-stage-purpose{color:var(--category);font-weight:600;margin:22px 0}
.readable .stage-plan .plan-card{background:#fffefa;border-color:var(--category-line);border-top-color:var(--category)}
.readable .stage-plan :is(.plan-price,.plan-kicker,.source-link,.text-link){color:var(--category)}
.readable .stage-plan .button.outline{border-color:var(--category);color:var(--category)}
.readable .stage-plan .button.outline:hover{background:var(--category);color:white}
.readable .stage-plan .plan-table-wrap{background:#fffefa}
.readable .stage-plan .plan-table thead th{background:var(--category);color:white}
.readable .third-plan-grid article{background:#fffefa;border-top-color:var(--category)}
.readable .third-price-table thead{background:#e3eee7}
.readable .third-price-table td[data-label="料金"]{color:var(--category)}
.readable .plan-nav a{color:var(--category);background:var(--category-soft);border:1px solid var(--category-line);border-top:4px solid var(--category)}
.readable .foundation-compare dl>div,.readable .foundation-compare dl>div+div{background:var(--category-soft);border:1px solid var(--category-line);border-left:5px solid var(--category);padding:22px;margin:0 0 16px}
.readable .foundation-compare dl :is(dt,dd strong){color:var(--category)}
.comparison-stage{display:block;font-weight:700;margin-bottom:6px;font-size:14px}
.readable .tasting-steps{border-color:#d6b1bd}
.readable .tasting-steps>li{border-top:4px solid var(--category);background:var(--category-soft)}
.readable .survey-heading{margin-bottom:24px}
.readable .survey-metrics article{background:#fffefa}
.readable .survey-metrics .metric-count{color:#59534b}
.readable .survey-scope{margin-top:18px;color:#625c52}
.readable .survey-disclosure{margin-top:5px;border:0;padding:0;background:transparent;color:#625c52}
.readable .survey-disclosure>summary{width:fit-content;max-width:100%;cursor:pointer;min-height:36px;padding:8px 0;text-decoration:underline;text-underline-offset:3px}
.readable .survey-disclosure>summary span{margin-left:8px}
.readable .survey-disclosure[open]>summary{margin-bottom:12px}
.readable .survey-disclosure>div{border-top:1px solid #c9baa2;padding:22px 0 0;color:#4b4842}
.survey-sample-facts{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;margin:0 0 25px}
.survey-sample-facts>div{padding:14px 0;border-bottom:1px solid #d8c9ad}
.survey-sample-facts dt{font-weight:600}.survey-sample-facts dd{margin:6px 0 0}
@layer readable-type {
 .readable main .survey-disclosure>summary{font-size:11px!important;line-height:1.7!important}
 .readable main .survey-scope,.readable main .survey-heading>p{font-size:12px!important;line-height:1.85!important}
 .readable main .survey-disclosure :is(p,li,dt,dd){font-size:14px!important;line-height:1.9!important}
}
@media(max-width:1100px){
 .readable .course-row{grid-template-columns:90px minmax(0,1fr);padding:28px}
 .readable .course-row .course-button{grid-column:2}
 .readable .annual-grid.expert-route .annual-step{border:1px solid var(--category-line);border-left:7px solid var(--category)}
 .readable .annual-step+.annual-step{margin-top:0}
 .readable .stage-plan{padding:24px}.readable .stage-plan .plan-heading{margin:-24px -24px 0;padding:25px 24px}
}
@media(max-width:700px){
 .page-category-nav .wrap>div{grid-template-columns:1fr 1fr;gap:6px 20px}
 .readable .category-section{border-top-width:6px}
 .readable .category-section .category-label{margin-bottom:20px}
 .readable .annual-grid{display:grid;gap:18px}
 .readable .annual-grid.expert-route,.readable .annual-grid.sommelier-route{display:grid;grid-template-columns:1fr;gap:18px}
 .readable .annual-grid.expert-route .annual-step,.readable .annual-step{border:1px solid var(--category-line);border-top:6px solid var(--category)}
 .readable .course-row{grid-template-columns:1fr;padding:24px 20px;gap:18px}
 .readable .course-id{flex-direction:row;align-items:center;gap:16px}
 .readable .course-row .course-button{grid-column:1;width:100%;max-width:none}
 .readable .course-body h3{font-size:25px}
 .readable .course-detail{padding:20px;margin-bottom:28px}
 .readable .stage-plan{padding:20px 16px}
 .readable .stage-plan .plan-heading{display:block;margin:-20px -16px 0;padding:25px 20px}
 .readable .stage-plan .plan-heading>span{display:block;margin-top:12px}
 .readable .stage-plan .plan-heading h3{font-size:25px}
 .readable .first-plan{padding:24px 18px}
 .readable .plan-price-row{grid-template-columns:1fr;gap:10px}
 .readable .price-year{padding-left:0;border:0;display:flex;gap:10px}
 .readable .price-year .year-value>span{display:inline}
 .readable .stage-plan .plan-table tbody th{background:var(--category-soft)}
 .readable .stage-plan .plan-table td,.readable .stage-plan .plan-table th{padding:14px 12px}
 .readable .foundation-compare dl>div,.readable .foundation-compare dl>div+div{padding:20px 18px}
 .survey-sample-facts{grid-template-columns:1fr;gap:0}
 .readable .survey-disclosure>summary span{margin-left:5px}
 .readable #results{padding-block:38px}
}

.readable :is(.stage-purpose,.plan-stage-purpose)>span{display:inline-block}
.readable .course-row .course-reference{color:var(--category);border-color:var(--category-line)}
.readable .course-detail summary{color:var(--category)}
