*,:before,:after{box-sizing:border-box}body{color:#111827;background:#f3f4f6;margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5}.app{max-width:1400px;margin:0 auto;padding:24px 16px 40px}.header{margin-bottom:24px;padding-top:4px;position:relative}.header__brand{text-align:center}.header__title{margin:0 0 8px;font-size:2rem}.header__subtitle{color:#6b7280;margin:0}.feature-menu{z-index:30;position:absolute;top:0;left:0}.feature-menu__trigger{color:#6b7280;cursor:pointer;background:#fff;border:none;border-radius:12px;justify-content:center;align-items:center;width:42px;height:42px;padding:0;transition:color .2s,background .2s,box-shadow .2s,transform .2s;display:inline-flex;box-shadow:0 1px 2px #0f172a0f,0 0 0 1px #0f172a0a}.feature-menu__trigger:hover,.feature-menu:hover .feature-menu__trigger,.feature-menu:focus-within .feature-menu__trigger{color:#2563eb;background:#f8fbff;transform:translateY(-1px);box-shadow:0 4px 12px #2563eb24,0 0 0 1px #93c5fdcc}.feature-menu__icon{width:20px;height:20px}.feature-menu__panel{opacity:0;visibility:hidden;transform-origin:0 0;pointer-events:none;background:#fff;border:1px solid #0f172a0f;border-radius:14px;min-width:168px;padding:8px;transition:opacity .18s,transform .18s,visibility .18s;position:absolute;top:calc(100% + 8px);left:0;transform:translateY(-6px)scale(.98);box-shadow:0 12px 32px #0f172a1f,0 2px 8px #0f172a0f}.feature-menu:hover .feature-menu__panel,.feature-menu:focus-within .feature-menu__panel{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)scale(1)}.feature-menu__title{color:#9ca3af;letter-spacing:.04em;margin:0 0 6px;padding:4px 10px 2px;font-size:.75rem;font-weight:600}.feature-menu__item{color:#374151;width:100%;font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:10px;align-items:center;gap:10px;padding:10px 12px;font-size:.92rem;text-decoration:none;transition:background .15s,color .15s;display:flex}.feature-menu__item-icon{color:#6b7280;background:#f3f4f6;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;font-size:.82rem;font-weight:600;transition:background .15s,color .15s;display:inline-flex}.feature-menu__item:hover{color:#1d4ed8;background:#eff6ff}.feature-menu__item:hover .feature-menu__item-icon{color:#2563eb;background:#dbeafe}.feature-menu__item+.feature-menu__item{margin-top:2px}.feature-menu__panel:before{content:"";height:10px;position:absolute;top:-10px;left:0;right:0}.toolbar{background:#fff;border-radius:12px;flex-wrap:wrap;align-items:center;gap:12px 16px;margin-bottom:20px;padding:16px;display:flex;box-shadow:0 1px 3px #00000014}.toolbar__item{align-items:center;gap:8px;display:flex}.toolbar__item--end{margin-left:auto}.toolbar__input{width:72px;font:inherit;background:#fff;border:1px solid #d1d5db;border-radius:8px;padding:6px 10px}.toolbar__select{min-width:220px;font:inherit;background:#fff;border:1px solid #d1d5db;border-radius:8px;padding:6px 10px}.page-size-wrap{position:relative}.page-size-dropdown{z-index:20;background:#fff;border:1px solid #d1d5db;border-radius:8px;min-width:100%;max-height:220px;margin:0;padding:4px 0;list-style:none;position:absolute;top:calc(100% + 4px);left:0;overflow-y:auto;box-shadow:0 4px 12px #0000001f}.page-size-dropdown li{cursor:pointer;padding:8px 12px}.page-size-dropdown li:hover{background:#f3f4f6}.btn{color:#fff;font:inherit;cursor:pointer;background:#2563eb;border:none;border-radius:8px;padding:8px 16px;transition:background .15s}.btn:hover:not(:disabled){background:#1d4ed8}.btn:disabled{cursor:not-allowed;background:#9ca3af}.btn--secondary{background:#4b5563}.btn--secondary:hover:not(:disabled){background:#374151}.mode-group{gap:8px;display:inline-flex}.btn--mode{color:#374151;background:#e5e7eb}.btn--mode:hover:not(:disabled){background:#d1d5db}.btn--mode.is-active{color:#fff;background:#2563eb}.btn--mode.is-active:hover:not(:disabled){background:#1d4ed8}.card-grid{grid-template-columns:repeat(5,1fr);gap:12px;min-height:120px;display:grid}.word-card{background:#fff;border-radius:10px;min-height:56px;display:flex;position:relative;overflow:visible;box-shadow:0 1px 3px #00000014}.word-card__visible{background:#f9fafb;border-right:1px solid #e5e7eb;border-radius:10px 0 0 10px;flex:1;justify-content:center;align-items:center;padding:10px 8px 10px 28px;display:flex;position:relative;overflow:visible}.word-card__star{z-index:6;color:#d1d5db;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;width:22px;height:22px;padding:0;transition:color .15s;display:inline-flex;position:absolute;top:4px;right:4px}.word-card__star svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linejoin:round;width:16px;height:16px}.word-card__star.is-active svg{fill:currentColor;stroke:none}.word-card__star:hover{color:#fbbf24}.word-card__star.is-active{color:#f59e0b}.word-card__star.is-active:hover{color:#d97706}.word-card__text{text-align:center;word-break:break-word;font-size:.875rem}.word-card__menu-wrap{z-index:5;position:absolute;top:4px;left:4px}.word-card__more{color:#9ca3af;cursor:pointer;opacity:0;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;width:22px;height:22px;padding:0;transition:opacity .15s,background .15s,color .15s;display:inline-flex}.word-card__more svg{width:14px;height:14px}.word-card__visible:hover .word-card__more,.word-card__menu-wrap.is-open .word-card__more{opacity:1}.word-card__more:hover,.word-card__menu-wrap.is-open .word-card__more{color:#4b5563;background:#ffffffe6;box-shadow:0 0 0 1px #0f172a0f}.word-card__menu{z-index:20;background:#fff;border:1px solid #0f172a14;border-radius:8px;min-width:88px;padding:4px;position:absolute;top:calc(100% + 4px);left:0;box-shadow:0 8px 20px #0f172a1f}.word-card__menu-item{color:#374151;width:100%;font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:8px 10px;font-size:.8rem;transition:background .15s,color .15s;display:block}.word-card__menu-item:hover{color:#1d4ed8;background:#eff6ff}.word-card__menu-item--danger:hover{color:#b91c1c;background:#fef2f2}.word-card__hidden-wrap{border-radius:0 10px 10px 0;flex:1;min-width:0;position:relative;overflow:hidden}.word-card__hidden{text-align:center;word-break:break-word;justify-content:center;align-items:center;height:100%;padding:10px 8px;font-size:.875rem;font-weight:600;display:flex}.word-card__mask{color:#1f2937;cursor:pointer;-webkit-user-select:none;user-select:none;background:linear-gradient(135deg,#d1d5db,#9ca3af);justify-content:center;align-items:center;font-size:.75rem;transition:opacity .2s;display:flex;position:absolute;inset:0}.word-card__hidden-wrap.is-revealed .word-card__mask{opacity:0;pointer-events:none}.pagination{justify-content:center;align-items:center;gap:16px;margin-top:24px;display:flex}.pagination__info{text-align:center;color:#374151;min-width:120px}.error{color:#b91c1c;background:#fef2f2;border-radius:8px;grid-column:1/-1;padding:16px}.empty-hint{text-align:center;color:#6b7280;background:#fff;border-radius:10px;grid-column:1/-1;padding:32px 16px;box-shadow:0 1px 3px #00000014}.modal{z-index:100;justify-content:center;align-items:center;padding:24px 16px;display:flex;position:fixed;inset:0}.modal__backdrop{background:#11182773;position:absolute;inset:0}.modal__panel{background:#fff;border-radius:14px;flex-direction:column;width:min(720px,100%);max-height:min(80vh,720px);display:flex;position:relative;overflow:hidden;box-shadow:0 20px 40px #0000002e}.modal__panel--form{width:min(480px,100%)}.modal__header{border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;gap:16px;padding:18px 20px;display:flex}.modal__title{margin:0;font-size:1.25rem}.modal__close{color:#374151;cursor:pointer;background:#f3f4f6;border:none;border-radius:8px;width:36px;height:36px;font-size:1.5rem;line-height:1}.modal__close:hover{background:#e5e7eb}.history-page__header{margin-bottom:24px;padding-top:4px;position:relative}.history-page__back{color:#374151;font:inherit;cursor:pointer;background:#fff;border:none;border-radius:8px;padding:8px 14px;text-decoration:none;transition:color .15s,box-shadow .15s;display:inline-block;position:absolute;top:0;left:0;box-shadow:0 1px 3px #00000014}.history-page__back:hover{color:#2563eb;box-shadow:0 2px 8px #2563eb1f}.history-page__title-wrap{text-align:center}.history-page__title{margin:0 0 8px;font-size:2rem}.history-page__subtitle{color:#6b7280;margin:0}.history-page__content{flex-direction:column;gap:12px;display:flex}.history-empty{text-align:center;color:#6b7280;background:#fff;border-radius:12px;padding:32px 16px;box-shadow:0 1px 3px #00000014}.history-empty__hint{margin:8px 0 0;font-size:.92rem}.history-item{border:1px solid #e5e7eb;border-radius:10px;justify-content:space-between;align-items:center;gap:16px;padding:14px 16px;display:flex}.history-item+.history-item{margin-top:12px}.history-item.is-active{background:#eff6ff;border-color:#93c5fd}.history-item__title{color:#111827;font-weight:600}.history-item__meta{color:#6b7280;flex-wrap:wrap;gap:8px 16px;margin-top:6px;font-size:.92rem;display:flex}.history-item__actions{flex-shrink:0;align-items:center;gap:8px;display:flex}.history-item__badge{color:#fff;background:#2563eb;border-radius:999px;padding:6px 12px;font-size:.85rem;display:inline-block}.btn--small{padding:6px 12px;font-size:.9rem}.btn--danger{color:#b91c1c;background:#fff;border:1px solid #fca5a5}.btn--danger:hover:not(:disabled){color:#991b1b;background:#fef2f2}.word-form{padding:20px}.word-form__field{margin-bottom:16px;display:block}.word-form__label{color:#374151;margin-bottom:6px;font-size:.95rem;display:block}.word-form__input{width:100%;font:inherit;border:1px solid #d1d5db;border-radius:8px;padding:10px 12px}.word-form__input:focus{border-color:#2563eb;outline:none;box-shadow:0 0 0 3px #2563eb26}.word-form__hint{color:#6b7280;margin:0 0 16px;font-size:.9rem}.word-form__actions{justify-content:flex-end;gap:10px;display:flex}@media (width<=1200px){.card-grid{grid-template-columns:repeat(3,1fr)}}@media (width<=768px){.card-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=640px){.header,.history-page__header{padding-top:48px}.header__brand,.history-page__title-wrap{text-align:left}.header__title,.history-page__title{font-size:1.5rem}.card-grid{grid-template-columns:1fr}}