:root{--primary:#f60;--accent:#f0652f;--text:#1a1a1a;--text-secondary:#666;--bg:#fff;--bg-secondary:#f6f6ef;--border:#e0e0e0;--hover:#ff8533;--shadow:#0000001a}*,:before,:after{box-sizing:border-box}body{-webkit-font-smoothing:antialiased;background:var(--bg-secondary);color:var(--text);margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.screen{max-width:800px;min-height:100vh;margin:0 auto;padding:20px}header{background:var(--primary);color:#fff;box-shadow:0 2px 4px var(--shadow);margin:-20px -20px 24px;padding:16px 20px}h1{margin:0;font-size:24px;font-weight:600}button{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:12px 24px;font-size:16px;font-weight:500;transition:background .2s}button:hover:not(:disabled){background:var(--hover)}button:disabled{opacity:.5;cursor:not-allowed}button.secondary{background:var(--accent)}button.secondary:hover:not(:disabled){background:#d95828}.story-list{flex-direction:column;gap:12px;margin-bottom:24px;display:flex}.story-card{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:16px;transition:box-shadow .2s}.story-card:hover{box-shadow:0 4px 8px var(--shadow)}.story-title{color:var(--text);margin:0 0 8px;font-size:18px;font-weight:600}.story-title a{color:var(--text);text-decoration:none}.story-title a:hover{color:var(--primary);text-decoration:underline}.story-meta{color:var(--text-secondary);align-items:center;gap:16px;font-size:14px;display:flex}.story-points{color:var(--primary);font-weight:600}.story-url{color:var(--text-secondary);word-break:break-all;text-decoration:none}.story-url:hover{color:var(--accent)}.loading{text-align:center;color:var(--text-secondary);padding:40px}.loading-spinner{border:4px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:40px;height:40px;margin:0 auto 16px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.error{color:#856404;background:#fff3cd;border:1px solid #ffc107;border-radius:8px;margin-bottom:24px;padding:16px}.error-title{margin:0 0 8px;font-weight:600}.error-message{margin:0}.empty-state{text-align:center;color:var(--text-secondary);padding:60px 20px}.empty-state h2{color:var(--text);margin:0 0 8px;font-size:20px}.empty-state p{margin:0 0 24px}.actions{flex-wrap:wrap;gap:12px;margin-bottom:24px;display:flex}@media (width<=600px){.screen{padding:16px}header{margin:-16px -16px 20px}h1{font-size:20px}button{padding:10px 20px;font-size:14px}.story-title{font-size:16px}.actions{flex-direction:column}.actions button{width:100%}}