.random-palette-generator{max-width:1180px!important;margin:20px auto!important;padding:25px!important;background:#f5f5f0!important;border:2px solid #333!important;font-family:'Noto Sans KR','Malgun Gothic',sans-serif!important;color:#222!important;box-shadow:8px 8px 0 rgba(0,0,0,.15)!important;box-sizing:border-box!important}.palette-generator-header{text-align:center!important;margin-bottom:25px!important;padding-bottom:18px!important;border-bottom:3px double #333!important}.palette-generator-header h2{margin:0 0 10px 0!important;font-size:28px!important;font-weight:700!important;color:#2c3e50!important;text-shadow:2px 2px 0 rgba(255,255,255,.5)!important;line-height:1.2!important}.header-subtitle{margin:0!important;font-size:14px!important;color:#666!important;line-height:1.4!important}.generator-controls{display:flex!important;flex-wrap:wrap!important;gap:12px!important;margin-bottom:25px!important;padding:18px!important;background:#fff!important;border:1px solid #333!important;box-shadow:4px 4px 0 rgba(0,0,0,.1)!important;align-items:center!important;justify-content:center!important}.control-group{display:flex!important;align-items:center!important;gap:10px!important}.control-label{display:flex!important;align-items:center!important;gap:6px!important;font-size:13px!important;font-weight:600!important;color:#555!important;margin:0!important}.control-icon{width:18px!important;height:18px!important;color:#9b59b6!important}.count-select{padding:8px 12px!important;border:1px solid #333!important;background:#fff!important;font-size:14px!important;font-weight:600!important;color:#222!important;cursor:pointer!important;min-width:80px!important}.count-select:focus{outline:none!important;background:#fffacd!important;border-color:#9b59b6!important}.input-row{display:flex!important;gap:8px!important}.select-input{flex-shrink:0!important;width:auto!important;min-width:90px!important}.btn-generate{display:flex!important;align-items:center!important;gap:8px!important;padding:10px 20px!important;background:#9b59b6!important;border:2px solid #333!important;color:#fff!important;font-size:15px!important;font-weight:700!important;cursor:pointer!important;box-shadow:4px 4px 0 rgba(0,0,0,.2)!important;transition:all 0.1s!important;white-space:nowrap!important}.btn-generate:hover{background:#8e44ad!important;transform:translate(1px,1px)!important;box-shadow:3px 3px 0 rgba(0,0,0,.2)!important}.btn-generate:active{transform:translate(4px,4px)!important;box-shadow:none!important}.btn-icon{width:18px!important;height:18px!important;flex-shrink:0!important}.action-buttons{display:flex!important;gap:10px!important}.btn-action{display:flex!important;align-items:center!important;gap:6px!important;padding:8px 14px!important;background:#fff!important;border:1px solid #333!important;color:#333!important;font-size:13px!important;font-weight:600!important;cursor:pointer!important;box-shadow:3px 3px 0 rgba(0,0,0,.2)!important;transition:all 0.1s!important;white-space:nowrap!important}.btn-action:hover{background:#f9f9f9!important;transform:translate(1px,1px)!important;box-shadow:2px 2px 0 rgba(0,0,0,.2)!important}.btn-action:active{transform:translate(3px,3px)!important;box-shadow:none!important}.palette-display{min-height:280px!important;margin-bottom:20px!important;padding:20px!important;background:#fff!important;border:1px solid #333!important;box-shadow:4px 4px 0 rgba(0,0,0,.1)!important}.empty-state{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;min-height:240px!important;text-align:center!important;color:#999!important}.empty-icon{width:64px!important;height:64px!important;margin-bottom:15px!important;opacity:0.3!important}.empty-state p{margin:0!important;font-size:14px!important;line-height:1.6!important}.palette-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))!important;gap:15px!important}.color-card{position:relative!important;border:2px solid #333!important;cursor:pointer!important;transition:all 0.2s!important;overflow:hidden!important;box-shadow:3px 3px 0 rgba(0,0,0,.15)!important}.color-card:hover{transform:translateY(-3px)!important;box-shadow:5px 5px 0 rgba(0,0,0,.2)!important}.color-card:active{transform:translateY(0)!important;box-shadow:2px 2px 0 rgba(0,0,0,.15)!important}.color-preview{width:100%!important;height:140px!important;position:relative!important}.color-preview::after{content:'클릭하여 복사'!important;position:absolute!important;top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;background:rgba(0,0,0,.7)!important;color:#fff!important;padding:6px 12px!important;border-radius:4px!important;font-size:12px!important;font-weight:600!important;opacity:0!important;transition:opacity 0.2s!important;pointer-events:none!important;white-space:nowrap!important}.color-card:hover .color-preview::after{opacity:1!important}.color-info{padding:12px!important;background:#fff!important;border-top:2px solid #333!important}.color-hex{font-size:16px!important;font-weight:700!important;color:#222!important;margin:0 0 6px 0!important;font-family:'Courier New',monospace!important;text-align:center!important}.color-rgb{font-size:11px!important;color:#666!important;margin:0!important;text-align:center!important;font-family:'Courier New',monospace!important}.history-section{margin-bottom:20px!important;padding:15px!important;background:#fff!important;border:1px solid #333!important;box-shadow:4px 4px 0 rgba(0,0,0,.1)!important}.history-header{display:flex!important;align-items:center!important;justify-content:space-between!important;margin-bottom:12px!important;padding-bottom:10px!important;border-bottom:2px solid #f0f0f0!important}.history-title{display:flex!important;align-items:center!important;gap:6px!important;margin:0!important;font-size:14px!important;font-weight:700!important;color:#2c3e50!important}.history-icon{width:16px!important;height:16px!important;color:#9b59b6!important}.history-count{font-size:12px!important;color:#999!important;font-weight:500!important}.btn-clear-history{display:flex!important;align-items:center!important;gap:4px!important;padding:4px 10px!important;background:#fff!important;border:1px solid #ddd!important;color:#666!important;font-size:11px!important;font-weight:600!important;cursor:pointer!important;transition:all 0.1s!important;border-radius:3px!important}.btn-clear-history:hover{background:#fee!important;border-color:#e74c3c!important;color:#e74c3c!important}.clear-icon{width:12px!important;height:12px!important}.history-grid{display:flex!important;flex-wrap:wrap!important;gap:8px!important;max-height:200px!important;overflow-y:auto!important;padding:5px!important}.history-grid::-webkit-scrollbar{width:6px!important;height:6px!important}.history-grid::-webkit-scrollbar-track{background:#f0f0f0!important;border-radius:3px!important}.history-grid::-webkit-scrollbar-thumb{background:#ccc!important;border-radius:3px!important}.history-grid::-webkit-scrollbar-thumb:hover{background:#999!important}.history-empty{width:100%!important;padding:20px!important;text-align:center!important;color:#999!important;font-size:12px!important}.history-item{display:flex!important;gap:3px!important;padding:8px!important;background:#fafafa!important;border:1px solid #ddd!important;border-radius:6px!important;cursor:pointer!important;transition:all 0.15s!important;box-shadow:2px 2px 0 rgba(0,0,0,.05)!important}.history-item:hover{transform:translateY(-2px)!important;box-shadow:3px 3px 0 rgba(0,0,0,.1)!important;border-color:#9b59b6!important}.history-item:active{transform:translateY(0)!important;box-shadow:1px 1px 0 rgba(0,0,0,.05)!important}.history-color{width:22px!important;height:22px!important;border:1px solid #333!important;border-radius:3px!important;flex-shrink:0!important}.usage-tips{padding:18px!important;background:#fff!important;border:1px solid #333!important;box-shadow:4px 4px 0 rgba(0,0,0,.1)!important}.tips-title{margin:0 0 12px 0!important;font-size:16px!important;font-weight:700!important;color:#2c3e50!important;padding-bottom:10px!important;border-bottom:2px solid #f0f0f0!important}.tips-list{margin:0!important;padding-left:20px!important;list-style:none!important}.tips-list li{position:relative!important;margin-bottom:8px!important;font-size:13px!important;line-height:1.6!important;color:#444!important;padding-left:12px!important}.tips-list li::before{content:'▸'!important;position:absolute!important;left:0!important;color:#9b59b6!important;font-weight:700!important}.tips-list li:last-child{margin-bottom:0!important}.tips-list strong{color:#222!important;font-weight:700!important}.toast-notification{position:fixed!important;bottom:30px!important;left:50%!important;transform:translateX(-50%) translateY(100px)!important;background:#333!important;color:#fff!important;padding:12px 24px!important;border-radius:6px!important;font-size:14px!important;font-weight:600!important;box-shadow:0 4px 12px rgba(0,0,0,.3)!important;opacity:0!important;transition:all 0.3s ease!important;z-index:9999!important;pointer-events:none!important;white-space:nowrap!important}.toast-notification.show{opacity:1!important;transform:translateX(-50%) translateY(0)!important}@media (max-width:768px){.random-palette-generator{padding:15px 10px!important;margin:10px!important}.palette-generator-header h2{font-size:22px!important}.header-subtitle{font-size:13px!important}.generator-controls{flex-direction:column!important;padding:15px 10px!important;gap:10px!important}.control-group{width:100%!important;justify-content:space-between!important}.count-select{flex:1!important;max-width:150px!important}.btn-generate{width:100%!important;justify-content:center!important;font-size:14px!important;padding:12px 16px!important}.action-buttons{width:100%!important;flex-direction:column!important}.btn-action{width:100%!important;justify-content:center!important}.palette-display{padding:15px 10px!important;min-height:240px!important}.palette-grid{grid-template-columns:1fr!important;gap:12px!important}.color-preview{height:120px!important}.history-section{padding:12px 10px!important}.history-header{flex-direction:column!important;gap:8px!important;align-items:flex-start!important}.btn-clear-history{align-self:flex-end!important}.history-grid{max-height:150px!important}.history-color{width:20px!important;height:20px!important}.usage-tips{padding:15px 10px!important}.tips-list{padding-left:15px!important}.tips-list li{font-size:12px!important}}@media (min-width:769px) and (max-width:1024px){.palette-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))!important}}