.plrnly-app {
  --plrnly-color-bg: #0b0f14 !important;
  --plrnly-color-surface: #141a25 !important;
  --plrnly-color-border: #222733 !important;
  --plrnly-color-primary: #1ed760 !important;
  --plrnly-color-text-main: #ffffff !important;
  --plrnly-color-text-secondary: #cfd6dd !important;
  --plrnly-color-text-muted: #8b95a1 !important;
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  min-height: 100vh !important;
  margin: 0 !important;
  background: var(--plrnly-color-bg) !important;
  color: var(--plrnly-color-text-secondary) !important;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", "Noto Sans KR", "Apple SD Gothic Neo", sans-serif !important;
  font-size: 16px !important;
  line-height: 1.5 !important;
}

.plrnly-app *,
.plrnly-app *::before,
.plrnly-app *::after {
  box-sizing: border-box !important;
}

.plrnly-app h1,
.plrnly-app h2,
.plrnly-app h3,
.plrnly-app h4,
.plrnly-app p {
  margin: 0 !important;
}

.plrnly-app h1 {
  font-size: 24px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}

.plrnly-app h2 {
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}

.plrnly-app h3 {
  font-size: 18px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}

.plrnly-app button,
.plrnly-app input,
.plrnly-app select {
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  font-family: inherit !important;
}

.plrnly-app input {
  font-weight: 400 !important;
}

.plrnly-page-container {
  max-width: 1600px !important;
  margin: 0 auto !important;
  padding: 3rem 0 !important;
}

.plrnly-hero-section {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 1rem !important;
  padding: 64px !important;
  margin-bottom: 2rem !important;
  background: linear-gradient(135deg, #0b0f14 0%, #141a25 50%, #0b0f14 100%) !important;
}

.plrnly-hero-glow {
  position: absolute !important;
  inset: 0 !important;
  opacity: 0.1 !important;
  background: radial-gradient(circle at 30% 50%, #1ed760 0%, transparent 70%) !important;
}

.plrnly-hero-content {
  position: relative !important;
  z-index: 1 !important;
  max-width: 768px !important;
}

.plrnly-hero-content h1 {
  margin-bottom: 16px !important;
  color: var(--plrnly-color-text-main) !important;
}

.plrnly-hero-subtitle-primary {
  margin-bottom: 12px !important;
  color: var(--plrnly-color-text-secondary) !important;
}

.plrnly-hero-subtitle-secondary {
  margin-bottom: 20px !important;
  color: var(--plrnly-color-text-muted) !important;
}

.plrnly-hero-actions {
  display: flex !important;
  align-items: center !important;
  gap: 1rem !important;
}

.plrnly-hero-btn {
  border: 0 !important;
  border-radius: 0.75rem !important;
  height: 48px !important;
  padding: 0 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
}

.plrnly-hero-btn-primary {
  background: var(--plrnly-color-primary) !important;
  color: var(--plrnly-color-bg) !important;
}

.plrnly-hero-btn-primary:hover {
  transform: scale(1.05) !important;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1) !important;
}

.plrnly-hero-btn-secondary {
  background: var(--plrnly-color-surface) !important;
  color: var(--plrnly-color-text-secondary) !important;
  border: 1px solid var(--plrnly-color-border) !important;
}

.plrnly-hero-btn-secondary:hover {
  transform: scale(1.05) !important;
}

.plrnly-featured-section {
  margin-bottom: 2rem !important;
}

.plrnly-featured-section h2 {
  margin-bottom: 1.5rem !important;
  color: var(--plrnly-color-text-main) !important;
}

.plrnly-featured-track {
  display: flex !important;
  gap: 1rem !important;
  overflow-x: auto !important;
  padding-bottom: 1rem !important;
  scrollbar-width: thin !important;
  scrollbar-color: #222733 #141a25 !important;
}

.plrnly-featured-track::-webkit-scrollbar {
  height: 8px !important;
}

.plrnly-featured-track::-webkit-scrollbar-track {
  background: #141a25 !important;
}

.plrnly-featured-track::-webkit-scrollbar-thumb {
  background: #222733 !important;
  border-radius: 999px !important;
}

.plrnly-featured-card {
  flex-shrink: 0 !important;
  width: 20rem !important;
  border-radius: 1rem !important;
  padding: 1.5rem !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  background: var(--plrnly-color-surface) !important;
  border: 1px solid var(--plrnly-color-border) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}

.plrnly-featured-card:hover {
  transform: scale(1.05) !important;
  box-shadow: 0 8px 24px rgba(30, 215, 96, 0.2) !important;
}

.plrnly-featured-icon-box {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 4rem !important;
  height: 4rem !important;
  border-radius: 0.75rem !important;
  margin-bottom: 1rem !important;
  background: rgba(30, 215, 96, 0.1) !important;
}

.plrnly-featured-icon {
  color: var(--plrnly-color-primary) !important;
  width: 32px !important;
  height: 32px !important;
}

.plrnly-featured-title {
  margin-bottom: 0.5rem !important;
  color: var(--plrnly-color-text-main) !important;
}

.plrnly-featured-description {
  margin-bottom: 1rem !important;
  color: var(--plrnly-color-text-muted) !important;
  font-size: 14px !important;
}

.plrnly-featured-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.5rem !important;
  margin-bottom: 1rem !important;
}

