.star-overlay[hidden], .star-overlay [hidden] { display: none !important; }
.star-overlay { position: fixed; inset: 0; z-index: 1200; background: #050b18bd; display: flex; align-items: center; justify-content: center; padding: 16px; }
.star-panel { width: 660px; max-width: 100%; max-height: 86dvh; display: flex; flex-direction: column; overflow: hidden; background: var(--bg-secondary); color: var(--text); border: 1px solid var(--border); border-radius: 22px; padding: 24px; box-sizing: border-box; box-shadow: 0 24px 80px #0008; }
.star-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; flex-shrink: 0; }
.star-content { overflow: auto; min-height: 0; padding: 4px; scrollbar-width: thin; scrollbar-color: var(--text-muted) transparent; }
.star-panel h2 { font-size: 22px; margin: 0; letter-spacing: -.5px; }
.star-panel h3 { font-size: 14px; margin: 0; }
.star-panel button, .star-panel input { font: inherit; color: inherit; background: var(--bg-tertiary); border: 1px solid var(--border); border-radius: 10px; padding: 11px 14px; box-sizing: border-box; }
.star-panel button { cursor: pointer; transition: background .15s, border-color .15s; }
.star-panel button:hover:not(:disabled) { background: #2a3b58; border-color: #8193b6; }
.star-panel button:focus-visible, .star-panel input:focus-visible, .star-panel a:focus-visible, .star-shared:focus-visible { outline: 3px solid #b6baff; outline-offset: 3px; }
.star-panel button:disabled { opacity: .55; cursor: wait; }
.star-panel .star-primary { background: var(--primary); border-color: var(--accent-text); color: var(--text); font-weight: 700; }
.star-panel .star-primary:hover:not(:disabled) { background: #7578fa; }
.star-query { display: flex; gap: 10px; padding: 8px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg); }
.star-query input { flex: 1; min-width: 0; border: 0; background: transparent; font-size: 16px; padding: 10px; }
.star-query input::placeholder { color: var(--text-muted); }
.star-tabs { display: flex; gap: 5px; padding: 5px; border-radius: 12px; margin: 16px 0 10px; background: var(--bg); }
.star-tabs button { flex: 1; border-color: transparent; background: transparent; font-size: 14px; padding: 10px 6px; color: var(--text-muted); }
.star-tabs [aria-pressed=true] { background: var(--bg-tertiary); border-color: var(--border); color: var(--text); font-weight: 700; }
.star-panel .star-tabs button:hover:not(:disabled) { background: #19243c; border-color: transparent; }
.star-panel .star-tabs button[aria-pressed=true] { background: #3c4773; border-color: #8e99d8; color: var(--text); }
.star-status, .star-shopping-note { font-size: 13px; line-height: 1.6; color: var(--text-muted); overflow-wrap: anywhere; margin: 12px 0 18px; }
.star-status:empty { display: none; }
.star-status[data-state=error] { padding: 12px 14px; color: #ffd4d4; background: #422431; border: 1px solid #895060; border-radius: 10px; }
.star-section-heading { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 10px; }
.star-result-count { color: var(--text-muted); font-size: 12px; }
.star-results { display: flex; flex-direction: column; gap: 10px; }
.star-panel .star-result { width: 100%; padding: 15px; text-align: left; border: 1px solid var(--border); background: var(--bg-secondary); border-radius: 14px; }
.star-panel button.star-result.is-selected { background: var(--bg-tertiary); border: 2px solid #a5a8ff; padding: 14px; }
.star-card { display: flex; gap: 14px; min-width: 0; overflow-wrap: anywhere; }
.star-card-media { position: relative; width: 76px; height: 76px; flex-shrink: 0; border-radius: 12px; overflow: hidden; background: var(--bg-tertiary); display: flex; align-items: center; justify-content: center; }
.star-card-symbol { font-size: 30px; font-weight: 600; color: var(--accent-text); }
.star-card-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: var(--bg); }
.star-card-info { min-width: 0; flex: 1; }
.star-card-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.star-kind { font-size: 11px; line-height: 1.4; color: var(--text); background: var(--bg-tertiary); padding: 3px 7px; border-radius: 5px; font-weight: 600; }
.star-source { font-size: 11px; color: var(--text-muted); }
.star-card-title { display: block; margin: 8px 0 6px; font-size: 16px; line-height: 1.5; color: var(--text); word-break: keep-all; overflow-wrap: anywhere; }
.star-card-description { margin: 0 0 9px; font-size: 13px; line-height: 1.65; color: var(--text-muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.star-domain { display: block; font-size: 11px; line-height: 1.5; color: var(--text-muted); }
.star-result-choice { display: block; margin-top: 10px; text-align: right; font-size: 12px; color: var(--accent-text); font-weight: 600; }
.star-results[data-category=image] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.star-results[data-category=image] .star-card { flex-direction: column; gap: 12px; }
.star-results[data-category=image] .star-card-media { width: 100%; height: 150px; }
.star-results[data-category=image] .star-card-title { font-size: 14px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.star-panel .star-more { display: block; width: 100%; margin-top: 12px; background: transparent; color: var(--accent-text); }
.star-preview:not(:empty) { margin-top: 20px; padding: 16px; background: var(--bg); border: 1px solid var(--border); border-radius: 16px; }
.star-preview-card { display: flex; justify-content: center; }
.star-preview-controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; }
.star-preview-controls a, .star-shop a { color: var(--accent-text); font-size: 13px; text-underline-offset: 3px; }
.star-shop { padding: 16px; border: 1px solid var(--border); border-radius: 14px; background: var(--bg-secondary); }
.star-shop p { margin: 0 0 12px; font-size: 13px; line-height: 1.65; color: var(--text-muted); }
.star-shop a { display: inline-block; margin-bottom: 12px; }
.star-shop input { display: block; width: 100%; margin-bottom: 10px; background: var(--bg-secondary); }
.star-shared { display: block; width: 320px; max-width: 100%; box-sizing: border-box; color: var(--text); text-decoration: none; border: 1px solid var(--border); border-radius: 14px; overflow: hidden; background: var(--bg-secondary); }
.star-shared-heading { padding: 10px 14px; background: var(--bg-tertiary); color: var(--text); font-size: 11px; font-weight: 700; border-bottom: 1px solid var(--border); }
.star-shared .star-card { padding: 14px; gap: 12px; }
.star-shared .star-card-media { width: 54px; height: 54px; border-radius: 9px; }
.star-shared .star-card-symbol { font-size: 24px; }
.star-shared .star-card-title { font-size: 15px; margin-top: 8px; }
.star-shared .star-card-description { font-size: 12px; }
.star-shared[data-category=image] .star-card { flex-direction: column; padding: 0; gap: 0; }
.star-shared[data-category=image] .star-card-media { width: 100%; height: 260px; border-radius: 0; }
.star-image-query { display: block; padding: 10px 14px; font-size: 12px; line-height: 1.5; color: var(--text-muted); }
.star-shared-action { padding: 11px 14px; display: flex; justify-content: space-between; gap: 8px; background: var(--bg-tertiary); border-top: 1px solid var(--border); color: var(--text); font-size: 12px; font-weight: 600; }
.star-shared:hover { border-color: #a5a8ff; }
@media (max-width: 480px) { .star-overlay { padding: 10px; } .star-panel { padding: 16px; border-radius: 18px; } .star-card { gap: 10px; } .star-card-media { width: 56px; height: 56px; } .star-card-title { font-size: 15px; } .star-panel .star-result { padding: 12px; } .star-panel .star-result.is-selected { padding: 11px; } .star-results[data-category=image] .star-card-media { height: 110px; } .star-preview:not(:empty) { padding: 12px; } }