:root{--color-coral:#ff6b6b;--color-navy:#2c3e50;--color-cream:#fff5e1;--color-gold:gold;--color-mint:#e8f5e9;--color-peach:#fff3e0;--color-lavender:#f3e5f5;--color-aqua:#e0f7fa;--color-sky:#87ceeb;--color-chartreuse:#7fff00;--color-text:#2c3e50;--color-text-light:#666;--color-white:#fff;--font-heading:"Playfair Display", "Georgia", serif;--font-body:"Lato", "Helvetica Neue", sans-serif;--font-display:"Abril Fatface", "Courier New", cursive}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);color:var(--color-text);background:linear-gradient(135deg,#fff8f0 0%,#fff5e1 50%,#ffefd5 100%);min-height:100vh;line-height:1.6}#root{width:100%;max-width:1200px;margin:0 auto}.app{flex-direction:column;min-height:100vh;display:flex}.header{background:linear-gradient(180deg, #fff 0%, var(--color-cream) 100%);border-bottom:3px solid var(--color-navy);justify-content:space-between;align-items:center;height:90px;padding:0 32px;display:flex;box-shadow:0 4px 12px #2c3e501a}.logo-icon{background:var(--color-coral);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;font-size:28px;display:flex;box-shadow:inset 0 -4px #0003}.logo-text{font-family:var(--font-heading);color:var(--color-navy);font-size:28px;font-weight:700}.nav a{font-family:var(--font-body);color:var(--color-navy);border-radius:4px;padding:8px 16px;font-size:16px;font-weight:600;text-decoration:none;transition:all .2s}.nav a:hover{background:var(--color-navy);color:var(--color-cream);text-decoration:none}.sound-toggle{background:var(--color-navy);color:#fff;font-family:var(--font-body);cursor:pointer;border:none;border-radius:20px;padding:8px 16px;font-size:14px;font-weight:600}.sound-toggle:hover{background:var(--color-coral)}.hero{background:radial-gradient(ellipse at 30% 20%, #ffb6c14d 0%, transparent 50%), radial-gradient(ellipse at 70% 80%, #87ceeb4d 0%, transparent 50%), linear-gradient(180deg, #ffefd5 0%, var(--color-cream) 100%);flex-direction:column;justify-content:center;align-items:center;gap:24px;height:400px;padding:48px;display:flex}.hero-box{border:4px solid var(--color-navy);box-shadow:8px 8px 0 var(--color-navy);background:#fff;border-radius:16px;padding:40px 60px}.hero-title{font-family:var(--font-heading);color:var(--color-navy);text-align:center;font-size:52px;font-weight:700}.hero-subtitle{font-family:var(--font-body);color:var(--color-text-light);text-align:center;margin-top:8px;font-size:20px;font-style:italic}.random-btn,.cta-button,.submit-btn,a.cta-button{background:var(--color-coral);color:#fff;border:3px solid var(--color-navy);font-family:var(--font-body);cursor:pointer;box-shadow:4px 4px 0 var(--color-navy);text-align:center;border-radius:30px;margin-top:20px;padding:14px 28px;font-size:16px;font-weight:700;text-decoration:none;transition:all .2s;display:inline-block}.random-btn:hover,.cta-button:hover,.submit-btn:hover,a.cta-button:hover{box-shadow:6px 6px 0 var(--color-navy);color:#fff;transform:translate(-2px,-2px)}.history-feature{background:linear-gradient(90deg, var(--color-navy) 0%, #4a6fa5 100%);margin:24px 0;padding:24px 48px}.history-content{align-items:center;gap:20px;max-width:800px;margin:0 auto;display:flex}.history-icon{font-size:36px}.history-label{color:var(--color-gold);text-transform:uppercase;letter-spacing:2px;font-size:12px;font-weight:700}.history-event{color:#fff;font-size:18px;font-style:italic}.messages-section{flex-direction:column;gap:24px;padding:32px 16px;display:flex}.messages-header{flex-direction:column;align-items:center;gap:12px;display:flex}.messages-title{font-family:var(--font-heading);color:var(--color-navy);font-size:36px}.title-underline{background:var(--color-coral);border-radius:3px;width:180px;height:5px}.category-filter{flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:16px;display:flex}.filter-btn{border:2px solid var(--color-navy);color:var(--color-navy);font-family:var(--font-body);cursor:pointer;background:#fff;border-radius:20px;padding:10px 20px;font-size:14px;font-weight:600;transition:all .2s}.filter-btn:hover,.filter-btn.active{background:var(--color-navy);color:#fff}.messages-grid{flex-wrap:wrap;justify-content:center;gap:20px;display:flex}.message-card{border:3px solid var(--color-navy);width:320px;min-height:200px;color:var(--color-text);box-shadow:4px 4px 0 var(--color-navy);border-radius:12px;flex-direction:column;gap:10px;padding:24px;text-decoration:none;transition:all .2s;display:flex}.message-card:hover{box-shadow:8px 8px 0 var(--color-navy);transform:translate(-4px,-4px)}.card-accent{border-radius:3px;width:60px;height:5px}.card-text{font-family:var(--font-body);color:var(--color-navy);font-size:16px;font-style:italic}.card-source{color:var(--color-text-light);font-size:13px}.card-votes{color:var(--color-coral);font-size:14px;font-weight:700}.decorative-shapes{justify-content:space-around;padding:32px;display:flex}.shape{width:30px;height:30px}.hexagon{background:var(--color-mint);clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%)}.pentagon{background:var(--color-coral);clip-path:polygon(50% 0%,100% 38%,82% 100%,18% 100%,0% 38%)}.circle-orange{background:var(--color-peach);border-radius:50%}.circle-blue{background:var(--color-aqua);border-radius:50%}.hexagon-purple{background:var(--color-lavender);clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%)}.cta-section{background:linear-gradient(135deg, var(--color-navy) 0%, #4a6fa5 100%);box-shadow:8px 8px 0 var(--color-coral);border-radius:16px;flex-direction:column;align-items:center;gap:20px;margin:24px;padding:48px;display:flex}.cta-content{flex-direction:column;align-items:center;gap:16px;display:flex}.cta-title{font-family:var(--font-heading);color:#fff;text-align:center;font-size:32px}.cta-subtitle{color:#fffc;text-align:center;font-size:18px}.cta-subtitle a{color:var(--color-gold);text-decoration:underline}.cta-subtitle a:hover{color:#fff}.field-input{border:2px solid var(--color-navy);color:var(--color-text);font-size:16px;font-family:var(--font-body);background:#fff;border-radius:8px;padding:14px}.field-input:focus{border-color:var(--color-coral);outline:none;box-shadow:0 0 0 3px #ff6b6b33}.action-btn{border:2px solid var(--color-navy);color:var(--color-navy);font-family:var(--font-body);cursor:pointer;background:#fff;border-radius:25px;align-items:center;gap:8px;padding:12px 20px;font-weight:600;transition:all .2s;display:flex}.action-btn:hover{background:var(--color-navy);color:#fff}.action-btn:disabled{opacity:.5;cursor:not-allowed}.about-hero{background:linear-gradient(180deg, var(--color-cream) 0%, white 100%);flex-direction:column;justify-content:center;align-items:center;gap:16px;height:280px;padding:32px;display:flex}.about-title{font-family:var(--font-heading);color:var(--color-navy);font-size:48px}.about-subtitle{color:var(--color-text-light);font-size:20px;font-style:italic}.about-main{flex-wrap:wrap;justify-content:center;gap:40px;padding:40px 16px;display:flex}.about-text{width:600px}.section-title{font-family:var(--font-heading);color:var(--color-navy);margin-bottom:20px;font-size:28px}.about-paragraph{color:var(--color-text-light);margin-bottom:20px;font-size:16px;line-height:1.8}.about-image{background:var(--color-cream);border:3px solid var(--color-navy);border-radius:12px;flex-direction:column;align-items:center;gap:16px;width:300px;padding:24px;display:flex}.founders-circle{background:linear-gradient(135deg, var(--color-coral) 0%, #ff8a80 100%);border-radius:50%;width:120px;height:120px}.founders-title{font-family:var(--font-heading);color:var(--color-navy);font-size:20px}.founders-subtitle{color:var(--color-text-light);font-size:14px}.about-values{flex-wrap:wrap;justify-content:center;gap:24px;padding:32px 16px;display:flex}.value-card{border:3px solid var(--color-navy);width:280px;box-shadow:4px 4px 0 var(--color-navy);background:#fff;border-radius:12px;flex-direction:column;align-items:center;gap:16px;padding:24px;display:flex}.value-icon{width:50px;height:50px}.value-icon.star{background:var(--color-gold);clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}.value-icon.circle{background:var(--color-peach);border-radius:50%}.value-icon.hexagon{background:var(--color-lavender);clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%)}.value-title{font-family:var(--font-heading);color:var(--color-navy);font-size:20px}.value-text{color:var(--color-text-light);text-align:center;font-size:14px}.detail-hero{background:var(--color-navy);justify-content:space-between;align-items:center;height:80px;padding:0 32px;display:flex}.back-btn{color:#fff;font-size:14px;font-weight:600;text-decoration:none}.back-btn:hover{color:var(--color-coral)}.detail-main{flex-direction:column;align-items:center;gap:28px;padding:32px 16px;display:flex}.detail-card{border:4px solid var(--color-navy);width:700px;box-shadow:6px 6px 0 var(--color-navy);background:#fff;border-radius:16px;flex-direction:column;gap:20px;padding:40px;display:flex}.detail-badge{background:var(--color-coral);color:#fff;border-radius:20px;width:fit-content;padding:8px 16px;font-size:14px;font-weight:700;display:inline-flex}.detail-text{font-family:var(--font-heading);color:var(--color-navy);text-align:center;font-size:28px;font-style:italic;line-height:1.4}.detail-meta{justify-content:space-between;display:flex}.detail-source,.detail-votes{color:var(--color-text-light);font-size:16px}.detail-votes{color:var(--color-coral);font-weight:700}.detail-actions{gap:16px;display:flex}.detail-context{width:700px}.context-title{font-family:var(--font-heading);color:var(--color-navy);margin-bottom:12px;font-size:20px}.context-text{color:var(--color-text-light);font-size:16px;line-height:1.7}.related-section{width:700px}.related-title{font-family:var(--font-heading);color:var(--color-navy);margin-bottom:16px;font-size:20px}.related-grid{gap:16px;display:flex}.related-card{border:2px solid var(--color-navy);color:var(--color-text);background:#fff;border-radius:8px;flex-direction:column;flex:1;gap:10px;padding:20px;text-decoration:none;transition:all .2s;display:flex}.related-card:hover{box-shadow:4px 4px 0 var(--color-navy);transform:translate(-2px,-2px)}.related-accent{border-radius:2px;width:50px;height:4px}.related-text{font-size:14px;font-style:italic}.submit-hero{background:var(--color-navy);align-items:center;height:80px;padding:0 32px;display:flex}.submit-title{font-family:var(--font-heading);color:#fff;font-size:28px}.submit-main{flex-wrap:wrap;justify-content:center;gap:40px;padding:32px 16px;display:flex}.submit-form{flex-direction:column;gap:20px;width:500px;display:flex}.form-title{font-family:var(--font-heading);color:var(--color-navy);font-size:24px}.form-desc{color:var(--color-text-light);font-size:14px}.form-field{flex-direction:column;gap:8px;display:flex}.field-label{color:var(--color-navy);font-size:14px;font-weight:600}.terms-check{align-items:center;gap:12px;display:flex}.terms-check input{width:22px;height:22px}.terms-check label{color:var(--color-text-light);font-size:14px}.submit-preview{flex-direction:column;gap:16px;width:380px;display:flex}.preview-title{font-family:var(--font-heading);color:var(--color-navy);font-size:20px}.preview-card{background:var(--color-cream);border:3px solid var(--color-navy);border-radius:12px;flex-direction:column;gap:12px;min-height:220px;padding:24px;display:flex}.preview-accent{background:var(--color-coral);border-radius:3px;width:60px;height:5px}.preview-text{color:var(--color-navy);font-size:16px;font-style:italic}.preview-source{color:var(--color-text-light);font-size:13px}.preview-placeholder{color:var(--color-text-light);font-size:14px;font-style:italic}.preview-tip{color:var(--color-coral);font-size:13px}.guidelines{padding:32px 16px}.guidelines-title{font-family:var(--font-heading);color:var(--color-navy);margin-bottom:16px;font-size:18px}.guidelines-list{color:var(--color-text-light);flex-direction:column;gap:10px;font-size:14px;list-style:none;display:flex}.not-found{flex-direction:column;justify-content:center;align-items:center;gap:20px;height:400px;display:flex}.not-found h1{font-family:var(--font-heading);color:var(--color-navy)}.not-found a{color:var(--color-coral);font-weight:600;text-decoration:none}@media (width<=768px){.hero-title{font-size:36px}.hero-box{padding:24px 32px}.messages-grid,.about-main,.about-values{flex-direction:column;align-items:center}.detail-card,.detail-context,.related-section{width:100%}.submit-main{flex-direction:column;align-items:center}}.app{flex-direction:column;min-height:100vh;padding-bottom:60px;display:flex}.header{justify-content:space-between;align-items:center;height:80px;padding:0 24px;display:flex}.logo{align-items:center;gap:12px;text-decoration:none;display:flex}.logo-icon{background:var(--color-coral);border-radius:50%;width:48px;height:48px}.logo-text{color:var(--color-navy);font-size:24px;font-weight:700}.nav{gap:32px;display:flex}.nav a{color:var(--color-navy);font-size:16px;text-decoration:none}.nav a:hover{color:var(--color-coral)}.footer{background:var(--color-navy);justify-content:space-between;align-items:center;height:80px;padding:0 24px;display:flex}.footer-text{color:#fff;font-size:14px}.footer-tagline{color:var(--color-coral);font-size:14px}.radio-player-container{background:var(--color-navy);border-top:3px solid var(--color-coral);z-index:999;width:100%;max-width:1200px;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.radio-player{align-items:center;gap:12px;padding:8px 16px;display:flex}.radio-shuffle{background:var(--color-coral);cursor:pointer;border:none;border-radius:4px;width:36px;height:36px;font-size:18px;transition:transform .2s}.radio-shuffle:hover{transform:scale(1.1)}.radio-now-playing{color:var(--color-cream);white-space:nowrap;text-overflow:ellipsis;max-width:200px;font-size:13px;overflow:hidden}.radio-loading,.radio-error{text-align:center;color:#ccc;padding:10px;font-size:14px}.radio-player iframe{flex:1;height:60px;display:block}.radio-error{text-align:center;color:#ccc;padding:10px;font-size:14px}