.plrnly-tag-pill {
  padding: 0.25rem 0.75rem !important;
  border-radius: 0.5rem !important;
  background: var(--plrnly-color-border) !important;
  color: var(--plrnly-color-text-secondary) !important;
  font-size: 12px !important;
}

.plrnly-featured-download-btn {
  width: 100% !important;
  border: 0 !important;
  border-radius: 0.5rem !important;
  padding: 0.5rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  background: var(--plrnly-color-primary) !important;
  color: var(--plrnly-color-bg) !important;
}

.plrnly-featured-download-btn:hover {
  filter: brightness(1.1) !important;
}

.plrnly-content-grid {
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  gap: 2rem !important;
}

.plrnly-main-column,
.plrnly-sidebar-column {
  grid-column: span 12 / span 12 !important;
  min-width: 0 !important;
}

.plrnly-filter-search {
  border-radius: 0.75rem !important;
  padding: 1.5rem !important;
  margin-bottom: 2rem !important;
  background: var(--plrnly-color-surface) !important;
  border: 1px solid var(--plrnly-color-border) !important;
  overflow: hidden !important;
}

.plrnly-filter-search-row {
  display: flex !important;
  flex-wrap: wrap !important;
  min-width: 0 !important;
  align-items: center !important;
  gap: 1rem !important;
}

.plrnly-search-wrap {
  flex: 1 1 auto !important;
  min-width: 300px !important;
  max-width: none !important;
}

.plrnly-search-input-container {
  position: relative !important;
}

.plrnly-icon-search {
  position: absolute !important;
  left: 1rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: var(--plrnly-color-text-muted) !important;
  width: 20px !important;
  height: 20px !important;
}

.plrnly-search-input {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  border-radius: 0.5rem !important;
  border: 1px solid var(--plrnly-color-border) !important;
  outline: none !important;
  transition: all 0.3s ease !important;
  height: 48px !important;
  padding: 0 1rem 0 3rem !important;
  line-height: 1.5 !important;
  background: var(--plrnly-color-bg) !important;
  color: var(--plrnly-color-text-secondary) !important;
}

.plrnly-search-input::placeholder {
  color: var(--plrnly-color-text-muted) !important;
}

.plrnly-search-input:focus {
  border-color: var(--plrnly-color-primary) !important;
  box-shadow: 0 0 0 2px rgba(30, 215, 96, 0.2) !important;
}

.plrnly-select-group {
  display: flex !important;
  flex-wrap: wrap !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
  align-items: center !important;
  gap: 0.75rem !important;
}

