.vocab-layout{display:grid;grid-template-columns:350px 1fr;gap:var(--space-xl);margin-bottom:var(--space-xxl)}.vocab-config{position:sticky;top:var(--space-lg);height:fit-content}.vocab-config .card{padding:var(--space-xl);border:2px solid var(--border);border-radius:var(--radius);background:var(--card)}.vocab-config h3{margin:0 0 var(--space-lg) 0;font-size:1.3rem;color:var(--text)}.form-group{margin-bottom:var(--space-lg)}.form-group label{display:block;margin-bottom:var(--space-sm);font-size:14px;font-weight:500;color:var(--text)}.form-control{width:100%;padding:10px 14px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font-size:14px;transition:var(--transition)}.form-control:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #0a84ff1a}.form-control-sm{padding:8px 12px;font-size:13px}select.form-control,select.form-control-sm,select{width:100%;padding:8px 32px 8px 12px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font-size:13px;cursor:pointer;transition:var(--transition);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23666' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}select.form-control:hover,select.form-control-sm:hover,select:hover{border-color:var(--accent)}select.form-control:focus,select.form-control-sm:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #0a84ff1a}.book-selector{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-sm) var(--space-md)}.range-selector{display:flex;align-items:center;gap:var(--space-sm)}.range-selector input{flex:1}.range-selector span{color:var(--muted);font-size:14px}.quick-select{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-xs)}.config-preview{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md);background:var(--surface);border-radius:var(--radius);border-left:4px solid var(--accent);margin-top:var(--space-lg)}.preview-icon{font-size:2rem}.preview-text{font-size:14px;color:var(--muted)}.preview-text strong{color:var(--accent);font-size:1.5rem;font-weight:700}.vocab-functions{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:var(--space-lg)}.vocab-functions .function-card:nth-child(1){grid-column:1;grid-row:1}.vocab-functions .function-card:nth-child(2){grid-column:1;grid-row:2}.vocab-functions .function-card:nth-child(3){grid-column:2;grid-row:1 / 3}.function-card{padding:var(--space-xl);transition:var(--transition);display:flex;flex-direction:column;height:100%;border:2px solid var(--border);border-radius:var(--radius);background:var(--card)}.function-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #00000026;border-color:#0a84ff4d}.function-header{display:flex;align-items:flex-start;gap:var(--space-md);margin-bottom:var(--space-lg);flex-shrink:0}.function-icon{font-size:2.5rem;flex-shrink:0;line-height:1}.function-info{flex:1;min-width:0}.function-info h3{margin:0 0 var(--space-xs) 0;font-size:1.25rem;font-weight:600;color:var(--text);line-height:1.3}.function-desc{margin:0;font-size:13px;color:var(--muted);line-height:1.5}.function-settings{flex:1;display:flex;flex-direction:column;gap:var(--space-md);margin-bottom:var(--space-lg)}.form-group{margin:0}.form-group label{display:block;margin-bottom:var(--space-sm);font-size:13px;font-weight:500;color:var(--text)}.form-group-inline{display:flex;align-items:center;gap:var(--space-sm)}.form-group-inline label{min-width:50px;font-size:13px;font-weight:500;color:var(--text);margin:0;flex-shrink:0}.form-group-inline .form-control-sm{flex:1;min-width:0}.settings-grid{display:flex;flex-direction:column;gap:var(--space-sm)}.radio-group{display:flex;flex-direction:row;gap:var(--space-md)}.radio-label{display:flex;align-items:center;gap:var(--space-sm);cursor:pointer;font-size:13px;color:var(--text);padding:var(--space-xs) 0}.radio-label input[type=radio]{width:16px;height:16px;cursor:pointer;flex-shrink:0}.checkbox-group{display:flex;flex-direction:column;gap:var(--space-sm)}.checkbox-label{display:flex;align-items:center;gap:var(--space-sm);cursor:pointer;font-size:13px;color:var(--text);padding:var(--space-xs) 0}.checkbox-label input[type=checkbox]{width:16px;height:16px;cursor:pointer;flex-shrink:0}.estimated-time{text-align:center;padding:var(--space-md);background:#0a84ff0d;border:1px solid rgba(10,132,255,.1);border-radius:var(--radius);font-size:13px;color:var(--muted)}.estimated-time strong{display:block;color:var(--accent);font-size:1.25rem;font-weight:700;margin-top:var(--space-xs)}.function-actions{display:flex;flex-direction:column;gap:var(--space-sm);margin-top:auto;padding-top:var(--space-md)}.function-actions .btn{width:100%;padding:var(--space-md) var(--space-lg);font-size:14px;font-weight:500;white-space:nowrap}.btn-icon{margin-right:var(--space-xs);font-size:1.1em}@media (min-width: 769px) and (max-width: 1024px){.vocab-layout{grid-template-columns:2fr 3fr;gap:var(--space-lg)}.vocab-functions{grid-template-columns:1fr 1fr;grid-template-rows:auto auto}.vocab-functions .function-card:nth-child(1){grid-column:1;grid-row:1}.vocab-functions .function-card:nth-child(2){grid-column:1;grid-row:2}.vocab-functions .function-card:nth-child(3){grid-column:2;grid-row:1 / 3}.settings-grid{flex-direction:column}.function-actions .btn{min-width:120px}}@media (max-width: 768px){.vocab-layout{grid-template-columns:1fr;gap:var(--space-md)}.vocab-config{position:static}.vocab-config .card,.function-card{padding:var(--space-lg)}.vocab-functions{grid-template-columns:1fr;grid-template-rows:auto}.vocab-functions .function-card:nth-child(1),.vocab-functions .function-card:nth-child(2),.vocab-functions .function-card:nth-child(3){grid-column:1;grid-row:auto}.book-selector,.quick-select{grid-template-columns:repeat(2,1fr)}.function-icon{font-size:2rem}.function-actions{flex-direction:column}.function-actions .btn{width:100%;min-width:0}.settings-grid,.function-actions{flex-direction:column}.function-actions .btn{width:100%}}.history-section{margin-top:var(--space-xxl);padding:var(--space-xl);background:var(--card);border-radius:var(--radius);border:2px solid var(--border)}.history-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-lg);flex-wrap:wrap;gap:var(--space-md)}.history-header h3{margin:0;font-size:1.3rem;color:var(--text)}.history-actions{display:flex;align-items:center;gap:var(--space-md);flex-wrap:wrap}.history-filters{display:flex;gap:var(--space-sm);flex-wrap:wrap}.filter-btn{padding:6px 16px;background:var(--surface);border:1px solid var(--border);border-radius:20px;color:var(--muted);font-size:14px;font-weight:500;cursor:pointer;transition:var(--transition);display:inline-flex;align-items:center;justify-content:center}.filter-btn:hover{border-color:var(--accent);color:var(--text)}.filter-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}.history-grid{display:grid;gap:var(--space-md)}@media (min-width: 1200px){.history-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}@media (min-width: 768px) and (max-width: 1199px){.history-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}}@media (max-width: 767px){.history-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 480px){.history-grid{grid-template-columns:1fr}}.history-card{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);padding:var(--space-md);transition:var(--transition);cursor:pointer}.history-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.history-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--space-sm)}.history-card-type{display:flex;align-items:center;gap:var(--space-xs);font-size:14px;font-weight:600}.history-card-icon{font-size:1.2rem}.history-card-title{font-size:16px;font-weight:600;color:var(--text)}.history-card-actions{display:flex;gap:var(--space-sm);margin-top:var(--space-sm)}.btn-detail,.btn-retry-all,.btn-retry-all-flashcard,.btn-practice-wrong,.btn-practice-wrong-flashcard,.btn-view-printable,.btn-replay-offline{flex:1;padding:8px 12px;font-size:13px;font-weight:500;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;transition:var(--transition)}.btn-detail:hover,.btn-retry-all:hover,.btn-retry-all-flashcard:hover,.btn-practice-wrong:hover,.btn-practice-wrong-flashcard:hover,.btn-view-printable:hover,.btn-replay-offline:hover{border-color:var(--accent);background:#0a84ff0d;transform:translateY(-1px)}.btn-retry-all,.btn-retry-all-flashcard{border-color:var(--accent);color:var(--accent)}.btn-retry-all:hover,.btn-retry-all-flashcard:hover{border-color:var(--accent);background:#0a84ff1a}.btn-practice-wrong,.btn-practice-wrong-flashcard{border-color:#ff9500;color:#ff9500}.btn-practice-wrong:hover,.btn-practice-wrong-flashcard:hover{border-color:#ff9500;background:#ff95000d}.btn-view-printable,.btn-replay-offline{border-color:#34c759;color:#34c759}.btn-view-printable:hover,.btn-replay-offline:hover{border-color:#34c759;background:#34c7590d}.history-card-config{font-size:14px;color:var(--text);margin-bottom:var(--space-xs);font-weight:500}.history-card-stats{font-size:13px;color:var(--muted);margin-bottom:var(--space-xs)}.history-card-time{font-size:12px;color:var(--muted)}.history-empty{text-align:center;padding:var(--space-xxl);color:var(--muted)}.empty-icon{font-size:4rem;margin-bottom:var(--space-md)}.empty-text{font-size:1.1rem;font-weight:500;margin-bottom:var(--space-sm);color:var(--text)}.empty-hint{font-size:14px}@media (max-width: 768px){.history-section{padding:var(--space-md)}.history-header{flex-direction:column;align-items:flex-start}.history-actions{width:100%;flex-direction:column;align-items:stretch}.history-filters{width:100%;justify-content:flex-start}.filter-btn{flex:0 0 auto}#clearHistoryBtn{width:100%}}