:root{--ink: #1A1A1A;--navy: #1E3A8A;--red: #E8453C;--red-shadow: #b5352c;--yellow: #FFD400;--gold: #B57500;--gold-light: #D89400;--badge: #3D352F;--bg: #FFFFFF;--bg2: #F5F5F3;--border: #eee;--disp: "Zen Maru Gothic", "Noto Sans JP", sans-serif;--body: "Noto Sans JP", system-ui, sans-serif;--color-navy: var(--navy);--color-navy-light: #2d4fa8;--color-navy-dark: #142a6e;--color-accent-red: var(--red);--color-error: var(--red);--color-error-bg: #fff0ef;--color-warning: var(--gold);--color-warning-bg: #fffbeb;--color-success: #2E7D32;--color-success-bg: #f0fdf4;--color-info: var(--navy);--color-info-bg: #eff6ff;--grade-s-bg: #fff5f5;--grade-s-text: #E8453C;--grade-s-border: #E8453C;--grade-s-strong: #E8453C;--grade-s-dot: #E8453C;--grade-a-bg: #eff6ff;--grade-a-text: #1E3A8A;--grade-a-border: #1E3A8A;--grade-a-strong: #1E3A8A;--grade-a-dot: #1E3A8A;--grade-b-bg: #f5f5f5;--grade-b-text: #1A1A1A;--grade-b-border: #1A1A1A;--grade-b-strong: #1A1A1A;--grade-b-dot: #1A1A1A;--grade-c-bg: #fffbeb;--grade-c-text: #B57500;--grade-c-border: #B57500;--grade-c-strong: #B57500;--grade-c-dot: #D89400;--grade-d-bg: #f5f5f5;--grade-d-text: #666666;--grade-d-border: #888888;--grade-d-strong: #666666;--grade-d-dot: #8B8B8B;--color-white: #ffffff;--color-gray-50: #f9fafb;--color-gray-100: #F5F5F3;--color-gray-200: #e5e7eb;--color-gray-300: #d1d5db;--color-gray-400: #9ca3af;--color-gray-500: #6b7280;--color-gray-600: #4b5563;--color-gray-700: #374151;--color-gray-800: #1f2937;--color-gray-900: var(--ink);--font-family: var(--body);--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1.125rem;--font-size-lg: 1.25rem;--font-size-xl: 1.5rem;--font-size-2xl: 1.875rem;--font-size-3xl: 2.25rem;--font-size-4xl: 3rem;--spacing-1: .25rem;--spacing-2: .5rem;--spacing-3: .75rem;--spacing-4: 1rem;--spacing-5: 1.25rem;--spacing-6: 1.5rem;--spacing-8: 2rem;--spacing-10: 2.5rem;--spacing-12: 3rem;--spacing-16: 4rem;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 18px;--radius-xl: 20px;--radius-full: 9999px;--tap-min: 48px;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .08);--shadow-md: 0 4px 14px rgba(0, 0, 0, .05);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);--transition-fast: .15s ease;--transition-base: .25s ease}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--body);font-size:var(--font-size-base);color:var(--ink);background-color:var(--bg2);line-height:1.8;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-wrap:break-word;word-break:auto-phrase;line-break:strict;text-wrap:pretty}h1,h2,h3{font-family:var(--disp);line-height:1.3;text-wrap:balance}:focus-visible{outline:3px solid var(--navy);outline-offset:2px}button{font-family:inherit;cursor:pointer}input,select,textarea{font-family:inherit;font-size:inherit}#root{min-height:100dvh;display:flex;flex-direction:column}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg2)}::-webkit-scrollbar-thumb{background:var(--color-gray-300);border-radius:var(--radius-full)}.page-container{width:100%;max-width:640px;margin:0 auto;padding:var(--spacing-4) var(--spacing-4) var(--spacing-16);flex:1}.card{background:var(--bg);border:2px solid var(--border);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-md);transition:box-shadow var(--transition-base),transform var(--transition-base)}.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.welcome-step-card:hover{box-shadow:0 6px 20px #1e3a8a1a;transform:translateY(-3px)}.welcome-steps-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-3);max-width:560px;margin:0 auto}@media (min-width: 480px){.welcome-steps-grid{grid-template-columns:repeat(3,1fr)}}@media (prefers-reduced-motion: reduce){.card,.welcome-step-card{transition:none;transform:none!important}}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);width:100%;min-height:var(--tap-min);padding:16px 32px;background:var(--red);color:#fff;font-family:var(--disp);font-size:17px;font-weight:900;border:none;border-radius:var(--radius-full);text-decoration:none;box-shadow:0 6px 0 var(--red-shadow);transition:transform .1s,box-shadow .2s;letter-spacing:.02em}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 0 var(--red-shadow)}.btn-primary:active{transform:translateY(1px);box-shadow:0 2px 0 var(--red-shadow)}.btn-primary:disabled{background:var(--color-gray-300);box-shadow:0 4px #aaa;cursor:not-allowed;transform:none}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);width:100%;min-height:var(--tap-min);padding:16px 32px;background:var(--ink);color:#fff;font-family:var(--disp);font-size:17px;font-weight:900;border:none;border-radius:var(--radius-full);text-decoration:none;box-shadow:0 6px #000;transition:transform .1s,box-shadow .2s;letter-spacing:.02em}.btn-secondary:hover{transform:translateY(-2px);box-shadow:0 4px #000}.btn-secondary:active{transform:translateY(1px);box-shadow:0 2px #000}@media (prefers-reduced-motion: reduce){.btn-primary,.btn-secondary{transition:none;transform:none!important}}.app-header{background:var(--bg);color:var(--ink);padding:12px 20px;position:sticky;top:0;z-index:100;border-bottom:1px solid var(--border)}.app-header-inner{max-width:640px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-3)}.app-header-title{font-family:var(--disp);font-size:17px;font-weight:900;letter-spacing:.02em;color:var(--ink)}.progress-bar-wrapper{width:100%;height:6px;background:var(--color-gray-200);border-radius:var(--radius-full);overflow:hidden}.progress-bar-fill{height:100%;background:var(--red);border-radius:var(--radius-full);transition:width var(--transition-base)}.error-message{display:flex;align-items:flex-start;gap:var(--spacing-2);color:var(--color-error);font-size:var(--font-size-sm);margin-top:var(--spacing-2)}.input-field{width:100%;min-height:var(--tap-min);padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-lg);font-weight:500;border:2px solid var(--color-gray-300);border-radius:var(--radius-md);background:var(--bg);color:var(--ink);transition:border-color var(--transition-fast);text-align:center}.input-field:focus{border-color:var(--navy);outline:none;box-shadow:0 0 0 4px #1e3a8a2e}.input-field.error{border-color:var(--red)}.input-field::-webkit-inner-spin-button,.input-field::-webkit-outer-spin-button{-webkit-appearance:none}.select-field{width:100%;min-height:var(--tap-min);padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-base);font-weight:500;border:2px solid var(--color-gray-300);border-radius:var(--radius-md);background:var(--bg);color:var(--ink);transition:border-color var(--transition-fast);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath fill='%231A1A1A' d='M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--spacing-4) center;padding-right:var(--spacing-10)}.select-field:focus{border-color:var(--navy);outline:none;box-shadow:0 0 0 3px #1e3a8a26}.input-label{display:block;font-family:var(--disp);font-size:var(--font-size-sm);font-weight:700;color:var(--color-gray-700);margin-bottom:var(--spacing-2);letter-spacing:.04em}.checkbox-wrapper{display:flex;align-items:flex-start;gap:var(--spacing-3);cursor:pointer}.checkbox-wrapper input[type=checkbox]{width:24px;height:24px;min-width:24px;margin-top:2px;accent-color:var(--navy);cursor:pointer}.toggle-wrapper{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-4);padding:var(--spacing-4);background:var(--bg2);border-radius:var(--radius-md);border:1px solid var(--border)}.toggle-switch{position:relative;width:52px;height:28px;min-width:52px}.toggle-switch input{opacity:0;width:0;height:0;position:absolute}.toggle-slider{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--color-gray-300);border-radius:var(--radius-full);transition:background var(--transition-fast);cursor:pointer}.toggle-slider:before{content:"";position:absolute;height:22px;width:22px;left:3px;bottom:3px;background:var(--bg);border-radius:50%;transition:transform var(--transition-fast);box-shadow:var(--shadow-sm)}.toggle-switch input:checked+.toggle-slider{background:var(--navy)}.toggle-switch input:checked+.toggle-slider:before{transform:translate(24px)}.toggle-switch input:focus-visible+.toggle-slider{outline:3px solid var(--navy);outline-offset:2px}.notice-banner{display:flex;gap:var(--spacing-3);padding:var(--spacing-4);background:var(--color-warning-bg);border:1px solid var(--color-warning);border-radius:var(--radius-md);font-size:var(--font-size-sm);color:var(--color-warning)}.section-title{font-family:var(--disp);font-size:var(--font-size-xl);font-weight:900;color:var(--navy);margin-bottom:var(--spacing-4)}.divider{height:1px;background:var(--border);margin:var(--spacing-6) 0}.ruler{height:18px;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 22px);opacity:.85;margin-top:24px}.ruler--sm{height:12px;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 14px);opacity:.6;margin-top:0}.pill{display:inline-block;background:var(--badge);color:#fff;font-family:var(--disp);font-weight:700;font-size:14px;padding:8px 22px;border-radius:var(--radius-full);letter-spacing:.04em}