.plrnly-filter-select {
  display: inline-block !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 48px !important;
  white-space: nowrap !important;
  line-height: 1.5 !important;
  vertical-align: middle !important;
  border-radius: 0.5rem !important;
  border: 1px solid var(--plrnly-color-border) !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  padding: 0 1rem !important;
  background: var(--plrnly-color-bg) !important;
  color: var(--plrnly-color-text-secondary) !important;
}

.plrnly-filter-select:focus {
  outline: none !important;
  border-color: var(--plrnly-color-primary) !important;
}

.plrnly-filter-select-no-arrow {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  padding-right: 2.5rem !important;
  background-image: none !important;
}

.plrnly-filter-select[data-plrnly-filter-category] {
  min-width: 168px !important;
}

.plrnly-filter-select[data-plrnly-filter-difficulty] {
  min-width: 128px !important;
}

.plrnly-filter-select[data-plrnly-filter-filetype] {
  min-width: 110px !important;
}

.plrnly-filter-select[data-plrnly-filter-sort] {
  min-width: 104px !important;
}

.plrnly-upload-open-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  height: 48px !important;
  border: 0 !important;
  border-radius: 0.5rem !important;
  padding: 0 1rem !important;
  cursor: pointer !important;
  transition: transform 0.2s ease, filter 0.2s ease !important;
  background: var(--plrnly-color-primary) !important;
  color: var(--plrnly-color-bg) !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.plrnly-upload-open-btn:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.06) !important;
}

.plrnly-upload-mobile-wrap {
  display: none !important;
  width: 100% !important;
}

.plrnly-resource-board {
  border-radius: 0.75rem !important;
  overflow: hidden !important;
  margin-bottom: 2rem !important;
  background: var(--plrnly-color-surface) !important;
  border: 1px solid var(--plrnly-color-border) !important;
}

.plrnly-resource-header-row,
.plrnly-resource-row {
  display: grid !important;
  grid-template-columns: 64px minmax(250px, 2fr) 92px 84px 78px 90px 110px 108px !important;
  gap: 0.75rem !important;
  align-items: center !important;
}

.plrnly-resource-header-row {
  padding: 1rem 1.5rem !important;
  background: var(--plrnly-color-bg) !important;
  border-bottom: 2px solid var(--plrnly-color-border) !important;
}

.plrnly-resource-header-row > * {
  color: var(--plrnly-color-text-muted) !important;
}

.plrnly-resource-row {
  position: relative !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  border-bottom: 1px solid var(--plrnly-color-border) !important;
  border-left: 3px solid transparent !important;
  padding: 1rem 1.5rem !important;
}

.plrnly-resource-row:hover {
  background: var(--plrnly-color-surface) !important;
  border-left-color: var(--plrnly-color-primary) !important;
  transform: translateY(-2px) !important;
}

.plrnly-resource-col-center {
  text-align: center !important;
}

.plrnly-resource-col-1 {
  grid-column: auto !important;
}

.plrnly-resource-col-2 {
  grid-column: auto !important;
}

.plrnly-resource-col-4 {
  grid-column: auto !important;
}

.plrnly-resource-col-title {
  min-width: 0 !important;
}

.plrnly-resource-col-number,
.plrnly-resource-col-type,
.plrnly-resource-col-download,
.plrnly-resource-col-date {
  text-align: center !important;
  white-space: nowrap !important;
}

.plrnly-resource-col-action {
  min-width: 108px !important;
}

.plrnly-resource-number {
  text-align: center !important;
  color: var(--plrnly-color-text-muted) !important;
}

.plrnly-resource-title-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
}

.plrnly-resource-file-icon-box {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 2.5rem !important;
  height: 2.5rem !important;
  border-radius: 0.5rem !important;
  background: var(--plrnly-color-border) !important;
  flex-shrink: 0 !important;
}

.plrnly-resource-file-icon {
  width: 20px !important;
  height: 20px !important;
  color: var(--plrnly-color-primary) !important;
}

.plrnly-resource-title-content {
  flex: 1 !important;
  min-width: 0 !important;
}

