/* Four fixed course entries and one rotating recommendation. */
.recommend-stage{position:relative}
.recommend-particles{position:absolute;left:0;top:0;z-index:4;pointer-events:none;border-radius:18px 0 0 18px}
@media(max-width:768px){.recommend-particles{border-radius:18px 18px 0 0}}
.recommend-stage{display:grid;perspective:1400px;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:0 14px 36px -25px rgba(65,40,118,.25);overflow:hidden;touch-action:pan-y}
.recommend-panel{grid-area:1/1;display:grid;grid-template-columns:42% 58%;visibility:hidden;pointer-events:none;min-width:0;background:var(--surface)}
.recommend-panel.is-current,.recommend-panel.is-leaving{visibility:visible}
.recommend-panel.is-current{pointer-events:auto;z-index:2}
.recommend-panel.is-leaving{z-index:1}
.recommend-cover{position:relative;overflow:hidden;background:#ffe747;color:#262133;padding:40px;display:flex;flex-direction:column;justify-content:center;gap:28px;min-height:380px}
.recommend-cover h3{position:relative;z-index:1;font-size:29px;line-height:1.5;margin:0;max-width:420px;color:inherit}
.recommend-cover h3 span{display:block;font-size:24px;margin-top:4px}
.recommend-cover p{position:relative;z-index:1;margin:0;border-top:1px solid currentColor;padding-top:22px;font-size:16px;line-height:1.9;max-width:330px}
.recommend-mark{position:absolute;right:-8px;top:0;font-size:166px;line-height:1.2;letter-spacing:-12px;font-weight:800;opacity:.10;user-select:none}
.theme-tools .recommend-cover{background:#eee8ff;color:#42267f}
.theme-create .recommend-cover{background:#5a35b6;color:#fffaf0}
.theme-remake .recommend-cover{background:#fff3bb;color:#423225}
.theme-create .recommend-mark{opacity:.16}
.recommend-copy{padding:34px 40px;display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.recommend-copy h3{margin:0;font-size:25px;line-height:1.5}
.recommend-copy>p{font-size:15px;color:var(--muted);line-height:1.8;margin:10px 0 17px}
.recommend-copy ol{list-style:none;margin:0 0 22px;padding:0;width:100%}
.recommend-copy li{display:flex;gap:14px;align-items:center;min-height:48px;padding:8px 0;border-bottom:1px solid var(--line);font-size:16px}
.recommend-copy li>span:first-child{color:var(--action);font-size:13px;font-weight:700}
.recommend-copy>.btn{margin-top:auto;align-self:flex-start}
.recommend-controls{display:flex;align-items:center;justify-content:space-between;padding:12px 4px 0;color:var(--muted)}
.recommend-count{font-size:13px;letter-spacing:2px;font-variant-numeric:tabular-nums}
.recommend-controls-actions{display:flex;gap:7px;align-items:center}
.recommend-controls button{font:inherit;font-size:13px;border:1px solid var(--line);background:var(--surface);color:var(--action);border-radius:9px;min-width:44px;min-height:40px;padding:6px 12px;cursor:pointer}
.recommend-controls button:hover{background:var(--soft)}
.recommend-controls button:focus-visible,.recommend-select:focus-visible{outline:3px solid var(--action);outline-offset:3px}
.recommend-controls button:disabled{opacity:.5;cursor:default}
.topic-grid.recommend-choices{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:14px}
.recommend-choices>.topic-tile{padding:23px;cursor:pointer;min-height:238px;position:relative}
.recommend-choices>.topic-tile.is-current{border-color:var(--action);background-color:#f6f2ff;box-shadow:inset 0 0 0 1px var(--action)}
.recommend-choices .recommend-select{font:inherit;font-weight:700;text-align:left;border:0;padding:0;background:none;color:inherit;cursor:pointer;line-height:1.5}
.recommend-choices .topic-tile h3{font-size:20px;min-height:30px}
.recommend-choices .topic-tile p{font-size:14px;line-height:1.85;flex:1;margin:12px 0 22px}
.recommend-choices .course-entry{font-size:14px;white-space:nowrap}
.recommend-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:1100px){.recommend-cover{padding:28px}.recommend-copy{padding:28px}.recommend-cover h3{font-size:25px}.recommend-cover h3 span{font-size:21px}.recommend-copy h3{font-size:23px}.topic-grid.recommend-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.recommend-choices>.topic-tile{min-height:220px}}
@media(max-width:768px){.recommend-panel{grid-template-columns:1fr}.recommend-cover{min-height:245px;padding:26px;gap:20px}.recommend-cover h3{font-size:25px}.recommend-cover p{font-size:15px;padding-top:15px;max-width:none}.recommend-mark{font-size:140px}.recommend-copy{padding:25px}.recommend-copy li{font-size:15px}.recommend-copy>p{margin-bottom:12px}.recommend-controls [data-recommend-auto]{display:none}.recommend-choices>.topic-tile{padding:18px}.recommend-choices .topic-tile h3{font-size:18px}.recommend-choices .course-entry{padding:10px 14px}.recommend-stage{touch-action:pan-y}}
@media(max-width:480px){.topic-grid.recommend-choices{grid-template-columns:1fr}.recommend-choices>.topic-tile{min-height:190px}.recommend-cover h3 span{font-size:20px}.recommend-copy h3{font-size:22px}}
@media(prefers-reduced-motion:reduce){.recommend-panel,.recommend-cover,.recommend-copy{animation:none!important;transition:none!important}}

/* Larger fixed course entry buttons, matching the homepage primary action. */
.recommend-choices .topic-tile>.btn.course-entry{width:220px;max-width:100%;min-height:58px;padding:14px 24px;font-size:18px;font-weight:700;line-height:1.5;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box}
