.particles-app-wrapper{--bg:#f7f8f3;--panel:#fff;--ink:#1f2937;--muted:#6b7280;--accent:#0f766e;--line:#d1d5db;flex-direction:column;align-items:center;gap:.65rem;width:100%;padding:0 1rem 2rem;display:flex}.particles-app{background:var(--panel);border:1px solid var(--line);border-radius:16px;width:min(980px,100%);overflow:clip;box-shadow:0 16px 40px #0f172a14}.particles-header{color:#f0fdfa;background:linear-gradient(135deg,#0f766e,#0ea5a4);flex-direction:column;justify-content:space-between;align-items:stretch;gap:1rem;padding:1rem 1.25rem;display:flex;position:relative}.study-title-row{justify-content:space-between;align-items:center;gap:1rem;width:100%;display:flex}.study-title-copy{min-width:0}.study-header-actions{flex:none;align-items:center;gap:.5rem;display:flex}.particle-settings-toggle{color:#f0fdfa;cursor:pointer;background:#0f766e59;border:1px solid #f0fdfa80;border-radius:8px;place-items:center;width:2.25rem;height:2.25rem;padding:0;font-size:1.35rem;line-height:1;display:inline-grid}.particle-settings-toggle:hover,.particle-settings-toggle[aria-expanded=true]{background:#0f766ea6}.particle-header-actions{scrollbar-width:thin;gap:.5rem;width:100%;padding:0 .1rem .25rem;display:flex;overflow-x:auto}.particle-header-actions button{color:#f0fdfa;white-space:nowrap;cursor:pointer;background:#0f766e59;border:1px solid #f0fdfa80;border-radius:8px;flex:none;padding:.5rem .7rem;font-size:.82rem;font-weight:600}.particle-header-actions button:hover{background:#0f766ea6}.particle-header-actions button.active-state{color:#fff;background:#dc2626;border-color:#b91c1c}.header-pause-control{color:#f0fdfa;white-space:nowrap;background:#0f766e59;border:1px solid #f0fdfa80;border-radius:8px;flex:none;padding:.35rem .6rem;font-size:.78rem}.header-pause-control input[type=range]{width:5rem}.particle-voice-options{gap:.4rem;display:flex}.particle-voice-options button{border:1px solid var(--line);color:var(--ink);cursor:pointer;background:0 0;border-radius:7px;padding:.4rem .25rem;font-size:.8rem;font-weight:700}.particle-voice-options button.selected{border-color:var(--accent);background:var(--accent);color:#fff}.particle-voice-select-label{color:var(--muted);margin:0;font-size:.78rem;font-weight:700;display:block}.particle-voice-select{border:1px solid var(--line);background:var(--panel);width:min(24rem,100%);color:var(--ink);border-radius:7px;padding:.4rem;font-size:.8rem}.particle-voice-settings{border-top:1px solid var(--line);background:var(--panel);color:var(--ink);justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.25rem;display:flex}.particle-voice-settings h2{margin:0;font-family:inherit;font-size:1rem}.particle-voice-controls{justify-content:flex-end;align-items:center;gap:.75rem;display:flex}.particles-header h1{margin:0;font-family:inherit;font-size:1.4rem}.particles-header .sub{opacity:.95;margin:.35rem 0 0;font-size:.95rem}.pause-control{align-items:center;gap:.5rem;display:flex}.pause-control input[type=range]{accent-color:var(--accent)}.particle-intro-overlay{z-index:10;background:#0f172a9e;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.particle-intro-dialog{border:1px solid var(--line);background:var(--panel);width:min(820px,100%);max-height:min(720px,100vh - 2rem);color:var(--ink);border-radius:14px;overflow:hidden;box-shadow:0 24px 70px #0f172a4d}.particle-intro-heading{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.15rem;display:flex}.particle-intro-heading h2{margin:.2rem 0 0;font-size:1.25rem}.particle-intro-heading .label{margin:0}.particle-intro-close{border:1px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer;border-radius:8px;padding:.45rem .7rem;font-weight:700}.particle-intro-table-wrap{max-height:calc(min(720px,100vh - 2rem) - 76px);padding-bottom:1rem;overflow:auto}.particle-intro-table{border-collapse:collapse;text-align:left;width:100%;min-width:720px;font-size:.9rem}.particle-intro-table th,.particle-intro-table td{border-bottom:1px solid var(--line);vertical-align:top;padding:.7rem .8rem}.particle-intro-table thead th{z-index:1;background:var(--panel);color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-size:.75rem;position:sticky;top:0}.particle-intro-example{color:var(--accent);white-space:nowrap;font-weight:700}.particle-intro-example u{text-underline-offset:3px;text-decoration-thickness:2px}.particle-intro-speak{border:1px solid var(--accent);color:var(--accent);cursor:pointer;background:0 0;border-radius:7px;margin-left:.65rem;padding:.25rem .5rem;font-size:.78rem;font-weight:700}.particle-intro-speak:hover{background:var(--accent);color:#fff}.particles-list{flex-direction:column;gap:.8rem;padding:1rem;display:flex}.particle-item{border:1px solid var(--line);text-align:center;background:#fcfcfb;border-radius:12px;grid-template-columns:minmax(0,1fr) minmax(12rem,.55fr);justify-content:center;align-items:center;gap:.35rem;padding:.85rem .95rem;transition:transform .12s,box-shadow .12s,border-color .12s,background-color .12s;display:grid}.particle-main{flex-direction:column;align-items:center;gap:.35rem;min-width:0;display:flex}.particle-vocabulary{border-left:1px solid var(--line);text-align:left;align-self:stretch;min-width:0;padding-left:1rem}.particle-vocabulary-list{flex-direction:column;gap:.35rem;margin-top:.35rem;display:flex}.particle-vocabulary-pair{grid-template-columns:minmax(4rem,auto) 1fr;align-items:baseline;gap:.5rem;display:grid}.particle-vocabulary-japanese{color:var(--accent);font-size:1.05rem;font-weight:700}.particle-vocabulary-english{color:var(--muted);font-size:.85rem}.particle-item.active{background:#fff7d6;border-color:#92400e;transform:translateY(-1px);box-shadow:0 0 0 2px #92400e3d}.particle-item.active .hiragana{color:#7c2d12;background:#fde68a;border-radius:999px;padding:.2rem .6rem}.item-field{flex-direction:column;align-items:center;gap:.1rem;display:flex}.item-field-inline{flex-direction:row;justify-content:center;align-items:center;gap:.5rem}.hiragana-line{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;display:flex}.show-count{color:#92400e;background:#fef3c7;border:1px solid #fde68a;border-radius:999px;justify-content:center;align-items:center;min-width:1.7rem;height:1.7rem;padding:0 .35rem;font-size:.8rem;font-weight:700;display:inline-flex}.tile-action,.tile-show{background:var(--accent);color:#fff;cursor:pointer;border:0;border-radius:999px;padding:.3rem .61rem;font-size:.8rem;font-weight:700}.tile-action:hover,.tile-show:hover{filter:brightness(1.06)}.label{text-transform:uppercase;letter-spacing:.08em;color:#64748b;font-size:.78rem;font-weight:700}.hiragana{color:#0f766e;font-size:1.35rem;font-weight:700}.particle-badge{color:#0f766e;background:#ccfbf1;border-radius:6px;padding:.15rem .5rem;font-size:1.1rem;font-weight:700;display:inline-block}.particle-meaning{color:#0d9488;font-weight:600}.particle-usage{color:var(--muted,#6b7280);margin-top:.2rem;font-size:.85rem;font-style:italic;display:block}.english-meaning{color:#ca8a04;font-weight:600}.particles-pagination{border-top:1px solid var(--line);justify-content:center;align-items:center;gap:1rem;padding:.85rem 1.25rem;font-weight:600;display:flex}.particles-pagination button{border:1px solid var(--line);background:var(--panel);cursor:pointer;border-radius:8px;padding:.4rem .8rem;font-weight:600}.particles-pagination button:disabled{opacity:.5;cursor:not-allowed}body.dark-mode .particles-app{background:#111827;border-color:#334155}body.dark-mode .particle-voice-settings{color:#f9fafb;background:#111827;border-color:#334155}body.dark-mode .particle-voice-options button,body.dark-mode .particle-voice-select{color:#f9fafb;background:#1f2937;border-color:#374151}body.dark-mode .particle-voice-options button.selected{background:var(--accent);border-color:var(--accent)}body.dark-mode .particle-item{color:#f9fafb;background:#1f2937;border-color:#374151}body.dark-mode .particle-vocabulary{border-left-color:#334155}body.dark-mode .particles-pagination{border-top-color:#334155}body.dark-mode .particles-pagination button{color:#f9fafb;background:#1f2937;border-color:#374151}body.dark-mode .particle-intro-dialog,body.dark-mode .particle-intro-close,body.dark-mode .particle-intro-table thead th{color:#f9fafb;background:#111827}body.dark-mode .particle-intro-table th,body.dark-mode .particle-intro-table td,body.dark-mode .particle-intro-heading{border-color:#334155}body.dark-mode .particle-intro-speak{color:#5eead4;border-color:#5eead4}body.dark-mode .particle-intro-speak:hover{color:#ecfeff;background:#0f766e}@media (max-width:680px){.particle-voice-settings,.particle-voice-controls{flex-direction:column;align-items:stretch}.particle-voice-controls,.particle-voice-select{width:100%}.particle-item{grid-template-columns:1fr}.particle-vocabulary{border-top:1px solid var(--line);border-left:0;width:100%;padding:.65rem 0 0}}