.plrnly-resource-title-line {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
}

.plrnly-resource-title-text {
  color: var(--plrnly-color-text-main) !important;
}

.plrnly-badge-new {
  padding: 0.125rem 0.5rem !important;
  border-radius: 0.25rem !important;
  font-size: 12px !important;
  line-height: 1 !important;
  background: var(--plrnly-color-primary) !important;
  color: var(--plrnly-color-bg) !important;
}

.plrnly-icon-flame {
  width: 16px !important;
  height: 16px !important;
  color: #ef4444 !important;
}

.plrnly-resource-file-size {
  margin-top: 0.25rem !important;
  color: var(--plrnly-color-text-muted) !important;
  font-size: 12px !important;
}

.plrnly-category-badge {
  display: inline-block !important;
  border-radius: 0.5rem !important;
  padding: 0.25rem 0.75rem !important;
  background: var(--plrnly-color-border) !important;
  color: var(--plrnly-color-text-secondary) !important;
  font-size: 13px !important;
}

.plrnly-difficulty-badge {
  display: inline-block !important;
  border-radius: 0.5rem !important;
  padding: 0.25rem 0.75rem !important;
  font-size: 13px !important;
}

.plrnly-difficulty-intro {
  background: rgba(139, 149, 161, 0.12) !important;
  color: #8b95a1 !important;
}

.plrnly-difficulty-beginner {
  background: rgba(74, 158, 255, 0.12) !important;
  color: #4a9eff !important;
}

.plrnly-difficulty-intermediate {
  background: rgba(251, 191, 36, 0.12) !important;
  color: #fbbf24 !important;
}

.plrnly-difficulty-advanced {
  background: rgba(239, 68, 68, 0.12) !important;
  color: #ef4444 !important;
}

.plrnly-resource-center-text {
  text-align: center !important;
  color: var(--plrnly-color-text-secondary) !important;
  font-size: 13px !important;
}

.plrnly-resource-center-text-muted {
  text-align: center !important;
  color: var(--plrnly-color-text-muted) !important;
  font-size: 13px !important;
  white-space: nowrap !important;
}

.plrnly-resource-actions {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 0.5rem !important;
}

.plrnly-preview-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 0.5rem !important;
  padding: 0 !important;
  width: 36px !important;
  height: 36px !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  background: var(--plrnly-color-border) !important;
  color: var(--plrnly-color-text-secondary) !important;
}

.plrnly-preview-btn:hover {
  transform: scale(1.1) !important;
}

.plrnly-download-btn-small {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 0.5rem !important;
  padding: 0 !important;
  width: 48px !important;
  height: 40px !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  background: var(--plrnly-color-primary) !important;
  color: var(--plrnly-color-bg) !important;
}

.plrnly-download-btn-small:hover {
  filter: brightness(1.1) !important;
}

.plrnly-download-btn-small:disabled {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
  filter: none !important;
}

.plrnly-download-btn-label {
  display: none !important;
}

.plrnly-pagination {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  padding: 0.5rem 0 !important;
}

.plrnly-pagination-pages {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
}

