:root{--bg-page:#fff;--bg-secondary:#f7f8fa;--bg-tertiary:#f3f4f6;--bg-card:#fff;--bg-hover:#f9fafb;--bg-overlay:#00000080;--text-primary:#191f28;--text-secondary:#4e5968;--text-tertiary:#8b95a1;--text-disabled:#b0b8c1;--text-inverse:#fff;--primary-50:#eef2ff;--primary-100:#e0e7ff;--primary-200:#c7d2fe;--primary-300:#a5b4fc;--primary-400:#818cf8;--primary-500:#6366f1;--primary-600:#4f46e5;--primary-700:#4338ca;--primary:#4f46e5;--primary-hover:#4338ca;--primary-light:#eef2ff;--primary-bg:#4f46e514;--accent-50:#faf5ff;--accent-100:#f3e8ff;--accent-200:#e9d5ff;--accent-300:#d8b4fe;--accent-400:#c084fc;--accent-500:#a855f7;--accent-600:#9333ea;--accent-700:#7c3aed;--accent:#7c3aed;--accent-light:#f5f3ff;--surface-primary:var(--bg-card);--surface-secondary:var(--bg-secondary);--surface-tertiary:var(--bg-tertiary);--surface-overlay:#ffffff80;--surface-glass:#ffffffb3;--success:#10b981;--success-bg:#ecfdf5;--warning:#f59e0b;--warning-bg:#fffbeb;--error:#ef4444;--error-bg:#fef2f2;--info:#3b82f6;--info-bg:#eff6ff;--border-light:#e5e8eb;--border-default:#d1d5db;--border-focus:var(--primary);--max-width:480px;--header-height:56px;--safe-area-bottom:env(safe-area-inset-bottom,0px);--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;--radius-xs:6px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--radius-2xl:24px;--radius-full:9999px;--primary-dark:var(--primary-hover);--text-quaternary:#b0b8c1;--focus-ring:0 0 0 3px #4f46e54d;--color-water:#3b82f6;--color-wood:#22c55e;--color-fire:#ef4444;--color-metal:#f59e0b;--color-earth:#8b5cf6;--shadow-xs:0 1px 2px #0000000d;--shadow-sm:0 1px 3px #00000014;--shadow-md:0 4px 12px #00000014;--shadow-lg:0 8px 24px #0000001a;--shadow-xl:0 16px 48px #0000001f;--shadow-focus:0 0 0 3px #4f46e533;--shadow-card:0 2px 8px #0000000a,0 1px 2px #0000000f;--shadow-float:0 12px 32px #4f46e51f;--font-sans:"Pretendard Variable","Pretendard",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--text-xs:12px;--text-sm:14px;--text-base:16px;--text-lg:18px;--text-xl:20px;--text-2xl:24px;--text-3xl:28px;--text-4xl:32px;--text-5xl:40px;--font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;--font-extrabold:800;--leading-tight:1.25;--leading-snug:1.375;--leading-normal:1.5;--leading-relaxed:1.625;--ease-out:cubic-bezier(.33,1,.68,1);--ease-in-out:cubic-bezier(.65,0,.35,1);--ease-bounce:cubic-bezier(.34,1.56,.64,1);--duration-fast:.15s;--duration-normal:.2s;--duration-slow:.3s;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-page:#0f0f14;--bg-secondary:#1a1a24;--bg-tertiary:#252532;--bg-card:#1e1e2a;--bg-hover:#2a2a3a;--bg-overlay:#000000b3;--text-primary:#f7f8fa;--text-secondary:#a0a8b8;--text-tertiary:#6b7280;--text-disabled:#4a5568;--text-inverse:#191f28;--primary-50:#818cf814;--primary-100:#818cf81f;--primary-200:#818cf833;--primary-300:#a5b4fc;--primary-400:#818cf8;--primary-500:#6366f1;--primary-600:#4f46e5;--primary-700:#4338ca;--primary:#818cf8;--primary-hover:#a5b4fc;--primary-light:#818cf826;--primary-bg:#818cf81a;--accent-50:#a78bfa14;--accent-100:#a78bfa1f;--accent-200:#a78bfa33;--accent-300:#d8b4fe;--accent-400:#c084fc;--accent-500:#a855f7;--accent-600:#9333ea;--accent-700:#7c3aed;--accent:#a78bfa;--accent-light:#a78bfa26;--surface-primary:var(--bg-card);--surface-secondary:var(--bg-secondary);--surface-tertiary:var(--bg-tertiary);--surface-overlay:#00000080;--surface-glass:#1e1e2acc;--success:#34d399;--success-bg:#34d39926;--warning:#fbbf24;--warning-bg:#fbbf2426;--error:#f87171;--error-bg:#f8717126;--info:#60a5fa;--info-bg:#60a5fa26;--border-light:#2d2d3d;--border-default:#3d3d4d;--border-focus:var(--primary);--shadow-xs:0 1px 2px #0003;--shadow-sm:0 1px 3px #00000040;--shadow-md:0 4px 12px #0000004d;--shadow-lg:0 8px 24px #00000059;--shadow-xl:0 16px 48px #0006;--shadow-focus:0 0 0 3px #818cf84d;--shadow-card:0 2px 8px #0003;--shadow-float:0 12px 32px #818cf826;--color-water:#60a5fa;--color-wood:#4ade80;--color-fire:#f87171;--color-metal:#fbbf24;--color-earth:#a78bfa;--primary-dark:var(--primary-hover);--text-quaternary:#4a5568;--focus-ring:0 0 0 3px #818cf84d}@media (prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-theme=dark]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-page:#0f0f14;--bg-secondary:#1a1a24;--bg-tertiary:#252532;--bg-card:#1e1e2a;--bg-hover:#2a2a3a;--bg-overlay:#000000b3;--text-primary:#f7f8fa;--text-secondary:#a0a8b8;--text-tertiary:#6b7280;--text-disabled:#4a5568;--text-inverse:#191f28;--primary:#818cf8;--primary-hover:#a5b4fc;--primary-light:#818cf826;--primary-bg:#818cf81a;--accent:#a78bfa;--accent-light:#a78bfa26;--success:#34d399;--success-bg:#34d39926;--warning:#fbbf24;--warning-bg:#fbbf2426;--error:#f87171;--error-bg:#f8717126;--info:#60a5fa;--info-bg:#60a5fa26;--border-light:#2d2d3d;--border-default:#3d3d4d;--border-focus:var(--primary);--shadow-xs:0 1px 2px #0003;--shadow-sm:0 1px 3px #00000040;--shadow-md:0 4px 12px #0000004d;--shadow-lg:0 8px 24px #00000059;--shadow-xl:0 16px 48px #0006;--shadow-focus:0 0 0 3px #818cf84d;--shadow-card:0 2px 8px #0003;--shadow-float:0 12px 32px #818cf826;--color-water:#60a5fa;--color-wood:#4ade80;--color-fire:#f87171;--color-metal:#fbbf24;--color-earth:#a78bfa;--primary-dark:var(--primary-hover);--text-quaternary:#4a5568;--focus-ring:0 0 0 3px #818cf84d}}*,:before,:after{box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0}html{-webkit-tap-highlight-color:transparent;font-size:16px}body{background-color:var(--bg-page);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-base);font-weight:var(--font-normal);line-height:var(--leading-normal);min-height:100dvh;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-weight:var(--font-bold);letter-spacing:-.02em;color:var(--text-primary);line-height:var(--leading-tight)}h1{font-size:var(--text-4xl)}h2{font-size:var(--text-2xl)}h3{font-size:var(--text-xl)}h4{font-size:var(--text-lg)}p{color:var(--text-secondary);letter-spacing:-.01em}a{color:var(--primary);transition:color var(--duration-fast)var(--ease-out);text-decoration:none}a:hover{color:var(--primary-hover)}button{cursor:pointer;font-family:inherit;font-size:inherit;background:0 0;border:none}.btn{justify-content:center;align-items:center;gap:var(--space-2);height:52px;padding:0 var(--space-6);border-radius:var(--radius-lg);font-weight:var(--font-semibold);font-size:var(--text-base);transition:all var(--duration-normal)var(--ease-out);white-space:nowrap;display:inline-flex}.btn-primary{background:var(--primary);color:var(--text-inverse);box-shadow:var(--shadow-sm)}.btn-primary:hover{background:var(--primary-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.btn-primary:active{box-shadow:var(--shadow-xs);transform:translateY(0)}.btn-primary:disabled{background:var(--text-disabled);cursor:not-allowed;box-shadow:none;transform:none}.btn-secondary{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-light)}.btn-secondary:hover{background:var(--bg-tertiary);border-color:var(--border-default)}.btn-ghost{color:var(--text-secondary);background:0 0}.btn-ghost:hover{background:var(--bg-secondary);color:var(--text-primary)}.btn-sm{height:40px;padding:0 var(--space-4);font-size:var(--text-sm);border-radius:var(--radius-md)}.btn-lg{height:56px;padding:0 var(--space-8);font-size:var(--text-lg);border-radius:var(--radius-xl)}.btn-block{width:100%}.input{width:100%;height:52px;padding:0 var(--space-4);background:var(--bg-secondary);border-radius:var(--radius-lg);color:var(--text-primary);font-size:var(--text-base);font-weight:var(--font-medium);transition:all var(--duration-fast)var(--ease-out);appearance:none;border:1.5px solid #0000}.input::placeholder{color:var(--text-tertiary);font-weight:var(--font-normal)}.input:hover{background-color:var(--bg-tertiary)}.input:focus{background-color:var(--bg-page);border-color:var(--primary);box-shadow:var(--shadow-focus),0 2px 8px #4f46e514;outline:none;transform:translateY(-1px)}select.input{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%234E5968' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--space-4)center;cursor:pointer;background-size:20px;padding-right:48px}.card{background:var(--bg-card);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);overflow:hidden}.card-elevated{box-shadow:var(--shadow-lg)}.card-bordered{border:1px solid var(--border-light);box-shadow:none}.container{width:100%;max-width:var(--max-width);padding:0 var(--space-5);margin:0 auto}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-semibold{font-weight:var(--font-semibold)}.font-bold{font-weight:var(--font-bold)}.text-primary{color:var(--primary)!important}.text-secondary{color:var(--text-secondary)!important}.text-tertiary{color:var(--text-tertiary)!important}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--text-disabled);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-fadeIn{animation:fadeIn var(--duration-normal)var(--ease-out)}.animate-slideUp{animation:slideUp var(--duration-slow)var(--ease-out)}@media (max-width:480px){:root{--text-4xl:28px;--text-3xl:24px;--text-2xl:20px}.container{padding:0 var(--space-4)}}@media (max-width:389px){:root{--text-4xl:26px;--text-3xl:22px;--text-2xl:19px;--text-xl:18px}}@media (max-width:480px){.btn{height:50px;padding:0 var(--space-5);font-size:var(--text-sm)}.btn-lg{height:54px;padding:0 var(--space-6);font-size:var(--text-base)}.btn-primary{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}}@media (max-width:374px){:root{--text-4xl:24px;--text-3xl:20px;--text-2xl:18px;--text-xl:17px;--text-lg:16px;--text-base:15px;--text-sm:13px;--space-6:20px;--space-5:16px}.container{padding:0 var(--space-3)}.btn{height:46px;padding:0 var(--space-4);font-size:var(--text-sm);gap:var(--space-1)}.btn-lg{height:50px;padding:0 var(--space-5);font-size:var(--text-sm)}.input{height:46px;font-size:var(--text-sm)}}.glass-card{-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-xl);background:#ffffffb3;border:1px solid #fff3;box-shadow:0 4px 30px #0000001a,inset 0 0 0 1px #ffffff1a}[data-theme=dark] .glass-card{background:#1e1e2acc;border-color:#ffffff14;box-shadow:0 4px 30px #0000004d,inset 0 0 0 1px #ffffff0d}.modal-overlay{-webkit-backdrop-filter:blur(8px);z-index:9999;animation:fadeIn var(--duration-fast)var(--ease-out);background:#0006;position:fixed;inset:0}[data-theme=dark] .modal-overlay{background:#0009}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.btn:active{transition-duration:50ms;transform:scale(.98)}.haptic{-webkit-tap-highlight-color:transparent}.skeleton{background:linear-gradient(90deg,var(--bg-secondary)25%,var(--bg-tertiary)50%,var(--bg-secondary)75%);border-radius:var(--radius-md);background-size:200% 100%;animation:1.5s infinite skeleton-loading}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}[data-theme=dark] ::-webkit-scrollbar-thumb{background:var(--text-disabled)}[data-theme=dark] ::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}[data-theme=dark] select.input{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23A0A8B8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E")}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
