*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,sans-serif;background:#eef2ff;color:#111827}button,select,textarea{font:inherit}.topbar{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:18px 24px;background:#fffffff0;border-bottom:1px solid #d1d5db;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.topbar h1{margin:0 0 4px}.topbar p{margin:0;color:#6b7280}.controls{display:flex;flex-wrap:wrap;gap:8px}button,select{border:1px solid #2563eb;border-radius:10px;background:#fff;padding:9px 12px}button{cursor:pointer;color:#1e40af;font-weight:700}button.activeFilter{background:#dbeafe;border-color:#1d4ed8}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:18px;padding:24px}.card{min-height:260px;position:relative;border:3px solid #1f2937;border-radius:20px;background:#fff;box-shadow:0 8px 20px #0f172a24;overflow:hidden;cursor:pointer}.card.covered{border-color:#16a34a;background:#ecfdf5}.rememberedIcon{position:absolute;top:10px;left:10px;z-index:2;border-color:#10b981;color:#9ca3af;border-radius:999px}.rememberedIcon.remembered{color:#047857;background:#d1fae5}.face{min-height:260px;display:flex;align-items:center;justify-content:center;padding:20px;text-align:center}.word{font-size:28px;font-weight:900}.photo{padding:0;position:relative}.photo img{width:100%;height:260px;object-fit:cover;display:block}.photoPlaceholder{width:100%;height:260px;align-items:center;justify-content:center;padding:18px;background:linear-gradient(135deg,#dbeafe,#fef3c7);color:#1e3a8a;font-size:24px;font-weight:900}.korean{flex-direction:column;gap:14px;color:#1e3a8a;font-size:34px;background:#eff6ff;padding-bottom:58px}.korean strong{max-width:100%;overflow-wrap:anywhere}.edit{position:absolute;left:10px;bottom:10px;background:#ffffffe6}.edit.compact{left:50%;transform:translate(-50%);padding:5px 9px;border-radius:8px;font-size:12px;line-height:1}.modalShade{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px;background:#0f172a8c}.modal{max-width:560px;width:min(100%,560px);max-height:86vh;overflow:auto;background:#fff;border-radius:18px;padding:22px;box-shadow:0 24px 70px #0000004d}.wide{width:min(100%,900px);max-width:900px}.actions,.choices{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.dropzone{display:block;border:2px dashed #93c5fd;border-radius:14px;padding:28px;background:#eff6ff}textarea{width:100%;border:1px solid #93c5fd;border-radius:12px;padding:10px}.question{border-top:1px solid #e5e7eb;padding:14px 0}.choices button.selected{background:#dbeafe}.list{display:grid;gap:8px;margin-bottom:18px}.empty{max-width:640px;margin:48px auto;padding:32px;text-align:center;background:#fff;border:2px dashed #cbd5e1;border-radius:16px;color:#475569}.empty h2{margin-top:0;color:#1e293b}button:disabled{opacity:.45;cursor:not-allowed}button.danger{background:#c62828;color:#fff;border-color:#c62828}button.danger:hover{background:#a31f1f}.stage{min-height:calc(100vh - 140px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;box-sizing:border-box}.puzzle{max-width:100%;box-sizing:border-box;display:grid;grid-template-columns:repeat(auto-fill,200px);justify-content:center;gap:18px;padding:18px;border-radius:24px;background-color:#e2e8f0;background-size:cover;background-position:center;background-repeat:no-repeat;box-shadow:0 12px 30px #0f172a33}.puzzle .card{width:200px;box-sizing:border-box;transition:opacity .5s ease,transform .5s ease}.card.gone{opacity:0;border-color:transparent;background:transparent;box-shadow:none;transform:scale(.92)}.card.gone:hover{opacity:.25;background:#fff}.allFound{margin-bottom:14px;padding:10px 18px;border-radius:999px;background:#fef3c7;font-weight:700}.choices button.correct{background:#dcfce7;border-color:#16a34a;color:#14532d;font-weight:700}.choices button.wrong{background:#fee2e2;border-color:#dc2626;color:#7f1d1d;text-decoration:line-through}.choices button:disabled{cursor:default;opacity:1}.question.isWrong{background:#fff7f7}.resultBox{margin:8px 0 12px;padding:12px 16px;border-radius:12px;background:#f8fafc;border:1px solid #e2e8f0}.wrongTable{border-collapse:collapse;width:100%}.wrongTable th,.wrongTable td{border-bottom:1px solid #e5e7eb;padding:6px 8px;text-align:left}.wrongTable .bad{color:#b91c1c}.wrongTable .good{color:#15803d;font-weight:700}button.primary{background:#1d4ed8;color:#fff;border-color:#1d4ed8}button.primary:disabled{background:#93c5fd;border-color:#93c5fd}html{-webkit-text-size-adjust:100%}body{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}button,select,.fileButton{min-height:44px;touch-action:manipulation}.topbar small{display:block;margin-top:6px;color:#475569}.errorBanner{position:sticky;top:0;z-index:200;display:flex;gap:12px;align-items:center;padding:12px 20px;background:#fee2e2;color:#991b1b;white-space:pre-wrap;overflow-wrap:anywhere}.errorBanner span{flex:1}.errorNotice{white-space:pre-wrap;overflow-wrap:anywhere;padding:12px;border-radius:10px;background:#fee2e2;color:#991b1b}.successNotice{padding:12px;border-radius:10px;background:#dcfce7;color:#166534}.storageWarning{color:#92400e;background:#fffbeb;padding:10px;border-radius:8px}.storagePanel{line-height:1.55}.storagePanel progress{width:min(100%,360px);height:24px;margin-top:12px}.fileButton{display:inline-flex;flex-direction:column;gap:8px;border:1px solid #2563eb;border-radius:10px;padding:12px}.fileButton input{max-width:100%}.replaceChoice{display:flex;align-items:center;gap:10px;margin-bottom:12px}.replaceChoice input{min-width:24px;min-height:24px}.attributions{max-height:50vh;overflow:auto;overflow-wrap:anywhere;padding:12px;margin-top:12px;background:#f8fafc}.attributions article{border-bottom:1px solid #cbd5e1;padding:12px 0}.attributions p{margin:6px 0}.licenseLink{display:inline-block;margin:4px 12px 4px 0}@media(max-width:1100px){.topbar{flex-direction:column;align-items:stretch;position:relative}.controls{align-items:center}}@media(max-width:600px){.topbar{padding:14px}.topbar h1{font-size:24px}.stage{padding:12px}.modalShade{padding:10px}.modal{padding:16px;max-height:calc(100dvh - 32px)}}