.plrnly-page-nav-btn {
  border-radius: 0.5rem !important;
  border: 1px solid var(--plrnly-color-border) !important;
  padding: 0 !important;
  width: 40px !important;
  height: 40px !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  background: var(--plrnly-color-surface) !important;
  color: var(--plrnly-color-text-secondary) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.plrnly-page-nav-btn:hover:not(:disabled) {
  transform: scale(1.1) !important;
}

.plrnly-page-nav-btn:disabled {
  opacity: 0.4 !important;
  cursor: not-allowed !important;
}

.plrnly-page-btn {
  width: 2.5rem !important;
  height: 2.5rem !important;
  border-radius: 0.5rem !important;
  border: 1px solid var(--plrnly-color-border) !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  background: var(--plrnly-color-surface) !important;
  color: var(--plrnly-color-text-secondary) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  padding: 0 !important;
}

.plrnly-page-btn:hover {
  transform: scale(1.1) !important;
}

.plrnly-page-btn.plrnly-active {
  background: var(--plrnly-color-primary) !important;
  border-color: var(--plrnly-color-primary) !important;
  color: var(--plrnly-color-bg) !important;
  box-shadow: 0 0 20px rgba(30, 215, 96, 0.3) !important;
}

.plrnly-page-btn:not(.plrnly-active):hover {
  border-color: var(--plrnly-color-primary) !important;
  box-shadow: 0 0 12px rgba(30, 215, 96, 0.2) !important;
}

.plrnly-sidebar-sticky {
  position: sticky !important;
  top: 2rem !important;
}

.plrnly-sidebar-card {
  border-radius: 0.75rem !important;
  padding: 1.5rem !important;
  margin-bottom: 1.5rem !important;
  background: var(--plrnly-color-surface) !important;
  border: 1px solid var(--plrnly-color-border) !important;
}

.plrnly-sidebar-title-row {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  margin-bottom: 1rem !important;
}

.plrnly-sidebar-title-icon {
  width: 20px !important;
  height: 20px !important;
  color: var(--plrnly-color-primary) !important;
}

.plrnly-sidebar-title {
  color: var(--plrnly-color-text-main) !important;
}

.plrnly-sidebar-item-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.75rem !important;
}

.plrnly-sidebar-item {
  padding: 0.75rem !important;
  border-radius: 0.5rem !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  background: var(--plrnly-color-bg) !important;
  border: 1px solid var(--plrnly-color-border) !important;
}

.plrnly-sidebar-item:hover {
  border-color: var(--plrnly-color-primary) !important;
}

.plrnly-sidebar-item-top {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  margin-bottom: 0.5rem !important;
}

.plrnly-sidebar-item-title {
  color: var(--plrnly-color-text-secondary) !important;
  font-size: 13px !important;
}

.plrnly-sidebar-item-meta {
  color: var(--plrnly-color-text-muted) !important;
  font-size: 11px !important;
}

.plrnly-sidebar-download-icon {
  flex-shrink: 0 !important;
  margin-left: 0.5rem !important;
  width: 14px !important;
  height: 14px !important;
  color: var(--plrnly-color-primary) !important;
}

.plrnly-modal-open {
  overflow: hidden !important;
}

.plrnly-resource-row:focus-visible {
  outline: 2px solid var(--plrnly-color-primary) !important;
  outline-offset: -2px !important;
}

.plrnly-detail-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 1rem !important;
  background: rgba(6, 10, 16, 0.72) !important;
  backdrop-filter: blur(6px) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.22s ease !important;
}

.plrnly-detail-backdrop[hidden] {
  display: none !important;
}

.plrnly-detail-backdrop.plrnly-open {
  opacity: 1 !important;
  pointer-events: auto !important;
}

.plrnly-detail-modal {
  position: relative !important;
  width: min(680px, 100%) !important;
  max-height: calc(100vh - 2rem) !important;
  overflow-y: auto !important;
  border-radius: 1rem !important;
  border: 1px solid var(--plrnly-color-border) !important;
  background: linear-gradient(165deg, #141a25 0%, #111826 100%) !important;
  padding: 1.5rem !important;
  box-shadow: 0 28px 56px rgba(0, 0, 0, 0.45) !important;
  transform: translateY(16px) scale(0.98) !important;
  opacity: 0 !important;
  transition: transform 0.25s ease, opacity 0.25s ease !important;
  outline: none !important;
}

.plrnly-detail-backdrop.plrnly-open .plrnly-detail-modal {
  transform: translateY(0) scale(1) !important;
  opacity: 1 !important;
}

.plrnly-detail-close {
  position: absolute !important;
  top: 0.75rem !important;
  right: 0.75rem !important;
  width: 36px !important;
  height: 36px !important;
  border: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  border-radius: 0.5rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--plrnly-color-border) !important;
  color: var(--plrnly-color-text-secondary) !important;
  cursor: pointer !important;
  transition: transform 0.2s ease, filter 0.2s ease !important;
}

