:root{--color-sea: #0094c8;--color-bingata: #e76f33;--color-paper: #fff9f0;--color-user: rgba(0, 148, 200, .6);--color-truth: rgba(231, 111, 51, .6);--color-intersect: rgba(119, 65, 158, .7);--color-text: #1a1a1a;--color-text-muted: #5a5a5a;--color-border: #d0d0d0;--font-heading: "M PLUS Rounded 1c", "Hiragino Maru Gothic Pro", "ヒラギノ丸ゴ Pro", "メイリオ", sans-serif;--font-body: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN", "メイリオ", sans-serif;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 40px;--max-width: 480px;--canvas-size: min(95vw, 480px);--border-radius: 8px}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;background:var(--color-paper);color:var(--color-text);font-family:var(--font-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overscroll-behavior:none;touch-action:manipulation}#app{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:100vh;padding:var(--space-md);max-width:var(--max-width);margin:0 auto}h1,h2,h3{font-family:var(--font-heading);margin:0 0 var(--space-md);font-weight:700}button{font-family:var(--font-heading);font-size:18px;font-weight:700;border:none;border-radius:var(--border-radius);background:var(--color-sea);color:#fff;padding:var(--space-md) var(--space-lg);cursor:pointer;transition:transform .1s ease,background .2s ease;min-height:48px;-webkit-tap-highlight-color:transparent}button:hover,button:focus-visible{transform:translateY(-1px);background:#0079a3}button:active{transform:translateY(0)}button.secondary{background:transparent;color:var(--color-sea);border:2px solid var(--color-sea)}button.secondary:hover,button.secondary:focus-visible{background:#0094c81a}button:disabled{background:var(--color-border);color:var(--color-text-muted);cursor:not-allowed;transform:none}.tagline{color:var(--color-text-muted);font-size:14px;margin-bottom:var(--space-lg);text-align:center}.drawing_view{display:flex;flex-direction:column;align-items:center;width:100%}.drawing_view__header{display:flex;align-items:center;justify-content:space-between;width:100%;margin-bottom:var(--space-md)}.drawing_view__title{font-family:var(--font-heading);font-size:18px;font-weight:700;margin:0}.drawing_view__back{background:transparent;color:var(--color-text-muted);font-size:14px;font-weight:500;padding:8px 12px;border:1px solid var(--color-border);min-height:auto}.drawing_view__back:hover{background:#0000000a;color:var(--color-text);transform:none}.drawing_view__canvas_wrap{position:relative;width:var(--canvas-size);height:var(--canvas-size);background:#fbfbfb;border:1px solid var(--color-border);border-radius:var(--border-radius);overflow:auto;-webkit-overflow-scrolling:touch}.drawing_view__zoom_layer{position:relative;transition:width .15s ease-out,height .15s ease-out}.drawing_view__hint_svg,.drawing_view__user_canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.drawing_view__hint_svg{pointer-events:none}.drawing_view__user_canvas{touch-action:none;cursor:crosshair;z-index:2}.drawing_view__zoom_controls{display:flex;gap:6px;margin-top:var(--space-sm);align-items:center;justify-content:center;font-size:13px;color:var(--color-text-muted)}.drawing_view__zoom_controls button{font-size:18px;font-weight:700;min-width:38px;min-height:38px;padding:0 10px;background:#fff;color:var(--color-sea);border:1px solid var(--color-border)}.drawing_view__zoom_controls button:hover,.drawing_view__zoom_controls button:focus-visible{background:#0094c814;transform:none}.drawing_view__zoom_controls button:disabled{background:var(--color-border);color:var(--color-text-muted)}.drawing_view__zoom_controls button.active{background:var(--color-sea);color:#fff;border-color:var(--color-sea)}.drawing_view__zoom_controls .zoom_level{min-width:56px;text-align:center;font-variant-numeric:tabular-nums}.drawing_view__canvas_wrap.pan_mode{cursor:grab}.drawing_view__canvas_wrap.pan_mode .drawing_view__user_canvas{pointer-events:none;cursor:grab}.drawing_view__canvas_wrap.pan_dragging,.drawing_view__canvas_wrap.pan_dragging .drawing_view__user_canvas{cursor:grabbing}.drawing_view__instruction{margin-top:var(--space-md);color:var(--color-text-muted);font-size:14px;text-align:center;min-height:1.6em}.drawing_view__toolbar{display:flex;gap:var(--space-sm);margin-top:var(--space-md);width:100%;justify-content:center}.drawing_view__toolbar button{font-size:15px;padding:10px 18px;min-height:44px}.drawing_view__loading,.drawing_view__error{padding:var(--space-xl) 0;text-align:center;color:var(--color-text-muted)}.drawing_view__error{color:#b00020}.result_view{display:flex;flex-direction:column;align-items:center;width:100%;text-align:center;padding-top:var(--space-xl)}.result_view__score_label{font-size:14px;color:var(--color-text-muted);letter-spacing:.1em;margin-bottom:var(--space-xs)}.result_view__score{font-family:var(--font-heading);font-size:72px;font-weight:700;color:var(--color-sea);line-height:1;margin-bottom:var(--space-lg)}.result_view__pct{font-size:36px;margin-left:4px;color:var(--color-text-muted)}.result_view__overlay_wrap{display:flex;flex-direction:column;align-items:center;margin-bottom:var(--space-lg)}.result_view__overlay{width:min(80vw,320px);height:min(80vw,320px);background:#fbfbfb;border:1px solid var(--color-border);border-radius:var(--border-radius);display:block}.result_view__legend{display:flex;gap:var(--space-md);margin-top:var(--space-sm);font-size:12px;color:var(--color-text-muted)}.result_view__legend i{display:inline-block;width:12px;height:12px;border-radius:2px;margin-right:4px;vertical-align:middle}.result_view__legend .dot_truth{background:#e76f33a6;border:1px solid #C04A1A}.result_view__legend .dot_user{background:#0094c8a6;border:1px solid #006F94}.result_view__legend .dot_intersect{background:#77419ed9;border:1px solid #4E2A6A}.result_view__title{font-family:var(--font-heading);font-size:26px;line-height:1.3;margin:0 0 var(--space-sm);color:var(--color-bingata)}.result_view__comment{font-size:15px;color:var(--color-text);margin:0 0 var(--space-lg);max-width:360px}.result_view__note{font-size:13px;color:var(--color-text-muted);margin:-8px 0 var(--space-md)}.result_view__actions{display:flex;gap:var(--space-sm);margin-bottom:var(--space-lg)}.result_view__status{font-size:13px;color:var(--color-sea);min-height:1.4em;margin:-8px 0 8px;text-align:center}.result_view__hashtag{margin-top:auto;padding:var(--space-md) 0;font-size:12px;color:var(--color-text-muted);letter-spacing:.05em}