:root{--bg:#0e1015;--bg-elev-1:#181b22;--bg-elev-2:#21252e;--bg-elev-3:#2a2f39;--fg:#f0f1f3;--fg-muted:#a0a4ae;--fg-dim:#6c7280;--accent:#ffd23f;--accent-strong:#ffb400;--accent-deep:#c68a00;--accent-glow:#ffd23f2e;--danger:#ff5d5d;--success:#4cd97b;--info:#5da9ff;--border:#2c313b;--border-soft:#20242c;--radius-sm:8px;--radius:14px;--radius-lg:20px;--header-h:56px;--nav-h:64px;--safe-bottom:env(safe-area-inset-bottom,0);--safe-top:env(safe-area-inset-top,0);--shadow-1:0 1px 2px #00000080;--shadow-2:0 4px 16px #00000073, 0 1px 3px #00000059;--shadow-pop:0 12px 32px #0000008c, 0 2px 6px #0006;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;letter-spacing:-.01em;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Apple SD Gothic Neo,Malgun Gothic,Pretendard,Noto Sans KR,sans-serif;font-size:15px}*{box-sizing:border-box}html,body,#root{background:var(--bg);color:var(--fg);height:100%;margin:0;padding:0;overflow:hidden}body{-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}input,textarea,select{font:inherit;color:inherit}img{display:block}.app{background:radial-gradient(1200px 600px at 100% -10%, #ffb4000d, transparent 60%), var(--bg);flex-direction:column;height:100%;display:flex}.app-header{z-index:10;padding:calc(var(--safe-top) + 10px) 1.1em 10px;height:calc(var(--header-h) + var(--safe-top));-webkit-backdrop-filter:saturate(160%)blur(18px);border-bottom:1px solid var(--border-soft);background:#0e1015c7;flex-shrink:0;align-items:center;gap:.7em;display:flex;position:sticky;top:0}.app-header .title{letter-spacing:-.015em;font-size:1.05em;font-weight:600}.app-header .sub{color:var(--fg-muted);background:var(--bg-elev-1);border:1px solid var(--border-soft);border-radius:999px;margin-left:auto;padding:4px 10px;font-size:.78em}.app-main{-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;padding:1em 1em calc(var(--nav-h) + var(--safe-bottom) + 1em);flex:1;overflow:hidden auto}.app-nav{height:calc(var(--nav-h) + var(--safe-bottom));padding-bottom:var(--safe-bottom);-webkit-backdrop-filter:saturate(160%)blur(18px);border-top:1px solid var(--border);z-index:10;background:#181b22eb;display:flex;position:fixed;bottom:0;left:0;right:0}.app-nav a{min-width:0;color:var(--fg-dim);flex-direction:column;flex:1 1 0;justify-content:center;align-items:center;gap:3px;font-size:.72em;font-weight:500;transition:color .15s;display:flex;position:relative}.app-nav a .icon{font-size:1.45em;line-height:1;transition:transform .18s}.app-nav a.active{color:var(--accent)}.app-nav a.active .icon{transform:translateY(-1px)scale(1.05)}.app-nav a.active:before{content:"";background:var(--accent);width:28px;height:2px;box-shadow:0 0 8px var(--accent-glow);border-radius:2px;position:absolute;top:0;left:50%;transform:translate(-50%)}.card{background:linear-gradient(180deg, var(--bg-elev-1), var(--bg-elev-2));border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-1);margin-bottom:1em;padding:1em 1.1em}.card.hero{background:linear-gradient(135deg, #ffb4001a, #ffb40005 60%), linear-gradient(180deg, var(--bg-elev-1), var(--bg-elev-2));border-color:#ffb40040;position:relative;overflow:hidden}.card.hero:after{content:"";background:radial-gradient(circle at 100% 0%, var(--accent-glow), transparent 60%);pointer-events:none;position:absolute;inset:0}.card .title{align-items:center;gap:.45em;margin-bottom:4px;font-size:1em;font-weight:600;display:flex}.card .meta{color:var(--fg-muted);font-size:.85em;line-height:1.5}.card .meta+.body{margin-top:.6em}.grid{grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:4px;display:grid}.tile{aspect-ratio:1;border-radius:var(--radius-sm);background:var(--bg-elev-1);cursor:pointer;transition:transform .12s,box-shadow .12s;position:relative;overflow:hidden}.tile:active{box-shadow:var(--shadow-2);transform:scale(.97)}.tile img{object-fit:cover;background:var(--bg-elev-1);width:100%;height:100%;transition:opacity .4s}.tile img[data-loaded=false]{opacity:.4}.tile.skeleton{background:linear-gradient(90deg, var(--bg-elev-1) 0%, var(--bg-elev-2) 45%, var(--bg-elev-3) 50%, var(--bg-elev-2) 55%, var(--bg-elev-1) 100%);cursor:default;background-size:240% 100%;animation:1.6s linear infinite shimmer}.tile.skeleton:active{box-shadow:none;transform:none}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-100% 0}}.tile .badge{color:#fff;pointer-events:none;-webkit-backdrop-filter:blur(4px);background:#000000a6;border-radius:999px;padding:2px 7px;font-size:.7em;position:absolute;top:6px;right:6px}.state{text-align:center;color:var(--fg-muted);padding:4em 1em 1em;line-height:1.6}.state .icon{opacity:.95;margin-bottom:.4em;font-size:3em;display:block}.state .duck-wrap{width:96px;height:96px;margin:0 auto 1em}.state strong{color:var(--fg);margin-bottom:.3em;font-weight:600;display:block}.state small{color:var(--fg-dim);font-size:.85em}.btn{background:var(--bg-elev-2);border:1px solid var(--border);-webkit-tap-highlight-color:transparent;border-radius:10px;justify-content:center;align-items:center;gap:.4em;padding:.7em 1.1em;font-weight:500;transition:background .12s,transform 80ms;display:inline-flex}.btn:active{transform:scale(.97)}.btn:hover{background:var(--bg-elev-3)}.btn-primary{background:var(--accent);color:#1a1a1a;border-color:var(--accent);font-weight:600;box-shadow:0 4px 12px #ffb40033}.btn-primary:hover{background:var(--accent-strong)}.btn-primary:disabled{opacity:.5;box-shadow:none}.btn-icon{border-radius:50%;width:40px;height:40px;padding:0}.search-bar{gap:8px;margin-bottom:1em;display:flex}.search-bar input{background:var(--bg-elev-1);border:1px solid var(--border);color:var(--fg);border-radius:12px;flex:1;padding:.85em 1.05em;font-size:.95em;transition:border-color .15s,box-shadow .15s}.search-bar input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow);outline:none}.viewer{z-index:100;padding:var(--safe-top) 0 var(--safe-bottom);background:#000000f5;flex-direction:column;animation:.18s viewer-in;display:flex;position:fixed;inset:0}@keyframes viewer-in{0%{opacity:0;transform:scale(1.02)}to{opacity:1;transform:scale(1)}}.viewer-header{background:linear-gradient(#0000008c,#0000);align-items:center;gap:8px;padding:.7em 1em;display:flex}.viewer-header .title{color:var(--fg-muted);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:.88em;overflow:hidden}.viewer-header .actions{gap:4px;display:flex}.viewer-header .btn-icon{color:#fff;background:#ffffff14;border-color:#0000}.viewer-body{flex:1;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.viewer-body img,.viewer-body video{object-fit:contain;max-width:100%;max-height:100%}.viewer-side-btn{color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent;background:#00000073;border:1px solid #ffffff1f;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.6em;line-height:1;transition:background .15s,transform 80ms;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.viewer-side-btn:hover{background:#000000a6}.viewer-side-btn:active{transform:translateY(-50%)scale(.92)}.viewer-side-btn.left{left:12px}.viewer-side-btn.right{right:12px}@media (width<=720px){.viewer-side-btn{opacity:.3;width:36px;height:36px;font-size:1.3em}.viewer-side-btn:active{opacity:.9}}.viewer-meta{color:var(--fg-muted);background:linear-gradient(#0000,#0000008c);grid-template-columns:auto 1fr;gap:.45em 1em;max-height:40vh;padding:1em 1.2em;font-size:.85em;display:grid;overflow-y:auto}.viewer-meta dt{color:var(--fg-dim);font-size:.85em}.viewer-meta dd{color:var(--fg);word-break:break-word;margin:0}.section-title{text-transform:uppercase;letter-spacing:.05em;color:var(--fg-dim);margin:1.2em .4em .5em;font-size:.78em;font-weight:600}.list{background:var(--bg-elev-1);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:1em;overflow:hidden}.row{border-bottom:1px solid var(--border-soft);align-items:center;gap:1em;padding:.95em 1.1em;display:flex}.row:last-child{border-bottom:0}.row .info{flex:1;min-width:0}.row .label{font-size:.95em}.row .sub{color:var(--fg-muted);margin-top:2px;font-size:.8em;line-height:1.4}.row .danger{color:var(--danger)}.toggle{background:var(--bg-elev-3);cursor:pointer;border-radius:15px;flex-shrink:0;width:50px;height:30px;transition:background .2s;position:relative}.toggle.on{background:var(--accent);box-shadow:0 0 12px var(--accent-glow)}.toggle:after{content:"";background:#fff;border-radius:50%;width:24px;height:24px;transition:left .2s;position:absolute;top:3px;left:3px;box-shadow:0 1px 3px #0006}.toggle.on:after{left:23px}.toast{left:50%;bottom:calc(var(--nav-h) + var(--safe-bottom) + 16px);background:var(--bg-elev-3);color:var(--fg);border:1px solid var(--border);box-shadow:var(--shadow-pop);z-index:200;border-radius:999px;max-width:calc(100% - 2em);padding:.8em 1.2em;font-size:.88em;animation:.2s toast-in;position:fixed;transform:translate(-50%)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}.spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:28px;height:28px;margin:0 auto;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.fade-in{animation:.25s fade-in}@keyframes fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}