.plrnly-detail-close-icon {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  fill: none !important;
  pointer-events: none !important;
}

.plrnly-detail-close:hover {
  transform: scale(1.06) !important;
  filter: brightness(1.06) !important;
}

.plrnly-detail-header {
  padding-right: 2.75rem !important;
  margin-bottom: 1rem !important;
}

.plrnly-detail-title {
  color: var(--plrnly-color-text-main) !important;
  font-size: 22px !important;
  line-height: 1.4 !important;
  margin-bottom: 0.75rem !important;
}

.plrnly-detail-badges {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.5rem !important;
  min-height: 30px !important;
}

.plrnly-detail-badges .plrnly-category-badge,
.plrnly-detail-badges .plrnly-difficulty-badge,
.plrnly-detail-type {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 30px !important;
  padding: 0 0.75rem !important;
  line-height: 1 !important;
}

.plrnly-detail-type {
  border-radius: 0.5rem !important;
  border: 1px solid var(--plrnly-color-border) !important;
  color: var(--plrnly-color-text-secondary) !important;
  font-size: 13px !important;
  background: var(--plrnly-color-bg) !important;
}

.plrnly-detail-meta-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0.75rem !important;
  margin-bottom: 1rem !important;
}

.plrnly-detail-meta-item {
  border-radius: 0.75rem !important;
  border: 1px solid var(--plrnly-color-border) !important;
  padding: 0.75rem !important;
  background: rgba(8, 12, 18, 0.45) !important;
}

.plrnly-detail-meta-label {
  display: block !important;
  color: var(--plrnly-color-text-muted) !important;
  font-size: 12px !important;
  margin-bottom: 0.2rem !important;
}

.plrnly-detail-meta-value {
  display: block !important;
  color: var(--plrnly-color-text-main) !important;
  font-size: 15px !important;
  line-height: 1.4 !important;
}

.plrnly-detail-body {
  border-radius: 0.75rem !important;
  border: 1px solid var(--plrnly-color-border) !important;
  background: rgba(8, 12, 18, 0.42) !important;
  padding: 1rem !important;
  margin-bottom: 1rem !important;
}

.plrnly-detail-description {
  color: var(--plrnly-color-text-secondary) !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
}

.plrnly-detail-actions {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 0.625rem !important;
}

.plrnly-detail-btn {
  height: 42px !important;
  border: 0 !important;
  border-radius: 0.625rem !important;
  padding: 0 1rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  font-size: 14px !important;
  cursor: pointer !important;
  transition: transform 0.2s ease, filter 0.2s ease !important;
}

.plrnly-detail-btn:hover {
  transform: translateY(-1px) !important;
}

.plrnly-detail-btn:disabled,
.plrnly-detail-btn-disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  transform: none !important;
  filter: none !important;
}

.plrnly-detail-btn-secondary {
  background: var(--plrnly-color-border) !important;
  color: var(--plrnly-color-text-secondary) !important;
}

.plrnly-detail-btn-primary {
  background: var(--plrnly-color-primary) !important;
  color: var(--plrnly-color-bg) !important;
}

.plrnly-detail-btn-primary:hover {
  filter: brightness(1.06) !important;
}

.plrnly-upload-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 1rem !important;
  background: rgba(6, 10, 16, 0.72) !important;
  backdrop-filter: blur(6px) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.22s ease !important;
}

.plrnly-upload-backdrop[hidden] {
  display: none !important;
}

.plrnly-upload-backdrop.plrnly-open {
  opacity: 1 !important;
  pointer-events: auto !important;
}

