:root{--c-gray-50: #f9fafb;--c-gray-100: #f3f4f6;--c-gray-200: #e5e7eb;--c-gray-300: #d1d5db;--c-gray-400: #9ca3af;--c-gray-500: #6b7280;--c-gray-600: #4b5563;--c-gray-700: #374151;--c-gray-800: #1f2937;--c-gray-900: #111827;--c-blue-50: #eff6ff;--c-blue-100: #dbeafe;--c-blue-300: #93c5fd;--c-blue-500: #3b82f6;--c-blue-600: #2563eb;--c-blue-700: #1d4ed8;--c-blue-800: #1e40af;--c-indigo-100: #e0e7ff;--c-indigo-400: #818cf8;--c-indigo-800: #3730a3;--c-green-50: #f0fdf4;--c-green-500: #22c55e;--c-green-600: #16a34a;--c-amber-50: #fffbeb;--c-amber-200: #fde68a;--c-amber-500: #f59e0b;--c-amber-600: #d97706;--c-amber-700: #b45309;--text-primary: var(--c-gray-900);--text-secondary: var(--c-gray-600);--text-muted: var(--c-gray-400);--text-link: var(--c-blue-600);--bg-page: #fafafa;--bg-surface: #ffffff;--bg-subtle: var(--c-gray-50);--border-color: var(--c-gray-200);--border-light: var(--c-gray-100);--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-pill: 9999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .06);--shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--shadow-focus: 0 0 0 3px rgba(59, 130, 246, .15);--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Hiragino Sans", "Noto Sans JP", sans-serif;--text-xs: .85rem;--text-sm: 1rem;--text-base: 1.125rem;--text-lg: 1.3rem;--text-xl: 1.625rem;--text-2xl: 1.9rem;--transition: .15s ease}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-sans);font-size:var(--text-base);line-height:1.7;color:var(--text-primary);background:var(--bg-page);max-width:800px;margin:0 auto;padding:1rem;-webkit-font-smoothing:antialiased}a{color:var(--text-link);text-decoration:none;transition:color var(--transition)}a:hover{text-decoration:underline}main{padding-top:1.25rem}.site-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 0;border-bottom:1px solid var(--border-color);position:sticky;top:0;background:var(--bg-page);z-index:100}.site-title{font-size:var(--text-lg);font-weight:700;color:var(--text-primary);display:flex;align-items:center;gap:.4rem}.site-title:hover{text-decoration:none;color:var(--c-blue-600)}.site-title .site-icon{color:var(--c-blue-500)}.menu-toggle{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--bg-surface);cursor:pointer;color:var(--c-gray-500);transition:all var(--transition)}.menu-toggle:hover{background:var(--c-gray-50);color:var(--text-primary);border-color:var(--c-gray-300)}.header-menu{display:none;position:absolute;top:100%;right:0;z-index:100;min-width:220px;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:.5rem 0;margin-top:.25rem}.header-menu.open{display:block}.menu-section{padding:.25rem 0;border-bottom:1px solid var(--border-light)}.menu-section:last-child{border-bottom:none}.menu-label{padding:.4rem 1rem .2rem;font-size:var(--text-xs);color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.menu-item{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:var(--text-sm);color:var(--c-gray-700);cursor:pointer;border:none;background:none;width:100%;text-align:left;transition:background var(--transition)}.menu-item:hover{background:var(--c-gray-50);text-decoration:none}.menu-item svg{flex-shrink:0}#user-name-display{padding:.35rem 1rem;font-size:var(--text-xs);color:var(--text-muted)}.breadcrumb{display:flex;align-items:center;gap:.35rem;font-size:var(--text-sm);color:var(--text-muted);margin-bottom:1rem}.breadcrumb a{color:var(--c-gray-500)}.breadcrumb a:hover{color:var(--text-link);text-decoration:none}.page-title{font-size:var(--text-2xl);font-weight:700;color:var(--text-primary);margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.page-title .icon{color:var(--c-blue-500);flex-shrink:0}.section-title{font-size:var(--text-lg);font-weight:600;color:var(--text-primary);margin-bottom:.75rem;padding-bottom:.4rem;border-bottom:2px solid var(--c-blue-100);display:flex;align-items:center;gap:.4rem}.section-title .icon{color:var(--c-blue-500);flex-shrink:0}.card{display:block;padding:1rem 1.25rem;border:1px solid var(--border-color);border-radius:var(--radius-lg);background:var(--bg-surface);transition:border-color var(--transition),box-shadow var(--transition)}.card:hover{border-color:var(--c-blue-500);box-shadow:var(--shadow-focus);text-decoration:none}.card h3{font-size:var(--text-lg);font-weight:600;color:var(--text-primary);margin-bottom:.4rem;display:flex;align-items:center;gap:.4rem}.card h3 .icon{flex-shrink:0}.card p{font-size:var(--text-sm);color:var(--text-secondary);line-height:1.6}.info-box{background:var(--bg-subtle);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:1rem 1.25rem;font-size:var(--text-sm);color:var(--text-secondary);line-height:1.7}.tag{display:inline-flex;align-items:center;gap:.25rem;padding:.25rem .65rem;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;background:var(--c-indigo-100);color:var(--c-indigo-800);transition:opacity var(--transition)}.tag:hover{text-decoration:none;opacity:.8}.tag-sub{background:var(--c-blue-100);color:var(--c-blue-700)}.tag-count{font-size:var(--text-xs);color:var(--c-indigo-400);margin-left:.1rem}.tag-list{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}.tag-list li{display:inline-flex;align-items:center;gap:.2rem;padding:.3rem .75rem;background:var(--c-indigo-100);border-radius:var(--radius-md);font-size:var(--text-sm)}.tag-list a{color:var(--c-indigo-800);font-weight:500}.tag-list a:hover{text-decoration:none;opacity:.8}.btn-outline{display:inline-flex;align-items:center;gap:.35rem;padding:.45rem 1rem;border:1px solid var(--c-blue-500);border-radius:var(--radius-md);background:var(--bg-surface);color:var(--c-blue-600);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:all var(--transition)}.btn-outline:hover{background:var(--c-blue-50);text-decoration:none}.btn-outline svg{flex-shrink:0}.btn-primary{display:inline-flex;align-items:center;gap:.35rem;padding:.5rem 1.25rem;border:none;border-radius:var(--radius-md);background:var(--c-blue-600);color:#fff;font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:background var(--transition)}.btn-primary:hover{background:var(--c-blue-700);text-decoration:none}.btn-ghost{display:inline-flex;align-items:center;gap:.3rem;padding:.35rem .75rem;border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--bg-surface);color:var(--c-gray-500);font-size:var(--text-sm);cursor:pointer;transition:all var(--transition)}.btn-ghost:hover{border-color:var(--c-gray-300);color:var(--c-gray-700)}.btn-ghost.active{border-color:var(--c-blue-500);background:var(--c-blue-50);color:var(--c-blue-600)}.btn-ghost.active-amber{border-color:var(--c-amber-500);background:var(--c-amber-50);color:var(--c-amber-600)}.btn-pill{display:inline-flex;align-items:center;gap:.3rem;padding:.35rem .85rem;border:1px solid var(--c-gray-300);border-radius:var(--radius-pill);background:var(--bg-surface);color:var(--text-muted);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:all var(--transition)}.btn-pill .check-icon{display:none}.btn-pill.active{border-color:var(--c-blue-600);background:var(--c-blue-600);color:#fff}.btn-pill.active .check-icon{display:inline}.btn-pill:hover{border-color:var(--c-blue-500)}.nav-btn{display:inline-flex;align-items:center;gap:.3rem;padding:.5rem 1rem;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:var(--text-sm);color:var(--text-secondary);transition:all var(--transition)}.nav-btn:hover{background:var(--c-gray-50);border-color:var(--c-gray-300);text-decoration:none;color:var(--text-primary)}.problem-list{list-style:none;padding:0}.problem-list li{padding:.5rem 0;border-bottom:1px solid var(--border-light);display:flex;align-items:baseline;gap:.4rem}.problem-list li:last-child{border-bottom:none}.problem-list .problem-title-text{color:var(--text-secondary);font-size:var(--text-sm)}.difficulty{font-size:var(--text-sm);color:var(--c-amber-500);letter-spacing:1px}.memo-area{background:var(--c-amber-50);border:1px solid var(--c-amber-200);border-radius:var(--radius-lg);padding:.75rem;margin-bottom:1rem}.memo-input{width:100%;border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:.5rem;font-size:var(--text-sm);font-family:inherit;resize:vertical;line-height:1.5;transition:border-color var(--transition)}.memo-input:focus{outline:none;border-color:var(--c-amber-500);box-shadow:0 0 0 3px #f59e0b1a}.memo-footer{display:flex;align-items:center;gap:.5rem;margin-top:.5rem}.memo-count{font-size:var(--text-xs);color:var(--text-muted);margin-right:auto}.memo-save{padding:.3rem .8rem;border:none;border-radius:var(--radius-sm);font-size:var(--text-sm);cursor:pointer;background:var(--c-amber-500);color:#fff;transition:background var(--transition)}.memo-save:hover{background:var(--c-amber-600)}.memo-delete{padding:.3rem .8rem;border:none;border-radius:var(--radius-sm);font-size:var(--text-sm);cursor:pointer;background:var(--c-gray-200);color:var(--c-gray-500);transition:background var(--transition)}.memo-delete:hover{background:var(--c-gray-300)}.content-section{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:1.25rem;margin-bottom:1rem;white-space:pre-line;line-height:2}.content-section.explanation h3{font-size:var(--text-base);margin-bottom:.75rem;display:flex;align-items:center;gap:.35rem}.answer-toggle{margin:1.5rem 0}.answer-toggle[open] .content-section{border-color:var(--c-blue-300)}.answer-toggle>summary{display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1.5rem;background:var(--c-blue-600);color:#fff;border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-sm);font-weight:500;user-select:none;list-style:none;margin-bottom:1rem;transition:background var(--transition)}.answer-toggle>summary::-webkit-details-marker{display:none}.answer-toggle>summary:hover{background:var(--c-blue-700)}.answer-toggle>summary span.label-show{display:inline}.answer-toggle>summary span.label-hide{display:none}.answer-toggle[open]>summary{background:var(--c-gray-500)}.answer-toggle[open]>summary span.label-show{display:none}.answer-toggle[open]>summary span.label-hide{display:inline}.source-text{font-size:var(--text-xs);color:var(--text-muted);margin-top:.5rem}.related-section{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--border-color)}.related-section h3{font-size:var(--text-base);font-weight:600;margin-bottom:.75rem;color:var(--text-primary)}.related-section ul{list-style:none;padding:0}.related-section li{padding:.4rem 0;border-bottom:1px solid var(--border-light)}.related-section li:last-child{border-bottom:none}.related-title{color:var(--text-secondary);font-size:var(--text-sm)}:global(.problem-image){max-width:100%;height:auto;margin:.75rem 0;border-radius:var(--radius-sm)}.link-btn{background:none;border:none;color:var(--text-link);cursor:pointer;font-size:inherit;text-decoration:underline;padding:0}.checkbox-label{display:flex;align-items:center;gap:.4rem;font-size:var(--text-sm);color:var(--text-secondary);cursor:pointer}.checkbox-label input[type=checkbox]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--c-blue-600)}.memo-text{margin-top:.3rem;padding:.4rem .6rem;background:var(--c-amber-50);border-left:3px solid var(--c-amber-500);border-radius:var(--radius-sm);font-size:var(--text-sm);color:var(--text-secondary);white-space:pre-wrap}.katex-display{overflow-x:auto;overflow-y:hidden;padding:.5rem 0}.mt-0{margin-top:0}.mb-0{margin-bottom:0}.mb-sm{margin-bottom:.5rem}.mb-md{margin-bottom:1rem}.mb-lg{margin-bottom:1.5rem}.mb-xl{margin-bottom:2rem}.text-muted{color:var(--text-muted)}.text-secondary{color:var(--text-secondary)}.toast{position:fixed;bottom:2rem;left:50%;transform:translate(-50%) translateY(1rem);padding:.75rem 1.25rem;background:var(--c-gray-800, #1f2937);color:#fff;font-size:var(--text-sm);border-radius:var(--radius-md);opacity:0;transition:opacity .3s,transform .3s;z-index:1000;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}