/* DGNL.vn V3 / Distinct semantic hierarchy, high-contrast editorial surfaces. */
:root{--ink:#192342;--muted:#65738b;--paper:#f5f7fd;--white:#fff;--line:#e3e8f3;--deep:#172241;--teal:#0e948e;--teal2:#16b0a0;--mint:#e8faf5;--orange:#fb9c44;--shadow:0 20px 70px rgba(29,43,88,.09);--uiv2-ink:#192342;--uiv2-sea:#4855e8;--uiv2-bg:#f5f7fd;--uiv2-line:#e1e6f2;--uiv2-soft:#f0f2ff;--uiv2-shadow:0 20px 60px rgba(33,46,94,.08)}
@keyframes v3fade{from{opacity:0;transform:translate3d(0,16px,0);filter:blur(4px)}to{opacity:1;transform:translateZ(0);filter:blur(0)}}
@keyframes v3sway{0%,100%{transform:translate3d(0,0,0) rotate(-9deg)}50%{transform:translate3d(0,-13px,0) rotate(-4deg)}}
@keyframes v3glow{0%,100%{opacity:.43;transform:scale(1)}50%{opacity:.7;transform:scale(1.09)}}
@keyframes v3shimmer{to{background-position:200% 0}}
@keyframes v3pop{0%{opacity:0;transform:translateY(11px) scale(.974)}100%{opacity:1;transform:translateY(0) scale(1)}}
body{background:#f5f7fd;color:#1a2644}body[data-page=home],body[data-page=catalog],body[data-page=system]{background:linear-gradient(180deg,#f7f9ff,#f2f5fa)}
.site-header{background:rgba(255,255,255,.91)!important;border-bottom:1px solid #e9ecf5!important;box-shadow:0 5px 27px #19294d08}
.brand-symbol{background:linear-gradient(140deg,#192447,#3b47a6);box-shadow:0 8px 20px #1a2b5a22}.brand-symbol:after{background:#ffb565}.brand-name{color:#1a2446}.brand-name span{color:#5259de}.brand-sub{color:#8790a5}
.main-nav a{color:#5c6882}.main-nav a[aria-current=page],.main-nav a:hover{color:#4450d6}
.btn-primary{background:linear-gradient(120deg,#4759dc,#5c46da)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 11px 24px #5d54d538}.btn-primary:hover{background:linear-gradient(125deg,#334bd2,#4832bd)!important;box-shadow:0 15px 34px #4a51d342}
.btn-dark{background:#192443;color:white}.btn-outline{border-color:#dce2f0;background:#fff;color:#283956}.btn-outline:hover{background:#f3f5ff;border-color:#b6c2ed}
.btn-violet{background:#ede9ff;color:#5e43bd;border:1px solid #d6cdfa}.btn-violet:hover{background:#e1d9ff;box-shadow:0 9px 21px #8874d328}
button,.btn,a{ -webkit-tap-highlight-color:transparent }button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #ffae4b;outline-offset:3px}
.site-footer{background:linear-gradient(132deg,#172242,#202d51 60%,#2b2c66);color:#ecf1ff}.site-footer .brand-name{color:#fff}.site-footer .brand-name span{color:#8edfd5}
.home-hero{background:radial-gradient(circle at 81% 25%,#ddd9ff 0,transparent 35%),radial-gradient(circle at 12% 80%,#ddf7fa 0,transparent 40%),linear-gradient(135deg,#fbfcff,#f1f4ff)}
.home-hero .hero-copy h1 em{color:#5554da}.eyebrow{color:#5154d9}
.hero-art::before{content:'';position:absolute;inset:7% 8%;border:1px solid #b8b7f4;border-radius:45%;pointer-events:none;animation:v3sway 10s ease-in-out infinite alternate}
body[data-page=catalog] .page-hero,body[data-page=system] .page-hero{background:radial-gradient(circle at 83% 22%,#4d5ec3 0,transparent 37%),linear-gradient(125deg,#17223f,#303470 65%,#35478a)!important;color:white;border-bottom:none;position:relative;isolation:isolate;overflow:hidden;padding-block:55px 65px}
body[data-page=catalog] .page-hero::after,body[data-page=system] .page-hero::after{content:'';position:absolute;right:-5%;top:-70%;width:430px;height:430px;border:1px solid #ffffff30;box-shadow:0 0 0 55px #ffffff07,0 0 0 110px #ffffff05;border-radius:50%;pointer-events:none;z-index:-1;animation:v3glow 9s ease-in-out infinite}
body[data-page=catalog] .page-hero h1,body[data-page=system] .page-hero h1{color:#fff!important;letter-spacing:-.055em}
body[data-page=catalog] .page-hero p,body[data-page=system] .page-hero p,body[data-page=catalog] .page-hero .breadcrumbs,body[data-page=system] .page-hero .breadcrumbs{color:#dce5ff!important}
body[data-page=catalog] .page-hero .eyebrow,body[data-page=system] .page-hero .eyebrow{color:#caf0fc;border-color:#6a80aa;background:#ffffff12}
.explorer-shell{background:#fff;border:1px solid #e0e5f0;box-shadow:0 27px 75px #26325b14;border-radius:24px;position:relative;margin-top:-9px}
.explorer-intro{background:linear-gradient(115deg,#fff 45%,#f0edff 100%);padding-block:31px 28px;position:relative}
.explorer-intro::before{content:'';position:absolute;left:0;top:0;height:4px;width:100%;background:linear-gradient(90deg,#535ce6 0 30%,#16b5a7 30% 52%,#f6a347 52% 70%,#9464e0 70% 85%,#eb667a 85% 100%)}
.explorer-intro h2{color:#172342}.explorer-intro p{color:#76829b}.explorer-kicker{color:#5d55cc}.pulse-dot{background:#8261e5}
.explorer-totals{background:#fff;border-color:#dfe5f3;box-shadow:0 8px 24px #3a468210}.explorer-totals>span:not(.explorer-total-divider){color:#5b50d6}.explorer-totals small{color:#76849d}
.explorer-chip{background:#f4f6fb;color:#596780;border-color:#e6e9f3;transition:transform .28s cubic-bezier(.2,.8,.2,1),background .22s,box-shadow .22s}.explorer-chip:hover{background:#eff0ff;border-color:#b8baf2;color:#4d51bc;box-shadow:0 6px 13px #4552aa12}.explorer-chip.active{background:#242c58;border-color:#242c58;color:#fff;box-shadow:0 7px 18px #26346b33}.explorer-chip.active span{color:#e4e8ff;background:#47538d}
.explorer-search,.manager-tree-search{background:#f6f8fd;border-color:#e1e6f1}.explorer-search:focus-within,.manager-tree-search:focus-within{border-color:#7668db;background:white;box-shadow:0 0 0 4px #665ddc18}.explorer-search input,.manager-tree-search input{color:#1c2b46}
.explorer-tool-btn{border-color:#dfe4ef;color:#5b6882}.explorer-tool-btn:hover{background:#f0f1ff;color:#4f4bc0;border-color:#beb9f5;transform:translateY(-2px)}
.explorer-labelbar{background:#eef1f9;color:#5d6685;border-bottom-color:#dfe6f1}.explorer-labelbar>span:last-child{color:#68768e}
.explorer-directory{background:linear-gradient(180deg,#fff,#fcfdff)}
/* Clearly distinct five levels: indigo / cyan / amber / purple / coral. */
.dir-item,.manager-node{--accent:#5b64df;--light:#ecedff;--edge:#bfc5fa;--accentdark:#4049a8}
.dir-item.level-1,.manager-node.depth-1{--accent:#059eaa;--light:#e6fbfb;--edge:#aae2e8;--accentdark:#067a8b}
.dir-item.level-2,.manager-node.depth-2{--accent:#d58a19;--light:#fff5e5;--edge:#f8d3a0;--accentdark:#945b09}
.dir-item.level-3,.manager-node.depth-3{--accent:#9860da;--light:#f5ebff;--edge:#d7bdf5;--accentdark:#7541ba}
.dir-item.level-4,.manager-node.depth-4{--accent:#dd5c78;--light:#fff0f4;--edge:#f6c1ce;--accentdark:#b33555}
.dir-row,.manager-row{border-radius:13px;transition:transform .28s cubic-bezier(.2,.8,.2,1),background .25s,border-color .25s,box-shadow .25s}
.dir-group>.dir-row,.dir-nested .dir-group>.dir-row,.manager-root>.manager-node>.manager-row,.manager-node>.manager-row{background:var(--light)!important;border:1px solid transparent;}
.dir-root>.dir-group>.dir-row,.manager-root>.manager-node>.manager-row{background:linear-gradient(90deg,#f1f1ff,#f8f9ff)!important;border-color:#dadffa}
.dir-leaf>.dir-row{background:#fff!important;border:1px solid #e3e8f3}
.dir-group>.dir-row:hover,.dir-nested .dir-group>.dir-row:hover,.dir-leaf>.dir-row:hover,.manager-node>.manager-row:hover{background:color-mix(in srgb,var(--light),white 35%)!important;border-color:var(--edge)!important;box-shadow:0 9px 24px #1f2b5415;transform:translateX(3px)}
.dir-row::before,.manager-row::before{content:'';position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:7px;background:var(--accent);opacity:.9}
.manager-row{position:relative}.dir-arrow,.manager-toggle{color:var(--accentdark);border-color:var(--edge);background:white}.dir-arrow:hover,.manager-toggle:hover{background:var(--light);color:var(--accentdark)}
.dir-icon,.dir-nested .dir-icon,.manager-level-icon,.manager-node.is-leaf .manager-level-icon{background:white!important;color:var(--accent)!important;box-shadow:inset 0 0 0 1px var(--edge)}
.dir-row:hover .dir-icon,.manager-row:hover .manager-level-icon{transform:rotate(-4deg) scale(1.08)}
.dir-name,.manager-label{color:#1c2a45}.dir-name small,.manager-label small{color:#67758d}.dir-root>.dir-item>.dir-row .dir-name strong{color:#27316d}
.dir-meta,.manager-childcount{background:white;color:var(--accentdark);border:1px solid var(--edge)}
.dir-nested,.manager-nested{border-left:1px dashed #cbd0eb}.dir-go{background:#5158da;color:white}.dir-go:hover{background:#373ab3;box-shadow:0 10px 20px #5360c82d}
.dir-fold,.manager-fold{transition:grid-template-rows .42s cubic-bezier(.16,.77,.22,1),opacity .3s ease}
.dir-item.is-open>.dir-row,.manager-node.is-selected>.manager-row{border-color:var(--edge)!important;box-shadow:0 5px 20px #202a5410}
.manager-node .manager-label strong{color:#233151}.manager-actions .manager-icon-btn{color:#53617d}.manager-icon-btn:hover{background:#fff;color:var(--accentdark);box-shadow:0 5px 15px #1e315320}
.manager-status.is-published{background:#dff8ee;color:#087b5c}.manager-status.is-draft{background:#fff0dc;color:#925b0a}
.explorer-bottom{background:#f5f7fe;border-top-color:#e4e8f3;color:#71809b}.explorer-bottom a{color:#5053ce}
/* Console: separate navy nav and vivid KPI tokens */
.console-body{background:#f5f7fc}.console-side{background:linear-gradient(165deg,#141e39,#262953 83%,#362c69)!important;border-right:1px solid #5d63904d}.console-side .side-link.active{background:#ffffff17;box-shadow:inset 3px 0 0 #65d5de}.console-side .brand-name{color:white}.console-side .brand-name span{color:#96dae4}.console-status{border-color:#58658955}
.console-main{background:radial-gradient(circle at 88% 1%,#e9e6ff 0,transparent 22%),#f5f7fc}.console-top h1{color:#202849}.console-top .overline{color:#6265c6}
.demo-banner{background:#fff7e9!important;border:1px solid #f2d9aa!important;color:#9f6323!important}.demo-banner strong{color:#874d10!important}
.stats-grid .stat-card{border:1px solid #e5eaf4;background:#fff;position:relative;overflow:hidden;box-shadow:0 9px 25px #202b5311}
.stats-grid .stat-card::before{content:'';position:absolute;left:0;top:0;height:4px;width:100%;background:var(--tone,#5b64df)}
.stats-grid .stat-card:nth-child(1){--tone:#5767dc}.stats-grid .stat-card:nth-child(2){--tone:#09a9ae}.stats-grid .stat-card:nth-child(3){--tone:#ed9b35}.stats-grid .stat-card:nth-child(4){--tone:#9455d7}
.stats-grid .stat-card .stat-value{color:var(--tone)}.stats-grid .stat-card:hover{transform:translateY(-5px)}
.manager-tree-head h3{color:#192544}.manager-tree-head .overline{color:#5e5ed0}.console-board-v2{border-color:#dfe5f0;box-shadow:0 16px 50px #28375b10}
.manager-row .manager-level-icon{transition:transform .3s ease}.manager-node.is-leaf>.manager-row{background:#fff!important;border:1px solid #e8ebf4}
.drawer-overlay:not([hidden]){backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.drawer-overlay:not([hidden]) .drawer{animation:v3slide .38s cubic-bezier(.16,.8,.22,1)}
@keyframes v3slide{from{opacity:.65;transform:translate3d(35px,0,0)}to{opacity:1;transform:translateZ(0)}}
.console-overlay:not([hidden]) .modal{animation:v3pop .3s cubic-bezier(.18,.9,.24,1)}
.drawer-head{background:linear-gradient(125deg,#f0f0ff,#fff)!important;border-bottom:1px solid #e5e8f6}.drawer-tabs button.active{color:#5147ce;border-bottom-color:#5c51d6}.question-card{border-color:#e6eaf4;background:#fff;transition:transform .18s,box-shadow .18s,border-color .18s}.question-card:hover{border-color:#c9cafa;box-shadow:0 8px 22px #313d7410;transform:translateY(-1px)}
.question-option-preview span{background:#f5f7fc}.question-answer{color:#5152b8}.notice{background:#eef4ff;color:#4b6091}.notice.warn{background:#fff4e5;color:#99632f}
/* Groups are visibly containers, unlike standalone single questions. */
.v3-qtoolbar{align-items:flex-start}.v3-qactions{display:flex;flex-wrap:wrap;gap:7px;justify-content:flex-end}
.v3-group-editor{background:#faf9ff;border:1px solid #cfc4f1;border-radius:19px;padding:14px;margin:16px 0;box-shadow:0 9px 34px #5b47a511;position:relative;overflow:hidden;animation:v3fade .32s both}
.v3-group-editor:before{content:'';height:5px;background:linear-gradient(90deg,#7652d6,#a97bec,#d1b0ff);position:absolute;top:0;left:0;right:0}
.v3-group-header{display:flex;align-items:flex-start;justify-content:space-between;gap:9px;padding:9px 4px 12px}.v3-group-header h3{font-size:16px;margin:5px 0 0;color:#46367e;overflow-wrap:anywhere}.v3-group-label{display:flex;align-items:center;gap:11px;min-width:0}.v3-group-label .overline{color:#8966bd}.v3-group-symbol{display:grid;place-items:center;flex:none;width:41px;height:41px;border-radius:13px;background:#eae0ff;color:#7350ce}
.v3-group-excerpt{font-size:13px;line-height:1.75;color:#4d5470;background:#fff;padding:14px;border-radius:12px;border:1px solid #eae5f6;white-space:pre-wrap;max-height:170px;overflow:auto;margin:0 0 12px}.v3-group-image-note{font-size:12px;color:#7358b2;margin:0 0 12px}.v3-group-children{display:grid;gap:8px}.v3-group-children .question-card{margin:0;border-left:3px solid #a481e7}.v3-group-empty{padding:20px;background:#fff;border:1px dashed #bdb2dc;border-radius:12px;font-size:12px;color:#8676a9}.v3-group-footer{border-top:1px solid #e3ddf4;padding:13px 3px 1px;display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.v3-group-footer span{font-size:11px;color:#817899}.v3-import-note{line-height:1.85}.v3-import-note code{background:white;padding:2px 5px;border-radius:4px;color:#5547a9}
/* Exam player: group passage stays visible on each subquestion. */
.player-body{background:linear-gradient(150deg,#f0f3fc,#f6f8ff)}.player-top{background:#fff;border-bottom:1px solid #e3e7f3}.player-card,.player-side{border:1px solid #e0e6f2;box-shadow:0 10px 28px #283a6510}.player-kicker{color:#5754ce}.player-progress{background:#e6e9f7}.player-progress span{background:linear-gradient(90deg,#5666e2,#15aab4)}
.question-number .num{background:#ebedff;color:#5453c8}.answer-choice{border-color:#dfe5f2;transition:transform .2s,background .2s,border-color .2s,box-shadow .2s}.answer-choice:hover{background:#f6f5ff;border-color:#c3b9f1;transform:translateX(4px)}.answer-choice.selected{background:#f0edff;border-color:#7b65d4;box-shadow:0 0 0 1px #7b65d4,0 6px 20px #7662d215}.answer-choice.selected .letter{background:#6255cd;border-color:#6255cd;color:white}.answer-choice .letter{border-color:#d2d8ea}
.number-grid button{background:#f6f7fc;border-color:#dfe5ef;color:#60708b}.number-grid button.answered{background:#e5f6f2;border-color:#8dcfbe;color:#0c827e}.number-grid button.current{border-color:#675bd0;color:#5049b4;box-shadow:0 0 0 1px #675bd0}.number-grid button.is-grouped{border-bottom:3px solid #a17be0}
.passage-card{border:1px solid #d3c9f2;background:linear-gradient(140deg,#f7f3ff,#fdfbff);border-radius:17px;padding:clamp(15px,2.5vw,24px);margin:10px 0 25px;box-shadow:0 8px 25px #6954bd12;animation:v3fade .35s both}
.passage-top{display:flex;align-items:center;flex-wrap:wrap;gap:9px;font-size:10px;letter-spacing:.085em;font-weight:840;color:#6a50b2}.passage-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:#eae2ff;color:#6c52be}.passage-count{margin-left:auto;background:white;color:#7457b8;border:1px solid #d8c9ef;padding:5px 9px;border-radius:99px;letter-spacing:0}.passage-card h2{font-size:clamp(17px,2.6vw,22px);color:#342864;margin:16px 0 10px}.passage-body{font-size:14px;line-height:1.92;white-space:pre-wrap;overflow-wrap:anywhere;color:#3c3c60}.passage-image{display:block;max-height:380px;max-width:100%;object-fit:contain;border-radius:11px;margin:16px auto 0;box-shadow:0 7px 20px #1d285015}
.review-passage{border:1px solid #d8c9f1;background:#f7f2ff;border-radius:13px;padding:15px;margin-bottom:15px}.review-passage strong{font-size:14px;color:#5e42ab}.review-passage p{font-size:13px;line-height:1.75;color:#4b4c70;white-space:pre-wrap;margin:9px 0}.review-passage img{max-height:300px;display:block;object-fit:contain;margin:9px 0;border-radius:9px}
.review-item.correct{border-left-color:#13a688}.review-item.wrong{border-left-color:#e47a48}.review-explain{background:#f0f2ff;color:#48517c}.result-ring{background:conic-gradient(#6555d7 var(--score),#e5e8f5 0)}
/* Lightweight reveal and press feedback, honor reduced motion. */
[data-v3-reveal]{opacity:0;transform:translateY(13px);transition:opacity .55s ease,transform .55s cubic-bezier(.18,.8,.23,1)}[data-v3-reveal].v3-revealed{opacity:1;transform:translateY(0)}
.v3-ripple-host{position:relative;overflow:hidden}.v3-ripple{position:absolute;pointer-events:none;width:10px;height:10px;border-radius:50%;background:currentColor;opacity:.12;transform:translate(-50%,-50%) scale(0);animation:v3rip .52s ease-out forwards}
@keyframes v3rip{to{opacity:0;transform:translate(-50%,-50%) scale(32)}}
@media(max-width:700px){body[data-page=catalog] .page-hero,body[data-page=system] .page-hero{padding:31px 0 45px}.explorer-intro{padding:25px 18px}.v3-qtoolbar{flex-direction:column}.v3-qactions{justify-content:flex-start;width:100%}.v3-qactions .btn{flex:1}.v3-group-header{align-items:flex-start}.v3-group-header .question-ops{flex-wrap:wrap;justify-content:flex-end}}
@media(max-width:440px){.dir-row::before,.manager-row::before{left:0;top:9px;bottom:9px;width:2px}.v3-group-editor{padding:10px}.v3-group-header{flex-direction:column}.passage-card{padding:14px}.passage-count{margin-left:0}.console-side{box-shadow:10px 0 36px #0f1d3b4d}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}[data-v3-reveal]{opacity:1!important;transform:none!important}}
.v3-box-separator{padding:10px 7px 0;margin:7px 0 -3px}.v3-box-separator span{display:inline-flex;gap:6px;align-items:center;font-size:9px;letter-spacing:.12em;font-weight:850;color:#6f7c99;background:#eff2fa;border-radius:99px;padding:5px 10px;border:1px solid #e1e7f2}


/* V3.1 — Better tree-row separation + mobile submit at the bottom. */
/* Distinct cards, air between every sibling, and visible hierarchy guide. */
.dir-root{gap:15px}
.dir-nested{display:grid;gap:11px;padding-top:13px;padding-bottom:13px;border-left:2px solid #c4c9ee}
.dir-nested .dir-nested{gap:10px;border-left-color:#d9dcef}
.dir-item>.dir-row{min-height:70px;margin:0!important;padding:11px 14px;border-width:1px!important;box-shadow:0 2px 8px rgba(29,43,83,.045);isolation:isolate}
.dir-group>.dir-row,.dir-nested .dir-group>.dir-row{border-color:var(--edge)!important}
.dir-leaf>.dir-row{border:1px solid #d9e0ec!important;background:linear-gradient(110deg,#fff 50%,#f8faff)!important}
.dir-item.is-open>.dir-row{box-shadow:0 6px 20px rgba(35,46,91,.09)!important}
.dir-row::before{width:4px;top:11px;bottom:11px}
.dir-row:focus-within{outline:2px solid var(--accent);outline-offset:2px}
.dir-nested>.dir-item{width:100%}
.dir-row:hover{transform:translateX(2px)}
.player-submit-zone{margin-top:20px;padding-top:18px;border-top:1px solid #e1e6f2;display:flex;flex-direction:column;gap:11px}
.player-submit-title{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:840;color:#273452}
.player-submit-hint{font-size:12px!important;line-height:1.55;color:#71809b;margin:0!important}
.player-submit-button{width:100%;min-height:48px;display:flex;justify-content:center;align-items:center;gap:8px;font-size:14px;transition:transform .22s ease,box-shadow .22s ease,background .22s ease}
.player-submit-button:hover{transform:translateY(-2px);box-shadow:0 10px 24px #2331522b}
.player-save-note{font-size:11px!important;line-height:1.6;margin:0!important;color:#77849a}
#player-question-card{scroll-margin-top:86px}
@media(max-width:840px){
  .player-layout{display:flex;flex-direction:column;gap:15px;padding-top:19px}
  .player-left{order:0;width:100%}
  .player-side{order:1;width:100%;position:static;margin-top:4px;border-radius:20px;padding:20px}
  .player-side .number-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
  .player-side .number-grid button{min-height:40px}
  .player-submit-zone{margin-top:24px;padding:22px 16px 16px;background:linear-gradient(140deg,#f4f3ff,#fafbff);border:1px solid #d9d4f5;border-radius:17px}
  .player-submit-button{background:linear-gradient(120deg,#333a83,#4b3ea6);min-height:52px}
  .player-question-card{animation:v3pop .32s ease both}
}
@media(max-width:570px){
  .dir-root{gap:13px}
  .dir-nested,.dir-nested .dir-nested{gap:10px;padding-top:10px;padding-bottom:10px}
  .dir-item>.dir-row{min-height:64px;padding:10px 9px;box-shadow:0 2px 8px #2531550d}
  .dir-row::before{width:3px;top:10px;bottom:10px}
  .player-side .number-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}
  .player-side .number-grid button{min-height:46px;border-radius:12px;font-size:13px}
  .player-side .legend{gap:12px;line-height:1.55}
  .player-submit-zone{margin-top:23px;padding:17px 14px}
  .player-submit-button{min-height:54px;font-size:15px}
  .question-nav-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .question-nav-controls>.btn{padding-inline:8px;justify-content:center;min-width:0}
  #player-question-card{scroll-margin-top:74px}
}
@media(max-width:440px){
  .dir-root{gap:12px}
  .dir-item>.dir-row{gap:6px;padding:9px 7px}
  .dir-nested{margin-left:8px;padding-left:9px}
  .dir-nested .dir-nested{margin-left:7px;padding-left:7px}
  .dir-nested .dir-nested .dir-nested{padding-left:6px}
  .dir-nested .dir-nested .dir-nested .dir-nested{padding-left:5px}
  .dir-icon{width:28px!important;height:30px!important}
  .dir-row .dir-name strong{line-height:1.55}
}
@media(prefers-reduced-motion:reduce){.player-question-card,.dir-item>.dir-row{animation:none!important;transition:none!important}}

/* DGNL.vn V4.1 — Cache & Hiệu năng */
.dgnl-cache-panel{color:#273453;animation:cacheEnter .32s ease both}.dgnl-cache-hero{display:flex;align-items:center;gap:15px;background:linear-gradient(120deg,#1c2958,#5141ae);border-radius:18px;color:#fff;padding:19px 20px;margin:2px 0 15px}.dgnl-cache-hero h3{color:#fff;font-size:19px;margin:4px 0}.dgnl-cache-hero p{color:#dce6ff;font-size:12px;line-height:1.6;margin:0}.cache-pulse{width:50px;height:50px;display:grid;place-items:center;border:1px solid #ffffff61;background:#ffffff20;border-radius:15px;font-size:24px;flex-shrink:0;animation:cachePulse 2.7s ease-in-out infinite}.dgnl-cache-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-bottom:16px}.dgnl-cache-stats>div{background:#f6f8fe;border:1px solid #dfe5f6;border-radius:13px;padding:12px;display:grid;gap:7px}.dgnl-cache-stats span{font-size:11px;color:#637496}.dgnl-cache-stats strong{font-size:14px;color:#1d2e59}.dgnl-cache-panel .field{margin:12px 0}.dgnl-cache-panel select,.dgnl-cache-panel input{width:100%;border-radius:12px;border:1px solid #cbd6eb;background:#fff;padding:12px;color:#1c2b45;font-size:14px}.dgnl-cache-panel label{display:block;margin:0 0 8px;font-weight:750;font-size:13px}.cache-inherit-note{font-size:12px;color:#3f5175;padding:13px;background:#ecf8fc;border:1px solid #c7e7f0;border-radius:12px;line-height:1.7}.dgnl-cache-actions{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0}.dgnl-cache-actions .btn{min-height:43px}.dgnl-cache-foot{font-size:12px;line-height:1.7;color:#586985;padding:12px;border-left:3px solid #a89bed;background:#f7f6ff;border-radius:0 10px 10px 0}[hidden].dgnl-cache-duration,#cache-custom-ttl[hidden]{display:none!important}@keyframes cacheEnter{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}@keyframes cachePulse{50%{transform:scale(1.08);box-shadow:0 0 0 9px #fff1}}@media(max-width:540px){.dgnl-cache-hero{padding:15px;gap:10px}.dgnl-cache-stats{grid-template-columns:1fr 1fr}.dgnl-cache-stats>div:last-child{grid-column:1/-1}.dgnl-cache-actions .btn{width:100%}}@media(prefers-reduced-motion:reduce){.dgnl-cache-panel,.cache-pulse{animation:none!important}}

.dgnl-cache-test-result:not(:empty){font-size:12px;color:#25486b;padding:12px;border:1px solid #cfe1f7;border-radius:12px;background:#f1f8ff;margin-top:9px;line-height:1.6}


/* V4.7.2 — true completed-submission counters for each paper. */
.dir-attempt-count{display:inline-flex;gap:5px;align-items:center;white-space:nowrap;padding:6px 9px;border-radius:9px;background:#eff4ff;color:#4f5d90;border:1px solid #dce4ff;font-weight:750;font-size:11px;flex-shrink:0}
.dir-attempt-count svg,.paper-attempts svg{width:14px;height:14px;flex:none}
.paper-attempts{color:#53679a;font-weight:720}
@media(max-width:700px){.dir-row .dir-attempt-count{padding:5px 7px;font-size:10px}.dir-row .dir-attempt-count span{max-width:82px;overflow:hidden;text-overflow:ellipsis}}
@media(max-width:520px){.dir-leaf>.dir-row{flex-wrap:wrap;row-gap:8px}.dir-leaf .dir-attempt-count{margin-left:42px;order:4}.dir-leaf .dir-go{order:5;margin-left:auto}}

/* Responsive deep leaf: reserve full usable width for the title, place completed attempts on second line. */
@media(max-width:800px){
 .dir-leaf>.dir-row{display:grid!important;grid-template-columns:22px 30px minmax(0,1fr) 33px;column-gap:6px;row-gap:7px;align-items:center;flex-wrap:initial!important;min-width:0;padding:10px 6px!important}
 .dir-leaf>.dir-row>.dir-line{display:none}
 .dir-leaf>.dir-row>.dir-file-decor{grid-column:1;grid-row:1;width:22px;height:22px}
 .dir-leaf>.dir-row>.dir-icon{grid-column:2;grid-row:1;width:30px!important;height:30px!important}
 .dir-leaf>.dir-row>.dir-name{grid-column:3;grid-row:1;min-width:0;width:100%;overflow-wrap:normal;word-break:normal}
 .dir-leaf>.dir-row>.dir-name strong{overflow-wrap:break-word;word-break:normal;hyphens:none}
 .dir-leaf>.dir-row>.dir-go{grid-column:4;grid-row:1;justify-self:end;margin:0!important;padding:8px;min-width:33px;min-height:33px;justify-content:center}
 .dir-leaf>.dir-row>.dir-attempt-count{grid-column:3 / 5;grid-row:2;justify-self:start;margin:0!important;order:initial!important;max-width:100%}
 .dir-leaf>.dir-row>.dir-meta{display:none!important}
}

/* V4.3: SEO editor */
.dgnl-seo-panel{padding:20px}.dgnl-seo-panel .notice p{margin:8px 0 0}.seo-url-text{border:1px solid #dbe4f6;background:#f7faff;padding:13px 15px;border-radius:12px;font-size:13px;overflow-wrap:anywhere;color:#4a57a1}.seo-preview{margin-top:18px;border:1px solid #e1e8f4;padding:22px;border-radius:18px;background:#fff;box-shadow:0 8px 24px #20305b0b}.seo-preview small{color:#2b7a65}.seo-preview-title{color:#354eaa;font-size:20px;font-weight:780;margin:9px 0}.seo-preview p{color:#627086;font-size:14px;line-height:1.6;margin:0}@media(max-width:600px){.dgnl-seo-panel{padding:10px}.seo-preview{padding:17px}}

/* Actual completed-paper badges: visually separated from directory metadata */
.dir-attempt-count{background:#eaf9f2;border-color:#c8ecdc;color:#116d4e}.paper-attempts{color:#116d4e;font-weight:760}