.plrnly-upload-modal {
  position: relative !important;
  width: min(760px, 100%) !important;
  max-height: calc(100vh - 2rem) !important;
  overflow-y: auto !important;
  border-radius: 1rem !important;
  border: 1px solid var(--plrnly-color-border) !important;
  background: linear-gradient(165deg, #141a25 0%, #111826 100%) !important;
  padding: 1.5rem !important;
  box-shadow: 0 28px 56px rgba(0, 0, 0, 0.45) !important;
  transform: translateY(16px) scale(0.98) !important;
  opacity: 0 !important;
  transition: transform 0.25s ease, opacity 0.25s ease !important;
  outline: none !important;
}

.plrnly-upload-backdrop.plrnly-open .plrnly-upload-modal {
  transform: translateY(0) scale(1) !important;
  opacity: 1 !important;
}

.plrnly-upload-close {
  position: absolute !important;
  top: 0.75rem !important;
  right: 0.75rem !important;
  width: 36px !important;
  height: 36px !important;
  border: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  border-radius: 0.5rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--plrnly-color-border) !important;
  color: var(--plrnly-color-text-secondary) !important;
  cursor: pointer !important;
  transition: transform 0.2s ease, filter 0.2s ease !important;
}

.plrnly-upload-close:hover {
  transform: scale(1.06) !important;
  filter: brightness(1.06) !important;
}

.plrnly-upload-close-icon {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  fill: none !important;
  pointer-events: none !important;
}

.plrnly-upload-header {
  padding-right: 2.75rem !important;
  margin-bottom: 1rem !important;
}

.plrnly-upload-header h3 {
  color: var(--plrnly-color-text-main) !important;
  font-size: 22px !important;
  line-height: 1.4 !important;
  margin-bottom: 0.25rem !important;
}

.plrnly-upload-header p {
  color: var(--plrnly-color-text-muted) !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

.plrnly-upload-form {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.75rem !important;
}

.plrnly-upload-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.75rem !important;
}

.plrnly-upload-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.375rem !important;
}

.plrnly-upload-field span {
  color: var(--plrnly-color-text-muted) !important;
  font-size: 12px !important;
  line-height: 1 !important;
}

.plrnly-upload-field-full {
  grid-column: 1 / -1 !important;
}

.plrnly-upload-input,
.plrnly-upload-select,
.plrnly-upload-file,
.plrnly-upload-textarea {
  width: 100% !important;
  border-radius: 0.5rem !important;
  border: 1px solid var(--plrnly-color-border) !important;
  background: var(--plrnly-color-bg) !important;
  color: var(--plrnly-color-text-secondary) !important;
  padding: 0 0.75rem !important;
  height: 42px !important;
  outline: none !important;
}

.plrnly-upload-textarea {
  height: auto !important;
  min-height: 100px !important;
  padding: 0.75rem !important;
  resize: vertical !important;
}

.plrnly-upload-input:focus,
.plrnly-upload-select:focus,
.plrnly-upload-file:focus,
.plrnly-upload-textarea:focus {
  border-color: var(--plrnly-color-primary) !important;
  box-shadow: 0 0 0 2px rgba(30, 215, 96, 0.2) !important;
}

.plrnly-upload-feedback {
  min-height: 20px !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}

.plrnly-upload-feedback-loading {
  color: var(--plrnly-color-text-muted) !important;
}

.plrnly-upload-feedback-error {
  color: #f87171 !important;
}

.plrnly-upload-feedback-success {
  color: var(--plrnly-color-primary) !important;
}

.plrnly-upload-actions {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 0.625rem !important;
}

.plrnly-icon-16 {
  width: 16px !important;
  height: 16px !important;
}

.plrnly-icon-18 {
  width: 18px !important;
  height: 18px !important;
}

.plrnly-resource-empty-row {
  display: block !important;
  padding: 0 !important;
  border-left: 0 !important;
  cursor: default !important;
}

.plrnly-resource-empty-message {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  padding: 24px 16px !important;
  color: var(--plrnly-color-text-muted) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  white-space: nowrap !important;
}

.plrnly-resource-empty-row:hover {
  transform: none !important;
  border-left-color: transparent !important;
}

@media (min-width: 1024px) {
  .plrnly-main-column {
    grid-column: span 9 / span 9 !important;
  }

  .plrnly-sidebar-column {
    grid-column: span 3 / span 3 !important;
  }
}

