@tailwind base;@tailwind components;@tailwind utilities;:root{--primary: #7EB8DA;--primary-dark: #5A9DC4;--primary-light: #E4F2FA;--primary-glow: rgba(126, 184, 218, .25);--gray-light: #F1F5F9;--gray: #CBD5E1;--gray-dark: #64748B;--bg: linear-gradient(160deg, #F8FAFC 0%, #E8F4FD 30%, #F0F7FC 60%, #FAFCFD 100%);--card-bg: rgba(255, 255, 255, .92);--card-border: rgba(255, 255, 255, .7);--warning-bg: #FFFBF0;--warning-border: #F6AD55;--success: #48BB78;--danger: #FC8181;--danger-dark: #E53E3E;--shadow-sm: 0 1px 3px rgba(0,0,0,.04), 0 1px 2px rgba(0,0,0,.03);--shadow-md: 0 4px 16px rgba(0,0,0,.06), 0 1px 3px rgba(0,0,0,.04);--shadow-lg: 0 12px 32px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.04);--shadow-button: 0 2px 8px rgba(126, 184, 218, .3);--radius-sm: 10px;--radius-md: 16px;--radius-lg: 20px}*{box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background:var(--bg);color:#475569;line-height:1.6;padding:16px;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@property --border-angle{syntax: "<angle>"; initial-value: 0deg; inherits: false;}@keyframes borderSpin{to{--border-angle: 360deg}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes gentlePulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.container{max-width:620px;margin:24px auto 40px;background:var(--card-bg);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:32px 28px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--card-border);animation:fadeInUp .5s ease-out}h1{color:#4a6fa5;text-align:center;margin:0 0 24px;font-size:2rem;font-weight:800;letter-spacing:-.3px;position:relative;padding-bottom:16px;display:inline-block;width:100%}h1:after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:180px;height:3px;border-radius:3px;background:linear-gradient(90deg,#ff6b6b,#feca57,#48dbfb,#ff9ff3,#a29bfe);background-size:200% 100%;animation:shimmer 3s ease-in-out infinite}@keyframes shimmer{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.notice{background:var(--warning-bg);padding:16px 20px;margin-bottom:28px;border-radius:var(--radius-sm);font-size:.88rem;color:#92400e;line-height:1.6;box-shadow:var(--shadow-sm);position:relative;overflow:hidden}.notice:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#feca57,#ff9f43,#ee5a24,#feca57);background-size:100% 200%;animation:shimmerVertical 3s ease-in-out infinite;border-radius:4px 0 0 4px}@keyframes shimmerVertical{0%,to{background-position:50% 0%}50%{background-position:50% 100%}}.notice strong{color:#d97706;font-weight:700}.input-area{--input-bg: #FAFBFC;margin-bottom:32px;padding:20px;border-radius:var(--radius-md);background:var(--input-bg);position:relative;z-index:0;border:2px solid transparent}.input-area:before{content:"";position:absolute;inset:-3px;z-index:-1;border-radius:calc(var(--radius-md) + 3px);background:conic-gradient(from var(--border-angle, 0deg),#ff6b6b,#feca57,#48dbfb,#ff9ff3,#54a0ff,#a29bfe,#ff6b6b);animation:borderSpin 4s linear infinite;opacity:.4;filter:blur(4px);transition:opacity .4s ease,filter .4s ease}.input-area:focus-within:before{opacity:.7;filter:blur(2px)}.input-area:after{content:"";position:absolute;inset:2px;z-index:-1;border-radius:calc(var(--radius-md) - 1px);background:var(--input-bg)}textarea{width:100%;min-height:140px;padding:16px 18px;font-size:1rem;line-height:1.7;color:#334155;border:2px solid #E2E8F0;border-radius:12px;resize:vertical;margin-bottom:12px;transition:border-color .25s ease,box-shadow .25s ease;background-color:#fff;font-family:inherit;position:relative;z-index:0}textarea::placeholder{color:#94a3b8;font-style:italic}textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-glow),0 0 20px #7eb8da26;background-color:#fff}.counter{text-align:right;color:var(--gray-dark);font-size:.8rem;margin-bottom:14px;font-variant-numeric:tabular-nums}.counter.near-limit{color:var(--danger-dark);font-weight:600}button{background:linear-gradient(135deg,var(--primary) 0%,#6CB4D9 50%,var(--primary-dark) 100%);color:#fff;border:none;border-radius:var(--radius-md);padding:14px 24px;font-size:1rem;font-weight:600;cursor:pointer;width:100%;transition:all .3s cubic-bezier(.4,0,.2,1);min-height:48px;letter-spacing:.3px;position:relative;overflow:hidden;z-index:0}button:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.3) 40%,rgba(255,255,255,.5) 50%,rgba(255,255,255,.3) 60%,transparent 100%);background-size:200% 100%;opacity:0;transition:opacity .3s ease;z-index:1;pointer-events:none}button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 16px #7eb8da59,0 0 30px #ff6b6b26,0 0 50px #48dbfb1f,0 0 70px #ff9ff31a}button:hover:not(:disabled):after{opacity:1;animation:shimmer-sweep 2s ease-in-out infinite}@keyframes shimmer-sweep{0%,to{background-position:200% 0}50%{background-position:-200% 0}}button:active:not(:disabled){transform:translateY(0);box-shadow:var(--shadow-sm)}button:disabled{background:#cbd5e1;color:#94a3b8;cursor:not-allowed;transform:none;box-shadow:none}button:disabled:after{display:none}.posts-container{border-top:2px solid #F1F5F9;padding-top:24px}.post{--post-bg: #fff;background:var(--post-bg);border-radius:var(--radius-md);padding:22px 24px;margin-bottom:0;box-shadow:var(--shadow-sm);border:2px solid transparent;transition:transform .3s cubic-bezier(.4,0,.2,1),box-shadow .3s ease;position:relative;z-index:0}.post:before{content:"";position:absolute;inset:-3px;z-index:-1;border-radius:calc(var(--radius-md) + 3px);background:conic-gradient(from var(--border-angle, 0deg),#ff6b6b,#feca57,#48dbfb,#ff9ff3,#54a0ff,#a29bfe,#ff6b6b);animation:borderSpin 4s linear infinite;opacity:.55;filter:blur(3px);transition:opacity .4s ease,filter .4s ease}.post:hover:before{opacity:.85;filter:blur(2px)}.post:after{content:"";position:absolute;inset:2px;z-index:-1;border-radius:calc(var(--radius-md) - 1px);background:var(--post-bg)}.post.expiring{opacity:0;transform:scale(.95);max-height:0;padding-top:0;padding-bottom:0;margin-bottom:0;border-color:transparent;overflow:hidden}.post.expiring:before,.post.expiring:after{opacity:0}.posts-list{display:flex;flex-direction:column;gap:14px}.post:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.post-content{font-size:1.02rem;line-height:1.75;margin-bottom:16px;color:#334155;white-space:pre-wrap;word-break:break-word}.post-time{display:flex;justify-content:space-between;align-items:center;color:var(--gray-dark);font-size:.78rem;padding-top:14px;border-top:1px dashed #E2E8F0;margin-top:14px;gap:8px}.remaining-time{color:var(--danger-dark);font-weight:600;display:flex;align-items:center;gap:4px}.remaining-time:before{content:"⏳";font-size:.85rem}.loading,.empty{text-align:center;color:#94a3b8;padding:48px 0;font-size:1.05rem}.empty{color:#94a3b8}.empty:before{content:"🍃 "}.loading{display:flex;flex-direction:column;align-items:center;gap:12px}.loading-more{display:flex;align-items:center;justify-content:center;gap:10px;padding:20px 0;color:var(--gray-dark);font-size:.9rem;animation:fadeIn .3s ease}.spinner{width:22px;height:22px;border:3px solid #E2E8F0;border-top-color:var(--primary);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.load-more-container{text-align:center;padding:8px 0 4px}.load-more-button{background:transparent!important;color:var(--primary-dark)!important;border:2px solid var(--primary)!important;border-radius:var(--radius-md)!important;padding:10px 28px!important;font-size:.9rem!important;font-weight:600!important;cursor:pointer;width:auto!important;min-height:auto!important;transition:all .25s ease!important;overflow:visible!important}.load-more-button:after{display:none}.load-more-button:hover{background:var(--primary-light)!important;transform:translateY(-1px)!important;box-shadow:var(--shadow-sm)!important}.no-more-messages{text-align:center;color:#94a3b8;font-size:.85rem;padding:16px 0 4px}.toast-success{background:linear-gradient(135deg,var(--success) 0%,#38A169 100%);color:#fff;padding:12px 24px;border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);font-weight:500;font-size:.92rem;animation:fadeInUp .35s ease-out;position:fixed;top:20px;left:50%;transform:translate(-50%);z-index:9999;white-space:nowrap}.toast-error{background:linear-gradient(135deg,var(--danger) 0%,#E53E3E 100%);color:#fff;padding:12px 24px;border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);font-weight:500;font-size:.92rem;animation:fadeInUp .35s ease-out;position:fixed;top:20px;left:50%;transform:translate(-50%);z-index:9999;white-space:nowrap}footer{margin-top:32px;text-align:center;color:#94a3b8;font-size:.78rem;padding-top:20px;border-top:2px solid #F1F5F9;letter-spacing:.3px}@media(max-width:640px){body{padding:8px}.container{padding:22px 16px;border-radius:var(--radius-md);margin-top:8px;margin-bottom:24px}h1{font-size:1.6rem}h1:after{width:140px}.notice{font-size:.82rem;padding:12px 14px}.input-area{padding:14px}.post-time{flex-direction:column;align-items:flex-start;gap:6px}.post{padding:18px 16px}textarea{min-height:120px;font-size:.95rem;padding:14px}button{font-size:.95rem;padding:13px 20px}.toast-success,.toast-error{left:12px;right:12px;transform:none;text-align:center;white-space:normal}}@media(prefers-color-scheme:dark){:root{--primary: #7CA9D8;--primary-dark: #5B8ABF;--primary-light: #1E293B;--primary-glow: rgba(124, 169, 216, .18);--gray-light: #334155;--gray: #64748B;--gray-dark: #CBD5E0;--bg: linear-gradient(160deg, #0F172A 0%, #1A2332 30%, #162032 60%, #0F172A 100%);--card-bg: rgba(30, 41, 59, .92);--card-border: rgba(255, 255, 255, .06);--warning-bg: #3D3020;--warning-border: #DD6B20}body{color:#e2e8f0}h1{color:#8bb8e0;text-shadow:none}h1:after{opacity:.8}.notice{color:#fcd34d;background:#3d302099}.notice strong{color:#fbbf24}.notice:before{opacity:.8}.input-area{--input-bg: rgba(15, 23, 42, .6)}.input-area:after{background:var(--input-bg)}.input-area:before{opacity:.5}.input-area:focus-within:before{opacity:.8}textarea{background-color:#0f172ab3;color:#e2e8f0;border-color:#334155}textarea::placeholder{color:#64748b}textarea:focus{background-color:#0f172ae6;border-color:var(--primary);box-shadow:0 0 0 3px #7ca9d833,0 0 20px #7ca9d81a}.post{--post-bg: rgba(30, 41, 59, .85)}.post:after{background:var(--post-bg)}.post-content{color:#e2e8f0}.post-time{border-top-color:#ffffff14}.posts-container{border-top-color:#ffffff0f}footer{border-top-color:#ffffff0f;color:#64748b}.loading,.empty,.no-more-messages{color:#64748b}.spinner{border-color:#334155;border-top-color:var(--primary)}.load-more-button{color:#8bb8e0!important;border-color:#7ca9d866!important}.load-more-button:hover{background:#7ca9d81a!important}button:disabled{background:#334155;color:#64748b}::-webkit-scrollbar-thumb{background:#475569}::-webkit-scrollbar-thumb:hover{background:#64748b}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#94a3b8}