*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:linear-gradient(135deg,#f6f6ef,#e8e8e0);color:#000;line-height:1.6;margin:0;padding:0;min-height:100vh;overflow-x:hidden}.app{width:100%;min-height:100vh;position:relative}.header{background:linear-gradient(135deg,#f60,#e55a00);color:#fff;padding:20px;text-align:center;box-shadow:0 2px 10px #0000001a}.header h1{font-size:24px;font-weight:700}.header p{font-size:14px;opacity:.9;margin-top:5px}.loading{text-align:center;padding:40px;font-size:18px;color:#666}.loading:after{content:"";display:inline-block;width:20px;height:20px;border:3px solid #ccc;border-radius:50%;border-top-color:#f60;animation:spin 1s ease-in-out infinite;margin-left:10px}.error{background-color:#fee;border:1px solid #fcc;color:#c00;padding:15px;border-radius:5px;margin:20px 0;text-align:center}.stories{list-style:none}.story{background:#fff;border:1px solid #e0e0e0;border-radius:8px;margin-bottom:15px;padding:20px;transition:box-shadow .2s ease}.story:hover{box-shadow:0 2px 10px #0000001a}.story-title{font-size:18px;font-weight:600;margin-bottom:10px;line-height:1.4}.story-title a{color:#333;text-decoration:none}.story-title a:hover{color:#f60}.story-meta{font-size:13px;color:#666;display:flex;gap:15px;flex-wrap:wrap}.story-meta span{display:flex;align-items:center;gap:5px}.story-meta .score{color:#f60;font-weight:600}.story-meta .author{color:#333}.story-meta .time{color:#999}.story-meta .comments{color:#666}@media (max-width: 768px){.app{padding:10px}.header{margin:-10px -10px 15px;padding:15px}.header h1{font-size:20px}.story{padding:15px;margin-bottom:10px}.story-title{font-size:16px}.story-meta{font-size:12px;gap:10px}}@media (max-width: 480px){.story-meta{flex-direction:column;gap:5px}}.card-container{position:relative;width:100%;height:calc(100vh - 120px);display:flex;justify-content:center;align-items:center;perspective:1000px;overflow:hidden}.article-card{position:absolute;width:min(400px,90vw);height:min(600px,80vh);border-radius:20px;cursor:grab;-webkit-user-select:none;user-select:none;transform-style:preserve-3d;transition:transform .6s ease;transform-origin:center}.article-card.flipped{transform:rotateY(180deg)}.card-face{position:absolute;width:100%;height:100%;border-radius:20px;backface-visibility:hidden;box-shadow:0 10px 30px #0003;padding:30px;display:flex;flex-direction:column;justify-content:space-between}.card-front{background:#fff;z-index:2}.card-back{background:linear-gradient(135deg,#f8f9fa,#e9ecef);transform:rotateY(180deg);z-index:1}.card-back-content{display:flex;flex-direction:column;gap:20px;height:100%}.card-back-header{text-align:center;border-bottom:2px solid #ff6600;padding-bottom:15px}.card-back-title{font-size:18px;font-weight:700;color:#333;margin-bottom:10px;line-height:1.3}.card-back-meta{font-size:14px;color:#666;display:flex;justify-content:center;gap:15px}.summary-content-back{flex:1;display:flex;flex-direction:column;gap:15px;overflow-y:auto}.summary-text-back{background:#fffc;padding:20px;border-radius:12px;font-size:14px;line-height:1.6;color:#333;box-shadow:0 2px 8px #0000001a}.summary-loading-back{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;flex:1;color:#666}.summary-loading-back .loading-spinner{width:24px;height:24px;border:3px solid rgba(255,102,0,.3);border-top:3px solid #ff6600;border-radius:50%;animation:spin 1s linear infinite}.summary-error-back{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;flex:1;color:#d32f2f;text-align:center}.flip-back-button{background:#f60;color:#fff;border:none;padding:12px 24px;border-radius:25px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;align-self:center}.flip-back-button:hover{background:#e55a00;transform:translateY(-2px)}.article-card:active{cursor:grabbing}.article-card.dragging{transition:none;z-index:10}.article-card.swiping-left{transform:translate(-100px) rotate(-10deg)}.article-card.swiping-right{transform:translate(100px) rotate(10deg)}.card-header{text-align:center;margin-bottom:20px}.card-progress{font-size:14px;color:#666;margin-bottom:10px}.card-title{font-size:24px;font-weight:700;line-height:1.4;color:#333;margin-bottom:30px;text-align:center;min-height:120px;display:flex;align-items:center;justify-content:center}.card-meta{display:flex;flex-direction:column;gap:15px;margin-bottom:30px}.card-meta-row{display:flex;justify-content:space-between;align-items:center;font-size:16px}.card-meta-item{display:flex;align-items:center;gap:8px;color:#666}.card-meta-item.score{color:#f60;font-weight:700}.card-actions{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}.card-actions-row{display:flex;gap:15px}.card-button{flex:1;padding:15px;border:none;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;text-decoration:none;text-align:center;display:flex;align-items:center;justify-content:center;gap:8px}.card-button.primary{background:#f60;color:#fff}.card-button.primary:hover{background:#e55a00;transform:translateY(-2px)}.card-button.secondary{background:#f0f0f0;color:#666}.card-button.secondary:hover{background:#e0e0e0;transform:translateY(-2px)}.swipe-hint{text-align:center;font-size:14px;color:#999;margin-top:10px}.nav-controls{position:fixed;bottom:30px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:20px;z-index:100}.nav-button{width:60px;height:60px;border:none;border-radius:50%;background:#fff;box-shadow:0 4px 15px #0003;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:24px;transition:all .3s ease}.nav-button:hover{transform:scale(1.1);box-shadow:0 6px 20px #0000004d}.nav-button:disabled{opacity:.5;cursor:not-allowed;transform:none}.nav-button.prev{background:#4caf50;color:#fff}.nav-button.next{background:#f60;color:#fff}.nav-controls .progress-indicator{background:#ffffffe6;padding:8px 16px;border-radius:20px;box-shadow:0 2px 10px #0000001a;font-size:14px;font-weight:600;color:#333;min-width:60px;text-align:center}@keyframes slideInFromRight{0%{transform:translate(100%) rotate(10deg);opacity:0}to{transform:translate(0) rotate(0);opacity:1}}@keyframes slideInFromLeft{0%{transform:translate(-100%) rotate(-10deg);opacity:0}to{transform:translate(0) rotate(0);opacity:1}}@keyframes slideOutToLeft{0%{transform:translate(0) rotate(0);opacity:1}to{transform:translate(-100%) rotate(-10deg);opacity:0}}@keyframes slideOutToRight{0%{transform:translate(0) rotate(0);opacity:1}to{transform:translate(100%) rotate(10deg);opacity:0}}.card-enter-right{animation:slideInFromRight .4s ease}.card-enter-left{animation:slideInFromLeft .4s ease}.card-exit-left{animation:slideOutToLeft .4s ease}.card-exit-right{animation:slideOutToRight .4s ease}.error-card{background:linear-gradient(135deg,#fff,#fef8f8);border:2px solid #ff4444}.error-content{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;height:100%;gap:20px}.error-content h2{color:#f44;font-size:24px;margin:0;font-weight:700}.error-content p{color:#666;font-size:16px;margin:0}.error-icon{font-size:48px}.retry-button{max-width:200px;background:#f44!important}.retry-button:hover{background:#e63939!important}.loading-card{background:linear-gradient(135deg,#fff,#f8f8f8);border:2px solid #ff6600}.loading-content{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;height:100%;gap:20px}.loading-content h2{color:#f60;font-size:28px;margin:0;font-weight:700}.loading-content p{color:#666;font-size:16px;margin:0}.loading-spinner{width:40px;height:40px;border:4px solid #f0f0f0;border-radius:50%;border-top-color:#f60;animation:spin 1s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 768px){.article-card{width:95vw;height:70vh;padding:20px}.card-title{font-size:20px;min-height:100px}.card-meta-row{font-size:14px}.card-button{padding:12px;font-size:14px}.nav-controls{bottom:20px;gap:15px}.nav-button{width:50px;height:50px;font-size:20px}.nav-controls .progress-indicator{padding:6px 12px;font-size:12px;min-width:50px}}.summary-container{margin-top:5px;border-top:1px solid rgba(255,255,255,.1);padding-top:10px}.summary-header{margin-bottom:10px}.summary-toggle{display:flex;align-items:center;gap:10px;width:100%;background:linear-gradient(135deg,#f60,#ff8533);border:none;border-radius:12px;padding:12px 16px;color:#fff;cursor:pointer;transition:all .3s ease;font-size:14px;font-weight:600;box-shadow:0 4px 12px #ff66004d;position:relative;overflow:hidden}.summary-toggle:hover{background:linear-gradient(135deg,#e55a00,#ff7020);transform:translateY(-2px);box-shadow:0 6px 16px #f606}.summary-toggle:active{transform:translateY(0);box-shadow:0 2px 8px #ff66004d}.summary-toggle:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.summary-toggle:hover:before{left:100%}.summary-icon{font-size:18px;text-shadow:0 1px 2px rgba(0,0,0,.2)}.summary-text{flex:1;text-align:left;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.2)}.summary-arrow{font-size:14px;transition:transform .3s ease;text-shadow:0 1px 2px rgba(0,0,0,.2)}.summary-toggle.expanded .summary-arrow{transform:rotate(180deg)}.summary-content{overflow:hidden;transition:all .3s ease}.summary-content.hidden{display:none}.summary-loading{display:flex;align-items:center;gap:10px;padding:15px;background:#ffffffe6;border-radius:8px;color:#666;font-size:14px;border-left:4px solid #ff6600;margin-top:8px}.loading-spinner{width:16px;height:16px;border:2px solid rgba(255,102,0,.3);border-top:2px solid #ff6600;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.summary-text-content{padding:12px;background:#fffffff2;border-radius:8px;color:#333;font-size:13px;line-height:1.5;box-shadow:0 2px 8px #0000001a;margin-top:8px}.summary-error{display:flex;align-items:center;gap:10px;padding:15px;background:#ffebebf2;border:1px solid rgba(255,0,0,.3);border-radius:8px;color:#d32f2f;font-size:14px;border-left:4px solid #d32f2f;margin-top:8px}.error-icon{font-size:16px;color:#ff6b6b}.error-message{flex:1}.retry-button{background:#f60;border:none;border-radius:4px;padding:6px 12px;color:#fff;font-size:12px;cursor:pointer;transition:background-color .2s ease}.retry-button:hover{background:#e55a00}.retry-button:active{transform:translateY(1px)}.hidden{display:none!important}@media (max-width: 480px){.summary-container{margin-top:12px;padding-top:12px}.summary-toggle{padding:8px 10px;font-size:13px}.summary-text-content,.summary-loading,.summary-error{padding:12px;font-size:13px}.summary-icon{font-size:14px}}