:root{--color-navy-50: #e8eaf0;--color-navy-100: #c5c9d8;--color-navy-200: #9ea4b8;--color-navy-300: #777f98;--color-navy-400: #596380;--color-navy-500: #3c4868;--color-navy-600: #344160;--color-navy-700: #2a3855;--color-navy-800: #22304b;--color-navy-900: #0a1128;--color-gold-50: #fffbeb;--color-gold-100: #fef3c7;--color-gold-200: #fde68a;--color-gold-300: #fcd34d;--color-gold-400: #fbbf24;--color-gold-500: #d4af37;--color-gold-600: #b8943a;--color-gold-700: #9c7a3d;--color-gold-800: #8b6f3e;--color-gold-900: #6b5530;--color-red-50: #fef2f2;--color-red-100: #fee2e2;--color-red-200: #fecaca;--color-red-300: #fca5a5;--color-red-400: #f87171;--color-red-500: #c41e3a;--color-red-600: #b91c1c;--color-red-700: #991b1b;--color-red-800: #7f1d1d;--color-red-900: #450a0a;--color-green-50: #f0fdf4;--color-green-100: #dcfce7;--color-green-200: #bbf7d0;--color-green-300: #86efac;--color-green-400: #4ade80;--color-green-500: #165b33;--color-green-600: #16a34a;--color-green-700: #15803d;--color-green-800: #166534;--color-green-900: #14532d;--color-neutral-0: #ffffff;--color-neutral-50: #fafafa;--color-neutral-100: #f5f5f5;--color-neutral-200: #eeeeee;--color-neutral-300: #e0e0e0;--color-neutral-400: #bdbdbd;--color-neutral-500: #9e9e9e;--color-neutral-700: #616161;--color-neutral-900: #212121;--space-50: 4px;--space-100: 8px;--space-150: 12px;--space-200: 16px;--space-300: 24px;--space-400: 32px;--space-500: 40px;--space-600: 48px;--font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", Roboto, sans-serif;--font-size-50: 12px;--font-size-75: 14px;--font-size-100: 16px;--font-size-200: 20px;--font-size-300: 24px;--font-size-400: 32px;--font-size-500: 48px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-bold: 700;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--border-radius-sm: 4px;--border-radius-md: 8px;--border-radius-lg: 12px;--border-radius-xl: 16px;--border-radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1)}:root{--color-brand-primary: var(--color-gold-500);--color-brand-primary-hover: var(--color-gold-600);--color-brand-accent: var(--color-red-500);--color-background-default: var(--color-navy-900);--color-background-subtle: var(--color-navy-800);--color-background-card: rgba(255, 255, 255, .05);--color-background-card-hover: rgba(255, 255, 255, .08);--color-background-overlay: rgba(10, 17, 40, .95);--color-text-default: var(--color-neutral-0);--color-text-subtle: var(--color-neutral-300);--color-text-accent: var(--color-gold-400);--color-text-on-gold: var(--color-navy-900);--color-success: var(--color-green-500);--color-success-subtle: rgba(22, 91, 51, .2);--color-success-glow: rgba(22, 163, 74, .3);--color-error: var(--color-red-500);--color-error-subtle: rgba(196, 30, 58, .2);--color-warning: var(--color-gold-400);--color-warning-subtle: rgba(251, 191, 36, .2);--color-info: var(--color-gold-300);--button-background-primary: var(--color-gold-500);--button-background-primary-hover: var(--color-gold-600);--button-text-primary: var(--color-text-on-gold);--button-glow: 0 0 20px rgba(212, 175, 55, .5);--button-background-secondary: transparent;--button-border-secondary: var(--color-gold-400);--button-text-secondary: var(--color-gold-400);--input-background: rgba(255, 255, 255, .08);--input-border-default: rgba(255, 255, 255, .2);--input-border-focus: var(--color-gold-400);--input-border-error: var(--color-error);--input-text: var(--color-text-default);--card-background: rgba(255, 255, 255, .05);--card-border: rgba(255, 255, 255, .1);--card-backdrop-filter: blur(10px);--shadow-card: 0 8px 32px rgba(0, 0, 0, .4);--shadow-raised: 0 12px 48px rgba(0, 0, 0, .5);--shadow-overlay: 0 24px 64px rgba(0, 0, 0, .6);--shadow-gold-glow: 0 0 30px rgba(212, 175, 55, .4);--shadow-red-glow: 0 0 30px rgba(196, 30, 58, .3);--shadow-green-glow: 0 0 30px rgba(22, 163, 74, .3);--focus-ring-width: 2px;--focus-ring-color: var(--color-gold-400);--focus-ring-offset: 2px}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes fade-in-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes scale-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.8}}@keyframes glow-pulse{0%,to{box-shadow:0 0 20px #d4af374d}50%{box-shadow:0 0 30px #d4af3799}}@keyframes glow-pulse-green{0%,to{box-shadow:0 0 20px #16a34a4d}50%{box-shadow:0 0 30px #16a34a99}}@keyframes glow-pulse-red{0%,to{box-shadow:0 0 20px #c41e3a4d}50%{box-shadow:0 0 30px #c41e3a99}}@keyframes check-mark{0%{stroke-dashoffset:100}to{stroke-dashoffset:0}}@keyframes success-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-10px)}75%{transform:translate(10px)}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.animate-fade-in{animation:fade-in .3s cubic-bezier(.2,0,0,1)}.animate-fade-in-up{animation:fade-in-up .4s cubic-bezier(.2,0,0,1)}.animate-scale-in{animation:scale-in .3s cubic-bezier(.2,0,0,1)}.animate-glow-pulse{animation:glow-pulse 2s ease-in-out infinite}.animate-shake{animation:shake .4s cubic-bezier(.2,0,0,1)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-family-base);background:radial-gradient(ellipse at top,var(--color-navy-700) 0%,var(--color-background-default) 50%);background-attachment:fixed;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-300);color:var(--color-text-default);line-height:var(--line-height-normal);position:relative}body:before{content:"";position:fixed;inset:0;background-image:radial-gradient(2px 2px at 20% 30%,rgba(255,255,255,.3),transparent),radial-gradient(2px 2px at 60% 70%,rgba(212,175,55,.2),transparent),radial-gradient(1px 1px at 50% 50%,rgba(255,255,255,.4),transparent),radial-gradient(1px 1px at 80% 10%,rgba(212,175,55,.3),transparent);background-size:200px 200px,300px 300px,150px 150px,250px 250px;background-position:0 0,40px 60px,130px 270px,70px 100px;pointer-events:none;z-index:0}.container{background:var(--card-background);backdrop-filter:var(--card-backdrop-filter);-webkit-backdrop-filter:var(--card-backdrop-filter);border:1px solid var(--card-border);border-radius:var(--border-radius-xl);padding:var(--space-500);max-width:600px;width:100%;box-shadow:var(--shadow-overlay);position:relative;z-index:1;animation:fade-in-up .5s cubic-bezier(.2,0,0,1)}h1{color:var(--color-text-default);margin-bottom:var(--space-150);font-size:var(--font-size-500);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);text-align:center;text-shadow:0 2px 10px rgba(0,0,0,.5);word-break:keep-all;overflow-wrap:normal;white-space:normal}h2{color:var(--color-text-accent);font-size:var(--font-size-400);font-weight:var(--font-weight-bold);margin-bottom:var(--space-200);text-align:center;text-shadow:0 0 20px rgba(212,175,55,.6);word-break:keep-all;overflow-wrap:normal;white-space:normal}h3{color:var(--color-text-default);font-size:var(--font-size-300);font-weight:var(--font-weight-bold);margin-bottom:var(--space-150);word-break:keep-all;overflow-wrap:normal}p{color:var(--color-text-subtle);line-height:var(--line-height-relaxed);margin-bottom:var(--space-300);word-break:normal;overflow-wrap:break-word;line-break:strict}.button{background:var(--button-background-primary);color:var(--button-text-primary);border:none;padding:var(--space-200) var(--space-400);font-size:var(--font-size-200);font-weight:var(--font-weight-bold);border-radius:var(--border-radius-md);cursor:pointer;width:100%;transition:transform .2s cubic-bezier(.2,0,0,1),box-shadow .2s cubic-bezier(.2,0,0,1);margin-top:var(--space-300);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.button:hover{background:var(--button-background-primary-hover);transform:translateY(-2px);box-shadow:var(--shadow-raised),var(--button-glow)}.button:disabled{opacity:.6;cursor:not-allowed;transform:none}.button:focus:not(:focus-visible){outline:none}.button:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.button:focus{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.alert{padding:var(--space-200);border-radius:var(--border-radius-md);margin-bottom:var(--space-300);border-width:1px;border-style:solid;word-break:normal;overflow-wrap:break-word;line-break:strict}.alert-error{background:var(--color-error-subtle);color:var(--color-text-default);border-color:var(--color-error);box-shadow:var(--shadow-red-glow)}.alert-success{background:var(--color-success-subtle);color:var(--color-text-default);border-color:var(--color-success);box-shadow:var(--shadow-green-glow)}.alert-warning{background:var(--color-warning-subtle);color:var(--color-text-default);border-color:var(--color-warning);box-shadow:var(--shadow-gold-glow)}.alert-info{background:#fcd34d1a;color:var(--color-text-default);border-color:var(--color-info);box-shadow:var(--shadow-gold-glow)}.skip-link{position:absolute;top:-40px;left:0;background:var(--color-brand-primary);color:var(--color-text-on-gold);padding:var(--space-100) var(--space-200);text-decoration:none;z-index:100;border-radius:0 var(--border-radius-md) var(--border-radius-md) 0;font-weight:var(--font-weight-bold);box-shadow:var(--button-glow)}.skip-link:focus{top:0;outline:var(--focus-ring-width) solid var(--color-navy-900);outline-offset:2px}@media(max-width:768px){h1{font-size:var(--font-size-400)}h2{font-size:var(--font-size-300)}}@media(max-width:640px){body{padding:var(--space-150)}.container{padding:var(--space-300);border-radius:var(--border-radius-lg)}h1{font-size:var(--font-size-300);margin-bottom:var(--space-100)}h2{font-size:var(--font-size-200);margin-bottom:var(--space-150)}p{font-size:var(--font-size-100)}.button{min-height:48px;padding:var(--space-150) var(--space-300);font-size:var(--font-size-200)}}@media(max-width:375px){body{padding:var(--space-100)}.container{padding:var(--space-200)}h1{font-size:var(--font-size-200)}.button{font-size:var(--font-size-100)}}@media(prefers-reduced-motion:reduce){.button{transition:none}.button:hover{transform:none}}
