:root {
  --bg: #070d16;
  --panel: rgba(14, 25, 40, .82);
  --panel-solid: #0d1928;
  --panel-bright: #132238;
  --line: rgba(150, 184, 220, .14);
  --line-bright: rgba(84, 222, 198, .32);
  --ink: #eef6ff;
  --muted: #8da2b8;
  --cyan: #4fe0c5;
  --cyan-dark: #1d9d8d;
  --blue: #53a8ff;
  --violet: #a78bfa;
  --danger: #ff6f7d;
  --shadow: 0 30px 80px rgba(0, 0, 0, .28);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; color-scheme: dark; }
body { margin: 0; min-height: 100vh; color: var(--ink); background: radial-gradient(circle at 65% -10%, #122941 0, transparent 38%), linear-gradient(160deg, #060b13, #08121e 55%, #070c15); font: 14px/1.6 Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
button, input, select, textarea { font: inherit; }
a { color: inherit; text-decoration: none; }
.grid-haze { position: fixed; z-index: -3; inset: 0; opacity: .22; background-image: linear-gradient(rgba(98,152,194,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(98,152,194,.07) 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(to bottom, #000, transparent 82%); }
.orb { position: fixed; z-index: -2; width: 430px; height: 430px; border-radius: 50%; filter: blur(110px); opacity: .12; pointer-events: none; }
.orb-one { right: -180px; top: 14%; background: #36d8bd; }.orb-two { left: -220px; bottom: -100px; background: #376ef2; }
.vault-header { position: sticky; top: 12px; z-index: 40; max-width: 1360px; margin: 12px auto 0; padding: 10px 14px; border: 1px solid var(--line); border-radius: 20px; background: rgba(8,17,29,.78); box-shadow: 0 16px 45px rgba(0,0,0,.18); backdrop-filter: blur(22px); display: flex; align-items: center; gap: 24px; }
.vault-brand { display: flex; align-items: center; gap: 11px; min-width: 235px; }
.brand-glyph { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid rgba(79,224,197,.32); border-radius: 15px; color: var(--cyan); background: linear-gradient(145deg, rgba(79,224,197,.14), rgba(83,168,255,.06)); box-shadow: inset 0 0 24px rgba(79,224,197,.06); font: 800 15px/1 ui-monospace, monospace; }
.vault-brand strong, .vault-brand small { display: block; }.vault-brand strong { letter-spacing: .01em; }.vault-brand small { color: var(--muted); font-size: 10px; letter-spacing: .06em; }
.vault-header nav { flex: 1; display: flex; gap: 4px; }.vault-header nav a { padding: 9px 13px; border-radius: 10px; color: #a8b8c9; transition: .18s ease; }.vault-header nav a:hover { color: var(--ink); background: rgba(255,255,255,.055); }
.account-chip { display: flex; align-items: center; gap: 10px; padding: 7px 8px 7px 12px; border: 1px solid var(--line); border-radius: 13px; color: var(--muted); font-size: 12px; }.account-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 12px var(--cyan); }.account-chip a { color: #bdd0e2; }.account-chip form { margin: 0; }.account-chip button { border: 0; padding: 4px 8px; color: var(--muted); background: transparent; cursor: pointer; }
.vault-shell { max-width: 1360px; margin: 0 auto; padding: 42px 25px 80px; }.narrow-shell { max-width: 680px; }.login-shell { max-width: 1220px; }
.message-stack { display: grid; gap: 9px; margin-bottom: 18px; }.flash { padding: 12px 15px; border: 1px solid rgba(79,224,197,.25); border-radius: 12px; color: #baf7eb; background: rgba(35,128,113,.18); }.flash.error { color: #ffc5cb; border-color: rgba(255,111,125,.28); background: rgba(155,52,65,.18); }
.eyebrow { margin-bottom: 9px; color: var(--cyan); font: 700 10px/1.3 ui-monospace, monospace; letter-spacing: .18em; }
h1, h2, h3, p { margin-top: 0; }h1 { margin-bottom: 14px; font-size: clamp(36px, 5.2vw, 70px); line-height: 1.05; letter-spacing: -.055em; }h1 span { color: transparent; background: linear-gradient(95deg, var(--cyan), var(--blue)); background-clip: text; }h2 { font-size: 22px; }p { color: var(--muted); }
.primary-button, .ghost-button { display: inline-flex; justify-content: center; align-items: center; gap: 8px; min-height: 43px; padding: 10px 17px; border-radius: 11px; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }.primary-button { border: 1px solid rgba(79,224,197,.3); color: #031510; background: linear-gradient(135deg, #68efd5, #38c8b0); box-shadow: 0 9px 25px rgba(55,207,181,.16); font-weight: 800; }.primary-button:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(55,207,181,.24); }.ghost-button { border: 1px solid var(--line); color: #b7c7d8; background: rgba(255,255,255,.025); }.ghost-button:hover { border-color: rgba(150,184,220,.35); transform: translateY(-1px); }
.glass-card { border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(145deg, rgba(19,34,54,.86), rgba(10,20,33,.91)); box-shadow: var(--shadow); backdrop-filter: blur(18px); }
input, select, textarea { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid rgba(150,184,220,.2); border-radius: 10px; outline: 0; color: var(--ink); background: rgba(5,12,21,.7); transition: border .16s, box-shadow .16s; }textarea { resize: vertical; line-height: 1.75; unicode-bidi: plaintext; }input:focus, select:focus, textarea:focus { border-color: rgba(79,224,197,.65); box-shadow: 0 0 0 4px rgba(79,224,197,.08); }input::placeholder, textarea::placeholder { color: #62768b; }
label > span { display: block; margin-bottom: 6px; color: #adbed0; font-size: 11px; font-weight: 700; letter-spacing: .025em; }.field-error, .form-error { color: #ff9aa5; }.field-error { display: block; margin-top: 5px; font-size: 11px; }.form-error { margin-bottom: 14px; padding: 11px; border: 1px solid rgba(255,111,125,.25); border-radius: 10px; background: rgba(145,44,57,.15); }.form-error ul { margin: 0; padding-left: 18px; }
.login-stage { min-height: calc(100vh - 210px); display: grid; grid-template-columns: 1.15fr .7fr; align-items: center; gap: clamp(40px, 8vw, 100px); }.login-copy p { max-width: 650px; font-size: 17px; }.code-fragment { display: inline-block; margin-top: 22px; padding: 12px 15px; border: 1px solid rgba(83,168,255,.2); border-radius: 11px; color: #8297ad; background: rgba(5,13,23,.6); font: 12px/1.4 ui-monospace, monospace; }.code-fragment span { color: var(--blue); }.code-fragment b { color: var(--cyan); font-weight: 500; }.login-form { padding: 34px; display: grid; gap: 16px; }.login-form h2 { margin-bottom: 5px; }.form-kicker { color: var(--cyan); font: 700 10px ui-monospace, monospace; letter-spacing: .12em; }.login-form label { display: grid; }.security-note { margin: 0; text-align: center; font-size: 10px; }
.vault-hero { padding: 45px 0 34px; display: flex; align-items: flex-end; justify-content: space-between; gap: 35px; }.vault-hero h1 { max-width: 820px; }.vault-hero p { max-width: 650px; font-size: 15px; }.hero-metrics { display: grid; grid-template-columns: repeat(3, 115px); gap: 8px; }.hero-metrics article { padding: 17px 12px; border: 1px solid var(--line); border-radius: 15px; text-align: center; background: rgba(13,25,40,.6); }.hero-metrics strong, .hero-metrics span { display: block; }.hero-metrics strong { color: var(--cyan); font: 700 24px ui-monospace, monospace; }.hero-metrics span { color: var(--muted); font-size: 9px; }
.filter-console { position: relative; padding: 20px; border: 1px solid var(--line); border-radius: 20px; background: rgba(11,21,35,.78); box-shadow: 0 24px 60px rgba(0,0,0,.2); }.search-line { display: grid; grid-template-columns: 34px minmax(240px,1fr) auto auto; align-items: center; gap: 10px; }.search-icon { color: var(--cyan); font-size: 24px; text-align: center; }.search-line input { min-height: 48px; font-size: 14px; }.filter-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 14px; }.tag-filter-head { margin-top: 17px; display: flex; align-items: center; justify-content: space-between; color: #adbed0; font-size: 11px; font-weight: 700; }.segmented { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 10px; }.segmented label { cursor: pointer; }.segmented input { display: none; }.segmented span { margin: 0; padding: 5px 9px; border-radius: 7px; color: var(--muted); font-size: 10px; }.segmented input:checked + span { color: #061913; background: var(--cyan); }.tag-cloud { display: flex; flex-wrap: wrap; gap: 7px; }.filter-tags { margin-top: 10px; }.tag-cloud label { cursor: pointer; }.tag-cloud input { display: none; }.tag-cloud label span, .problem-tags span { display: inline-flex; align-items: center; gap: 5px; border: 1px solid color-mix(in srgb, var(--tag-color) 35%, transparent); border-radius: 999px; color: color-mix(in srgb, var(--tag-color) 75%, white); background: color-mix(in srgb, var(--tag-color) 9%, transparent); }.tag-cloud label span { padding: 5px 10px; font-size: 10px; }.tag-cloud label span small { opacity: .55; }.tag-cloud input:checked + span { color: #05140f; background: var(--tag-color); border-color: var(--tag-color); box-shadow: 0 0 18px color-mix(in srgb, var(--tag-color) 22%, transparent); }.mobile-filter-submit { display: none; }
.result-heading { margin: 30px 0 14px; display: flex; align-items: center; justify-content: space-between; }.result-heading > div { display: flex; align-items: baseline; gap: 9px; }.result-heading h2 { margin: 0; font-size: 14px; color: var(--muted); font-weight: 500; }.result-count { color: var(--ink); font: 700 24px ui-monospace, monospace; }.add-problem-button { display: inline-flex; align-items: center; gap: 7px; color: var(--cyan); font-weight: 700; }.add-problem-button span { font-size: 22px; }
.problem-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }.problem-card { position: relative; min-height: 245px; padding: 19px; border: 1px solid var(--line); border-radius: 17px; background: linear-gradient(145deg, rgba(18,33,52,.78), rgba(10,19,31,.9)); box-shadow: 0 13px 35px rgba(0,0,0,.14); overflow: hidden; transition: transform .18s, border-color .18s, box-shadow .18s; }.problem-card::after { content: ""; position: absolute; right: -40px; bottom: -55px; width: 120px; height: 120px; border: 22px solid rgba(79,224,197,.025); border-radius: 50%; pointer-events: none; }.problem-card:hover { transform: translateY(-3px); border-color: rgba(79,224,197,.24); box-shadow: 0 20px 45px rgba(0,0,0,.22); }.problem-card:has([data-problem-select]:checked) { border-color: rgba(79,224,197,.65); box-shadow: inset 0 0 0 1px rgba(79,224,197,.2), 0 20px 45px rgba(0,0,0,.22); }.select-problem { position: absolute; top: 17px; right: 17px; z-index: 2; cursor: pointer; }.select-problem input { display: none; }.select-problem span { display: grid; place-items: center; width: 20px; height: 20px; border: 1px solid rgba(150,184,220,.3); border-radius: 6px; background: rgba(5,12,21,.7); }.select-problem input:checked + span { border-color: var(--cyan); background: var(--cyan); }.select-problem input:checked + span::before { content: "✓"; color: #061913; font-size: 13px; font-weight: 900; }.problem-top { display: flex; align-items: center; gap: 8px; padding-right: 31px; }.source-badge { padding: 3px 7px; border-radius: 6px; color: #93a8bd; background: rgba(255,255,255,.045); font: 700 8px ui-monospace, monospace; letter-spacing: .06em; text-transform: uppercase; }.source-codeforces { color: #9ac8ff; }.source-codeforces_gym { color: #72d8ff; }.source-atcoder { color: #d1a9ff; }.source-quera { color: #8ce5bb; }.source-qoj { color: #ffd479; }.difficulty { font: 800 12px ui-monospace, monospace; }.rating-unrated { color: #6f8193; }.rating-newbie { color: #a1a1aa; }.rating-pupil { color: #38d67a; }.rating-specialist { color: #24d5d8; }.rating-expert { color: #5a8cff; }.rating-candidate { color: #b36dff; }.rating-master { color: #ffad3d; }.rating-grandmaster { color: #ff545f; text-shadow: 0 0 12px rgba(255,84,95,.2); }.problem-card h3 { margin: 17px 0 12px; padding-right: 5px; font-size: 18px; line-height: 1.3; letter-spacing: -.02em; }.problem-card h3 a:hover { color: var(--cyan); }.problem-note { margin: -3px 0 13px; color: #8ea5ba; font-size: 11px; line-height: 1.65; white-space: pre-line; unicode-bidi: plaintext; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }.problem-tags { display: flex; flex-wrap: wrap; gap: 5px; min-height: 26px; }.problem-tags span { padding: 3px 7px; font-size: 9px; }.problem-tags .no-tags { border-color: var(--line); color: #65788b; background: transparent; }.problem-meta { margin-top: 17px; padding-top: 12px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; color: #677b90; font-size: 9px; }.problem-actions { position: relative; z-index: 2; margin-top: 12px; display: flex; align-items: center; gap: 13px; color: #90a4b8; font-size: 10px; }.problem-actions a:hover { color: var(--cyan); }.problem-actions form { margin: 0 0 0 auto; }.problem-actions button { border: 0; padding: 0; color: #8d6570; background: none; cursor: pointer; }.problem-actions button:hover { color: var(--danger); }
.selection-dock { position: sticky; top: 89px; z-index: 30; margin: 0 0 12px auto; width: max-content; max-width: 100%; padding: 8px; border: 1px solid rgba(79,224,197,.3); border-radius: 14px; background: rgba(8,22,31,.92); box-shadow: 0 15px 40px rgba(0,0,0,.32); backdrop-filter: blur(18px); display: flex; align-items: center; gap: 8px; }.selection-dock[hidden] { display: none; }.selection-dock > div { display: flex; align-items: baseline; gap: 5px; padding: 0 7px; }.selection-dock strong { color: var(--cyan); font: 800 17px ui-monospace, monospace; }.selection-dock span { color: var(--muted); font-size: 9px; }.selection-dock button { border: 1px solid var(--line); border-radius: 9px; padding: 7px 10px; color: #a9bbcd; background: rgba(255,255,255,.04); cursor: pointer; }.selection-dock .copy-button { color: #061913; border-color: var(--cyan); background: var(--cyan); font-weight: 800; }.copy-status { min-width: 0; color: var(--cyan) !important; }.copy-menu { position: relative; padding: 0 !important; }.copy-options { position: absolute; z-index: 45; top: calc(100% + 7px); right: 0; min-width: 170px; padding: 6px !important; border: 1px solid rgba(79,224,197,.26); border-radius: 11px; display: grid !important; gap: 4px !important; background: rgba(6,15,25,.98); box-shadow: 0 18px 45px rgba(0,0,0,.45); }.copy-options[hidden] { display: none !important; }.copy-options button { width: 100%; text-align: left; white-space: nowrap; }
.empty-vault { padding: 75px 25px; border: 1px dashed rgba(150,184,220,.2); border-radius: 20px; text-align: center; background: rgba(13,25,40,.42); }.empty-vault h2 { margin-bottom: 6px; }.empty-orbit { margin: 0 auto 15px; display: grid; place-items: center; width: 58px; height: 58px; border: 1px solid rgba(79,224,197,.25); border-radius: 50%; color: var(--cyan); font-size: 26px; }.compact-empty { padding: 45px 20px; }.pagination { margin-top: 23px; display: flex; justify-content: center; align-items: center; gap: 18px; color: var(--muted); font-size: 11px; }.pagination a { padding: 7px 11px; border: 1px solid var(--line); border-radius: 9px; color: #b6c6d7; }
.form-page-head { padding: 35px 0 27px; display: flex; align-items: flex-end; justify-content: space-between; gap: 25px; }.form-page-head h1 { font-size: clamp(35px,5vw,58px); }.form-page-head p { max-width: 720px; }.editor-layout { display: grid; grid-template-columns: minmax(0,1fr) 310px; align-items: start; gap: 15px; }.editor-form { padding: clamp(22px,4vw,36px); display: grid; gap: 15px; }.smart-import { display: flex; align-items: flex-start; gap: 13px; }.smart-import h2 { margin-bottom: 3px; }.smart-import p { margin: 0; font-size: 11px; }.field-number { color: var(--cyan); font: 700 12px ui-monospace, monospace; }.full-field, .editor-form > label { display: grid; }.editor-form label small { margin-top: 4px; color: #708398; font-size: 10px; }.format-examples { display: flex; flex-wrap: wrap; gap: 6px; }.format-examples code { padding: 5px 8px; border: 1px solid rgba(83,168,255,.16); border-radius: 7px; color: #85acd4; background: rgba(83,168,255,.055); font-size: 9px; }.details-head { margin-top: 12px; padding-top: 20px; border-top: 1px solid var(--line); }.two-fields { display: grid; grid-template-columns: 1fr 180px; gap: 11px; }.form-tag-picker { position: relative; }.tag-options-source ul { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 7px; }.tag-options-source li label { display: flex; align-items: center; gap: 6px; padding: 6px 9px; border: 1px solid var(--line); border-radius: 9px; color: #a6b7c8; cursor: pointer; }.tag-options-source input[type=checkbox] { width: 14px; min-height: 14px; accent-color: var(--cyan); }.tag-search-field { display: grid; }.tag-search-field input { padding-left: 38px; background-image: radial-gradient(circle, transparent 42%, var(--cyan) 44%, var(--cyan) 52%, transparent 54%), linear-gradient(45deg, transparent 42%, var(--cyan) 44%, var(--cyan) 51%, transparent 53%); background-position: 15px 16px, 25px 27px; background-size: 13px 13px, 7px 7px; background-repeat: no-repeat; }.tag-picker-suggestions { position: absolute; z-index: 12; top: 69px; right: 0; left: 0; max-height: 255px; padding: 7px; border: 1px solid rgba(79,224,197,.28); border-radius: 13px; overflow-y: auto; background: rgba(7,16,27,.98); box-shadow: 0 22px 50px rgba(0,0,0,.42); backdrop-filter: blur(20px); }.tag-picker-suggestions[hidden] { display: none; }.tag-suggestion { width: 100%; padding: 10px 11px; border: 0; border-radius: 9px; display: flex; align-items: center; gap: 9px; color: #c2d2e1; text-align: left; background: transparent; cursor: pointer; }.tag-suggestion:hover, .tag-suggestion:focus { outline: 0; color: var(--ink); background: rgba(79,224,197,.09); }.tag-suggestion-dot { width: 9px; height: 9px; flex: 0 0 auto; border-radius: 50%; background: var(--tag-color); box-shadow: 0 0 12px color-mix(in srgb, var(--tag-color) 45%, transparent); }.tag-suggestion-empty { padding: 13px; color: var(--muted); font-size: 11px; }.tag-picker-selected { min-height: 36px; margin-top: 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }.selected-tag-chip { padding: 6px 10px; border: 1px solid color-mix(in srgb, var(--tag-color) 35%, transparent); border-radius: 999px; color: color-mix(in srgb, var(--tag-color) 78%, white); background: color-mix(in srgb, var(--tag-color) 10%, transparent); cursor: pointer; }.selected-tag-chip:hover { color: #08121f; background: var(--tag-color); }.tag-picker-empty { color: #64788d; font-size: 10px; }.form-tag-picker.is-enhanced .tag-options-source { display: none; }.editor-actions { margin-top: 8px; display: flex; gap: 9px; }.danger-button { margin-left: auto; border: 1px solid rgba(255,111,125,.24); border-radius: 11px; padding: 10px 14px; color: #ff9ea8; background: rgba(255,111,125,.07); cursor: pointer; }.danger-button:hover { border-color: rgba(255,111,125,.5); background: rgba(255,111,125,.13); }.editor-aside { position: sticky; top: 95px; padding: 24px; border: 1px solid var(--line); border-radius: 19px; color: var(--muted); background: rgba(11,22,36,.64); }.editor-aside h3 { color: var(--ink); }.editor-aside ul { padding-left: 18px; }.editor-aside li { margin-bottom: 9px; }.editor-aside b { color: #bdd0e2; }.editor-aside p { margin: 17px 0 0; padding-top: 16px; border-top: 1px solid var(--line); font-size: 11px; }.aside-orbit { margin-bottom: 14px; color: var(--cyan); font-size: 26px; }
.tag-manager-layout { display: grid; grid-template-columns: 350px minmax(0,1fr); align-items: start; gap: 15px; }.compact-form { padding: 25px; display: grid; gap: 14px; }.compact-form label { display: grid; }.tag-color-field > span { display: block; margin-bottom: 6px; color: #adbed0; font-size: 11px; font-weight: 700; }.tag-color-control { display: grid; grid-template-columns: 58px minmax(0,1fr); gap: 8px; }.tag-color-control input[type=color] { min-height: 44px; padding: 4px; cursor: pointer; }.tag-color-control button { width: 100%; }.tag-color-field output { display: block; margin-top: 5px; color: #71869b; font: 10px ui-monospace, monospace; }.tag-admin-list, .admin-account-list { display: grid; gap: 9px; }.tag-admin-list article { padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: rgba(13,25,40,.72); display: flex; align-items: center; gap: 8px; }.tag-admin-list article > form:first-child { flex: 1; display: grid; grid-template-columns: minmax(150px,1fr) 46px 100px auto; align-items: center; gap: 8px; }.tag-admin-list input { min-height: 38px; }.tag-admin-list input[type=color] { padding: 4px; }.tag-admin-list button, .admin-account-actions button { border: 1px solid var(--line); border-radius: 8px; padding: 7px 10px; color: #aebfd0; background: rgba(255,255,255,.035); cursor: pointer; }.tag-usage { color: var(--muted); font-size: 9px; }.danger-link { color: #a97a83 !important; }.admin-account-list article { padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: rgba(13,25,40,.72); display: grid; grid-template-columns: 42px minmax(0,1fr) auto auto; align-items: center; gap: 12px; }.admin-avatar { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; color: var(--cyan); background: rgba(79,224,197,.09); font-weight: 800; }.admin-account-list strong, .admin-account-list code, .admin-account-list small { display: block; }.admin-account-list code { color: #83a2bf; }.admin-account-list small { color: var(--muted); font-size: 9px; }.account-status { padding: 4px 8px; border-radius: 999px; font-size: 9px; }.account-status.active { color: #7ff4d7; background: rgba(55,207,181,.11); }.account-status.disabled { color: #ff9ca6; background: rgba(255,111,125,.1); }.admin-account-actions { display: flex; align-items: center; gap: 8px; font-size: 10px; }.admin-account-actions form { margin: 0; }.standalone-form { margin-top: 5vh; }.standalone-form h1 { font-size: 38px; }
.target-set-banner { margin-bottom: 13px; padding: 11px 15px; border: 1px solid rgba(79,224,197,.25); border-radius: 13px; display: flex; align-items: center; gap: 8px; color: var(--muted); background: rgba(79,224,197,.055); }
.target-set-banner strong { color: var(--cyan); }.target-set-banner a { margin-left: auto; color: #b9ccde; }
.filter-console.is-loading::after { content: "Updating…"; position: absolute; right: 18px; bottom: 14px; color: var(--cyan); font: 9px ui-monospace, monospace; }
.filter-tag-picker { margin-top: 9px; }.filter-tag-picker .tag-picker-suggestions { top: 69px; }.filter-tag-picker.is-enhanced .tag-options-source { display: none; }
.selection-review { width: min(620px, calc(100vw - 30px)); max-height: min(680px, calc(100vh - 50px)); padding: 0; border: 1px solid rgba(79,224,197,.28); border-radius: 20px; color: var(--ink); background: rgba(8,18,30,.98); box-shadow: 0 30px 90px rgba(0,0,0,.65); }
.selection-review::backdrop { background: rgba(2,7,13,.72); backdrop-filter: blur(6px); }
.selection-review-head, .selection-review-actions { padding: 16px 18px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.selection-review-head { border-bottom: 1px solid var(--line); }.selection-review-head strong, .selection-review-head span { display: block; }.selection-review-head span { margin-top: 3px; color: var(--muted); font-size: 10px; }.selection-review-head > button { border: 0; color: var(--muted); background: none; font-size: 24px; cursor: pointer; }
.selection-review-list { max-height: 440px; padding: 9px 18px; overflow-y: auto; }.selection-review-list > div { padding: 10px 0; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 14px; }.selection-review-list button { border: 0; color: #b87783; background: none; cursor: pointer; }
.selection-review-actions { border-top: 1px solid var(--line); }.selection-review-actions .danger-link { border: 0; background: none; cursor: pointer; }
.problem-hints { margin: 0 0 13px; border: 1px solid rgba(83,168,255,.12); border-radius: 10px; background: rgba(83,168,255,.035); overflow: hidden; }.problem-hints > header { padding: 8px 10px 5px; color: #6888a6; font-size: 9px; text-transform: uppercase; letter-spacing: .06em; }.problem-hint-spoiler { border-top: 1px solid rgba(83,168,255,.1); }.problem-hint-spoiler summary { padding: 8px 10px; color: #86acd0; font-size: 10px; cursor: pointer; }.problem-hint-spoiler > div { padding: 0 11px 10px; color: #9bb0c4; font-size: 11px; line-height: 1.65; unicode-bidi: plaintext; }.math-content p { margin: 0; }.math-content p + p { margin-top: 1em; }
.import-guide { padding: 11px 13px; border: 1px solid rgba(83,168,255,.15); border-radius: 11px; color: #88a8c6; background: rgba(83,168,255,.04); }.import-guide summary { color: #9bc1e6; font-size: 11px; cursor: pointer; }.import-guide > div { margin-top: 11px; display: flex; flex-wrap: wrap; gap: 6px; }.import-guide code { padding: 5px 8px; border: 1px solid rgba(83,168,255,.15); border-radius: 7px; font-size: 9px; }.import-guide p { flex: 0 0 100%; margin: 7px 0 0; font-size: 10px; line-height: 1.7; }
.preview-actions { display: flex; justify-content: flex-end; }.preview-actions button { padding: 7px 10px; font-size: 10px; }.content-preview { padding: 14px; border: 1px dashed rgba(79,224,197,.25); border-radius: 12px; color: #afc1d2; background: rgba(79,224,197,.035); line-height: 1.8; unicode-bidi: plaintext; }
.hint-editor > [data-hint-list] { display: grid; gap: 10px; }.hint-editor > button { margin-top: 10px; }.hint-card { padding: 13px; border: 1px solid var(--line); border-radius: 13px; background: rgba(6,15,25,.45); }.hint-card > div:first-child { margin-bottom: 8px; display: flex; align-items: center; justify-content: space-between; }.hint-card > div:first-child button { border: 0; color: #a76f79; background: none; cursor: pointer; }.hint-card .preview-actions { margin-top: 7px; }
.set-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 13px; }.set-card { min-height: 260px; padding: 22px; border: 1px solid var(--line); border-radius: 19px; display: flex; flex-direction: column; color: var(--ink); background: linear-gradient(145deg,rgba(18,33,52,.82),rgba(8,17,29,.92)); transition: transform .18s,border-color .18s; }.set-card:hover { transform: translateY(-3px); border-color: rgba(79,224,197,.32); }.set-card h2 { margin: 0 0 9px; font-size: 20px; }.set-card-description { min-height: 24px; color: var(--muted); font-size: 11px; line-height: 1.7; unicode-bidi: plaintext; }.set-card-problems { min-height: 82px; max-height: 112px; margin: 16px 0; padding: 8px 10px; border: 1px solid rgba(150,184,220,.1); border-radius: 11px; display: flex; flex-direction: column; gap: 6px; overflow-y: auto; background: rgba(4,12,21,.38); scrollbar-width: thin; }.set-card-problems span { color: #9fb2c4; font-size: 10px; line-height: 1.45; }.set-card-problems .set-card-empty { color: #607489; font-style: italic; }.set-card footer { margin-top: auto; padding: 15px 0 0; border-top: 1px solid var(--line); display: flex; justify-content: space-between; color: var(--muted); font-size: 10px; }
.set-form { max-width: 760px; margin: 0 auto; padding: 30px; display: grid; gap: 16px; }.set-form label { display: grid; }.prepared-selection { padding: 13px; border: 1px solid rgba(79,224,197,.16); border-radius: 12px; }.prepared-selection > div { margin-top: 9px; display: flex; flex-wrap: wrap; gap: 6px; }.prepared-selection span { padding: 5px 8px; border-radius: 7px; color: #8fb3b0; background: rgba(79,224,197,.06); font-size: 9px; }
.set-head-actions { display: flex; gap: 8px; }.set-description { max-width: 760px; margin-top: 9px; color: var(--muted); line-height: 1.7; }.set-problem-count { margin-top: 11px; color: var(--cyan) !important; font: 700 10px ui-monospace,monospace; }.set-selection-bar { position: sticky; top: 89px; z-index: 28; margin: 0 0 12px auto; width: max-content; max-width: 100%; padding: 8px; border: 1px solid rgba(79,224,197,.28); border-radius: 14px; display: flex; align-items: center; gap: 8px; background: rgba(8,22,31,.94); box-shadow: 0 15px 40px rgba(0,0,0,.3); }.set-selection-bar[hidden] { display: none; }.set-selection-bar > div:first-child { padding: 0 7px; }.set-selection-bar strong { color: var(--cyan); font: 800 17px ui-monospace,monospace; }.set-selection-bar span { margin-left: 4px; color: var(--muted); font-size: 9px; }.set-selection-bar button { border: 1px solid var(--line); border-radius: 9px; padding: 7px 10px; color: #a9bbcd; background: rgba(255,255,255,.04); cursor: pointer; }.set-copy-panel { margin: 0 0 12px auto; width: min(520px,100%); padding: 13px; border: 1px solid rgba(79,224,197,.2); border-radius: 13px; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 9px; background: rgba(11,24,38,.82); }.set-copy-panel[hidden] { display: none; }.set-copy-panel label { display: grid; }.set-problem-list { display: grid; gap: 8px; }.set-problem-list article { padding: 15px 17px; border: 1px solid var(--line); border-radius: 14px; display: grid; grid-template-columns: 24px 24px 42px minmax(0,1fr) auto; align-items: center; gap: 10px; background: rgba(13,25,40,.7); transition: opacity .15s, border-color .15s, transform .15s; }.set-problem-list article.is-dragging { opacity: .5; border-color: var(--cyan); transform: scale(.99); }.drag-handle { color: #6d8499; font-size: 19px; cursor: grab !important; }.drag-handle:active { cursor: grabbing !important; }.set-select-problem input { display: none; }.set-select-problem span { display: grid; place-items: center; width: 19px; height: 19px; border: 1px solid rgba(150,184,220,.3); border-radius: 6px; background: rgba(5,12,21,.7); cursor: pointer; }.set-select-problem input:checked + span { border-color: var(--cyan); background: var(--cyan); }.set-select-problem input:checked + span::before { content: "✓"; color: #061913; font-size: 12px; font-weight: 900; }.set-problem-list h2 { margin: 0 0 4px; font-size: 16px; }.set-position { color: var(--cyan); font: 800 17px ui-monospace,monospace; }.set-problem-list button { border: 0; background: none; cursor: pointer; }.set-delete-form { margin-top: 24px; display: flex; justify-content: flex-end; }.set-delete-form .danger-button { margin-left: 0; }
footer { max-width: 1360px; margin: 0 auto; padding: 22px 25px 35px; border-top: 1px solid rgba(150,184,220,.08); display: flex; justify-content: space-between; color: #506377; font-size: 9px; letter-spacing: .06em; }
@media (max-width: 1050px) { .vault-header { margin-inline: 12px; }.vault-brand { min-width: auto; }.vault-brand small { display: none; }.problem-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.vault-hero { align-items: flex-start; flex-direction: column; }.hero-metrics { align-self: stretch; grid-template-columns: repeat(3,1fr); }.filter-grid { grid-template-columns: repeat(2,1fr); }.editor-layout { grid-template-columns: 1fr; }.editor-aside { position: static; }.tag-manager-layout { grid-template-columns: 300px minmax(0,1fr); } }
@media (max-width: 760px) { .vault-header { top: 7px; flex-wrap: wrap; gap: 8px; }.vault-header nav { order: 3; flex: 0 0 100%; width: 100%; overflow-x: auto; scrollbar-width: thin; }.vault-header nav a { white-space: nowrap; }.account-chip { margin-left: auto; }.account-chip > span:not(.account-dot), .account-chip > a { display: none; }.vault-shell { padding: 28px 13px 60px; }.login-stage { grid-template-columns: 1fr; min-height: auto; }.login-copy { padding-top: 25px; }.vault-hero { padding-top: 35px; }.search-line { grid-template-columns: 28px 1fr; }.search-line .primary-button, .search-line .ghost-button { display: none; }.mobile-filter-submit { display: inline-flex; margin-top: 15px; width: 100%; }.problem-grid { grid-template-columns: 1fr; }.selection-dock { top: 132px; width: 100%; overflow-x: auto; }.selection-dock button { white-space: nowrap; }.form-page-head { align-items: flex-start; flex-direction: column; }.tag-manager-layout { grid-template-columns: 1fr; }.two-fields { grid-template-columns: 1fr; }.tag-admin-list article { align-items: stretch; }.tag-admin-list article > form:first-child { grid-template-columns: 1fr 50px; }.tag-usage { grid-column: 1 / -1; }.admin-account-list article { grid-template-columns: 42px 1fr auto; }.admin-account-actions { grid-column: 2 / -1; }.hero-metrics strong { font-size: 18px; }.hero-metrics article { padding: 12px 7px; } }
@media (max-width: 430px) { .vault-brand strong { font-size: 12px; }.brand-glyph { width: 40px; height: 40px; }.filter-grid { grid-template-columns: 1fr; }.tag-filter-head { align-items: flex-start; flex-direction: column; gap: 8px; }.problem-card { min-height: 0; }.selection-dock [data-select-all] { display: none; }.editor-actions { flex-direction: column; }.admin-account-list article { grid-template-columns: 42px 1fr; }.account-status { grid-column: 1 / -1; width: max-content; } }
@media (max-width: 1050px) { .set-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 760px) { .set-grid { grid-template-columns: 1fr; }.set-head-actions { flex-wrap: wrap; }.set-selection-bar { top: 132px; width: 100%; overflow-x: auto; }.set-selection-bar button { white-space: nowrap; }.set-copy-panel { grid-template-columns: 1fr; }.set-problem-list article { grid-template-columns: 24px 24px 34px 1fr; }.set-problem-list form { grid-column: 4; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }*, *::before, *::after { transition-duration: .01ms !important; } }
.source-repovive { color: #ff9fb7; }
.assignment-form-head { margin: 25px 0 20px; }.assignment-form-head h1 { font-size: 44px; }
.assignment-form { padding: 28px; display: grid; gap: 17px; }.assignment-form > label, .assignment-form-fields label { display: grid; }
.assignment-form-fields { display: grid; grid-template-columns: minmax(0,.75fr) minmax(0,1.25fr); gap: 12px; }
.assignment-selection-preview { border: 1px solid var(--line); border-radius: 15px; overflow: hidden; background: rgba(5,13,23,.36); }.assignment-selection-preview > header { padding: 12px 14px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; gap: 14px; }.assignment-selection-preview > header span { color: var(--muted); font-size: 10px; }.assignment-selection-preview > div { max-height: 280px; overflow-y: auto; }.assignment-selection-preview article { padding: 10px 14px; border-bottom: 1px solid rgba(150,184,220,.08); display: grid; grid-template-columns: 32px minmax(0,1fr) auto; align-items: center; gap: 10px; }.assignment-selection-preview article:last-child { border-bottom: 0; }.assignment-index { color: var(--cyan); font: 800 11px ui-monospace,monospace; }
.duplicate-warning { padding: 15px; border: 1px solid rgba(245,158,11,.3); border-radius: 14px; background: rgba(245,158,11,.07); }.duplicate-warning > div strong, .duplicate-warning > div span { display: block; }.duplicate-warning > div strong { color: #ffc86b; }.duplicate-warning > div span { color: #bea782; font-size: 11px; }.duplicate-warning ul { margin: 10px 0 0; padding-left: 19px; }.duplicate-warning li { margin-top: 5px; color: #d7c7aa; }.duplicate-warning li small { margin-left: 8px; color: #917d60; }
.assignment-actions { justify-content: flex-end; }.assignment-actions .primary-button:disabled { opacity: .4; cursor: not-allowed; }
.assignment-hero { padding-bottom: 24px; }.assignment-student-filter { width: min(360px,100%); margin: 0 0 18px auto; }.assignment-student-filter label { display: grid; }
.owner-student-groups { display: grid; gap: 22px; }.student-progress-group { padding: 22px; border: 1px solid var(--line); border-radius: 22px; background: rgba(11,21,35,.76); box-shadow: var(--shadow); }.student-progress-group > header { display: grid; grid-template-columns: 46px minmax(0,1fr) auto; align-items: center; gap: 12px; margin-bottom: 15px; }.student-progress-group > header h2 { margin: 0; }.student-progress-group > header span { color: var(--muted); font-size: 10px; }.student-progress-group > header > strong { color: var(--cyan); font: 700 10px ui-monospace,monospace; }.student-avatar { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid rgba(79,224,197,.2); border-radius: 14px; color: var(--cyan); background: rgba(79,224,197,.08); font-weight: 800; }
.owner-assignment-list { display: grid; gap: 11px; }.owner-assignment-card { padding: 17px; border: 1px solid var(--line); border-radius: 16px; background: rgba(6,15,25,.58); }.owner-assignment-card > header { display: flex; justify-content: space-between; gap: 16px; }.owner-assignment-card h3 { margin: 0 0 3px; }.owner-assignment-card header span { color: var(--muted); font-size: 9px; }.owner-assignment-actions { display: grid; justify-items: end; gap: 9px; }.owner-assignment-actions form { margin: 0; }.assignment-remove-button { border: 1px solid rgba(255,111,125,.22); border-radius: 8px; padding: 6px 9px; color: #e9939c; background: rgba(255,111,125,.055); font-size: 9px; cursor: pointer; }.assignment-remove-button:hover { border-color: rgba(255,111,125,.48); color: #ffadb5; background: rgba(255,111,125,.11); }.owner-progress-pills { display: flex; align-items: flex-start; flex-wrap: wrap; justify-content: flex-end; gap: 5px; }.owner-progress-pills span { padding: 4px 7px; border-radius: 999px; }.owner-progress-pills .solved { color: #70e4c3; background: rgba(79,224,197,.1); }.owner-progress-pills .solving { color: #ffd078; background: rgba(245,158,11,.1); }.owner-progress-pills .stuck { color: #ff9ba5; background: rgba(255,111,125,.1); }
.owner-instruction { margin: 12px 0; padding: 10px 12px; border-inline-start: 3px solid var(--violet); border-radius: 9px; color: #b5a9d1; background: rgba(167,139,250,.055); font-size: 11px; }.owner-problem-statuses { display: grid; gap: 5px; }.owner-problem-statuses > div { padding: 8px 10px; border-radius: 9px; display: grid; grid-template-columns: 45px minmax(0,1fr) auto; align-items: center; gap: 9px; background: rgba(255,255,255,.025); }.owner-problem-statuses strong { min-width: 0; overflow-wrap: anywhere; font-size: 11px; }.assignment-status { padding: 3px 7px; border-radius: 999px; }.assignment-status.status-solved { color: #70e4c3; background: rgba(79,224,197,.1); }.assignment-status.status-solving { color: #ffd078; background: rgba(245,158,11,.1); }.assignment-status.status-stuck { color: #ff9ba5; background: rgba(255,111,125,.1); }.assignment-status.status-untouched { color: #8da2b8; background: rgba(141,162,184,.08); }
@media (max-width: 760px) { .assignment-form-fields { grid-template-columns: 1fr; }.student-progress-group { padding: 14px; }.student-progress-group > header { grid-template-columns: 42px 1fr; }.student-progress-group > header > strong { grid-column: 2; }.owner-assignment-card > header { flex-direction: column; }.owner-assignment-actions { justify-items: start; }.owner-progress-pills { justify-content: flex-start; }.owner-problem-statuses > div { grid-template-columns: 36px minmax(0,1fr); }.assignment-status { grid-column: 2; width: max-content; } }