@import"https://fonts.googleapis.com/css2?family=Ma+Shan+Zheng&family=Noto+Serif+SC:wght@400;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:"Noto Serif SC",Georgia,serif;min-height:100vh;background-color:#e8d5b7;background-image:radial-gradient(ellipse at 20% 50%,rgba(139,90,43,.08) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(139,90,43,.06) 0%,transparent 50%),radial-gradient(ellipse at 50% 80%,rgba(160,120,60,.05) 0%,transparent 50%);position:relative}body:before{content:"福禄寿喜德仁義禮智信忠孝廉恥勇和平安樂善美福禄寿喜德仁義禮智信忠孝廉恥勇和平安樂善美福禄寿喜德仁義禮智信忠孝廉恥勇和平安樂善美";position:fixed;top:0;left:0;width:100%;height:100%;font-family:Ma Shan Zheng,cursive;font-size:4.5rem;line-height:1.6;color:#8b5a2b0f;word-break:break-all;letter-spacing:1.2rem;pointer-events:none;z-index:0;overflow:hidden;padding:2rem}body:after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;box-shadow:inset 0 0 120px #65432140,inset 0 0 60px #6543211a}.app{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:2rem}.title{text-align:center;margin-bottom:2rem;color:#8b1a1a;font-family:Ma Shan Zheng,cursive;font-size:3.5rem;letter-spacing:.3rem;text-shadow:2px 2px 4px rgba(0,0,0,.15);position:relative}.title:after{content:"〜 龍 〜";display:block;font-size:1.2rem;color:#8b1a1a66;margin-top:.3rem;letter-spacing:.5rem}.featured-image{display:flex;flex-direction:column;align-items:center;margin-bottom:2rem;background:linear-gradient(145deg,#f5e6cc,#ecdaba);border-radius:4px;overflow:hidden;border:3px solid #8b1a1a;box-shadow:0 4px 16px #65432140,inset 0 0 30px #8b5a2b14;cursor:pointer;transition:transform .2s,box-shadow .2s;position:relative}.featured-image:before{content:"";position:absolute;top:4px;left:4px;right:4px;bottom:4px;border:1px solid rgba(139,26,26,.2);pointer-events:none;z-index:1}.featured-image:hover{transform:translateY(-4px);box-shadow:0 8px 24px #6543214d,0 0 20px #8b1a1a1a}.featured-image img{max-width:100%;max-height:500px;object-fit:contain;display:block}.featured-caption{padding:1rem;text-align:center;color:#5c3317;font-size:1.2rem;font-weight:700;font-family:"Noto Serif SC",serif}.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}.image-card{background:linear-gradient(145deg,#f5e6cc,#ecdaba);border-radius:4px;overflow:hidden;border:2px solid #a0522d;box-shadow:0 2px 8px #65432133,inset 0 0 20px #8b5a2b0f;transition:transform .2s,box-shadow .2s;cursor:pointer;position:relative}.image-card:before{content:"";position:absolute;top:3px;left:3px;right:3px;bottom:3px;border:1px solid rgba(160,82,45,.15);pointer-events:none;z-index:1}.image-card:hover{transform:translateY(-4px);box-shadow:0 4px 16px #6543214d,0 0 12px #8b1a1a14}.image-card img{width:100%;height:200px;object-fit:cover;display:block}.image-card .caption{padding:1rem;text-align:center;color:#5c3317;font-size:.9rem;font-family:"Noto Serif SC",serif}.lightbox{position:fixed;top:0;left:0;width:100%;height:100%;background:#140a05eb;display:flex;align-items:center;justify-content:center;z-index:1000;padding:2rem}.lightbox-content{position:relative;max-width:90vw;max-height:90vh}.lightbox-content img{max-width:100%;max-height:85vh;object-fit:contain;border-radius:4px;border:3px solid #8b1a1a;box-shadow:0 0 40px #8b1a1a4d}.lightbox-close{position:absolute;top:-40px;right:0;background:none;border:none;color:#e8d5b7;font-size:2.5rem;cursor:pointer;line-height:1}.lightbox-close:hover{color:#c9a96e}.lightbox-caption{text-align:center;color:#e8d5b7;padding:1rem;font-size:1.1rem;font-family:"Noto Serif SC",serif}.audio-controls{position:fixed;right:16px;top:16px;display:flex;align-items:center;gap:10px;background:linear-gradient(145deg,#f5e6cc,#ecdaba);border:2px solid #8b1a1a;border-radius:4px;box-shadow:0 4px 16px #65432133,inset 0 0 15px #8b5a2b0f;padding:10px 14px;z-index:1100}.audio-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid #8b1a1a;background:#8b1a1a;color:#f5e6cc;border-radius:4px;padding:8px 12px;cursor:pointer;font-family:"Noto Serif SC",serif;font-size:.85rem;transition:background .2s}.audio-button:hover{background:brown}.volume-label{font-size:.85rem;color:#5c3317;font-family:"Noto Serif SC",serif}.volume-slider{width:140px;accent-color:#8b1a1a}.chat-widget{position:fixed;bottom:20px;right:20px;z-index:1200;font-family:"Noto Serif SC",serif}.chat-toggle{position:absolute;bottom:0;right:0;width:52px;height:52px;border-radius:50%;border:2px solid #8b1a1a;background:linear-gradient(145deg,#8b1a1a,brown);color:#f5e6cc;font-size:1.4rem;cursor:pointer;box-shadow:0 4px 16px #65432159;display:flex;align-items:center;justify-content:center;transition:transform .2s,box-shadow .2s;z-index:10}.chat-toggle:hover{transform:scale(1.08);box-shadow:0 6px 20px #65432173}.chat-badge{position:absolute;top:-4px;right:-4px;background:#c9a96e;color:#3a1a00;font-size:.7rem;font-weight:700;min-width:18px;height:18px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 4px}.chat-open .chat-toggle{bottom:auto;top:-16px;right:-16px;width:36px;height:36px;font-size:1rem}.chat-panel{width:340px;height:460px;background:linear-gradient(170deg,#f5e6cc,#e8d5b7);border:2px solid #8b1a1a;border-radius:8px;box-shadow:0 8px 32px #65432159,inset 0 0 30px #8b5a2b0f;display:flex;flex-direction:column;overflow:hidden;position:relative}.chat-panel:before{content:"";position:absolute;top:3px;left:3px;right:3px;bottom:3px;border:1px solid rgba(139,26,26,.12);pointer-events:none;z-index:1;border-radius:6px}.chat-header{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:linear-gradient(135deg,#8b1a1a,brown);color:#f5e6cc}.chat-title{font-family:Ma Shan Zheng,cursive;font-size:1.3rem;letter-spacing:.15rem}.chat-status{font-size:.72rem;opacity:.85}.chat-connected:before{content:"●";color:#7ec87e;margin-right:4px}.chat-disconnected:before{content:"●";color:#e87c7c;margin-right:4px}.chat-name-bar{padding:6px 12px;background:#8b5a2b0f;border-bottom:1px solid rgba(139,26,26,.1)}.chat-name-display{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;color:#5c3317;font-family:"Noto Serif SC",serif;font-size:.8rem;cursor:pointer;padding:2px 6px;border-radius:4px;transition:background .2s}.chat-name-display:hover{background:#8b5a2b1a}.chat-name-form{display:flex;gap:6px}.chat-name-input{flex:1;border:1px solid #a0522d;background:#fdf6ec;border-radius:4px;padding:3px 8px;font-family:"Noto Serif SC",serif;font-size:.8rem;color:#3a1a00;outline:none}.chat-name-input:focus{border-color:#8b1a1a}.chat-name-save{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid #8b1a1a;background:#8b1a1a;color:#f5e6cc;border-radius:4px;padding:2px 8px;cursor:pointer;font-size:.85rem}.chat-messages{flex:1;overflow-y:auto;padding:10px 12px;display:flex;flex-direction:column;gap:6px}.chat-messages::-webkit-scrollbar{width:6px}.chat-messages::-webkit-scrollbar-track{background:transparent}.chat-messages::-webkit-scrollbar-thumb{background:#8b5a2b33;border-radius:3px}.chat-empty{text-align:center;color:#5c331780;font-size:.85rem;margin-top:2rem;font-style:italic}.chat-msg{display:flex;flex-direction:column;align-items:flex-start;max-width:85%}.chat-msg-self{align-self:flex-end;align-items:flex-end}.chat-msg-name{font-size:.68rem;color:#8b1a1a;font-weight:700;margin-bottom:1px;padding:0 4px}.chat-msg-text{background:#fdf6ec;border:1px solid rgba(160,82,45,.2);border-radius:10px 10px 10px 2px;padding:6px 10px;font-size:.85rem;color:#3a1a00;word-break:break-word;line-height:1.4;box-shadow:0 1px 3px #65432114}.chat-msg-self .chat-msg-text{background:linear-gradient(135deg,#8b1a1a,brown);color:#f5e6cc;border-color:#8b1a1a4d;border-radius:10px 10px 2px}.chat-msg-time{font-size:.6rem;color:#5c331766;margin-top:1px;padding:0 4px}.chat-input-bar{display:flex;gap:6px;padding:10px 12px;border-top:1px solid rgba(139,26,26,.12);background:#8b5a2b0a}.chat-input{flex:1;border:1px solid #a0522d;background:#fdf6ec;border-radius:6px;padding:8px 10px;font-family:"Noto Serif SC",serif;font-size:.85rem;color:#3a1a00;outline:none;transition:border-color .2s}.chat-input:focus{border-color:#8b1a1a}.chat-input::placeholder{color:#5c331759}.chat-send{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid #8b1a1a;background:linear-gradient(135deg,#8b1a1a,brown);color:#f5e6cc;border-radius:6px;padding:8px 14px;cursor:pointer;font-family:Ma Shan Zheng,cursive;font-size:1rem;letter-spacing:.1rem;transition:opacity .2s}.chat-send:hover:not(:disabled){opacity:.9}.chat-send:disabled{opacity:.5;cursor:not-allowed}@media (max-width: 480px){.chat-panel{width:calc(100vw - 40px);height:400px}}