@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans+JP:wght@400;500;700&display=swap");:root{--color-bg:#ffd600;--color-surface:#fff;--color-surface-2:#f0f0f0;--color-border:#1a1a1a;--color-border-hover:#000;--color-primary:#06f;--color-primary-hover:#0052cc;--color-primary-glow:rgba(0,102,255,.2);--color-accent:#f06;--color-accent-glow:rgba(255,0,102,.2);--color-text:#1a1a1a;--color-text-secondary:#444;--color-text-muted:#777;--color-success:#00c853;--color-warning:#ffab00;--color-error:#d50000;--gradient-primary:linear-gradient(135deg,#06f,#f06);--gradient-surface:linear-gradient(180deg,#fff,#f5f5f5);--gradient-card:linear-gradient(145deg,#fff,#f9f9f9);--font-sans:"Inter","Noto Sans JP",-apple-system,BlinkMacSystemFont,sans-serif;--radius-sm:8px;--radius-md:12px;--radius-lg:20px;--radius-xl:32px;--radius-full:9999px;--shadow-sm:4px 4px 0px rgba(0,0,0,.1);--shadow-md:8px 8px 0px rgba(0,0,0,.15);--shadow-lg:12px 12px 0px rgba(0,0,0,.2);--shadow-primary:6px 6px 0px var(--color-primary-glow);--shadow-accent:6px 6px 0px var(--color-accent-glow);--transition-fast:100ms ease;--transition-base:200ms ease;--transition-slow:300ms cubic-bezier(0.175,0.885,0.32,1.275)}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%}body{font-family:var(--font-sans);background-color:var(--color-bg);color:var(--color-text);line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:inherit;text-decoration:none}button{cursor:pointer;font-family:var(--font-sans);border:none;background:none}img{max-width:100%;height:auto;display:block}.container{width:100%;max-width:900px;margin:0 auto;padding:0 1rem}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--color-bg)}::-webkit-scrollbar-thumb{background:var(--color-surface-2);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-border-hover)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes spin{to{transform:rotate(1turn)}}.animate-fade-in{animation:fadeIn .4s ease forwards}.skeleton{background:linear-gradient(90deg,var(--color-surface) 25%,var(--color-surface-2) 50%,var(--color-surface) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-sm)}