@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&family=Noto+Serif+JP:wght@400;700&family=Potta+One&display=swap";body{font-family:Noto Sans JP,sans-serif;background-color:#f3f4f6;position:fixed;inset:0;width:100%;height:100dvh;touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}#app-container{width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden}.pb-safe{padding-bottom:calc(12px + env(safe-area-inset-bottom))}.pt-safe{padding-top:calc(12px + env(safe-area-inset-top))}body.platform-native .pt-safe{padding-top:54px!important;padding-top:max(54px,calc(10px + env(safe-area-inset-top)))!important}.tab-content{display:none;flex:1;overflow:hidden;flex-direction:column;min-height:0}.tab-content.active{display:flex}.canvas-bg{background-color:#fff;background-image:linear-gradient(#e5e7eb 1px,transparent 1px),linear-gradient(90deg,#e5e7eb 1px,transparent 1px);background-size:20px 20px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.char-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:8px;padding:16px;padding-bottom:calc(100px + env(safe-area-inset-bottom));overflow-y:auto;-webkit-overflow-scrolling:touch}.char-card{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fff;border-radius:12px;border:2px solid #e5e7eb;font-size:1.5rem;position:relative;cursor:pointer;transition:all .2s}.char-card.active{border-color:#3b82f6;background-color:#eff6ff}.char-card.done{border-color:#10b981;color:#059669}.status-dot{position:absolute;bottom:6px;width:6px;height:6px;border-radius:50%;background-color:#e5e7eb}.char-card.done .status-dot{background-color:#10b981}.filter-tab{padding:6px 12px;border-radius:999px;font-size:.8rem;font-weight:700;color:#6b7280;background:#f3f4f6;transition:all .2s;white-space:nowrap}.filter-tab.active{background:#3b82f6;color:#fff}@font-face{font-family:MyHandwritingPreview;src:url() format("opentype")}.preview-text{font-family:MyHandwritingPreview,Noto Sans JP,sans-serif;-webkit-user-select:text;user-select:text}.preview-text::placeholder{font-family:Noto Sans JP,sans-serif;font-size:1rem;color:#9ca3af}#guideLayer{pointer-events:none;-webkit-user-select:none;user-select:none;display:flex;align-items:center;justify-content:center;font-size:200px;line-height:1;padding-bottom:10%;color:#d1d5db}.modal-backdrop{position:fixed;inset:0;background-color:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:50;display:flex;justify-content:center;align-items:center;opacity:0;pointer-events:none;transition:opacity .2s}.modal-backdrop.active{opacity:1;pointer-events:auto}.modal-content{background:#fff;border-radius:1rem;width:90%;max-width:320px;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;transform:scale(.95);transition:transform .2s;overflow:hidden}.modal-backdrop.active .modal-content{transform:scale(1)}#tourOverlay{position:fixed;inset:0;z-index:100;pointer-events:auto;background-color:#0000001a;display:none}#tourOverlay.active{display:block}.tour-highlighter{position:absolute;border:3px solid #ef4444;border-radius:8px;box-shadow:0 0 0 9999px #00000080;transition:all .3s ease;pointer-events:none;z-index:101}.tour-tooltip{position:absolute;background:#fff;padding:1rem;border-radius:12px;width:280px;box-shadow:0 10px 25px #0003;pointer-events:auto;z-index:102;transition:all .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in{animation:fadeIn .2s ease-out}