*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Pretendard,system-ui,-apple-system,Segoe UI,Roboto,Noto Sans KR,sans-serif;color:#111;background:#fafafa}a{color:inherit;text-decoration:none}a:hover{color:#000;text-decoration:none}.container{max-width:960px;margin:0 auto;padding:16px}.subtitle{margin:4px 0 0;font-size:13px;color:#666}.header{position:sticky;top:0;z-index:10;background:#fafafae6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:grid;gap:8px;grid-template-columns:1fr auto;grid-template-rows:auto auto auto;grid-template-areas:"title  actions" "source actions" "cats   actions";padding:12px 0}.header h1{margin:0;font-size:20px;font-weight:700}.header>:nth-child(1){grid-area:title}.header>:nth-child(2){grid-area:source}.header>:nth-child(3){grid-area:cats}.header>.header-actions{grid-area:actions;justify-self:end;align-self:center;display:flex;gap:8px;align-items:center}.tabs{display:flex;gap:6px;flex-wrap:wrap}.tab{padding:6px 10px;border:1px solid #ddd;border-radius:999px;background:#fff;cursor:pointer;font-size:14px}.tab.active{background:#111;color:#fff;border-color:#111}.search{width:320px;max-width:100%;padding:8px 10px;border:1px solid #ddd;border-radius:10px;font-size:14px}.view-toggle{display:inline-flex;border:1px solid #ddd;border-radius:10px;overflow:hidden}.toggle-btn{padding:6px 10px;font-size:14px;cursor:pointer;background:#fff;border:0;min-width:36px}.toggle-btn.on{background:#111;color:#fff}@media (max-width: 720px){.header{grid-template-columns:1fr;grid-template-areas:"title" "source" "cats" "actions"}.header>.header-actions{justify-self:stretch}.search{width:100%}}.list{list-style:none;margin:12px 0 40px;padding:0;display:grid;gap:10px}.card{background:#fff;border:1px solid #eee;border-radius:12px;padding:12px;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}.card:hover{transform:translateY(-2px);box-shadow:0 6px 18px #00000014;border-color:#ddd}.card .title{color:#111;font-weight:700;font-size:16px}.card .title:hover{text-decoration:underline}.card .meta{color:#666;font-size:12px;margin-top:6px}.card .desc{margin-top:8px;font-size:14px;color:#333;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin:12px 0 40px}.tile{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;aspect-ratio:1/1;background:#fff;border:1px solid #eee;border-radius:14px;padding:16px;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}.tile:hover{transform:translateY(-3px);box-shadow:0 8px 20px #00000014;border-color:#ddd}.tile-title{margin:0;font-size:16px;font-weight:700;line-height:1.4;color:#111;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.tile:hover .tile-title{color:#000}.tile-meta-small{position:absolute;bottom:10px;left:16px;right:16px;font-size:12px;color:#666;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tile-head,.tile-emoji,.tile-bg,.tile-overlay{display:none!important}.cats-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.cats-row .tabs{display:flex;flex-wrap:wrap;gap:6px}.cats-row .header-actions{display:flex;align-items:center;gap:8px}.cats-row .search{width:320px;max-width:40vw}@media (max-width: 720px){.cats-row{flex-direction:column;align-items:stretch;gap:8px}.cats-row .header-actions{justify-content:space-between}.cats-row .search{width:100%;max-width:100%}}.animate-pulse{animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.bg-gray-200{background-color:#e5e7eb}