.hexagram-root{background:#fdf6e3;min-height:100vh;position:relative;overflow:hidden}.title-font{font-family:KaiTi,STKaiti,Microsoft YaHei,serif}.hexagram-card{background:linear-gradient(135deg,#fffef9 0%,#fff9f0 100%);border:3px solid #d4a574;position:relative;box-shadow:0 4px 12px #8b00001a}.hexagram-card:before{content:"";background:linear-gradient(90deg,#0000,#d4a574,#0000);width:60%;height:3px;position:absolute;top:-8px;left:50%;transform:translate(-50%)}.group-badge{margin-bottom:-15px;position:relative;top:-20px}.result-box{background:linear-gradient(135deg,#fffef9 0%,#fff5ee 100%);border:2px solid #d4a574}.corner-decoration{pointer-events:none;z-index:0;width:120px;height:120px;position:fixed}.corner-decoration.top-left{border-top:4px solid #d4a574;border-left:4px solid #d4a574;top:0;left:0}.corner-decoration.top-right{border-top:4px solid #d4a574;border-right:4px solid #d4a574;top:0;right:0}.corner-decoration.bottom-left{border-bottom:4px solid #d4a574;border-left:4px solid #d4a574;bottom:0;left:0}.corner-decoration.bottom-right{border-bottom:4px solid #d4a574;border-right:4px solid #d4a574;bottom:0;right:0}.side-decoration{pointer-events:none;z-index:0;width:40px;height:200px;position:fixed;top:50%;transform:translateY(-50%)}.side-decoration.left-side{border-left:3px solid #d4a574;left:20px}.side-decoration.right-side{border-right:3px solid #d4a574;right:20px}@keyframes borderGlow{0%,to{box-shadow:0 0 10px #d4a5744d}50%{box-shadow:0 0 20px #d4a57499}}.hexagram-card:hover{animation:2s ease-in-out infinite borderGlow}.hexagram-input:focus{outline:none;box-shadow:0 0 8px #8b00004d}.hexagram-btn{cursor:pointer;transition:all .3s}.hexagram-btn:active{transform:scale(.98)}.modal-overlay{z-index:1000;background-color:#0009;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal-content{background:linear-gradient(135deg,#fffef9 0%,#fff9f0 100%);border:3px solid #d4a574;border-radius:12px;width:100%;max-width:600px;max-height:80vh;overflow-y:auto;box-shadow:0 10px 30px #8b000033}.modal-header{background:linear-gradient(90deg,#8b0000,#a00000);border-bottom:2px solid #d4a574;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.modal-header h2{color:#fff;margin:0}.modal-close-btn{color:#fff;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:24px;transition:background-color .3s;display:flex}.modal-close-btn:hover{background-color:#fff3}.modal-body{padding:20px}.detail-item{background:linear-gradient(135deg,#fffef9 0%,#fff5ee 100%);border:1px solid #d4a574}.modal-footer{border-top:2px solid #d4a574;justify-content:flex-end;gap:10px;padding:16px 20px;display:flex}