*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:radial-gradient(circle at top,#1d4ed8 0,#020617 45% 100%);color:#e5e7eb}#root{min-height:100vh;display:flex;justify-content:center;align-items:flex-start;padding:2.5rem 1rem}.app-root{width:100%;display:flex;justify-content:center}.app-container{width:100%;max-width:1200px;margin:0 auto;background:#0f172af5;border-radius:18px;padding:2.25rem 2rem;box-shadow:0 24px 80px #0f172abf,0 0 0 1px #94a3b826;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.app-header{text-align:center;margin-bottom:2.25rem;padding-bottom:1.5rem;border-bottom:1px solid rgba(148,163,184,.25)}.app-title{margin:0 0 .4rem;font-size:2.1rem;font-weight:650;letter-spacing:.02em;color:#f9fafb}.app-subtitle{margin:0;font-size:.95rem;color:#9ca3af}.app-divider{display:none}.app-content{display:grid;grid-template-columns:360px 1fr;gap:2rem;align-items:flex-start}.article-list{display:flex;flex-direction:column;gap:1rem;max-height:600px;overflow-y:auto;padding-right:.4rem}.article-list::-webkit-scrollbar{width:6px}.article-list::-webkit-scrollbar-track{background:#0f172ab3;border-radius:999px}.article-list::-webkit-scrollbar-thumb{background:#4b5563;border-radius:999px}.article-list::-webkit-scrollbar-thumb:hover{background:#6b7280}.article-card{padding:.9rem 1rem;border-radius:12px;background:#0f172ae6;border:1px solid rgba(55,65,81,.9);cursor:pointer;transition:all .18s ease-out}.article-card:hover{background:#1e40af40;border-color:#4f46e5;transform:translateY(-1px)}.article-card--active{background:radial-gradient(circle at top left,#4f46e566,#0f172af2);border-color:#6366f1;box-shadow:0 0 0 1px #818cf866}.article-card-title{margin:0 0 .4rem;font-size:.98rem;font-weight:600;color:#e5e7eb}.snippet{margin:0 0 .6rem;font-size:.82rem;color:#9ca3af;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.article-card-meta{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;font-size:.73rem;color:#9ca3af}.article-chip{padding:.2rem .55rem;border-radius:999px;background:#1e40af40;color:#c7d2fe;font-size:.7rem;font-weight:500}.article-detail{border-radius:14px;padding:1.6rem 1.7rem;background:radial-gradient(circle at top left,#1e40af4d,#0f172afa);border:1px solid rgba(75,85,99,.8);min-height:400px;display:flex;flex-direction:column;gap:1rem}.detail-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap}.detail-title{margin:0;font-size:1.45rem;font-weight:650;color:#f9fafb;flex:1}.detail-badge{padding:.25rem .85rem;border-radius:999px;background:#22c55e14;border:1px solid rgba(34,197,94,.4);color:#bbf7d0;font-size:.75rem;font-weight:500;white-space:nowrap}.article-detail .article-card-meta{margin-top:-.4rem}.detail-body{font-size:.96rem;color:#e5e7eb;line-height:1.7;flex:1;overflow-y:auto;padding-right:.4rem}.detail-body p{margin:0 0 .9rem}.detail-body p:last-child{margin-bottom:0}.detail-body::-webkit-scrollbar{width:6px}.detail-body::-webkit-scrollbar-track{background:#0f172ab3;border-radius:999px}.detail-body::-webkit-scrollbar-thumb{background:#4b5563;border-radius:999px}.detail-body::-webkit-scrollbar-thumb:hover{background:#6b7280}.detail-placeholder{flex:1;display:flex;align-items:center;justify-content:center;font-size:.95rem;color:#9ca3af;text-align:center;min-height:200px}.detail-placeholder.loading:before{content:"";position:absolute;width:32px;height:32px;border:3px solid rgba(55,65,81,.8);border-top-color:#6366f1;border-radius:50%;animation:spin .8s linear infinite;margin-bottom:1rem}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:768px){#root{padding:1.25rem .9rem}.app-container{padding:1.6rem 1.4rem}.app-content{grid-template-columns:1fr;gap:1.4rem}.article-list{max-height:320px;order:2}.article-detail{order:1;min-height:320px}.detail-header{flex-direction:column;align-items:flex-start}}