:root{--bg-color: #f4f7f6;--text-color: #333;--card-bg: #ffffff;--border-color: #eee;--primary-color: #007aff;--secondary-text: #666;--shadow-color: rgba(0, 0, 0, .05);--input-bg: #fff;--input-border: #ddd;--header-bg: #fff;--nav-bg: #ffffff;--nav-icon-color: #333;--nav-icon-active: #ffffff;--success-bg: #d4edda;--success-text: #155724;--error-bg: #f8d7da;--error-text: #ff3b30;--warning-bg: #fff3cd;--warning-text: #856404;--info-bg: #eaf5ff;--submit-btn-bg: var(--primary-color);--submit-btn-text: #ffffff;--selection-btn-text: #007aff;--selection-btn-border: #007aff}.dark-mode{--bg-color: #050814;--text-color: #e0e6ed;--card-bg: #111620;--border-color: #2a3040;--primary-color: #3a82f7;--secondary-text: rgba(255, 255, 255, .7);--shadow-color: rgba(0, 0, 0, .4);--input-bg: #1a202c;--input-border: #2d3748;--header-bg: #050814;--nav-bg: #111620;--nav-icon-color: #ffffff;--nav-icon-active: #ffffff;--success-bg: #064e3b;--success-text: #6ee7b7;--error-bg: #7f1d1d;--error-text: #ff8a80;--warning-bg: #78350f;--warning-text: #fcd34d;--info-bg: #1e3a8a;--submit-btn-bg: var(--primary-color);--submit-btn-text: #ffffff;--selection-btn-text: #ffffff;--selection-btn-border: #ffffff}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Hiragino Sans,Noto Sans CJK JP,sans-serif;background-color:var(--bg-color);color:var(--text-color);margin:0;padding:20px 20px 100px;box-sizing:border-box;transition:background-color .3s,color .3s}.container{max-width:700px;width:95%;margin:0 auto;padding:0}@media(max-width:600px){body{padding:16px 16px 100px}.container{padding:0}}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.page-header h1{font-size:1.8em;font-weight:700;margin:0}.section-title-outside{font-size:1.1em;font-weight:600;color:var(--secondary-text);margin:24px 0 12px 4px}.page-header a,.back-link{font-size:1em;color:var(--primary-color);text-decoration:none;font-weight:500}.back-link:hover{text-decoration:underline}.card-base{background-color:var(--card-bg);border-radius:12px;box-shadow:0 4px 12px #0000000d;margin-bottom:20px;overflow:hidden}.course-card{display:flex;align-items:center;background-color:var(--card-bg);border-radius:12px;box-shadow:0 4px 12px #0000000d;padding:24px;text-decoration:none;color:var(--text-color);transition:transform .2s ease,box-shadow .2s ease;margin-bottom:0;position:relative}.course-card:hover{transform:translateY(-3px);box-shadow:0 6px 16px #00000014}.course-card.active{border:2px solid #007aff;cursor:pointer}.course-card.inactive{opacity:.8}.course-card.inactive:hover{transform:none;box-shadow:0 4px 12px #0000000d}.course-icon{font-size:2em;margin-right:20px;width:40px;text-align:center;flex-shrink:0}.course-text{flex:1;margin-right:12px}.course-text .title{font-size:1.3em;font-weight:700;margin-bottom:8px}.course-text .detail-link{font-size:.9em;color:var(--primary-color);text-decoration:none;font-weight:600;display:inline-block}.course-text .detail-link:hover{text-decoration:underline}.course-badge{margin-left:auto;padding:6px 12px;border-radius:20px;font-size:.85em;font-weight:600;white-space:nowrap;flex-shrink:0}.course-badge.active{background:#e8f5e9;color:#2e7d32}.dark-mode .course-badge.active{background:#2e7d3233;color:#66bb6a}.course-badge.inactive{background:#fce4ec;color:#c2185b}.dark-mode .course-badge.inactive{background:#c2185b33;color:#f48fb1}.option-button{display:flex;align-items:flex-start;width:100%;padding:14px 18px;font-size:1em;text-align:left;background-color:var(--card-bg);color:var(--text-color);border:1px solid var(--border-color);border-radius:8px;cursor:pointer;transition:background-color .2s,border-color .2s,box-shadow .2s}.option-button:hover{border-color:var(--primary-color)}.option-key{font-weight:700;margin-right:12px;color:var(--primary-color)}.option-text{flex:1;line-height:1.5}.bottom-nav{position:fixed;bottom:30px;left:50%;transform:translate(-50%);display:flex;gap:12px;padding:12px 24px;background:var(--nav-bg);border-radius:40px;box-shadow:0 4px 20px #0000001a;z-index:1000;max-width:90%;width:fit-content;box-sizing:border-box}.nav-button{display:flex;align-items:center;justify-content:center;width:56px;height:56px;background:transparent;border-radius:20px;text-decoration:none;transition:transform .2s ease;border:none;z-index:1;position:relative}.nav-button:hover{transform:scale(1.05)}.nav-button.active{background:transparent;border-color:transparent}.nav-button svg{width:28px;height:28px;stroke:var(--nav-icon-color);stroke-width:2.5px;transition:stroke .3s ease}.nav-button.active svg{stroke:var(--nav-icon-active)}.grouped-card{background-color:var(--card-bg);border-radius:12px;box-shadow:0 4px 12px #0000000d;margin-bottom:20px;overflow:hidden}.list-item{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--border-color);text-decoration:none;color:var(--text-color);transition:background-color .2s}.list-item:last-child{border-bottom:none}.list-item:hover{background-color:var(--bg-color)}.list-item .label{font-size:1em;color:var(--text-color);font-weight:500}.list-item .value{font-size:1em;color:var(--secondary-text)}.list-item .arrow{color:#c7c7cc;font-size:1.2em}.single-card{display:flex;align-items:center;justify-content:space-between;background-color:var(--card-bg);border-radius:12px;box-shadow:0 4px 12px #0000000d;padding:20px;text-decoration:none;color:var(--text-color);transition:transform .2s ease,box-shadow .2s ease;margin-bottom:16px}.single-card:hover{transform:translateY(-2px);box-shadow:0 6px 16px #00000014}@media(max-width:600px){.bottom-nav{bottom:16px;padding:10px 20px}.nav-button{width:52px;height:52px}.nav-button svg{width:26px;height:26px}}.loading{text-align:center;padding:60px;color:#666;font-size:18px}.loading-spinner{width:40px;height:40px;border:4px solid rgba(0,0,0,.1);border-top-color:#007aff;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 20px}@keyframes spin{to{transform:rotate(360deg)}}.animate-spin{animation:spin 1s linear infinite}.score-text-passed{color:#28a745}.score-text-failed{color:#007aff}.dark-mode .score-text-passed,.dark-mode .score-text-failed{color:#fff}