@import "https://fonts.googleapis.com/css2?family=Caveat:wght@400;700&family=Inter:wght@300;400;500;600;700;800&family=Noto+Sans+JP:wght@300;400;500;600;700&family=Noto+Serif+JP:wght@400;500;600;700&family=Zen+Kurenaido&display=swap";
:root{--font-primary:"Inter","Noto Sans JP",-apple-system,BlinkMacSystemFont,sans-serif;--font-mono:"JetBrains Mono","Fira Code",monospace;--font-xs:.75rem;--font-sm:.8125rem;--font-base:.875rem;--font-lg:1rem;--font-xl:1.125rem;--font-2xl:1.5rem;--font-3xl:2rem;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--color-bg-primary:#fdf8f0;--color-bg-secondary:#f5ede0;--color-bg-tertiary:#ede4d4;--color-bg-elevated:#fff;--color-bg-canvas:#fdf8f0;--color-surface:#8b73550f;--color-surface-hover:#8b73551a;--color-surface-active:#8b735526;--color-border:#8b735526;--color-border-hover:#8b73554d;--color-border-focus:#8b735580;--color-text-primary:#2e2117;--color-text-secondary:#5c4d3f;--color-text-tertiary:#7e7062;--color-text-inverse:#fdf8f0;--color-accent:#9b6b47;--color-accent-light:#7a5838;--color-accent-dark:#c4a89c;--color-accent-glow:#9b6b4726;--node-bg:#fff9;--node-blur:blur(16px);--node-border:1px solid #ffffff80;--node-radius:14px;--node-shadow:0 4px 16px #4a352014,0 1px 3px #4a35200d;--node-shadow-hover:0 16px 40px #4a35201f,0 2px 6px #4a35200f;--node-transition:all .4s cubic-bezier(.34,1.56,.64,1);--accent-personal:linear-gradient(90deg,#9b6b47,#c4a89c);--accent-social:linear-gradient(90deg,#e68a00,#ffb74d);--accent-period:linear-gradient(90deg,#7c6aff,#b794f6);--thumb-radius:10px;--thumb-size:64px;--canvas-bg:linear-gradient(160deg,#fdf8f0,#f5ede3,#ede3d5);--toolbar-bg:#ffffffa6;--toolbar-blur:blur(24px)saturate(1.2);--toolbar-border:1px solid #ffffff80;--toolbar-radius:16px;--menu-bg:#ffffffd9;--menu-blur:blur(20px);--menu-border:1px solid #fff9;--menu-radius:12px;--color-secondary:#8b6f47;--color-secondary-light:#a88b63;--color-secondary-dark:#6b5535;--color-success:#4ade80;--color-warning:#fbbf24;--color-error:#f87171;--color-info:#60a5fa;--upload-panel-bg:#0f0f1af2;--upload-panel-border:#ffffff0f;--upload-panel-text-primary:#e2e8f0;--upload-panel-text-secondary:#94a3b8;--upload-panel-text-muted:#64748b;--upload-panel-text-subtle:#475569;--upload-panel-track:#1e293b;--upload-panel-accent:#818cf8;--upload-panel-accent-gradient:linear-gradient(90deg,#6366f1,#8b5cf6);--upload-panel-accent-soft:#6366f121;--upload-panel-progress-gradient:linear-gradient(90deg,#6366f1,#818cf8);--upload-panel-success:#22c55e;--upload-panel-error:#ef4444;--upload-panel-error-soft:#ef444433;--upload-panel-warning:#f59e0b;--color-spring:#f9a8d4;--color-summer:#60a5fa;--color-autumn:#fb923c;--color-winter:#a5b4fc;--gradient-primary:linear-gradient(135deg,#8b7355 0%,#6b5740 100%);--gradient-hero:linear-gradient(180deg,#fdf8f0 0%,#f5ede0 50%,#ede4d4 100%);--gradient-card:linear-gradient(135deg,#8b73550f 0%,#8b735505 100%);--shadow-sm:0 1px 2px #3d2e1f14;--shadow-md:0 4px 12px #3d2e1f1a;--shadow-lg:0 8px 32px #3d2e1f1f;--shadow-glow:0 0 24px #8b73551f;--shadow-glow-hover:0 0 40px #8b73552e;--outline-width:2px;--outline-offset:2px;--outline-color:var(--color-accent);--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;--transition-fast:.15s cubic-bezier(.4,0,.2,1);--transition-base:.25s cubic-bezier(.4,0,.2,1);--transition-slow:.4s cubic-bezier(.4,0,.2,1);--transition-spring:.5s cubic-bezier(.34,1.56,.64,1);--z-base:0;--z-dropdown:100;--z-sticky:200;--z-modal-backdrop:300;--z-modal:400;--z-tooltip:500;--z-onboarding:650;--z-toast:700;--safe-area-top:env(safe-area-inset-top,0px);--safe-area-bottom:env(safe-area-inset-bottom,0px);--safe-area-left:env(safe-area-inset-left,0px);--safe-area-right:env(safe-area-inset-right,0px)}:focus-visible{outline:var(--outline-width)solid var(--outline-color);outline-offset:var(--outline-offset)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overscroll-behavior:none;font-size:16px}body{font-family:var(--font-primary);background-color:var(--color-bg-primary);color:var(--color-text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent;line-height:1.6;overflow-x:hidden}@media (max-width:768px){html,body{overscroll-behavior:auto}}a{color:var(--color-accent-light);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--color-accent)}img,video{image-orientation:from-image;max-width:100%;display:block}button{cursor:pointer;font-family:inherit}input,textarea,select{font-family:inherit}.visually-hidden,.skip-link{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.skip-link:focus{z-index:99999;clip:auto;white-space:normal;background:var(--color-accent);color:#fff;border-radius:var(--radius-md);width:auto;height:auto;margin:0;padding:12px 24px;font-size:.875rem;font-weight:600;text-decoration:none;position:fixed;top:8px;left:8px;overflow:visible;box-shadow:0 4px 12px #0000004d}.glass{-webkit-backdrop-filter:blur(20px);border:1px solid var(--color-border);background:#fdf8f0b3}.glass-strong{-webkit-backdrop-filter:blur(40px);border:1px solid var(--color-border-hover);background:#fdf8f0d9}.btn{justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-3)var(--space-6);border-radius:var(--radius-md);transition:all var(--transition-base);white-space:nowrap;border:none;font-size:.9375rem;font-weight:500;line-height:1;display:inline-flex}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--gradient-primary);color:#fff;box-shadow:var(--shadow-glow)}.btn-primary:hover:not(:disabled){box-shadow:var(--shadow-glow-hover);transform:translateY(-1px)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-secondary{background:var(--color-surface);color:var(--color-text-primary);border:1px solid var(--color-border)}.btn-secondary:hover:not(:disabled){background:var(--color-surface-hover);border-color:var(--color-border-hover)}.btn-ghost{color:var(--color-text-secondary);background:0 0;border:none}.btn-ghost:hover:not(:disabled){background:var(--color-surface-hover);color:var(--color-text-primary)}.btn-sm{padding:var(--space-2)var(--space-4);border-radius:var(--radius-sm);font-size:.8125rem}.btn-lg{padding:var(--space-4)var(--space-8);border-radius:var(--radius-lg);font-size:1.0625rem}.btn-icon{padding:var(--space-2);border-radius:var(--radius-md);min-width:44px;min-height:44px}.touch-target{justify-content:center;align-items:center;min-width:44px;min-height:44px;display:inline-flex}.input{width:100%;padding:var(--space-3)var(--space-4);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-primary);transition:all var(--transition-fast);outline:none;font-size:.9375rem}.input:hover{border-color:var(--color-border-hover)}.input:focus{border-color:var(--color-border-focus);box-shadow:0 0 0 3px var(--color-accent-glow)}.input::placeholder{color:var(--color-text-tertiary)}select.input{appearance:none;padding-right:var(--space-8);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%237E7062' d='M2 4l4 4 4-4'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat}select.input option{color:#2e2117;background:#fff;padding:8px 12px}select.input option:checked{color:#fff;background:#8b7355}select.input option:hover{background:#f5ede0}.card{background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);transition:all var(--transition-base)}.card:hover{border-color:var(--color-border-hover);box-shadow:var(--shadow-md)}.card-interactive{cursor:pointer}.card-interactive:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.badge{padding:var(--space-1)var(--space-3);border-radius:var(--radius-full);align-items:center;font-size:.75rem;font-weight:500;line-height:1;display:inline-flex}.badge-accent{background:var(--color-accent-glow);color:var(--color-accent-light);border:1px solid #8b73554d}.badge-spring{color:var(--color-spring);background:#f9a8d426}.badge-summer{color:var(--color-summer);background:#60a5fa26}.badge-autumn{color:var(--color-autumn);background:#fb923c26}.badge-winter{color:var(--color-winter);background:#a5b4fc26}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--color-surface-active);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-text-tertiary)}@keyframes fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-in-right{0%{opacity:0;transform:translate(16px)}to{opacity:1;transform:translate(0)}}@keyframes slide-in-up{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes glow-pulse{0%,to{box-shadow:0 0 20px #8b73551f}50%{box-shadow:0 0 40px #8b73552e}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.animate-fade-in{animation:fade-in .5s var(--transition-base)both}.animate-slide-in-right{animation:slide-in-right .4s var(--transition-base)both}.animate-slide-in-up{animation:slide-in-up .5s var(--transition-base)both}.animate-glow-pulse{animation:3s ease-in-out infinite glow-pulse}.animate-float{animation:6s ease-in-out infinite float}.container{width:100%;max-width:1200px;padding-inline:var(--space-6);margin-inline:auto}.container-wide{max-width:1440px}.container-narrow{max-width:720px}@media (min-width:769px) and (max-width:1024px){:root{--space-6:20px;--space-8:28px}}@media (max-width:768px){:root{--space-6:16px;--space-8:24px;--space-10:32px;--space-12:40px;--space-16:48px;--space-20:56px;--space-24:64px}.btn-lg{padding:var(--space-3)var(--space-6);font-size:1rem}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.15)}}@keyframes bounceIn{0%{opacity:0;transform:scale(.3)}50%{transform:scale(1.1)}70%{transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.animate-fade-in,.animate-slide-in-right,.animate-slide-in-up,.animate-glow-pulse{animation:none}@keyframes fade-in{0%,to{opacity:1;transform:none}}@keyframes slide-in-right{0%,to{opacity:1;transform:none}}@keyframes slide-in-up{0%,to{opacity:1;transform:none}}@keyframes glow-pulse{0%,to{box-shadow:none}}@keyframes float{0%,to{transform:none}}@keyframes pulse{0%,to{opacity:1;transform:none}}@keyframes bounceIn{0%,to{opacity:1;transform:none}}@keyframes fadeIn{0%,to{opacity:1;transform:none}}}