:root{--accent:oklch(56% .19 290);--accent-strong:oklch(48% .2 290);--accent-soft:oklch(94% .04 290);--accent-fg:#fff;--r:12px;--r-sm:8px;--r-lg:18px;--pad:1;--bg:oklch(98.5% .004 70);--bg-2:oklch(100% 0 0);--panel:oklch(100% 0 0);--panel-2:oklch(97.5% .004 70);--line:oklch(91% .005 70);--line-2:oklch(95% .004 70);--ink:oklch(22% .01 60);--ink-2:oklch(44% .01 60);--ink-3:oklch(60% .008 60);--ink-4:oklch(72% .006 60);--shadow:0 1px 2px oklch(40% .02 60/.06), 0 8px 24px oklch(40% .02 60/.06);--shadow-sm:0 1px 2px oklch(40% .02 60/.07);--shadow-lg:0 12px 40px oklch(30% .02 60/.14)}[data-theme=dark]{--bg:oklch(16.5% .006 65);--bg-2:oklch(20% .006 65);--panel:oklch(21.5% .007 65);--panel-2:oklch(24% .008 65);--line:oklch(30% .008 65);--line-2:oklch(27% .008 65);--ink:oklch(96% .004 70);--ink-2:oklch(78% .006 70);--ink-3:oklch(62% .008 70);--ink-4:oklch(50% .008 70);--accent-soft:oklch(33% .05 290);--shadow:0 1px 2px oklch(0% 0 0/.3), 0 10px 30px oklch(0% 0 0/.35);--shadow-sm:0 1px 2px oklch(0% 0 0/.35);--shadow-lg:0 16px 48px oklch(0% 0 0/.5)}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-feature-settings:"palt" 1;font-family:Manrope,Noto Sans JP,system-ui,sans-serif;line-height:1.5}#root{height:100%}.mono{font-feature-settings:normal;font-family:DM Mono,ui-monospace,monospace}::selection{background:var(--accent-soft)}::-webkit-scrollbar{width:11px;height:11px}::-webkit-scrollbar-thumb{background:var(--line);border:3px solid var(--bg);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:var(--ink-4)}::-webkit-scrollbar-track{background:0 0}button{font:inherit;cursor:pointer;color:inherit;background:0 0;border:none}input,textarea,select{font:inherit;color:inherit}input:focus,textarea:focus{outline:none}.ring:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.photo-ph{background:var(--panel-2);isolation:isolate;align-items:flex-end;display:flex;position:relative;overflow:hidden}.photo-ph:before{content:"";z-index:-1;background:repeating-linear-gradient(135deg, oklch(0% 0 0/.035) 0 2px, transparent 2px 9px), var(--ph-grad,linear-gradient(135deg, oklch(80% .06 60), oklch(70% .07 40)));position:absolute;inset:0}.photo-ph .ph-tag{letter-spacing:.02em;color:oklch(100% 0 0/.92);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:oklch(20% .02 60/.5);border-radius:6px;margin:8px;padding:3px 7px;font-family:DM Mono,monospace;font-size:10px;font-weight:500}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes pop{0%{transform:scale(.97)}to{transform:none}}@keyframes pageSwap{0%{transform:translateY(7px)}to{transform:none}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skel{background:linear-gradient(90deg, var(--panel-2) 25%, var(--line-2) 37%, var(--panel-2) 63%);background-size:200% 100%;animation:1.3s infinite shimmer}.page-swap{animation:.32s cubic-bezier(.2,.8,.2,1) both pageSwap}.pop{animation:.25s cubic-bezier(.2,.8,.2,1) both pop}@media (prefers-reduced-motion:no-preference){.fade-up{animation:.4s cubic-bezier(.2,.8,.2,1) both fadeUp}}