@media (max-width: 768px) {
  .plrnly-page-container {
    padding: 1.5rem 0 !important;
  }

  .plrnly-hero-section {
    padding: 2.5rem 1.5rem !important;
  }

  .plrnly-content-grid {
    gap: 1rem !important;
  }

  .plrnly-featured-section {
    display: none !important;
  }

  .plrnly-filter-search {
    display: block !important;
    padding: 1rem !important;
    margin-bottom: 1rem !important;
  }

  .plrnly-sidebar-column {
    display: none !important;
  }

  .plrnly-select-group {
    display: none !important;
  }

  .plrnly-upload-mobile-wrap {
    display: block !important;
    margin-top: 0.75rem !important;
  }

  .plrnly-upload-mobile-wrap .plrnly-upload-open-btn {
    width: 100% !important;
    justify-content: center !important;
    height: 44px !important;
  }

  .plrnly-search-wrap {
    min-width: 0 !important;
    width: 100% !important;
  }

  .plrnly-resource-header-row {
    display: none !important;
  }

  .plrnly-resource-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.75rem !important;
    padding: 0.75rem 1rem !important;
    border-left: 0 !important;
  }

  .plrnly-resource-col-action {
    min-width: auto !important;
  }

  .plrnly-resource-row:hover {
    transform: none !important;
    border-left-color: transparent !important;
  }

  .plrnly-resource-number,
  .plrnly-resource-file-icon-box,
  .plrnly-resource-col-2,
  .plrnly-badge-new,
  .plrnly-icon-flame,
  .plrnly-resource-file-size,
  .plrnly-resource-center-text,
  .plrnly-resource-center-text-muted,
  .plrnly-preview-btn {
    display: none !important;
  }

  .plrnly-resource-col-1,
  .plrnly-resource-col-4 {
    grid-column: auto !important;
  }

  .plrnly-resource-title-wrap {
    min-width: 0 !important;
    flex: 1 !important;
  }

  .plrnly-resource-title-line {
    gap: 0.35rem !important;
  }

  .plrnly-resource-title-text {
    display: block !important;
    width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
  }

  .plrnly-resource-actions {
    flex-shrink: 0 !important;
  }

  .plrnly-download-btn-small {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.35rem !important;
    width: auto !important;
    height: auto !important;
    padding: 0.5rem 0.75rem !important;
    white-space: nowrap !important;
  }

  .plrnly-download-btn-label {
    display: inline !important;
    font-size: 13px !important;
  }

  .plrnly-detail-backdrop {
    padding: 0.75rem !important;
    align-items: flex-end !important;
  }

  .plrnly-detail-modal {
    width: 100% !important;
    max-height: calc(100vh - 1rem) !important;
    border-radius: 1rem 1rem 0.75rem 0.75rem !important;
    padding: 1rem !important;
    transform: translateY(22px) !important;
  }

  .plrnly-detail-header {
    padding-right: 2.25rem !important;
  }

  .plrnly-detail-title {
    font-size: 18px !important;
    margin-bottom: 0.625rem !important;
  }

  .plrnly-detail-meta-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
  }

  .plrnly-detail-actions {
    justify-content: space-between !important;
  }

  .plrnly-detail-btn {
    flex: 1 !important;
  }

  .plrnly-upload-backdrop {
    padding: 0.75rem !important;
    align-items: flex-end !important;
  }

  .plrnly-upload-modal {
    width: 100% !important;
    max-height: calc(100vh - 1rem) !important;
    border-radius: 1rem 1rem 0.75rem 0.75rem !important;
    padding: 1rem !important;
    transform: translateY(22px) !important;
  }

  .plrnly-upload-header {
    padding-right: 2.25rem !important;
  }

  .plrnly-upload-header h3 {
    font-size: 18px !important;
  }

  .plrnly-upload-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .plrnly-upload-actions {
    justify-content: space-between !important;
  }

  .plrnly-upload-actions .plrnly-detail-btn {
    flex: 1 !important;
  }
}