:root{--parchment-bg: #f4ecd8;--parchment-dark: #e6d5b8;--ink-dark: #3a2e24;--ink-light: #5c4a3d;--gold-accent: #c59b27;--gold-light: #e8c766;--red-stamp: #8b2500;--shadow-color: rgba(58, 46, 36, .15);--font-serif: "Georgia", "Times New Roman", serif;--font-sans: system-ui, -apple-system, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background-color:#2c241b;background-image:radial-gradient(#3a2e24 1px,transparent 1px);background-size:20px 20px;color:var(--ink-dark);font-family:var(--font-sans);min-height:100vh}.timeline-app{max-width:1000px;margin:0 auto;min-height:100vh;background:linear-gradient(135deg,var(--parchment-bg) 0%,#faeedc 50%,var(--parchment-dark) 100%);box-shadow:0 0 40px #00000080;position:relative;overflow:hidden}.timeline-app:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml;utf8,<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"><filter id="noiseFilter"><feTurbulence type="fractalNoise" baseFrequency="0.8" numOctaves="3" stitchTiles="stitch"/></filter><rect width="100%" height="100%" filter="url(%23noiseFilter)" opacity="0.05"/></svg>');pointer-events:none;z-index:0}.app-header{position:relative;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:20px 30px;border-bottom:2px solid var(--gold-accent);background:#f4ecd8cc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.header-title{display:flex;align-items:center;gap:12px}.title-icon{color:var(--gold-accent);width:28px;height:28px}.header-title h1{font-family:var(--font-serif);font-size:24px;color:var(--ink-dark);letter-spacing:2px;text-shadow:1px 1px 0px rgba(255,255,255,.5)}.cloud-status{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-light);background:#fff6;padding:6px 12px;border-radius:20px;border:1px dashed var(--gold-accent)}.cloud-icon.pulsing{animation:pulse 1.5s infinite;color:var(--gold-accent)}@keyframes pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.7}to{transform:scale(1);opacity:1}}.app-main{position:relative;z-index:10;padding:30px}.search-section{max-width:600px;margin:0 auto 50px}.search-box{display:flex;background:#fff;border:2px solid var(--ink-dark);border-radius:8px;overflow:hidden;box-shadow:4px 4px 0 var(--ink-dark);transition:transform .2s,box-shadow .2s}.search-box:focus-within{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink-dark)}.search-input{flex:1;padding:15px 20px;border:none;outline:none;font-size:16px;font-family:var(--font-serif);background:transparent;color:var(--ink-dark)}.search-input::placeholder{color:#999;font-style:italic}.search-btn{background:var(--ink-dark);color:var(--parchment-bg);border:none;padding:0 25px;cursor:pointer;transition:background .2s}.search-btn:hover:not(:disabled){background:var(--gold-accent)}.search-btn:disabled{opacity:.7;cursor:not-allowed}.history-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:15px;align-items:center}.history-icon{color:var(--ink-light)}.history-tag{background:transparent;border:1px solid var(--ink-light);color:var(--ink-light);padding:4px 12px;border-radius:15px;font-size:12px;cursor:pointer;transition:all .2s;font-family:var(--font-serif)}.history-tag:hover{background:var(--ink-light);color:var(--parchment-bg)}.loading-state,.error-state{text-align:center;padding:60px 20px;font-family:var(--font-serif);color:var(--ink-light)}.hourglass-loader{width:40px;height:60px;margin:0 auto 20px;border:4px solid var(--gold-accent);border-radius:4px;position:relative;animation:flip 2s infinite ease-in-out}.hourglass-loader:before{content:"";position:absolute;top:0;left:0;right:0;bottom:50%;background:var(--gold-accent);animation:sand-flow 2s infinite ease-in-out}@keyframes flip{0%,40%{transform:rotate(0)}50%,90%{transform:rotate(180deg)}to{transform:rotate(180deg)}}@keyframes sand-flow{0%{bottom:50%;top:0}40%{bottom:0;top:50%}50%{bottom:0;top:50%}90%{bottom:50%;top:0}to{bottom:50%;top:0}}.timeline-container{position:relative;max-width:800px;margin:0 auto;padding:20px 0}.timeline-center-line{position:absolute;left:50%;transform:translate(-50%);top:0;bottom:0;width:4px;background:linear-gradient(to bottom,transparent,var(--gold-accent) 5%,var(--gold-accent) 95%,transparent);border-radius:2px}.timeline-item{display:flex;justify-content:flex-end;padding-right:50%;position:relative;margin-bottom:40px;width:100%}.timeline-item.right{justify-content:flex-start;padding-right:0;padding-left:50%}.timeline-dot{position:absolute;left:50%;top:20px;transform:translate(-50%,-50%);width:24px;height:24px;background:var(--parchment-bg);border:4px solid var(--gold-accent);border-radius:50%;z-index:2;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 4px #f4ecd8cc}.dot-inner{width:8px;height:8px;background:var(--ink-dark);border-radius:50%}.timeline-card{width:calc(100% - 40px);background:#fff;border:1px solid var(--parchment-dark);padding:20px;border-radius:2px 15px 3px/15px 5px 15px 3px;box-shadow:3px 3px 10px var(--shadow-color);cursor:pointer;transition:all .3s cubic-bezier(.25,.8,.25,1);position:relative}.timeline-item.left .timeline-card{margin-right:40px}.timeline-item.right .timeline-card{margin-left:40px}.timeline-card:hover{transform:translateY(-5px) scale(1.02);box-shadow:5px 8px 15px var(--shadow-color);border-color:var(--gold-accent)}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;border-bottom:1px dashed var(--parchment-dark);padding-bottom:8px}.event-year{font-family:var(--font-serif);font-weight:700;font-size:18px;color:var(--red-stamp)}.event-category{font-size:12px;background:var(--parchment-bg);padding:2px 8px;border-radius:10px;border:1px solid var(--gold-light);color:var(--ink-light)}.event-title{font-family:var(--font-serif);font-size:20px;margin-bottom:10px;display:flex;align-items:center;gap:8px;color:var(--ink-dark)}.timeline-icon-svg{width:20px;height:20px;color:var(--gold-accent)}.event-desc-short{font-size:14px;line-height:1.6;color:var(--ink-light);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.read-more{margin-top:15px;display:flex;align-items:center;justify-content:flex-end;gap:4px;font-size:12px;color:var(--gold-accent);font-weight:700;opacity:0;transition:opacity .2s}.timeline-card:hover .read-more{opacity:1}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#2c241bcc;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:100;display:flex;align-items:center;justify-content:center;padding:20px}.modal-content{background:linear-gradient(to bottom right,#fffdf7,var(--parchment-bg));width:100%;max-width:500px;border-radius:8px;padding:40px;position:relative;box-shadow:0 20px 50px #00000080;border:2px solid var(--gold-accent)}.close-btn{position:absolute;top:15px;right:15px;background:transparent;border:none;color:var(--ink-light);cursor:pointer;transition:color .2s,transform .2s}.close-btn:hover{color:var(--red-stamp);transform:rotate(90deg)}.modal-header{display:flex;align-items:flex-start;gap:20px;margin-bottom:20px}.modal-icon-wrapper{width:60px;height:60px;background:var(--parchment-dark);border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid var(--gold-accent);flex-shrink:0}.modal-icon-wrapper .timeline-icon-svg{width:30px;height:30px}.modal-title-group{flex:1}.modal-year{display:inline-block;font-family:var(--font-serif);color:var(--red-stamp);font-size:16px;font-weight:700;margin-bottom:5px;border-bottom:2px solid var(--gold-light)}.modal-title-group h2{font-family:var(--font-serif);font-size:28px;color:var(--ink-dark);line-height:1.2}.modal-divider{height:2px;background:repeating-linear-gradient(to right,var(--ink-light) 0,var(--ink-light) 5px,transparent 5px,transparent 10px);margin:20px 0;opacity:.3}.modal-body{margin-bottom:30px}.modal-desc{font-size:16px;line-height:1.8;color:var(--ink-dark);text-align:justify;margin-bottom:20px;font-family:var(--font-serif)}.modal-meta{background:#e8c76633;padding:10px 15px;border-radius:4px;display:inline-block;border-left:4px solid var(--gold-accent)}.meta-label{color:var(--ink-light);font-size:14px}.meta-value{color:var(--ink-dark);font-weight:700;font-size:14px}.modal-footer{text-align:center;border-top:1px solid var(--parchment-dark);padding-top:15px}.footer-hint{font-size:12px;color:#888;font-style:italic;font-family:var(--font-serif)}@media (max-width: 768px){.timeline-center-line{left:30px;transform:none}.timeline-item,.timeline-item.right{justify-content:flex-start;padding-left:70px;padding-right:0}.timeline-dot{left:30px;transform:translate(-50%,-50%)}.timeline-item.left .timeline-card,.timeline-item.right .timeline-card{margin:0;width:100%}.app-header{flex-direction:column;gap:10px;align-items:flex-start}.modal-content{padding:25px}}