* {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
     user-select: none;
     -webkit-user-select: none;
 }

 input,
 textarea,
 select,
 [contenteditable] {
     user-select: text;
     -webkit-user-select: text;
 }

 html,
 body {
     width: 100%;
     min-height: 100vh;
 }

 body {
     background: #000;
     color: #00ffff;
     font-family: 'Share Tech Mono', monospace;
     overflow-x: hidden;
     position: relative;
 }

 #particleCanvas {
     position: fixed;
     inset: 0;
     z-index: 0;
 }

 .bg-grid {
     position: fixed;
     inset: 0;
     background-image: linear-gradient(rgba(0, 255, 255, 0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 255, 255, 0.04) 1px, transparent 1px);
     background-size: 40px 40px;
     pointer-events: none;
     z-index: 0;
 }

 .scanlines {
     position: fixed;
     inset: 0;
     pointer-events: none;
     z-index: 9;
     background: repeating-linear-gradient(0deg, transparent, transparent 3px, rgba(0, 0, 0, 0.04) 3px, rgba(0, 0, 0, 0.04) 4px);
     opacity: 0.5;
 }

 .corner {
     position: fixed;
     width: 36px;
     height: 36px;
     z-index: 2;
 }

 .corner::before,
 .corner::after {
     content: '';
     position: absolute;
     background: #00ffff;
 }

 .corner::before {
     width: 100%;
     height: 1.5px;
     top: 0;
 }

 .corner::after {
     width: 1.5px;
     height: 100%;
     top: 0;
 }

 .corner.tl {
     top: 10px;
     left: 10px;
 }

 .corner.tr {
     top: 10px;
     right: 10px;
     transform: scaleX(-1);
 }

 .corner.bl {
     bottom: 10px;
     left: 10px;
     transform: scaleY(-1);
 }

 .corner.br {
     bottom: 10px;
     right: 10px;
     transform: scale(-1);
 }

 /* LOGIN */
 #loginScreen {
     position: fixed;
     inset: 0;
     z-index: 100;
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 16px;
 }

 .login-box {
     position: relative;
     z-index: 2;
     width: 100%;
     max-width: 400px;
     background: rgba(0, 3, 8, .95);
     border: 1px solid rgba(0, 255, 255, .2);
     padding: 36px 32px 28px;
     text-align: center;
     backdrop-filter: blur(10px);
     -webkit-backdrop-filter: blur(10px);
     margin: auto;
 }

 .login-box::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 1px;
     background: linear-gradient(90deg, transparent, #00ffff, transparent);
 }

 .login-title {
     font-family: 'Orbitron', sans-serif;
     font-size: clamp(24px, 5vw, 36px);
     font-weight: 900;
     letter-spacing: clamp(6px, 2vw, 14px);
     color: #00ffff;
     text-shadow: 0 0 12px #00ffff, 0 0 24px rgba(0, 255, 255, .3);
     animation: titlePulse 3s ease-in-out infinite;
     margin-bottom: 8px;
 }

 @keyframes titlePulse {

     0%,
     100% {
         text-shadow: 0 0 10px #00ffff, 0 0 20px rgba(0, 255, 255, .2);
     }

     50% {
         text-shadow: 0 0 18px #00ffff, 0 0 36px rgba(0, 255, 255, .4), 0 0 60px rgba(0, 255, 255, .1);
     }
 }

 .login-sub {
     font-size: 13px;
     letter-spacing: 3px;
     color: rgba(0, 255, 255, .35);
     margin-bottom: 24px;
     text-transform: uppercase;
 }

 .login-divider {
     display: flex;
     align-items: center;
     gap: 8px;
     justify-content: center;
     margin-bottom: 22px;
 }

 .ldl {
     height: 1px;
     width: 30px;
     background: linear-gradient(90deg, transparent, rgba(0, 255, 255, .25));
 }

 .ldl.r {
     background: linear-gradient(90deg, rgba(0, 255, 255, .25), transparent);
 }

 .ldd {
     width: 2px;
     height: 2px;
     border-radius: 50%;
     background: #00ffff;
     box-shadow: 0 0 4px #00ffff;
 }

 .btn-google {
     width: 100%;
     background: rgba(255, 255, 255, .03);
     border: 1px solid rgba(0, 255, 255, .28);
     color: #00ffff;
     font-family: 'Share Tech Mono', monospace;
     font-size: 11px;
     letter-spacing: 2px;
     padding: 9px 12px;
     cursor: pointer;
     transition: all .2s;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
     margin-bottom: 12px;
 }

 .btn-google:hover {
     background: rgba(0, 255, 255, .06);
     border-color: #00ffff;
     box-shadow: 0 0 10px rgba(0, 255, 255, .2);
 }

 .google-icon {
     width: 13px;
     height: 13px;
     flex-shrink: 0;
 }

 .login-or {
     display: flex;
     align-items: center;
     gap: 8px;
     margin-bottom: 18px;
 }

 .login-or-line {
     flex: 1;
     height: 1px;
     background: rgba(0, 255, 255, .08);
 }

 .login-or-text {
     font-size: 11px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .2);
 }

 .login-field {
     display: flex;
     flex-direction: column;
     gap: 5px;
     margin-bottom: 14px;
     text-align: left;
 }

 .login-label {
     font-size: 11px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .38);
 }

 .login-input {
     background: rgba(0, 255, 255, .03);
     border: 1px solid rgba(0, 255, 255, .15);
     color: #00ffff;
     font-family: 'Share Tech Mono', monospace;
     font-size: 14px;
     padding: 13px 14px;
     outline: none;
     transition: all .2s;
     width: 100%;
 }

 .login-input:focus {
     border-color: rgba(0, 255, 255, .6);
     box-shadow: 0 0 6px rgba(0, 255, 255, .12);
 }

 .login-input::placeholder {
     color: rgba(0, 255, 255, .15);
 }

 .btn-login {
     width: 100%;
     background: transparent;
     border: 1px solid rgba(0, 255, 255, .5);
     color: #00ffff;
     font-family: 'Share Tech Mono', monospace;
     font-size: 11px;
     letter-spacing: 3px;
     padding: 9px;
     cursor: pointer;
     transition: all .2s;
     margin-top: 4px;
 }

 .btn-login:hover {
     background: rgba(0, 255, 255, .07);
     box-shadow: 0 0 10px rgba(0, 255, 255, .25);
 }

 .login-msg {
     font-size: 12px;
     letter-spacing: 1px;
     margin-top: 6px;
     min-height: 12px;
     text-align: center;
 }

 .login-msg.err {
     color: #ff6b6b;
 }

 .login-msg.ok {
     color: #00ff88;
 }

 .login-msg.loading {
     color: rgba(0, 255, 255, .4);
 }

 .login-toggle {
     margin-top: 10px;
     font-size: 12px;
     color: rgba(0, 255, 255, .25);
     letter-spacing: 1px;
 }

 .login-toggle a {
     color: rgba(0, 255, 255, .5);
     cursor: pointer;
     text-decoration: underline;
 }

 .login-toggle a:hover {
     color: #00ffff;
 }

 /* APP */
 #appScreen {
     display: none;
     min-height: 100vh;
     background: var(--bg, #000);
 }

 .app {
     position: relative;
     z-index: auto;
     width: 100%;
     max-width: 960px;
     margin: 0 auto;
     padding: 0 16px 80px;
 }

 .header {
     text-align: center;
     padding: 56px 0 28px;
 }

 .sys-title {
     font-family: 'Orbitron', sans-serif;
     font-size: clamp(32px, 7vw, 56px);
     font-weight: 900;
     letter-spacing: clamp(8px, 4vw, 22px);
     color: #00ffff;
     text-shadow: 0 0 20px #00ffff, 0 0 40px rgba(0, 255, 255, .4);
     animation: titlePulse 3s ease-in-out infinite;
     margin-bottom: 10px;
 }

 .sys-sub {
     font-size: clamp(9px, 2vw, 12px);
     letter-spacing: clamp(2px, 1.5vw, 5px);
     color: rgba(0, 255, 255, .4);
     text-transform: uppercase;
 }

 .divider {
     display: flex;
     align-items: center;
     gap: 10px;
     justify-content: center;
     margin-top: 16px;
     margin-bottom: 12px;
 }

 .divider-line {
     height: 1px;
     width: clamp(30px, 8vw, 60px);
     background: linear-gradient(90deg, transparent, rgba(0, 255, 255, .4));
 }

 .divider-line.right {
     background: linear-gradient(90deg, rgba(0, 255, 255, .4), transparent);
 }

 .divider-dot {
     width: 3px;
     height: 3px;
     border-radius: 50%;
     background: #00ffff;
     box-shadow: 0 0 4px #00ffff;
 }

 /* USER CHIP */
 .user-bar {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 8px 16px;
     margin-top: 16px;
     margin-bottom: 0;
     flex-wrap: nowrap;
     gap: 8px;
     background: transparent;
 }

 .user-chip {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 4px 10px 4px 4px;
     cursor: pointer;
     position: relative;
     background: transparent;
     border: none;
 }

 .user-chip:hover .chip-name {
     color: #00ffff;
 }

 .user-info {
     display: flex;
     align-items: center;
     gap: 8px;
 }

 .user-avatar {
     width: 34px;
     height: 34px;
     min-width: 34px;
     border-radius: 50%;
     border: 2px solid rgba(0, 255, 255, .5);
     object-fit: cover;
     object-position: center;
     box-shadow: 0 0 8px rgba(0, 255, 255, .3);
     display: block;
     overflow: hidden;
 }

 .user-avatar-placeholder {
     width: 34px;
     height: 34px;
     min-width: 34px;
     border-radius: 50%;
     border: 0px solid rgba(0, 255, 255, .5);
     background: rgba(0, 255, 255, .1);
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 13px;
     color: #00ffff;
     box-shadow: 0 0 8px rgba(0, 255, 255, .3);
     overflow: hidden;
     flex-shrink: 0;
 }

 .user-chip .user-info img {
     width: 34px;
     height: 34px;
     min-width: 34px;
     border-radius: 50%;
     object-fit: cover;
     object-position: center;
     border: 0px solid rgba(0, 255, 255, .5);
     box-shadow: 0 0 8px rgba(0, 255, 255, .3);
     flex-shrink: 0;
 }

 .user-name {
     font-size: 15px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .8);
     transition: color .2s;
 }

 .user-email {
     display: none;
 }

 .chip-arrow {
     font-size: 12px;
     color: rgba(0, 255, 255, .5);
     transition: transform .2s;
     margin-left: 2px;
 }

 .user-chip.dd-open .chip-arrow {
     transform: rotate(180deg);
 }

 .btn-logout {
     display: none;
 }

 /* DROPDOWN cyberpunk animado */
 .user-dropdown {
     position: absolute;
     top: calc(100% + 6px);
     right: 0;
     min-width: 180px;
     width: max-content;
     background: rgba(0, 3, 10, .97);
     z-index: 500;
     display: none;
     overflow: hidden;
 }

 .user-dropdown.show {
     display: block;
 }

 /* borda animada com gradiente em movimento */
 .user-dropdown {
     border: 1px solid rgba(0, 255, 255, .2);
 }

 .user-dropdown-canvas {
     position: absolute;
     inset: -1px;
     pointer-events: none;
     z-index: 10;
 }

 .user-dropdown-inner {
     position: relative;
     z-index: 1;
     background: rgba(0, 3, 10, .97);
 }

 .dd-item {
     display: flex;
     align-items: center;
     gap: 10px;
     padding: 11px 18px;
     font-size: 12px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .75);
     cursor: pointer;
     border-bottom: 1px solid rgba(0, 255, 255, .07);
     transition: all .15s;
     white-space: nowrap;
 }

 .dd-item:last-child {
     border: none;
 }

 .dd-item:hover {
     background: rgba(0, 255, 255, .07);
     color: #00ffff;
 }

 .dd-item.red {
     color: rgba(255, 107, 107, .7);
 }

 .dd-item.red:hover {
     background: rgba(255, 107, 107, .06);
     color: #ff6b6b;
 }

 /* ── PAINEL TÁTICO ── */
 .pt-table {
     width: 100%;
     border-collapse: collapse;
 }

 .pt-table th {
     font-size: 12px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .4);
     padding: 10px 14px;
     text-align: center;
     border-bottom: 1px solid rgba(0, 255, 255, .1);
     background: rgba(0, 0, 0, .3);
 }

 .pt-table th:first-child {
     text-align: left;
 }

 .pt-table td {
     padding: 11px 14px;
     border-bottom: 1px solid rgba(0, 255, 255, .06);
     font-size: 13px;
     text-align: center;
     vertical-align: middle;
 }

 .pt-table td:first-child {
     text-align: left;
 }

 .pt-table tr:last-child td {
     border: none;
 }

 .pt-table tr:hover td {
     background: rgba(0, 255, 255, .02);
 }

 .pt-disc-cell {
     display: flex;
     align-items: center;
     gap: 8px;
 }

 .pt-disc-dot {
     width: 8px;
     height: 8px;
     border-radius: 50%;
     flex-shrink: 0;
 }

 .pt-disc-name {
     color: #00ffff;
     font-size: 13px;
     letter-spacing: .5px;
 }

 .pt-time {
     font-family: 'Orbitron', sans-serif;
     font-size: 13px;
     color: rgba(0, 255, 255, .8);
 }

 .pt-cor {
     color: #00ff88;
 }

 .pt-err {
     color: #ff6b6b;
 }

 .pt-tot {
     color: rgba(0, 255, 255, .6);
 }

 .pt-footer {
     display: flex;
     justify-content: flex-end;
     align-items: center;
     gap: 20px;
     padding: 10px 14px;
     border-top: 1px solid rgba(0, 255, 255, .1);
     font-size: 11px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .4);
     flex-wrap: wrap;
 }

 .pt-footer-val {
     font-family: 'Orbitron', sans-serif;
     font-size: 13px;
     color: #00ffff;
     margin-left: 4px;
 }

 /* badge sessão ativa no timer */
 .sess-badge {
     display: none;
     align-items: center;
     gap: 10px;
     padding: 10px 20px;
     border: 1px solid rgba(0, 255, 255, .2);
     background: rgba(0, 255, 255, .04);
     text-align: left;
     max-width: 90vw;
 }

 .sess-badge.show {
     display: flex;
 }

 .sess-badge-dot {
     width: 9px;
     height: 9px;
     border-radius: 50%;
     background: #00ffff;
     animation: blink 1s step-end infinite;
     flex-shrink: 0;
 }

 .sess-badge-disc {
     font-size: clamp(11px, 3vw, 13px);
     letter-spacing: 2px;
     color: #00ffff;
 }

 .sess-badge-top {
     font-size: clamp(9px, 2vw, 10px);
     color: rgba(0, 255, 255, .45);
     letter-spacing: 1px;
     margin-top: 3px;
 }

 /* ── EDITAL VERTICALIZADO ── */
 .ed-top {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 14px;
     flex-wrap: wrap;
     gap: 10px;
 }

 .ed-title {
     font-family: 'Orbitron', sans-serif;
     font-size: 12px;
     font-weight: 700;
     letter-spacing: 4px;
     color: #00ffff;
     text-shadow: 0 0 10px rgba(0, 255, 255, .3);
 }

 .ed-btns {
     display: flex;
     gap: 8px;
 }

 .ed-btn {
     background: transparent;
     border: 1px solid rgba(0, 255, 255, .35);
     color: #00ffff;
     font-family: 'Share Tech Mono', monospace;
     font-size: 11px;
     letter-spacing: 2px;
     padding: 7px 14px;
     cursor: pointer;
     transition: all .2s;
 }

 .ed-btn:hover {
     background: rgba(0, 255, 255, .08);
     box-shadow: 0 0 10px rgba(0, 255, 255, .2);
 }

 .ed-btn.pdf {
     border-color: rgba(255, 165, 0, .3);
     color: rgba(255, 165, 0, .6);
     position: relative;
 }

 .ed-btn.pdf:hover {
     background: rgba(255, 165, 0, .05);
 }

 .ed-soon {
     position: absolute;
     top: -8px;
     right: -8px;
     font-size: 11px;
     background: rgba(255, 165, 0, .2);
     border: 1px solid rgba(255, 165, 0, .4);
     color: #ffa500;
     padding: 1px 5px;
     letter-spacing: 1px;
 }

 .prog-geral-wrap {
     background: rgba(0, 255, 255, .03);
     border: 1px solid rgba(0, 255, 255, .12);
     border-radius: 12px;
     padding: 14px 16px;
     margin-bottom: 14px;
 }

 .prog-geral-top {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-bottom: 8px;
 }

 .prog-geral-label {
     font-size: 11px;
     letter-spacing: 3px;
     color: rgba(0, 255, 255, .45);
 }

 .prog-geral-info {
     font-size: 11px;
     color: rgba(0, 255, 255, .35);
     letter-spacing: 1px;
 }

 .prog-geral-pct {
     font-family: 'Orbitron', sans-serif;
     font-size: 20px;
     color: #00ffff;
 }

 .prog-bar-geral {
     flex: 1;
     height: 5px;
     background: rgba(0, 255, 255, .08);
     border-radius: 4px;
     overflow: hidden;
 }

 .prog-bar-geral-fill {
     height: 100%;
     background: linear-gradient(90deg, #00ffff, #00ff88);
     transition: width .5s;
 }

 .prog-bar-wrap {
     display: flex;
     align-items: center;
     gap: 10px;
 }

 .disc {
     border: 1px solid rgba(0, 255, 255, .15);
     border-radius: 10px;
     margin-bottom: 8px;
     overflow: hidden;
 }

 .disc-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 11px 14px;
     cursor: pointer;
     background: rgba(0, 255, 255, .04);
     transition: background .2s;
     gap: 10px;
 }

 .disc-header:hover {
     background: rgba(0, 255, 255, .08);
 }

 .disc-left {
     display: flex;
     align-items: center;
     gap: 10px;
     flex: 1;
 }

 .disc-color-bar {
     width: 3px;
     height: 26px;
     border-radius: 2px;
     flex-shrink: 0;
 }

 .disc-name {
     font-size: 13px;
     letter-spacing: 1px;
     color: #00ffff;
 }

 .disc-right {
     display: flex;
     align-items: center;
     gap: 10px;
 }

 .disc-mini-bar {
     width: 70px;
     height: 3px;
     background: rgba(0, 255, 255, .1);
     border-radius: 2px;
 }

 .disc-mini-fill {
     height: 100%;
     transition: width .5s;
 }

 .disc-pct-badge {
     font-size: 12px;
     padding: 2px 7px;
     letter-spacing: 1px;
 }

 .disc-arr {
     font-size: 12px;
     color: rgba(0, 255, 255, .4);
     transition: transform .2s;
 }

 .disc-open .disc-arr {
     transform: rotate(180deg);
 }

 .disc-body {
     display: none;
 }

 .disc-open .disc-body {
     display: block;
 }

 .top-table {
     width: 100%;
     border-collapse: collapse;
 }

 .top-table th {
     font-size: 12px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .35);
     padding: 7px 12px;
     text-align: center;
     border-bottom: 1px solid rgba(0, 255, 255, .08);
     background: rgba(0, 0, 0, .3);
 }

 .top-table th:nth-child(2) {
     text-align: left;
 }

 .top-table td {
     padding: 8px 12px;
     border-bottom: 1px solid rgba(0, 255, 255, .05);
     font-size: 12px;
     text-align: center;
     vertical-align: middle;
 }

 .top-table tr:last-child td {
     border-bottom: none;
 }

 .top-table tr:hover td {
     background: rgba(0, 255, 255, .02);
 }

 .t-chk {
     width: 14px;
     height: 14px;
     border: 1px solid rgba(0, 255, 255, .3);
     background: transparent;
     cursor: pointer;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     font-size: 11px;
     transition: all .2s;
 }

 .t-chk.done {
     background: rgba(0, 255, 136, .15);
     border-color: #00ff88;
     color: #00ff88;
 }

 .t-nm {
     text-align: left !important;
     color: rgba(0, 255, 255, .75);
 }

 .t-nm.done {
     color: rgba(0, 255, 255, .3);
     text-decoration: line-through;
 }

 .t-g {
     color: #00ff88;
 }

 .t-r {
     color: #ff6b6b;
 }

 .t-tot {
     color: rgba(0, 255, 255, .6);
 }

 .t-pct {
     display: inline-block;
     padding: 2px 6px;
     font-size: 11px;
     font-family: 'Orbitron', sans-serif;
 }

 .t-pct.high {
     background: rgba(0, 255, 136, .12);
     border: 1px solid rgba(0, 255, 136, .3);
     color: #00ff88;
 }

 .t-pct.mid {
     background: rgba(255, 165, 0, .1);
     border: 1px solid rgba(255, 165, 0, .3);
     color: #ffa500;
 }

 .t-pct.low {
     background: rgba(255, 107, 107, .1);
     border: 1px solid rgba(255, 107, 107, .3);
     color: #ff6b6b;
 }

 .t-pct.zero {
     color: rgba(0, 255, 255, .25);
 }

 .t-date {
     color: rgba(0, 255, 255, .3);
     font-size: 11px;
 }

 .t-del {
     background: transparent;
     border: none;
     color: rgba(255, 107, 107, .3);
     cursor: pointer;
     font-size: 12px;
     padding: 0 4px;
 }

 .t-del:hover {
     color: #ff6b6b;
 }

 .disc-footer {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 9px 14px;
     background: rgba(0, 0, 0, .25);
     border-top: 1px solid rgba(0, 255, 255, .07);
     flex-wrap: wrap;
     gap: 8px;
 }

 .disc-total {
     display: flex;
     gap: 12px;
     font-size: 12px;
     align-items: center;
 }

 .disc-total-label {
     font-size: 12px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .3);
 }

 .disc-prog-wrap {
     display: flex;
     align-items: center;
     gap: 8px;
 }

 .disc-prog-label {
     font-size: 12px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .3);
 }

 .disc-prog-bar {
     width: 100px;
     height: 4px;
     background: rgba(0, 255, 255, .08);
     border-radius: 2px;
 }

 .disc-prog-fill {
     height: 100%;
     transition: width .5s;
 }

 .disc-prog-pct {
     font-size: 11px;
     letter-spacing: 1px;
 }

 .disc-actions {
     display: flex;
     gap: 6px;
 }

 .disc-action-btn {
     background: transparent;
     border: none;
     color: rgba(0, 255, 255, .3);
     font-size: 13px;
     cursor: pointer;
     padding: 2px 6px;
     transition: color .2s;
 }

 .disc-action-btn:hover {
     color: #00ffff;
 }

 .disc-action-btn.del:hover {
     color: #ff6b6b;
 }

 .btn-add-top {
     background: transparent;
     border: 1px dashed rgba(0, 255, 255, .18);
     color: rgba(0, 255, 255, .35);
     font-family: 'Share Tech Mono', monospace;
     font-size: 11px;
     letter-spacing: 1px;
     padding: 7px 14px;
     cursor: pointer;
     width: 100%;
     transition: all .2s;
 }

 .btn-add-top:hover {
     border-color: rgba(0, 255, 255, .4);
     color: #00ffff;
 }

 .ed-empty {
     text-align: center;
     padding: 40px 20px;
     font-size: 12px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .25);
 }

 /* CONFIRM MODAL CUSTOMIZADO */
 .confirm-overlay {
     position: fixed;
     inset: 0;
     z-index: 900;
     background: rgba(0, 0, 0, .7);
     backdrop-filter: blur(6px);
     display: none;
     align-items: center;
     justify-content: center;
 }

 .confirm-overlay.show {
     display: flex;
 }

 .confirm-box {
     position: relative;
     width: 100%;
     max-width: 320px;
     background: rgba(0, 3, 10, .99);
     border: 1px solid rgba(0, 255, 255, .25);
     padding: 24px 22px 20px;
     animation: modalPop .2s ease;
 }

 .confirm-box::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 1.5px;
     background: linear-gradient(90deg, transparent, #00ffff, transparent);
 }

 .confirm-icon {
     text-align: center;
     font-size: 28px;
     margin-bottom: 10px;
 }

 .confirm-title {
     font-family: 'Orbitron', sans-serif;
     font-size: 13px;
     letter-spacing: 3px;
     color: #00ffff;
     text-align: center;
     margin-bottom: 8px;
 }

 .confirm-msg {
     font-size: 13px;
     color: rgba(0, 255, 255, .6);
     text-align: center;
     letter-spacing: 1px;
     line-height: 1.6;
     margin-bottom: 18px;
 }

 .confirm-btns {
     display: flex;
     gap: 8px;
 }

 .confirm-btn {
     flex: 1;
     padding: 10px;
     background: transparent;
     font-family: 'Share Tech Mono', monospace;
     font-size: 12px;
     letter-spacing: 2px;
     cursor: pointer;
     transition: all .2s;
     border: 1px solid rgba(0, 255, 255, .4);
     color: #00ffff;
 }

 .confirm-btn:hover {
     background: rgba(0, 255, 255, .08);
     box-shadow: 0 0 10px rgba(0, 255, 255, .2);
 }

 .confirm-btn.cancel {
     border-color: rgba(206, 209, 14, 0.863);
     color: rgba(216, 219, 14, 0.993);
 }

 .confirm-btn.cancel:hover {
     background: rgba(255, 107, 107, .06);
     color: #ff6b6b;
 }

 /* MODAIS DO EDITAL */
 .ed-overlay {
     position: fixed;
     inset: 0;
     z-index: 600;
     background: rgba(0, 0, 0, .65);
     backdrop-filter: blur(6px);
     display: none;
     align-items: center;
     justify-content: center;
 }

 .ed-overlay.show {
     display: flex;
 }

 .ed-modal-wrap {
     position: relative;
     width: 100%;
     max-width: 340px;
 }

 .ed-modal-canvas {
     position: absolute;
     inset: -1px;
     pointer-events: none;
     z-index: 2;
 }

 .ed-modal {
     position: relative;
     z-index: 1;
     background: rgba(0, 3, 10, .99);
     border: 1px solid rgba(0, 255, 255, .2);
     padding: 22px 20px 18px;
 }

 .ed-modal-title {
     font-family: 'Orbitron', sans-serif;
     font-size: 13px;
     letter-spacing: 4px;
     color: #00ffff;
     text-align: center;
     margin-bottom: 16px;
 }

 .ed-modal-close {
     position: absolute;
     top: 10px;
     right: 12px;
     background: none;
     border: none;
     color: rgba(0, 255, 255, .4);
     font-size: 15px;
     cursor: pointer;
 }

 .ed-modal-close:hover {
     color: #ff6b6b;
 }

 .ed-field {
     margin-bottom: 12px;
 }

 .ed-label {
     font-size: 12px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .4);
     margin-bottom: 4px;
 }

 .ed-input {
     width: 100%;
     background: rgba(0, 5, 10, .95);
     border: 1px solid rgba(0, 255, 255, .18);
     color: #00ffff;
     font-family: 'Share Tech Mono', monospace;
     font-size: 12px;
     padding: 9px 10px;
     outline: none;
     transition: border-color .2s;
 }

 .ed-input:focus {
     border-color: rgba(0, 255, 255, .6);
 }

 .ed-input::placeholder {
     color: rgba(0, 255, 255, .18);
 }

 .ed-input option {
     background: #000d10;
     color: #00ffff;
 }

 select.q-input option {
     background: #000d10;
     color: #00ffff;
 }

 select.q-input {
     background: rgba(0, 5, 10, .95);
 }

 .ed-colors {
     display: flex;
     gap: 8px;
     flex-wrap: wrap;
     margin-top: 6px;
 }

 .ed-color-opt {
     width: 22px;
     height: 22px;
     border-radius: 50%;
     cursor: pointer;
     border: 2px solid transparent;
     transition: all .2s;
 }

 .ed-color-opt.sel {
     border-color: #fff;
     transform: scale(1.2);
 }

 .ed-modal-btns {
     display: flex;
     gap: 8px;
     margin-top: 14px;
 }

 .ed-modal-btn {
     flex: 1;
     padding: 10px;
     background: transparent;
     border: 1px solid rgba(0, 255, 255, .4);
     color: #00ffff;
     font-family: 'Share Tech Mono', monospace;
     font-size: 11px;
     letter-spacing: 2px;
     cursor: pointer;
     transition: all .2s;
 }

 .ed-modal-btn:hover {
     background: rgba(0, 255, 242, 0.08);
 }

 .ed-modal-btn.yellow {
     border-color: rgba(255, 0, 0, 0.39);
     color: rgba(255, 0, 0, 0.582);
 }

 .ed-modal-btn.yellow:hover {
     background: rgba(255, 0, 0, 0.233);
 }

 /* ── RELATÓRIOS ── */
 .rel-periodo-btn {
     background: transparent;
     border: 1px solid rgba(0, 255, 255, .2);
     border-radius: 6px;
     color: rgba(0, 255, 255, .45);
     font-family: 'Share Tech Mono', monospace;
     font-size: 10px;
     letter-spacing: 2px;
     padding: 6px 12px;
     cursor: pointer;
     transition: all .2s;
 }

 .rel-periodo-btn:hover {
     border-color: rgba(0, 255, 255, .5);
     color: #00ffff;
 }

 .rel-periodo-btn.active {
     border-color: #00ffff;
     color: #00ffff;
     background: rgba(0, 255, 255, .08);
 }

 .rel-bar-wrap {
     display: flex;
     flex-direction: column;
     align-items: center;
     flex: 1;
     gap: 4px;
 }

 .rel-bar {
     width: 100%;
     background: rgba(0, 255, 255, .08);
     position: relative;
     min-height: 4px;
     transition: height .5s ease;
     border-radius: 1px 1px 0 0;
 }

 .rel-bar-fill {
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     background: linear-gradient(180deg, #00ffff, rgba(0, 255, 255, .4));
     transition: height .5s ease;
     border-radius: 1px 1px 0 0;
 }

 .rel-bar-val {
     font-size: 10px;
     color: rgba(0, 255, 255, .6);
     font-family: 'Orbitron', sans-serif;
 }

 .rel-bar-label {
     font-size: 10px;
     color: rgba(0, 255, 255, .4);
     letter-spacing: 1px;
 }

 .rel-disc-row {
     display: flex;
     align-items: center;
     gap: 10px;
     padding: 10px 0;
     border-bottom: 1px solid rgba(0, 255, 255, .06);
 }

 .rel-disc-row:last-child {
     border: none;
 }

 .rel-disc-bar-wrap {
     flex: 1;
     height: 6px;
     background: rgba(0, 255, 255, .08);
     overflow: hidden;
 }

 .rel-disc-bar-fill {
     height: 100%;
     transition: width .6s ease;
 }

 .rel-comp-row {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 12px 0;
     border-bottom: 1px solid rgba(0, 255, 255, .06);
 }

 .rel-comp-row:last-child {
     border: none;
 }

 .rel-arrow-up {
     color: #00ff88;
     font-size: 12px;
 }

 .rel-arrow-down {
     color: #ff6b6b;
     font-size: 12px;
 }

 /* ── RESPONSIVIDADE MOBILE ── */
 @media(max-width:768px) {

     /* PLANO */
     #planoCicloView {
         flex-direction: column !important;
         gap: 12px !important;
     }

     #cicloPizzaSvg {
         width: min(140px, 45vw) !important;
         height: min(140px, 45vw) !important;
     }

     #cicloListaDiscs {
         width: 100% !important;
         min-width: 0 !important;
         overflow: hidden;
     }

     #cicloListaDiscs>div {
         overflow: hidden;
     }

     .plano-topico {
         flex-wrap: wrap;
         gap: 8px;
     }

     .pt-tempo {
         font-size: 10px;
     }

     .pt-btn {
         padding: 5px 10px;
         font-size: 9px;
     }

     #timerGuiadoOverlay svg {
         width: min(240px, 60vw) !important;
         height: min(240px, 60vw) !important;
     }

     .dia-row-item {
         gap: 6px;
     }

     .dia-row-btn {
         min-width: 36px;
         padding: 4px 6px;
         font-size: 9px;
     }

     /* CONFIG PLANO */
     .ed-modal {
         max-height: 90vh;
         overflow-y: auto;
     }

     /* QUESTÕES FIXAÇÃO */
     .questao-card {
         padding: 12px;
     }

     .questao-alt {
         padding: 10px 10px;
         gap: 8px;
     }

     .rev-btn-1d,
     .rev-btn-5d,
     .rev-btn-7d,
     .rev-btn-sem {
         padding: 10px 12px;
         font-size: 9px;
         letter-spacing: 1px;
     }

     /* BOTÕES DO PLANO */
     #btnToggleModo,
     #btnReiniciarCiclo,
     #btnNovoDia {
         font-size: 9px;
         padding: 6px 10px;
         letter-spacing: 1px;
     }

     /* MODAL ESCOLHA QUESTÕES */
     #escolhaQuestoesOverlay .ed-modal {
         max-width: 94vw;
     }


     /* NAV */
     .nav-bar {
         overflow-x: auto;
         -webkit-overflow-scrolling: touch;
         scrollbar-width: none;
         flex-wrap: nowrap;
     }

     .nav-bar::-webkit-scrollbar {
         display: none;
     }


     /* USER BAR */
     .user-bar {
         padding: 12px;
     }

     .prova-name {
         max-width: 80px;
         font-size: 11px;
     }

     .user-name {
         font-size: 12px;
     }

     /* CARDS */
     .cards-row {
         grid-template-columns: 1fr 1fr;
         gap: 8px;
     }

     .card {
         padding: 12px 10px;
     }

     .card-val {
         font-size: clamp(16px, 5vw, 26px);
     }

     /* TABELAS - scroll horizontal */
     .top-table,
     .pt-table,
     .q-history-table {
         display: block;
         overflow-x: auto;
         -webkit-overflow-scrolling: touch;
         white-space: nowrap;
     }

     /* EDITAL */
     .disc-header {
         padding: 10px 12px;
         flex-wrap: nowrap;
     }

     .disc-name {
         font-size: 11px;
     }

     .disc-mini-bar {
         display: none;
     }

     .disc-right {
         gap: 4px;
     }

     /* MODAIS */
     .ed-modal-wrap {
         max-width: 94vw !important;
     }

     .ed-modal {
         padding: 18px 14px 14px;
     }

     .confirm-box {
         max-width: 92vw;
         padding: 20px 16px;
     }

     .profile-modal-wrap {
         max-width: 92vw !important;
     }

     /* TIMER FS */
     .timer-fullscreen {
         padding: 10px;
     }

     .sess-badge {
         padding: 6px 12px;
         max-width: 90vw;
     }

     .ctrl-btn {
         padding: 10px 14px;
         font-size: 11px;
     }

     /* HEADER */
     .sys-title {
         letter-spacing: clamp(4px, 2vw, 12px);
     }

     /* QUESTOES FORM */
     .q-row {
         flex-direction: column;
         gap: 8px;
     }

     .q-field {
         width: 100%;
     }
 }

 @media(max-width:480px) {
     .cards-row {
         grid-template-columns: 1fr 1fr;
     }

     .header {
         padding: 32px 0 16px;
     }

     .prova-name {
         display: none;
     }

     /* PLANO mobile pequeno */
     #cicloPizzaSvg {
         width: 140px !important;
         height: 140px !important;
     }

     .plano-topico {
         flex-wrap: wrap;
         gap: 8px;
         padding: 10px 12px;
     }

     .pt-info {
         flex: 1;
         min-width: 0;
     }

     .pt-check {
         align-self: flex-start;
         margin-top: 2px;
     }

     .pt-tempo {
         width: 100%;
         order: 3;
         font-size: 10px;
     }

     .pt-btn {
         width: 100%;
         order: 4;
         text-align: center;
         padding: 10px;
     }

     #btnToggleModo {
         font-size: 9px;
         padding: 6px 10px;
     }

     /* CONFIG PLANO */
     #configPesoDiscs input[type=range] {
         width: 70px;
     }

     .dia-row-btn {
         font-size: 8px;
         min-width: 30px;
     }

     /* QUESTÕES FIXAÇÃO mobile */
     .questao-alt {
         padding: 8px;
         gap: 6px;
     }

     .alt-letra {
         font-size: 11px;
         min-width: 18px;
     }

     .alt-tesoura {
         font-size: 12px;
     }

     .rev-btn-1d,
     .rev-btn-5d,
     .rev-btn-7d,
     .rev-btn-sem {
         padding: 8px 10px;
         font-size: 9px;
         min-width: unset;
         flex: 1;
     }

     /* timer guiado mobile */
     #timerGuiadoOverlay svg {
         width: min(200px, 70vw) !important;
         height: min(200px, 70vw) !important;
     }
 }

 @media(max-width:360px) {
     .cards-row {
         grid-template-columns: 1fr;
     }

     .user-name {
         display: none;
     }
 }

 /* SAFE AREA iOS */
 @supports(padding:env(safe-area-inset-top)) {
     .timer-fullscreen {
         padding-top: env(safe-area-inset-top);
         padding-bottom: env(safe-area-inset-bottom);
     }

     nav {
         padding-top: calc(12px + env(safe-area-inset-top));
     }
 }

 /* ── FRASE DO DIA ── */
 .quote-card {
     background: rgba(0, 255, 255, .03);
     border: 1px solid rgba(0, 255, 255, .12);
     border-left: 3px solid rgba(0, 255, 255, .4);
     padding: 14px 18px;
     margin-top: 14px;
     position: relative;
     overflow: hidden;
 }

 .quote-card::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 1px;
     background: linear-gradient(90deg, #00ffff, transparent);
     opacity: .4;
 }

 .quote-label {
     font-size: 12px;
     letter-spacing: 3px;
     color: rgba(0, 255, 255, .35);
     margin-bottom: 8px;
     display: flex;
     align-items: center;
     gap: 6px;
 }

 .quote-label::before {
     content: '✦';
     color: rgba(0, 255, 255, .3);
     font-size: 12px;
 }

 .quote-text {
     font-size: 13px;
     color: rgba(220, 240, 255, .85);
     letter-spacing: 1px;
     line-height: 1.7;
     font-style: italic;
 }

 .quote-author {
     font-size: 12px;
     color: rgba(255, 255, 255, .35);
     letter-spacing: 2px;
     margin-top: 8px;
 }

 .quote-loading {
     font-size: 12px;
     color: rgba(0, 255, 255, .3);
     letter-spacing: 2px;
     animation: blink 1.2s step-end infinite;
 }

 /* ── FLOATING TIMER ── */
 .timer-fab {
     position: fixed;
     bottom: 24px;
     right: 24px;
     z-index: 50;
     width: 52px;
     height: 52px;
     border-radius: 50%;
     background: rgba(0, 3, 10, .95);
     border: 1px solid rgba(0, 255, 255, .4);
     box-shadow: 0 0 16px rgba(0, 255, 255, .25);
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
     transition: all .2s;
     font-size: 22px;
 }

 .timer-fab:hover {
     border-color: #00ffff;
     box-shadow: 0 0 24px rgba(0, 255, 255, .4);
     transform: scale(1.08);
 }

 .timer-fab.running {
     border-color: #00ffff;
     box-shadow: 0 0 20px rgba(0, 255, 255, .5);
     animation: fabPulse 2s ease-in-out infinite;
 }

 @keyframes fabPulse {

     0%,
     100% {
         box-shadow: 0 0 16px rgba(0, 255, 255, .3);
     }

     50% {
         box-shadow: 0 0 28px rgba(0, 255, 255, .6);
     }
 }

 /* mini timer bolinho */
 .timer-mini {
     position: fixed;
     bottom: 24px;
     right: 24px;
     z-index: 50;
     pointer-events: auto;
     display: none;
     align-items: center;
     gap: 8px;
     background: rgba(0, 3, 10, .97);
     border: 1px solid rgba(0, 255, 255, .35);
     box-shadow: 0 0 16px rgba(0, 255, 255, .2);
     padding: 8px 14px 8px 10px;
     cursor: pointer;
     transition: all .2s;
 }

 .timer-mini:hover {
     border-color: #00ffff;
     box-shadow: 0 0 20px rgba(0, 255, 255, .35);
 }

 @keyframes timerPulse {
     0% {
         box-shadow: 0 0 8px rgba(0, 255, 255, .2), 0 0 0 0 rgba(0, 255, 255, .3);
     }

     50% {
         box-shadow: 0 0 14px rgba(0, 255, 255, .4), 0 0 12px 4px rgba(0, 255, 255, .1);
     }

     100% {
         box-shadow: 0 0 8px rgba(0, 255, 255, .2), 0 0 0 0 rgba(0, 255, 255, 0);
     }
 }

 @keyframes timerPulseRed {
     0% {
         box-shadow: 0 0 8px rgba(255, 107, 107, .2), 0 0 0 0 rgba(255, 107, 107, .3);
     }

     50% {
         box-shadow: 0 0 14px rgba(255, 107, 107, .4), 0 0 12px 4px rgba(255, 107, 107, .1);
     }

     100% {
         box-shadow: 0 0 8px rgba(255, 107, 107, .2), 0 0 0 0 rgba(255, 107, 107, 0);
     }
 }

 .timer-mini.show {
     animation: timerPulse 2s ease-in-out infinite;
 }

 .timer-mini.show.pausa {
     animation: timerPulseRed 2s ease-in-out infinite;
 }

 .timer-mini.show {
     display: flex;
 }

 .ed-overlay.show~* .timer-mini,

 .timer-mini-dot {
     width: 8px;
     height: 8px;
     border-radius: 50%;
     background: #00ffff;
     animation: blink 1s step-end infinite;
     flex-shrink: 0;
 }

 .timer-mini-dot.paused {
     background: rgba(0, 255, 255, .3);
     animation: none;
 }

 .timer-mini-time {
     font-family: 'Orbitron', sans-serif;
     font-size: 16px;
     color: #00ffff;
     letter-spacing: 2px;
 }

 .timer-mini-mode {
     font-size: 12px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .45);
 }

 /* tela cheia do timer */
 .timer-fullscreen {
     position: fixed;
     inset: 0;
     z-index: 350;
     background: rgba(0, 0, 0, .97);
     display: none;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     padding: 20px;
     backdrop-filter: blur(2px);
 }

 .timer-fullscreen.show {
     display: flex;
 }

 .timer-fs-header {
     position: absolute;
     top: 20px;
     left: 0;
     right: 0;
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 0 24px;
 }

 .timer-fs-title {
     font-family: 'Orbitron', sans-serif;
     font-size: clamp(14px, 3vw, 20px);
     font-weight: 900;
     letter-spacing: 6px;
     color: #00ffff;
     text-shadow: 0 0 16px #00ffff;
 }

 .timer-fs-actions {
     display: flex;
     gap: 10px;
 }

 .timer-fs-btn {
     background: transparent;
     border: 1px solid rgba(0, 255, 255, .25);
     color: rgba(0, 255, 255, .6);
     font-family: 'Share Tech Mono', monospace;
     font-size: 12px;
     letter-spacing: 2px;
     padding: 6px 14px;
     cursor: pointer;
     transition: all .2s;
 }

 .timer-fs-btn:hover {
     border-color: #00ffff;
     color: #00ffff;
 }

 .timer-fs-btn.close {
     border-color: rgba(255, 107, 107, .3);
     color: rgba(255, 107, 107, .6);
 }

 .timer-fs-btn.close:hover {
     border-color: #ff6b6b;
     color: #ff6b6b;
 }

 /* PROVA CARD */
 .prova-bar {
     display: flex;
     align-items: center;
     gap: 8px;
     cursor: pointer;
     position: relative;
 }

 .prova-chip {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 5px 12px;
     background: transparent;
     border: none;
     cursor: pointer;
     position: relative;
 }

 .prova-chip:hover .prova-name {
     color: #00ffff;
 }

 .prova-icon {
     font-size: 18px;
     opacity: .8;
 }

 .prova-info {
     display: flex;
     flex-direction: column;
 }

 .prova-name {
     font-size: 15px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .7);
     transition: color .2s;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
     max-width: 160px;
 }

 .prova-days {
     font-family: 'Orbitron', sans-serif;
     font-size: 15px;
     color: #ffd700;
     letter-spacing: 1px;
     text-shadow: 0 0 8px rgba(255, 215, 0, .4);
 }

 .prova-days span {
     font-size: 12px;
     letter-spacing: 1px;
     color: rgba(255, 215, 0, .6);
     font-family: 'Share Tech Mono', monospace;
 }

 .prova-edit {
     font-size: 11px;
     color: rgba(0, 255, 255, .3);
     cursor: pointer;
     padding: 2px 4px;
 }

 .prova-edit:hover {
     color: #00ffff;
 }

 /* PROVA MODAL */
 .prova-overlay {
     position: fixed;
     inset: 0;
     z-index: 600;
     background: rgba(0, 0, 0, .65);
     backdrop-filter: blur(6px);
     -webkit-backdrop-filter: blur(6px);
     display: none;
     align-items: center;
     justify-content: center;
 }

 .prova-overlay.show {
     display: flex;
 }

 .prova-modal-wrap {
     position: relative;
     width: 100%;
     max-width: 290px;
 }

 .prova-modal-canvas {
     position: absolute;
     inset: -1px;
     pointer-events: none;
     z-index: 2;
 }

 .prova-modal {
     position: relative;
     z-index: 1;
     width: 100%;
     background: rgba(0, 3, 10, .99);
     border: 1px solid rgba(0, 255, 255, .2);
     padding: 22px 20px 18px;
     animation: modalPop .22s ease;
 }

 .prova-modal::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 1.5px;
     background: linear-gradient(90deg, transparent, #ffd700, transparent);
 }

 .prova-modal-close {
     position: absolute;
     top: 10px;
     right: 12px;
     background: none;
     border: none;
     color: rgba(0, 255, 255, .4);
     font-size: 16px;
     cursor: pointer;
     font-family: 'Share Tech Mono', monospace;
 }

 .prova-modal-close:hover {
     color: #ff6b6b;
 }

 .prova-modal-title {
     font-family: 'Orbitron', sans-serif;
     font-size: 13px;
     letter-spacing: 4px;
     color: #ffd700;
     text-align: center;
     margin-bottom: 16px;
     text-shadow: 0 0 10px rgba(255, 215, 0, .3);
 }

 /* MODAL PERFIL */
 .profile-overlay {
     position: fixed;
     inset: 0;
     z-index: 600;
     background: rgba(0, 0, 0, .65);
     backdrop-filter: blur(6px);
     -webkit-backdrop-filter: blur(6px);
     display: none;
     align-items: center;
     justify-content: center;
 }

 .profile-overlay.show {
     display: flex;
 }

 .profile-modal-wrap {
     position: relative;
     width: 100%;
     max-width: 340px;
 }

 .profile-modal {
     position: relative;
     z-index: 1;
     width: 100%;
     background: rgba(0, 3, 10, .99);
     border: 1px solid rgba(0, 255, 255, .2);
     padding: 24px 20px 20px;
     animation: modalPop .22s ease;
     overflow: hidden;
 }

 .profile-modal-canvas {
     position: absolute;
     inset: -1px;
     pointer-events: none;
     z-index: 2;
 }

 @keyframes modalPop {
     from {
         opacity: 0;
         transform: scale(.95)
     }

     to {
         opacity: 1;
         transform: scale(1)
     }
 }

 .pm-close {
     position: absolute;
     top: 10px;
     right: 12px;
     background: none;
     border: none;
     color: rgba(0, 255, 255, .4);
     font-size: 16px;
     cursor: pointer;
     font-family: 'Share Tech Mono', monospace;
 }

 .pm-close:hover {
     color: #ff6b6b;
 }

 .pm-title {
     font-family: 'Orbitron', sans-serif;
     font-size: 13px;
     letter-spacing: 4px;
     color: #00ffff;
     text-align: center;
     margin-bottom: 16px;
 }

 .pm-av-wrap {
     text-align: center;
     margin-bottom: 16px;
 }

 .pm-av {
     width: 68px;
     height: 68px;
     border-radius: 50%;
     border: 2px solid rgba(0, 255, 255, .45);
     background: rgba(0, 255, 255, .08);
     margin: 0 auto 6px;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 26px;
     cursor: pointer;
     position: relative;
     overflow: hidden;
     transition: border-color .2s;
 }

 .pm-av:hover {
     border-color: #00ffff;
 }

 .pm-av:hover .pm-av-h {
     opacity: 1;
 }

 .pm-av-h {
     position: absolute;
     inset: 0;
     background: rgba(0, 0, 0, .55);
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 12px;
     letter-spacing: 1px;
     color: #00ffff;
     opacity: 0;
     transition: opacity .2s;
 }

 .pm-av img {
     position: absolute;
     inset: 0;
     width: 100%;
     height: 100%;
     object-fit: cover;
     border-radius: 50%;
 }

 .pm-av-hint {
     font-size: 12px;
     color: rgba(0, 255, 255, .3);
     letter-spacing: 1px;
     text-align: center;
     white-space: nowrap;
     width: 100%;
 }

 .pm-field {
     margin-bottom: 10px;
 }

 .pm-label {
     font-size: 12px;
     white-space: nowrap;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .4);
     margin-bottom: 3px;
 }

 .pm-input {
     width: 100%;
     background: rgba(0, 255, 255, .04);
     border: 1px solid rgba(0, 255, 255, .18);
     color: #00ffff;
     font-family: 'Share Tech Mono', monospace;
     font-size: 12px;
     padding: 8px 10px;
     outline: none;
     transition: border-color .2s;
 }

 .pm-input:focus {
     border-color: rgba(0, 255, 255, .6);
     box-shadow: 0 0 6px rgba(0, 255, 255, .1);
 }

 .pm-input::placeholder {
     color: rgba(0, 255, 255, .18);
 }

 .pm-input[readonly] {
     color: rgba(0, 255, 255, .3);
     background: rgba(0, 0, 0, .15);
     cursor: not-allowed;
 }

 .pm-btns {
     display: flex;
     gap: 8px;
     margin-top: 14px;
 }

 .pm-btn {
     flex: 1;
     padding: 10px;
     background: transparent;
     border: 1px solid rgba(0, 255, 255, .4);
     color: #00ffff;
     font-family: 'Share Tech Mono', monospace;
     font-size: 11px;
     letter-spacing: 2px;
     cursor: pointer;
     transition: all .2s;
 }

 .pm-btn:hover {
     background: rgba(0, 255, 255, .08);
     box-shadow: 0 0 8px rgba(0, 255, 255, .2);
 }

 .pm-btn.red {
     border-color: rgba(255, 107, 107, .35);
     color: rgba(255, 107, 107, .65);
 }

 .pm-btn.red:hover {
     background: rgba(255, 107, 107, .06);
     color: #ff6b6b;
 }

 .pm-btn.yellow {
     border-color: rgba(255, 215, 0, .4);
     color: rgba(255, 215, 0, .8);
 }

 .pm-btn.yellow:hover {
     background: rgba(255, 215, 0, .06);
     color: #ffd700;
     box-shadow: 0 0 8px rgba(255, 215, 0, .2);
 }

 .pm-toast {
     position: fixed;
     bottom: 24px;
     left: 50%;
     transform: translateX(-50%);
     background: rgba(0, 255, 136, .1);
     border: 1px solid rgba(0, 255, 136, .4);
     color: #00ff88;
     font-size: 12px;
     letter-spacing: 2px;
     padding: 8px 18px;
     z-index: 700;
     opacity: 0;
     transition: opacity .3s;
     pointer-events: none;
 }

 .pm-toast.show {
     opacity: 1;
 }

 .sync-bar {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
     font-size: 11px;
     letter-spacing: 2px;
     margin: 0;
     flex-wrap: wrap;
     width: 100%;
     text-align: center;
     padding: 6px 0;
 }

 .sync-dot {
     width: 6px;
     height: 6px;
     border-radius: 50%;
     background: rgba(0, 255, 255, .2);
     flex-shrink: 0;
 }

 .sync-dot.ok {
     background: #00ff88;
     box-shadow: 0 0 6px rgba(0, 255, 136, .5);
 }

 .sync-dot.err {
     background: #ff6b6b;
 }

 .sync-dot.loading {
     background: #ffa500;
     animation: blink 0.8s step-end infinite;
 }

 .sync-text {
     color: rgba(0, 255, 255, .4);
 }

 .nav {
     display: flex;
     gap: 6px;
     margin-top: 40px;
     margin-bottom: 20px;
     flex-wrap: nowrap;
     overflow-x: auto;
     -webkit-overflow-scrolling: touch;
     scrollbar-width: none;
     width: 100%;
     padding: 6px 0 8px;
     background: transparent;
 }

 .nav::-webkit-scrollbar {
     display: none;
 }

 .dia-btn {
     background: transparent;
     border: 1px solid rgba(0, 255, 255, .15);
     color: rgba(0, 255, 255, .35);
     font-family: 'Share Tech Mono', monospace;
     font-size: 10px;
     letter-spacing: 2px;
     padding: 8px 10px;
     cursor: pointer;
     transition: all .2s;
     border-radius: 4px;
 }

 .dia-btn.active {
     background: rgba(0, 255, 255, .1);
     border-color: rgba(0, 255, 255, .5);
     color: #00ffff;
 }

 .dia-row-btn {
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.2em;
     padding: 6px 10px;
     min-width: 46px;
     cursor: pointer;
     transition: all .15s;
     text-align: center;
     border-radius: var(--r-sm);
     border: 1px solid var(--border);
     background: transparent;
     color: var(--text-4);
 }

 .dia-row-btn:hover {
     border-color: var(--border-hover);
     color: var(--text-2);
     background: rgba(34, 211, 238, .06);
 }

 .dia-row-item.ativo .dia-row-btn {
     border-color: rgba(34, 211, 238, .5);
     background: rgba(34, 211, 238, .1);
     color: var(--cyan);
 }

 .dia-row-item {
     display: flex;
     align-items: center;
     gap: 8px;
     padding: 8px 10px;
     border: 1px solid var(--border);
     border-radius: var(--r-sm);
     transition: all .2s;
     margin-bottom: 4px;
 }

 .dia-row-item.ativo {
     border-color: rgba(34, 211, 238, .2);
     background: rgba(34, 211, 238, .03);
 }

 .dia-row-item:hover {
     border-color: var(--border-hover);
 }

 .plano-topico {
     background: rgba(13, 20, 28, .5);
     border: 1px solid var(--border);
     border-radius: var(--r-sm);
     padding: 12px 16px;
     margin-bottom: 8px;
     display: flex;
     align-items: center;
     gap: 12px;
     transition: all .2s;
     width: 100%;
     box-sizing: border-box;
     overflow: hidden;
 }

 .plano-topico:hover {
     border-color: var(--border-hover);
     background: rgba(13, 20, 28, .7);
 }

 .plano-topico.concluido-hoje {
     border-color: rgba(52, 211, 153, .2);
     background: rgba(52, 211, 153, .04);
 }

 .plano-topico.concluido-hoje .pt-nome {
     text-decoration: line-through;
     color: var(--text-4);
 }

 .pt-check {
     width: 22px;
     height: 22px;
     border-radius: 50%;
     border: 1px solid var(--border);
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 12px;
     flex-shrink: 0;
     color: var(--text-4);
 }

 .plano-topico.concluido-hoje .pt-check {
     background: rgba(52, 211, 153, .15);
     border-color: #34d399;
     color: #34d399;
 }

 .pt-info {
     flex: 1;
     min-width: 0;
 }

 .pt-nome {
     font-size: 13px;
     font-family: var(--font-ui);
     color: var(--text-2);
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
 }

 .pt-disc {
     font-size: 10px;
     font-family: var(--font-mono);
     color: var(--text-4);
     letter-spacing: 0.1em;
     margin-top: 2px;
 }

 .pt-tempo {
     font-size: 11px;
     font-family: var(--font-mono);
     color: var(--text-3);
     letter-spacing: 0.08em;
     margin-right: 8px;
     white-space: nowrap;
 }

 .pt-btn {
     background: transparent;
     border: 1px solid var(--border);
     color: var(--text-3);
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.1em;
     padding: 6px 12px;
     cursor: pointer;
     transition: all .15s;
     white-space: nowrap;
     border-radius: var(--r-sm);
     text-transform: uppercase;
 }

 .pt-btn:hover {
     border-color: var(--border-hover);
     color: var(--cyan);
     background: rgba(34, 211, 238, .06);
 }

 .plano-topico--revisao {
     background: rgba(251, 191, 36, .04);
     border-color: rgba(251, 191, 36, .3);
 }

 .plano-topico--revisao:hover {
     border-color: rgba(251, 191, 36, .55);
     background: rgba(251, 191, 36, .07);
 }

 .plano-topico--revisao .pt-nome {
     color: rgba(251, 191, 36, .95);
 }

 .plano-topico--revisao .pt-disc {
     color: rgba(251, 191, 36, .55);
 }

 .plano-topico--revisao .pt-tempo {
     color: rgba(251, 191, 36, .65);
 }

 .pt-check--rev {
     background: rgba(251, 191, 36, .08);
     border-color: rgba(251, 191, 36, .3);
     font-size: 13px;
 }

 .pt-btn--rev {
     border-color: rgba(251, 191, 36, .4);
     color: rgba(251, 191, 36, .9);
 }

 .pt-btn--rev:hover {
     border-color: rgba(251, 191, 36, .7);
     color: #fbbf24;
     background: rgba(251, 191, 36, .1);
 }

 .revisao-item {
     background: rgba(245, 158, 11, .03);
     border: 1px solid rgba(245, 158, 11, .2);
     border-radius: var(--r-sm);
     padding: 12px 16px;
     margin-bottom: 8px;
     display: flex;
     align-items: center;
     gap: 10px;
 }

 .questao-card {
     background: rgba(0, 255, 255, .02);
     border: 1px solid rgba(0, 255, 255, .1);
     padding: 16px;
     margin-bottom: 12px;
 }

 .questao-alt {
     display: flex;
     align-items: flex-start;
     gap: 12px;
     padding: 12px 14px;
     margin: 8px 0;
     cursor: pointer;
     border: 1px solid rgba(0, 255, 255, .1);
     border-radius: 4px;
     transition: all .2s;
     background: rgba(0, 255, 255, .02);
 }

 .questao-alt:hover {
     background: rgba(0, 255, 255, .07);
     border-color: rgba(0, 255, 255, .35);
     transform: translateX(2px);
 }

 .questao-alt.selecionada {
     background: rgba(0, 255, 255, .08);
     border-color: rgba(0, 255, 255, .4);
 }

 .questao-alt.correta {
     background: rgba(0, 255, 136, .08);
     border-color: #00ff88;
     color: #00ff88;
     cursor: default;
 }

 .questao-alt.correta:hover {
     transform: none;
     background: rgba(0, 255, 136, .08);
     border-color: #00ff88;
 }

 .questao-alt.errada {
     background: rgba(255, 107, 107, .08);
     border-color: rgba(255, 107, 107, .4);
     color: rgba(255, 107, 107, .8);
     cursor: default;
 }

 .questao-alt.errada:hover {
     transform: none;
     background: rgba(255, 107, 107, .08);
     border-color: rgba(255, 107, 107, .4);
 }

 .plano-btns-mobile {
     display: none;
 }

 .plano-btns-desktop {
     display: flex;
 }

 @media(max-width: 600px) {
     .plano-btns-mobile {
         display: block;
     }

     .plano-btns-desktop {
         display: none !important;
     }
 }

 .questao-alt.eliminada {
     opacity: 0.35;
     text-decoration: line-through;
     cursor: default;
     border-color: rgba(0, 255, 255, .05);
 }

 .questao-alt.eliminada:hover {
     transform: none;
     background: transparent;
     border-color: rgba(0, 255, 255, .05);
 }

 .alt-tesoura {
     font-size: 16px;
     font-weight: 700;
     color: rgba(0, 255, 255, .2);
     cursor: pointer;
     flex-shrink: 0;
     transition: color .2s;
     padding: 0 6px;
     line-height: 1;
     user-select: none;
 }

 .questao-alt:hover .alt-tesoura {
     color: rgba(0, 255, 255, .6);
 }

 .alt-tesoura:hover {
     color: rgba(255, 80, 80, 0.65) !important;
 }

 .questao-alt.eliminada .alt-tesoura {
     color: rgba(255, 107, 107, .6);
 }

 .rev-btn-1d {
     background: rgba(255, 107, 107, .08);
     border: 1px solid rgba(255, 107, 107, .4);
     color: rgba(255, 107, 107, .8);
     font-family: 'Share Tech Mono', monospace;
     font-size: 10px;
     letter-spacing: 2px;
     padding: 12px 18px;
     cursor: pointer;
     transition: all .2s;
 }

 .rev-btn-1d:hover {
     background: rgba(255, 107, 107, .2);
     border-color: rgba(255, 107, 107, .7);
 }

 .rev-btn-5d {
     background: rgba(255, 200, 0, .08);
     border: 1px solid rgba(255, 200, 0, .4);
     color: rgba(255, 200, 0, .8);
     font-family: 'Share Tech Mono', monospace;
     font-size: 10px;
     letter-spacing: 2px;
     padding: 12px 18px;
     cursor: pointer;
     transition: all .2s;
 }

 .rev-btn-5d:hover {
     background: rgba(255, 200, 0, .2);
     border-color: rgba(255, 200, 0, .7);
 }

 .rev-btn-7d {
     background: rgba(0, 255, 136, .08);
     border: 1px solid rgba(0, 255, 136, .4);
     color: #00ff88;
     font-family: 'Share Tech Mono', monospace;
     font-size: 10px;
     letter-spacing: 2px;
     padding: 12px 18px;
     cursor: pointer;
     transition: all .2s;
 }

 .rev-btn-7d:hover {
     background: rgba(0, 255, 136, .2);
     border-color: #00ff88;
 }

 .rev-btn-sem {
     background: transparent;
     border: 1px solid rgba(0, 255, 255, .2);
     color: rgba(0, 255, 255, .4);
     font-family: 'Share Tech Mono', monospace;
     font-size: 10px;
     letter-spacing: 2px;
     padding: 12px 18px;
     cursor: pointer;
     transition: all .2s;
 }

 .rev-btn-sem:hover {
     background: rgba(0, 255, 255, .08);
     border-color: rgba(0, 255, 255, .4);
     color: rgba(0, 255, 255, .7);
 }

 .alt-letra {
     font-family: 'Orbitron', sans-serif;
     font-size: 11px;
     color: #00ffff;
     min-width: 20px;
     margin-top: 1px;
 }

 .nav-btn {
     background: linear-gradient(180deg, rgba(0, 40, 50, .85) 0%, rgba(0, 20, 28, .95) 100%);
     border: 1px solid rgba(0, 255, 255, .25);
     border-top: 1px solid rgba(0, 255, 255, .45);
     border-radius: 8px;
     color: rgba(0, 255, 255, .55);
     font-family: 'Share Tech Mono', monospace;
     font-size: 10px;
     letter-spacing: 1.5px;
     padding: 10px 8px;
     cursor: pointer;
     transition: all .2s;
     white-space: nowrap;
     flex: 1;
     text-align: center;
     min-width: 0;
     position: relative;
     overflow: hidden;
     box-shadow: 0 2px 8px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(0, 255, 255, .1);
 }

 .nav-btn::before {
     content: '';
     position: absolute;
     top: 0;
     left: 10%;
     right: 10%;
     height: 1px;
     background: linear-gradient(90deg, transparent, rgba(0, 255, 255, .5), transparent);
     opacity: .6;
 }

 .nav-btn:hover {
     color: #00ffff;
     border-color: rgba(0, 255, 255, .5);
     border-top-color: rgba(0, 255, 255, .8);
     background: linear-gradient(180deg, rgba(0, 60, 75, .9) 0%, rgba(0, 30, 40, .95) 100%);
     box-shadow: 0 2px 12px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(0, 255, 255, .2), 0 0 10px rgba(0, 255, 255, .1);
 }

 .nav-btn.active {
     color: #00ffff;
     border-color: rgba(0, 255, 255, .6);
     border-top-color: #00ffff;
     background: linear-gradient(180deg, rgba(0, 70, 90, .95) 0%, rgba(0, 35, 50, .98) 100%);
     box-shadow: 0 2px 14px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(0, 255, 255, .35), 0 0 16px rgba(0, 255, 255, .15);
     text-shadow: 0 0 8px rgba(0, 255, 255, .6);
 }

 .panel {
     display: none;
 }

 .panel.active {
     display: block;
 }

 .cards-row {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
     gap: 10px;
     margin-bottom: 16px;
 }

 .card {
     background: rgba(0, 255, 255, .04);
     border: 1px solid rgba(0, 255, 255, .2);
     border-radius: 12px;
     padding: 16px 18px;
     position: relative;
     overflow: hidden;
 }

 .card::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 1px;
     background: linear-gradient(90deg, transparent, #00ffff, transparent);
     opacity: .5;
 }

 .card-label {
     font-size: clamp(9px, 2vw, 11px);
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .4);
     margin-bottom: 8px;
 }

 .card-val {
     font-family: 'Orbitron', sans-serif;
     font-size: clamp(22px, 5vw, 32px);
     font-weight: 700;
     color: #00ffff;
     line-height: 1;
 }

 .card-val.green {
     color: #00ff88;
     text-shadow: 0 0 10px rgba(0, 255, 136, .4);
 }

 .card-val.red {
     color: #ff6b6b;
     text-shadow: 0 0 10px rgba(255, 107, 107, .4);
 }

 .card-sub {
     font-size: clamp(10px, 2vw, 12px);
     color: rgba(0, 255, 255, .35);
     margin-top: 6px;
 }

 .card-icon {
     position: absolute;
     top: 12px;
     right: 12px;
     font-size: 14px;
     opacity: .3;
 }

 .timer-wrap {
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: clamp(12px, 3vw, 18px);
 }

 .modes {
     display: flex;
     gap: 6px;
     flex-wrap: wrap;
     justify-content: center;
 }

 .mode-btn {
     background: transparent;
     border: 1px solid rgba(0, 255, 255, .3);
     color: rgba(0, 255, 255, .5);
     font-family: 'Share Tech Mono', monospace;
     font-size: clamp(8px, 2.5vw, 10px);
     letter-spacing: clamp(1px, 1vw, 2px);
     padding: 5px clamp(8px, 2vw, 14px);
     cursor: pointer;
     transition: all .2s;
     white-space: nowrap;
 }

 .mode-btn.active,
 .mode-btn:hover {
     background: rgba(0, 255, 255, .1);
     border-color: #00ffff;
     color: #00ffff;
     box-shadow: 0 0 8px rgba(0, 255, 255, .25);
 }

 .timer-ring {
     position: relative;
     width: clamp(240px, 60vw, 400px);
     height: clamp(240px, 60vw, 400px);
 }

 .timer-fullscreen .timer-ring {
     width: clamp(260px, 65vmin, 420px);
     height: clamp(260px, 65vmin, 420px);
 }

 .ring-svg {
     width: 100%;
     height: 100%;
     transform: rotate(-90deg);
     filter: drop-shadow(0 0 6px #00ffff);
 }

 .ring-track {
     fill: none;
     stroke: rgba(0, 255, 255, .1);
     stroke-width: 4;
 }

 .ring-progress {
     fill: none;
     stroke: #00ffff;
     stroke-width: 4;
     stroke-linecap: round;
     transition: stroke-dashoffset .5s linear;
 }

 .ring-accent {
     fill: none;
     stroke: rgba(0, 255, 255, .25);
     stroke-width: 1;
     stroke-dasharray: 4 8;
 }

 .timer-center {
     position: absolute;
     inset: 0;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
 }

 .time-display {
     font-family: 'Orbitron', sans-serif;
     font-size: clamp(44px, 12vw, 72px);
     font-weight: 700;
     color: #00ffff;
     text-shadow: 0 0 16px rgba(0, 255, 255, .8);
     letter-spacing: 2px;
     line-height: 1;
 }

 .timer-fullscreen .time-display {
     font-size: clamp(52px, 14vmin, 88px);
 }

 .time-label {
     font-size: clamp(10px, 2vw, 12px);
     letter-spacing: 4px;
     color: rgba(0, 255, 255, .5);
     margin-top: 6px;
 }

 .pct-label {
     position: absolute;
     top: 6px;
     left: 50%;
     transform: translateX(-50%);
     font-size: 11px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .3);
 }

 .adjust-row {
     display: flex;
     align-items: center;
     gap: 12px;
 }

 .adj-btn {
     background: transparent;
     border: 1px solid rgba(0, 255, 255, .2);
     color: rgba(0, 255, 255, .6);
     font-family: 'Share Tech Mono', monospace;
     font-size: 18px;
     width: 36px;
     height: 36px;
     cursor: pointer;
     transition: all .15s;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .adj-btn:hover {
     border-color: #00ffff;
     color: #00ffff;
     box-shadow: 0 0 8px rgba(0, 255, 255, .3);
 }

 .adj-info {
     text-align: center;
 }

 .adj-label {
     font-size: 12px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .4);
 }

 .adj-val {
     font-family: 'Orbitron', monospace;
     font-size: 16px;
     color: #00ffff;
 }

 .controls {
     display: flex;
     gap: 8px;
     align-items: center;
     flex-wrap: wrap;
     justify-content: center;
     width: 100%;
 }

 .timer-fullscreen .controls {
     gap: clamp(8px, 2vw, 14px);
     padding: 0 clamp(8px, 2vw, 16px);
 }

 .ctrl-btn {
     background: transparent;
     border: 1px solid rgba(0, 255, 255, .35);
     color: #00ffff;
     font-family: 'Share Tech Mono', monospace;
     font-size: clamp(10px, 2.5vw, 12px);
     letter-spacing: clamp(1px, 1vw, 2px);
     padding: clamp(10px, 2vw, 12px) clamp(14px, 3vw, 22px);
     cursor: pointer;
     transition: all .2s;
     white-space: nowrap;
 }

 .ctrl-btn:hover {
     border-color: #00ffff;
     box-shadow: 0 0 12px rgba(0, 255, 255, .35);
 }

 .ctrl-btn.primary {
     font-size: clamp(12px, 3vw, 15px);
     padding: clamp(12px, 2vw, 14px) clamp(24px, 5vw, 36px);
     border-width: 2px;
     font-weight: 700;
 }

 .ctrl-btn.primary:hover {
     box-shadow: 0 0 20px rgba(0, 255, 255, .5);
 }

 .status-bar {
     display: flex;
     gap: clamp(10px, 3vw, 20px);
     font-size: clamp(10px, 2vw, 12px);
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .4);
     flex-wrap: wrap;
     justify-content: center;
 }

 .status-item {
     display: flex;
     align-items: center;
     gap: 5px;
 }

 .status-dot {
     width: 5px;
     height: 5px;
     border-radius: 50%;
     background: #00ffff;
     animation: blink 1s step-end infinite;
     flex-shrink: 0;
 }

 .status-dot.off {
     background: rgba(0, 255, 255, .2);
     animation: none;
 }

 @keyframes blink {

     0%,
     100% {
         opacity: 1
     }

     50% {
         opacity: 0
     }
 }

 @keyframes spin {
     from {
         transform: rotate(0deg)
     }

     to {
         transform: rotate(360deg)
     }
 }

 .sessions-row {
     display: flex;
     gap: 5px;
     margin-top: 4px;
     flex-wrap: wrap;
     justify-content: center;
 }

 .session-dot {
     width: 8px;
     height: 8px;
     border: 1px solid rgba(0, 255, 255, .3);
     border-radius: 50%;
     transition: all .3s;
 }

 .session-dot.done {
     background: #00ffff;
     box-shadow: 0 0 6px rgba(0, 255, 255, .6);
     border-color: #00ffff;
 }

 body.break-mode .time-display {
     color: #ff6b6b;
     text-shadow: 0 0 16px rgba(255, 107, 107, .8);
 }

 body.break-mode .ring-progress {
     stroke: #ff6b6b;
 }

 body.break-mode .ring-svg {
     filter: drop-shadow(0 0 8px #ff6b6b);
 }

 body.done-flash {
     animation: doneFlash .5s ease-in-out 4;
 }

 @keyframes doneFlash {

     0%,
     100% {
         background: #000
     }

     50% {
         background: #001a1a
     }
 }

 .q-form {
     background: rgba(0, 255, 255, .03);
     border: 1px solid rgba(0, 255, 255, .18);
     border-radius: 12px;
     padding: clamp(14px, 3vw, 20px);
     margin-bottom: 16px;
     position: relative;
 }

 .q-form::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 1px;
     background: linear-gradient(90deg, transparent, #00ffff, transparent);
     opacity: .5;
 }

 .q-form-title {
     font-size: clamp(9px, 2.5vw, 11px);
     letter-spacing: 3px;
     color: rgba(0, 255, 255, .5);
     margin-bottom: 14px;
 }

 .q-row {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
     gap: 10px;
     margin-bottom: 12px;
 }

 .q-field {
     display: flex;
     flex-direction: column;
     gap: 5px;
 }

 .q-field label {
     font-size: 13px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .55);
     display: flex;
     align-items: center;
     gap: 4px;
     flex-wrap: wrap;
 }

 .auto-badge {
     font-size: 9px;
     background: rgba(0, 255, 136, .12);
     border: 1px solid rgba(0, 255, 136, .4);
     color: #00ff88;
     padding: 1px 4px;
     letter-spacing: 1px;
     white-space: nowrap;
     vertical-align: middle;
 }

 .q-input {
     background: rgba(0, 180, 255, .04);
     border: 1px solid rgba(0, 180, 255, .3);
     border-radius: 8px;
     color: #00c8ff;
     font-family: 'Share Tech Mono', monospace;
     font-size: clamp(16px, 4vw, 20px);
     padding: 10px 12px;
     width: 100%;
     outline: none;
     transition: all .2s;
 }

 .q-input:focus {
     border-color: #00c8ff;
     box-shadow: 0 0 10px rgba(0, 180, 255, .2);
 }

 .q-input::placeholder {
     color: rgba(0, 180, 255, .2);
 }

 .q-input.green {
     background: rgba(0, 255, 136, .05);
     border-color: rgba(0, 255, 136, .35);
     color: #00ff88;
 }

 .q-input.auto {
     background: rgba(255, 107, 107, .05);
     border-color: rgba(255, 107, 107, .35);
     color: #ff6b6b;
     cursor: default;
 }

 .q-input.auto-zero {
     background: rgba(0, 255, 255, .03);
     border-color: rgba(0, 255, 255, .15);
     color: rgba(0, 255, 255, .3);
     cursor: default;
 }

 .q-input.auto-zero-ok {
     background: rgba(0, 255, 136, .04);
     border-color: rgba(0, 255, 136, .2);
     color: rgba(0, 255, 136, .5);
     cursor: default;
 }

 .preview {
     display: flex;
     gap: 12px;
     align-items: center;
     flex-wrap: wrap;
     border-top: 1px solid rgba(0, 255, 255, .1);
     padding-top: 12px;
     margin-top: 4px;
     opacity: 0;
     transition: opacity .3s;
 }

 .preview-item {
     display: flex;
     flex-direction: column;
     gap: 2px;
     align-items: center;
 }

 .preview-label {
     font-size: 12px;
     letter-spacing: 2px;
     color: rgba(0, 255, 255, .35);
 }

 .preview-val {
     font-family: 'Orbitron', monospace;
     font-size: clamp(13px, 3vw, 16px);
 }

 .preview-val.green {
     color: #00ff88;
 }

 .preview-val.red {
     color: #ff6b6b;
 }

 .preview-val.cyan {
     color: #00ffff;
 }

 .preview-sep {
     color: rgba(0, 255, 255, .2);
     font-size: 18px;
     align-self: center;
 }

 .prog-preview {
     width: 100%;
 }

 .prog-bar-thin {
     height: 6px;
     background: rgba(0, 255, 255, .08);
     border-radius: 4px;
     overflow: hidden;
     border: 1px solid rgba(0, 255, 255, .1);
 }

 .prog-fill-g {
     height: 100%;
     background: #00ff88;
     transition: width .3s ease;
     float: left;
 }

 .prog-fill-r {
     height: 100%;
     background: #ff6b6b;
     transition: width .3s ease;
     float: left;
 }

 .prog-labels {
     display: flex;
     justify-content: space-between;
     font-size: 11px;
     color: rgba(0, 255, 255, .35);
     margin-top: 4px;
 }

 .hint {
     font-size: clamp(8px, 2vw, 10px);
     color: rgba(0, 255, 255, .25);
     letter-spacing: 1px;
     margin-top: 8px;
     margin-bottom: 8px;
     line-height: 1.5;
 }

 .q-submit {
     width: 100%;
     background: transparent;
     border: 2px solid #00ffff;
     border-radius: 8px;
     color: #00ffff;
     font-family: 'Share Tech Mono', monospace;
     font-size: clamp(10px, 3vw, 12px);
     letter-spacing: 3px;
     padding: 12px;
     cursor: pointer;
     transition: all .2s;
 }

 .q-submit:hover {
     background: rgba(0, 255, 255, .1);
     box-shadow: 0 0 16px rgba(0, 255, 255, .35);
 }

 .q-submit:disabled {
     opacity: .3;
     cursor: not-allowed;
     border-color: rgba(0, 255, 255, .3);
 }

 .stat-block {
     background: rgba(0, 255, 255, .03);
     border: 1px solid rgba(0, 255, 255, .15);
     border-radius: 10px;
     padding: clamp(12px, 3vw, 18px);
     margin-bottom: 14px;
 }

 .stat-block-title {
     font-size: clamp(9px, 2.5vw, 11px);
     letter-spacing: 3px;
     color: rgba(0, 255, 255, .5);
     margin-bottom: 12px;
 }

 .prog-wrap {
     margin-top: 6px;
 }

 .prog-label {
     display: flex;
     justify-content: space-between;
     font-size: clamp(8px, 2vw, 10px);
     color: rgba(0, 255, 255, .4);
     margin-bottom: 4px;
 }

 .prog-bar {
     height: 5px;
     background: rgba(0, 255, 255, .08);
     border-radius: 4px;
     overflow: hidden;
 }

 .prog-fill {
     height: 100%;
     transition: width .6s ease;
 }

 .prog-fill.g {
     background: #00ff88;
 }

 .prog-fill.r {
     background: #ff6b6b;
 }

 .log-list {
     margin-top: 16px;
 }

 .log-title {
     font-size: clamp(9px, 2.5vw, 11px);
     letter-spacing: 3px;
     color: rgba(0, 255, 255, .5);
     margin-bottom: 10px;
 }

 .log-entry {
     display: flex;
     align-items: center;
     border-bottom: 1px solid rgba(0, 255, 255, .08);
     padding: 10px 0;
     gap: 16px;
 }

 .log-date {
     font-size: 12px;
     color: rgba(0, 255, 255, .45);
     min-width: 160px;
     flex-shrink: 0;
 }

 .log-time-val {
     font-family: 'Orbitron', sans-serif;
     font-size: 14px;
     color: #00ffff;
     min-width: 80px;
 }

 .log-sessions {
     font-size: 12px;
     color: rgba(0, 255, 255, .3);
     flex: 1;
 }

 .log-q {
     font-size: 12px;
     color: #00ff88;
 }

 .log-detail {
     font-size: clamp(9px, 2vw, 10px);
 }

 .log-detail .g {
     color: #00ff88;
 }

 .log-detail .r {
     color: #ff6b6b;
 }

 .del-btn {
     background: transparent;
     border: none;
     color: rgba(255, 107, 107, .35);
     font-size: 14px;
     cursor: pointer;
     padding: 2px 8px;
     transition: color .2s;
     margin-left: auto;
     flex-shrink: 0;
 }

 .del-btn:hover {
     color: #ff6b6b;
 }

 .empty {
     font-size: clamp(9px, 2.5vw, 11px);
     color: rgba(0, 255, 255, .2);
     letter-spacing: 2px;
     padding: 20px 0;
     text-align: center;
 }

 .heatmap-wrap {
     background: rgba(0, 255, 255, .03);
     border: 1px solid rgba(0, 255, 255, .15);
     border-radius: 12px;
     padding: clamp(16px, 3vw, 24px);
     margin-top: 32px;
 }

 .heatmap-header {
     display: flex;
     justify-content: space-between;
     align-items: flex-start;
     margin-bottom: 12px;
     flex-wrap: wrap;
     gap: 8px;
 }

 .heatmap-title {
     font-size: clamp(9px, 2.5vw, 11px);
     letter-spacing: 3px;
     color: rgba(0, 255, 255, .5);
 }

 .heatmap-stats {
     font-size: clamp(9px, 2vw, 10px);
     color: rgba(0, 255, 255, .4);
     letter-spacing: 2px;
 }

 .heatmap-grid {
     display: flex;
     gap: clamp(3px, 1vw, 5px);
     flex-wrap: wrap;
     justify-content: center;
 }

 .heat-day {
     width: clamp(26px, 5vw, 34px);
     height: clamp(26px, 5vw, 34px);
     border: 1px solid rgba(0, 255, 255, .08);
     border-radius: 5px;
     background: rgba(0, 255, 255, .02);
     cursor: default;
     transition: border-color .2s;
 }

 .heat-day.future {
     background: transparent;
     border: 1px solid rgba(0, 255, 255, .04);
 }

 .heat-day.missed {
     background: rgba(220, 50, 50, .32);
     border-color: rgba(230, 70, 70, .45);
 }

 .heat-day[data-level="1"] {
     background: rgba(0, 160, 70, .20);
     border-color: rgba(0, 160, 70, .32);
 }

 .heat-day[data-level="2"] {
     background: rgba(0, 170, 75, .38);
     border-color: rgba(0, 170, 75, .50);
 }

 .heat-day[data-level="3"] {
     background: rgba(0, 175, 78, .58);
     border-color: rgba(0, 175, 78, .68);
 }

 .heat-day[data-level="4"] {
     background: rgba(0, 172, 76, .82);
     border-color: rgba(0, 178, 80, .92);
     box-shadow: 0 0 5px rgba(0, 170, 75, .30);
 }

 .heat-day.today {
     border: 2px solid #ffd700 !important;
     box-shadow: 0 0 8px rgba(255, 215, 0, .35);
 }

 .heat-day:hover {
     border-color: rgba(0, 255, 255, .5) !important;
     z-index: 2;
 }

 .heatmap-footer {
     display: flex;
     justify-content: flex-end;
     align-items: center;
     margin-top: 8px;
     font-size: 12px;
     color: rgba(255, 215, 0, .6);
     letter-spacing: 2px;
     gap: 6px;
 }

 .today-dot {
     width: 10px;
     height: 10px;
     border: 2px solid #ffd700;
     border-radius: 50%;
 }

 .streak-badge {
     display: inline-flex;
     align-items: center;
     gap: 5px;
     background: rgba(255, 165, 0, .1);
     border: 1px solid rgba(255, 165, 0, .3);
     padding: 4px 10px;
     font-size: clamp(8px, 2vw, 10px);
     letter-spacing: 2px;
     color: #ffa500;
     margin-top: 6px;
 }

 .no-streak {
     font-size: clamp(8px, 2vw, 10px);
     color: rgba(255, 107, 107, .6);
     letter-spacing: 2px;
     margin-top: 6px;
 }

 .heat-tip {
     position: fixed;
     background: rgba(5, 5, 5, .97);
     border: 1px solid rgba(0, 255, 255, .25);
     padding: 10px 14px;
     pointer-events: none;
     z-index: 999;
     display: none;
     min-width: 160px;
 }

 .heat-tip-date {
     font-family: 'Share Tech Mono', monospace;
     font-size: 13px;
     font-weight: 700;
     color: #00ffff;
     letter-spacing: 1px;
     margin-bottom: 4px;
 }

 .heat-tip-info {
     font-family: 'Share Tech Mono', monospace;
     font-size: 13px;
     letter-spacing: 1px;
 }

 .heat-tip-info.studied {
     color: #00ff88;
 }

 .heat-tip-info.not-studied {
     color: rgba(255, 107, 107, .7);
 }

 @media(max-width:480px) {
     .app {
         padding: 12px 10px 60px;
     }

     .sys-title {
         letter-spacing: 4px;
     }

     .cards-row {
         grid-template-columns: 1fr 1fr;
     }

     .q-row {
         grid-template-columns: 1fr;
     }

     .controls {
         gap: 6px;
     }

     .ctrl-btn {
         flex: 1;
         text-align: center;
     }

     .log-entry {
         flex-direction: column;
         align-items: flex-start;
         gap: 4px;
     }

     .preview-sep {
         display: none;
     }

     .preview {
         justify-content: space-around;
     }
 }

 .timer-ring {
     width: 160px;
     height: 160px;
 }

 @media(max-width:360px) {
     .time-display {
         font-size: 28px;
     }

     .cards-row {
         grid-template-columns: 1fr;
     }
 }

 ::-webkit-scrollbar {
     width: 4px;
 }

 ::-webkit-scrollbar-track {
     background: transparent;
 }

 ::-webkit-scrollbar-thumb {
     background: rgba(0, 255, 255, .3);
 }

 /* ══════════════════════════════════════════
   NEXUS DESIGN SYSTEM v2 — sobrepõe stylr.css
══════════════════════════════════════════ */

 /* ================================================================
   NEXUS — Design System v2.0
   ================================================================ */

 /* 1. Tokens ------------------------------------------------------- */
 :root {
     --bg: #070b10;
     --surface-1: #0d141c;
     --surface-2: #141d29;
     --border: rgba(94, 234, 212, 0.10);
     --border-hover: rgba(94, 234, 212, 0.28);

     --cyan: #22d3ee;
     --cyan-bright: #67e8f9;
     --cyan-deep: #0e7490;

     --success: #34d399;
     --warning: #fbbf24;
     --error: #f87171;
     --purple: #a78bfa;
     --magenta: #e879f9;

     --text-1: #f8fafc;
     --text-2: #e2e8f0;
     --text-3: #94a3b8;
     --text-4: #64748b;

     --font-ui: 'Geist', 'Space Grotesk', system-ui, sans-serif;
     --font-display: 'Space Grotesk', 'Geist', sans-serif;
     --font-mono: 'JetBrains Mono', 'Space Mono', ui-monospace, monospace;

     --r-sm: 8px;
     --r-md: 12px;
     --r-lg: 14px;
     --r-xl: 20px;
 }

 /* 2. Reset & Base -------------------------------------------------- */
 *,
 *::before,
 *::after {
     box-sizing: border-box;
     margin: 0;
     padding: 0;
 }

 html,
 body {
     min-height: 100vh;
     background: var(--bg);
     color: var(--text-2);
     font-family: var(--font-ui);
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
 }

 button {
     font-family: inherit;
     cursor: pointer;
 }

 input,
 select,
 textarea {
     font-family: inherit;
 }

 a {
     text-decoration: none;
     transition: color .15s;
 }

 img {
     display: block;
     max-width: 100%;
 }

 ::-webkit-scrollbar {
     width: 8px;
     height: 8px;
 }

 ::-webkit-scrollbar-track {
     background: transparent;
 }

 ::-webkit-scrollbar-thumb {
     background: rgba(94, 234, 212, 0.15);
     border-radius: 4px;
 }

 ::-webkit-scrollbar-thumb:hover {
     background: rgba(94, 234, 212, 0.3);
 }

 /* 3. Animations ---------------------------------------------------- */
 @keyframes nx-pulse {

     0%,
     100% {
         opacity: 1
     }

     50% {
         opacity: .4
     }
 }

 @keyframes nx-ping {
     0% {
         opacity: .6;
         transform: scale(1)
     }

     80%,
     100% {
         opacity: 0;
         transform: scale(1.5)
     }
 }

 @keyframes nx-fadeIn {
     from {
         opacity: 0
     }

     to {
         opacity: 1
     }
 }

 @keyframes nx-slideUp {
     from {
         opacity: 0;
         transform: translateY(10px) scale(.98)
     }

     to {
         opacity: 1;
         transform: translateY(0) scale(1)
     }
 }

 @keyframes nx-blink {
     50% {
         opacity: 0
     }
 }

 @keyframes nx-spin {
     to {
         transform: rotate(360deg)
     }
 }

 /* 4. Background ---------------------------------------------------- */
 .nx-bg {
     position: fixed;
     inset: 0;
     pointer-events: none;
     z-index: 0;
     overflow: hidden;
 }

 .nx-bg-grid {
     position: absolute;
     inset: 0;
     background-image:
         linear-gradient(rgba(94, 234, 212, 0.04) 1px, transparent 1px),
         linear-gradient(90deg, rgba(94, 234, 212, 0.04) 1px, transparent 1px);
     background-size: 64px 64px;
 }

 .nx-bg-glow-tl {
     position: absolute;
     top: -20%;
     left: -15%;
     width: 900px;
     height: 900px;
     border-radius: 50%;
     background: radial-gradient(closest-side, rgba(34, 211, 238, 0.10), transparent 65%);
     filter: blur(30px);
 }

 .nx-bg-glow-br {
     position: absolute;
     bottom: -30%;
     right: -15%;
     width: 900px;
     height: 900px;
     border-radius: 50%;
     background: radial-gradient(closest-side, rgba(232, 121, 249, 0.07), transparent 65%);
     filter: blur(30px);
 }

 /* 5. TopBar -------------------------------------------------------- */
 .nx-topbar {
     position: relative;
     z-index: 10;
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 0 40px;
     height: 72px;
     border-bottom: 1px solid var(--border);
     background: rgba(7, 11, 16, 0.7);
     backdrop-filter: blur(12px);
 }

 .nx-topbar__logo {
     display: flex;
     align-items: center;
     gap: 10px;
 }

 .nx-logo-name {
     font-family: var(--font-display);
     font-size: 16px;
     font-weight: 700;
     letter-spacing: 0.32em;
     color: var(--cyan);
 }

 .nx-logo-version {
     margin-left: 4px;
     padding: 2px 8px;
     border-radius: 4px;
     border: 1px solid rgba(148, 163, 184, 0.15);
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.2em;
     color: var(--text-4);
 }

 .nx-topbar__center {
     position: absolute;
     left: 50%;
     transform: translateX(-50%);
 }

 .nx-status-pill {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 6px 14px;
     border-radius: 999px;
     border: 1px solid rgba(148, 163, 184, 0.15);
     background: rgba(13, 20, 28, 0.6);
     backdrop-filter: blur(8px);
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.14em;
     text-transform: uppercase;
     color: rgba(226, 232, 240, 0.65);
 }

 .nx-status-dot {
     width: 6px;
     height: 6px;
     border-radius: 50%;
     background: var(--success);
     box-shadow: 0 0 8px var(--success), 0 0 2px var(--success);
     animation: nx-pulse 2s ease-in-out infinite;
 }

 .nx-status-dot.loading {
     background: var(--warning);
     box-shadow: 0 0 8px var(--warning);
 }

 .nx-status-dot.error {
     background: var(--error);
     box-shadow: 0 0 8px var(--error);
 }

 .nx-topbar__actions {
     display: flex;
     align-items: center;
     gap: 14px;
 }

 /* Bell */
 .nx-bell-btn {
     position: relative;
     width: 40px;
     height: 40px;
     border-radius: 50%;
     background: rgba(13, 20, 28, 0.5);
     border: 1px solid var(--border);
     color: rgba(203, 213, 225, 0.7);
     display: flex;
     align-items: center;
     justify-content: center;
     transition: all .15s;
 }

 .nx-bell-btn:hover {
     border-color: var(--border-hover);
     color: var(--text-2);
 }

 .nx-bell-badge {
     position: absolute;
     top: 8px;
     right: 9px;
     width: 7px;
     height: 7px;
     border-radius: 50%;
     background: var(--error);
     box-shadow: 0 0 6px var(--error);
     border: 2px solid var(--bg);
 }

 /* Profile Chip */
 .nx-profile-chip {
     position: relative;
 }

 .nx-profile-chip__btn {
     display: flex;
     align-items: center;
     gap: 10px;
     padding: 5px 12px 5px 5px;
     border-radius: 999px;
     background: rgba(13, 20, 28, 0.5);
     border: 1px solid var(--border);
     color: var(--text-2);
     font-size: 14px;
     font-weight: 500;
     transition: all .15s;
 }

 .nx-profile-chip__btn:hover,
 .nx-profile-chip__btn[aria-expanded="true"] {
     background: rgba(34, 211, 238, 0.08);
     border-color: rgba(34, 211, 238, 0.3);
 }

 .nx-profile-chip__avatar {
     width: 34px;
     height: 34px;
     border-radius: 50%;
     background: linear-gradient(135deg, var(--cyan), var(--cyan-deep));
     border: 1px solid rgba(34, 211, 238, 0.4);
     flex-shrink: 0;
     overflow: hidden;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 15px;
 }

 .nx-profile-chip__avatar img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 .nx-profile-chip__name {
     letter-spacing: 0.05em;
 }

 .nx-profile-chip__chevron {
     color: var(--text-4);
     line-height: 0;
     transition: transform .15s;
 }

 .nx-profile-chip__btn[aria-expanded="true"] .nx-profile-chip__chevron {
     transform: rotate(180deg);
 }

 .nx-profile-chip.dd-open .nx-profile-chip__chevron {
     transform: rotate(180deg);
 }

 .nx-profile-chip.dd-open .nx-profile-chip__btn {
     background: rgba(34, 211, 238, 0.08);
     border-color: rgba(34, 211, 238, 0.3);
 }

 .nx-profile-dropdown {
     position: absolute;
     top: calc(100% + 8px);
     right: 0;
     min-width: 200px;
     background: linear-gradient(180deg, rgba(20, 30, 42, 0.97), rgba(10, 16, 22, 0.97));
     border: 1px solid rgba(94, 234, 212, 0.18);
     border-radius: var(--r-md);
     padding: 6px;
     backdrop-filter: blur(12px);
     box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(34, 211, 238, 0.06);
     z-index: 50;
     animation: nx-slideUp .15s ease-out;
 }

 .nx-dd-item {
     display: flex;
     align-items: center;
     gap: 10px;
     width: 100%;
     padding: 10px 12px;
     background: transparent;
     border: none;
     border-radius: var(--r-sm);
     color: var(--text-2);
     font-size: 14px;
     text-align: left;
     transition: background .12s;
 }

 .nx-dd-item:hover {
     background: rgba(94, 234, 212, 0.07);
 }

 .nx-dd-item--danger {
     color: var(--error);
 }

 .nx-dd-item--danger:hover {
     background: rgba(248, 113, 113, 0.08);
 }

 .nx-dd-sep {
     height: 1px;
     background: rgba(148, 163, 184, 0.12);
     margin: 4px 6px;
 }

 /* 6. Main shell ---------------------------------------------------- */
 #appScreen {
     display: none;
 }

 #appScreen.visible {
     display: block;
 }

 .nx-main {
     position: relative;
     z-index: 1;
     max-width: 1280px;
     margin: 0 auto;
     padding: 20px 32px 120px;
 }

 /* 7. Hero ---------------------------------------------------------- */
 .nx-hero {
     display: flex;
     flex-wrap: wrap;
     align-items: flex-end;
     justify-content: space-between;
     gap: 32px;
     margin-bottom: 48px;
 }

 .nx-hero__text {
     flex: 1 1 360px;
     min-width: 0;
 }

 .nx-hero__eyebrow {
     display: flex;
     align-items: center;
     gap: 10px;
     margin-bottom: 14px;
 }

 .nx-eyebrow-label {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.24em;
     text-transform: uppercase;
     color: var(--cyan);
 }

 .nx-eyebrow-sep {
     width: 1px;
     height: 12px;
     background: rgba(148, 163, 184, 0.2);
 }

 .nx-eyebrow-date {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.18em;
     text-transform: uppercase;
     color: var(--text-4);
 }

 .nx-hero__title {
     font-family: var(--font-display);
     font-weight: 600;
     font-size: 32px;
     line-height: 1.1;
     letter-spacing: -0.02em;
     color: var(--text-1);
 }

 .nx-hero__title span {
     color: var(--cyan);
 }

 .nx-hero__sub {
     margin-top: 12px;
     font-size: 16px;
     max-width: 540px;
     color: rgba(148, 163, 184, 0.85);
     line-height: 1.6;
 }

 .nx-hl-green {
     color: var(--success);
     font-weight: 600;
 }

 .nx-hl-cyan {
     color: var(--cyan-bright);
     font-weight: 600;
 }

 /* Prova Card */
 .nx-prova-card {
     position: relative;
     padding: 10px 16px;
     background: linear-gradient(135deg, rgba(20, 30, 42, 0.85), rgba(10, 16, 22, 0.85));
     border: 1px solid rgba(34, 211, 238, 0.18);
     border-radius: var(--r-lg);
     overflow: hidden;
     min-width: 240px;
     flex: 0 1 300px;
     cursor: pointer;
     transition: border-color .2s;
 }

 .nx-prova-card:hover {
     border-color: rgba(34, 211, 238, 0.4);
 }

 .nx-prova-card__glow {
     position: absolute;
     right: -40px;
     top: -40px;
     width: 140px;
     height: 140px;
     border-radius: 50%;
     background: radial-gradient(closest-side, rgba(34, 211, 238, 0.18), transparent 70%);
     pointer-events: none;
 }

 .nx-prova-card__row {
     display: flex;
     align-items: center;
     justify-content: space-between;
     position: relative;
 }

 .nx-prova-card__label {
     display: flex;
     align-items: center;
     gap: 6px;
     margin-bottom: 2px;
 }

 .nx-prova-card__dot {
     width: 5px;
     height: 5px;
     border-radius: 50%;
     background: var(--cyan);
     box-shadow: 0 0 6px var(--cyan);
 }

 .nx-prova-card__tag {
     font-family: var(--font-mono);
     font-size: 9px;
     letter-spacing: 0.22em;
     text-transform: uppercase;
     color: var(--text-3);
 }

 .nx-prova-card__name {
     font-family: var(--font-display);
     font-size: 19px;
     font-weight: 700;
     color: #ffffff;
     letter-spacing: 0.02em;
 }

 .nx-prova-card__name--empty {
     font-size: 13px;
     color: var(--text-3);
     font-weight: 500;
 }

 .nx-prova-card__date {
     font-family: var(--font-mono);
     font-size: 11px;
     color: var(--text-3);
     margin-top: 2px;
 }

 .nx-prova-card__days {
     font-family: var(--font-display);
     font-size: 32px;
     font-weight: 700;
     line-height: 1;
     letter-spacing: -0.04em;
     text-align: right;
     transition: color .4s, text-shadow .4s;
 }

 .nx-prova-card__days-label {
     font-family: var(--font-mono);
     font-size: 9px;
     letter-spacing: 0.16em;
     text-transform: uppercase;
     color: var(--text-3);
     padding-bottom: 4px;
 }

 .nx-prova-card__progress {
     margin-top: 10px;
 }

 .nx-prova-card__bar-track {
     height: 4px;
     background: rgba(148, 163, 184, 0.12);
     border-radius: 2px;
     overflow: hidden;
 }

 .nx-prova-card__bar-fill {
     height: 100%;
     border-radius: 2px;
     background: linear-gradient(90deg, var(--cyan), rgba(34, 211, 238, 0.8));
     box-shadow: 0 0 10px rgba(34, 211, 238, 0.7);
     transition: width .4s;
 }

 .nx-prova-card__bar-labels {
     display: flex;
     justify-content: space-between;
     margin-top: 6px;
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.14em;
     text-transform: uppercase;
     color: var(--text-4);
 }

 /* 8. Tab Nav ------------------------------------------------------- */
 .nx-tabnav {
     display: flex;
     align-items: center;
     gap: 4px;
     padding: 6px;
     background: rgba(13, 20, 28, 0.55);
     border: 1px solid var(--border);
     border-radius: var(--r-md);
     backdrop-filter: blur(8px);
     width: fit-content;
     max-width: 100%;
     overflow-x: auto;
     overflow-y: hidden;
     scrollbar-width: none;
     margin-bottom: 36px;
 }

 .nx-tabnav::-webkit-scrollbar {
     display: none;
 }

 .nx-tabnav__btn {
     display: flex;
     align-items: center;
     gap: 8px;
     padding: 10px 16px;
     border-radius: var(--r-sm);
     background: transparent;
     border: none;
     color: rgba(203, 213, 225, 0.65);
     font-size: 13px;
     font-weight: 500;
     letter-spacing: 0.04em;
     white-space: nowrap;
     transition: background .15s, color .15s;
 }

 .nx-tabnav__btn:hover {
     color: var(--text-2);
 }

 .nx-tabnav__btn.active {
     background: linear-gradient(180deg, rgba(34, 211, 238, 0.18), rgba(34, 211, 238, 0.08));
     color: var(--cyan-bright);
     font-weight: 600;
     box-shadow: inset 0 0 0 1px rgba(34, 211, 238, 0.32), 0 0 20px rgba(34, 211, 238, 0.07);
 }

 .nx-tabnav__btn svg {
     flex-shrink: 0;
 }

 /* 9. Stat Cards ---------------------------------------------------- */
 .nx-cards {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
     gap: 20px;
     margin-bottom: 40px;
 }

 .nx-card {
     position: relative;
     padding: 24px 28px;
     background: linear-gradient(180deg, rgba(15, 23, 32, 0.7), rgba(10, 16, 22, 0.7));
     border: 1px solid rgba(94, 234, 212, 0.12);
     border-radius: var(--r-lg);
     overflow: hidden;
     transition: border-color .2s;
 }

 .nx-card:hover {
     border-color: rgba(94, 234, 212, 0.24);
 }

 .nx-card__corner {
     position: absolute;
     top: -1px;
     left: -1px;
     width: 32px;
     height: 32px;
     border-top: 1px solid var(--cyan);
     border-left: 1px solid var(--cyan);
     border-top-left-radius: var(--r-lg);
     opacity: 0.5;
 }

 .nx-card__header {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 12px;
 }

 .nx-card__label {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.22em;
     text-transform: uppercase;
     color: var(--text-3);
 }

 .nx-card__icon {
     color: var(--text-4);
     line-height: 0;
 }

 .nx-card__value {
     font-family: var(--font-display);
     font-weight: 600;
     font-size: 44px;
     line-height: 1;
     letter-spacing: -0.02em;
     color: var(--text-1);
     margin-bottom: 8px;
 }

 .nx-card__value--cyan {
     color: var(--cyan);
     text-shadow: 0 0 20px rgba(34, 211, 238, 0.4);
 }

 .nx-card__value--green {
     color: var(--success);
     text-shadow: 0 0 20px rgba(52, 211, 153, 0.4);
 }

 .nx-card__value--red {
     color: var(--error);
     text-shadow: 0 0 20px rgba(248, 113, 113, 0.4);
 }

 .nx-card__sub {
     font-size: 13px;
     color: var(--text-3);
 }

 /* 10. CTA Button --------------------------------------------------- */
 .nx-cta-wrap {
     display: flex;
     justify-content: center;
     margin-bottom: 56px;
 }

 .nx-cta-inner {
     text-align: center;
     width: 100%;
     max-width: 560px;
 }

 /* ── CTA Button "Get Offer" style ── */
 .nx-cta-container {
     --cta-dist: 20px;
     --cta-mult: 1.5;
     --cta-timing: cubic-bezier(0, 0, 0, 2.5);
     --cta-dur: 250ms;
     --cta-corner: rgba(34, 211, 238, 0.35);
     position: relative;
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 10px;
 }

 .nx-cta-btn {
     position: relative;
     width: 100%;
     min-width: 320px;
     height: 52px;
     display: flex;
     align-items: center;
     justify-content: center;
     background: linear-gradient(rgba(255, 255, 255, 0.12), rgba(0, 0, 0, 0.04)), #22d3ee;
     border: none;
     border-radius: var(--r-lg);
     cursor: pointer;
     box-shadow: 1px 1px 2px -1px rgba(255, 255, 255, 0.6) inset,
         0 2px 1px rgba(0, 0, 0, 0.08), 0 6px 4px rgba(0, 0, 0, 0.08),
         0 14px 8px rgba(0, 0, 0, 0.06), 0 7px 0 0 #0e7490;
     transition: transform var(--cta-dur) var(--cta-timing),
         filter var(--cta-dur) var(--cta-timing);
 }

 .nx-cta-btn__text {
     font-family: var(--font-display);
     font-size: 15px;
     font-weight: 700;
     letter-spacing: 0.06em;
     text-transform: uppercase;
     color: #031018;
     filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.5)) drop-shadow(0 -1px 0 rgba(0, 0, 0, 0.2));
     transition: transform var(--cta-dur) var(--cta-timing), filter var(--cta-dur) var(--cta-timing);
 }

 /* Drawers */
 .nx-cta-drawer {
     position: absolute;
     left: 0;
     right: 0;
     display: flex;
     justify-content: center;
     align-items: center;
     min-height: 30px;
     border-radius: 10px;
     padding: 4px 16px;
     font-family: var(--font-mono);
     font-size: 12px;
     font-weight: 700;
     letter-spacing: 0.1em;
     text-transform: uppercase;
     color: #031018;
     background: linear-gradient(rgba(255, 255, 255, 0.1), rgba(0, 0, 0, 0.04)), #06b6d4;
     opacity: 0;
     filter: blur(2px);
     transition: transform calc(0.5 * var(--cta-dur)) ease,
         filter var(--cta-dur) var(--cta-timing),
         opacity calc(0.5 * var(--cta-dur)) ease;
 }

 .nx-cta-drawer--top {
     top: 0;
     border-radius: 10px 10px 0 0;
     align-items: flex-start;
 }

 .nx-cta-drawer--bottom {
     bottom: 0;
     border-radius: 0 0 10px 10px;
     align-items: flex-end;
 }

 /* Corners */
 .nx-cta-corner {
     position: absolute;
     width: 24px;
     color: var(--cta-corner);
     transition: transform var(--cta-dur) var(--cta-timing), filter var(--cta-dur) var(--cta-timing);
 }

 .nx-cta-corner:nth-of-type(1) {
     top: 0;
     left: 0;
     transform: translate(calc(-1*var(--cta-dist)), calc(-1*var(--cta-dist))) rotate(0deg);
 }

 .nx-cta-corner:nth-of-type(2) {
     top: 0;
     right: 0;
     transform: translate(var(--cta-dist), calc(-1*var(--cta-dist))) rotate(90deg);
 }

 .nx-cta-corner:nth-of-type(3) {
     bottom: 0;
     right: 0;
     transform: translate(var(--cta-dist), var(--cta-dist)) rotate(180deg);
 }

 .nx-cta-corner:nth-of-type(4) {
     bottom: 0;
     left: 0;
     transform: translate(calc(-1*var(--cta-dist)), var(--cta-dist)) rotate(270deg);
 }

 /* Hover state */
 .nx-cta-container:has(.nx-cta-btn:hover) .nx-cta-btn {
     transform: scale(1.04);
     filter: drop-shadow(0 14px 14px rgba(34, 211, 238, 0.25));
     box-shadow: 1px 1px 2px -1px rgba(255, 255, 255, 0.6) inset, 0 2px 1px rgba(0, 0, 0, 0.08), 0 6px 4px rgba(0, 0, 0, 0.08);
 }

 .nx-cta-container:has(.nx-cta-btn:hover) .nx-cta-drawer--top {
     transform: translateY(-22px) rotateZ(2deg);
     opacity: 1;
     filter: blur(0);
     animation: nx-cta-hue 3s infinite linear;
 }

 .nx-cta-container:has(.nx-cta-btn:hover) .nx-cta-drawer--bottom {
     transform: translateY(22px) rotateZ(-2deg);
     opacity: 1;
     filter: blur(0);
     animation: nx-cta-hue 3s infinite linear;
 }

 .nx-cta-container:has(.nx-cta-btn:hover) .nx-cta-btn__text {
     transform: scale(1.04);
 }

 .nx-cta-container:has(.nx-cta-btn:hover) {
     --cta-corner: rgba(34, 211, 238, 0.7);
 }

 .nx-cta-container:has(.nx-cta-btn:hover) .nx-cta-corner:nth-of-type(1) {
     transform: translate(calc(-1*var(--cta-mult)*var(--cta-dist)), calc(-1*var(--cta-mult)*var(--cta-dist))) rotate(0deg);
 }

 .nx-cta-container:has(.nx-cta-btn:hover) .nx-cta-corner:nth-of-type(2) {
     transform: translate(calc(var(--cta-mult)*var(--cta-dist)), calc(-1*var(--cta-mult)*var(--cta-dist))) rotate(90deg);
 }

 .nx-cta-container:has(.nx-cta-btn:hover) .nx-cta-corner:nth-of-type(3) {
     transform: translate(calc(var(--cta-mult)*var(--cta-dist)), calc(var(--cta-mult)*var(--cta-dist))) rotate(180deg);
 }

 .nx-cta-container:has(.nx-cta-btn:hover) .nx-cta-corner:nth-of-type(4) {
     transform: translate(calc(-1*var(--cta-mult)*var(--cta-dist)), calc(var(--cta-mult)*var(--cta-dist))) rotate(270deg);
 }

 /* Active */
 .nx-cta-container:has(.nx-cta-btn:active) .nx-cta-btn {
     transform: scale(0.96) translateY(4px);
     box-shadow: none;
 }

 .nx-cta-container:has(.nx-cta-btn:active) .nx-cta-drawer--top,
 .nx-cta-container:has(.nx-cta-btn:active) .nx-cta-drawer--bottom {
     transform: translateY(0) scale(0.5);
 }

 @keyframes nx-cta-hue {

     0%,
     100% {
         filter: hue-rotate(0deg);
     }

     50% {
         filter: hue-rotate(-40deg);
     }
 }

 .nx-cta-hint {
     margin-top: 14px;
     font-size: 13px;
     color: var(--text-4);
     line-height: 1.6;
 }

 .nx-kbd {
     display: inline-block;
     padding: 2px 8px;
     margin: 0 2px;
     background: rgba(13, 20, 28, 0.7);
     border: 1px solid rgba(94, 234, 212, 0.2);
     border-radius: 4px;
     font-family: var(--font-mono);
     font-size: 11px;
     color: var(--cyan-bright);
     letter-spacing: 0.04em;
 }

 /* 11. Quote Card --------------------------------------------------- */
 .nx-quote {
     padding: 28px 32px;
     background: linear-gradient(135deg, rgba(15, 23, 32, 0.6), rgba(10, 16, 22, 0.6));
     border: 1px solid var(--border);
     border-radius: var(--r-lg);
     display: flex;
     align-items: flex-start;
     gap: 20px;
     overflow: hidden;
 }

 .nx-quote__icon {
     flex-shrink: 0;
     width: 44px;
     height: 44px;
     border-radius: 50%;
     background: rgba(34, 211, 238, 0.10);
     border: 1px solid rgba(34, 211, 238, 0.25);
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--cyan);
 }

 .nx-quote__label {
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.24em;
     text-transform: uppercase;
     color: var(--text-4);
     margin-bottom: 8px;
 }

 .nx-quote__text {
     font-family: var(--font-display);
     font-size: 20px;
     font-weight: 400;
     line-height: 1.45;
     letter-spacing: -0.01em;
     font-style: italic;
     color: var(--text-1);
 }

 .nx-quote__author {
     margin-top: 10px;
     font-size: 13px;
     color: var(--text-3);
 }

 /* 12. FAB Timer ---------------------------------------------------- */
 .nx-fab {
     position: fixed;
     bottom: 32px;
     right: 32px;
     z-index: 30;
     width: 64px;
     height: 64px;
     border-radius: 50%;
     background: linear-gradient(180deg, var(--cyan), #06b6d4);
     border: none;
     color: #031018;
     display: flex;
     align-items: center;
     justify-content: center;
     box-shadow: 0 12px 40px rgba(34, 211, 238, 0.45), 0 0 0 1px rgba(34, 211, 238, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.4);
     transition: transform .15s, box-shadow .18s;
 }

 .nx-fab:hover {
     transform: scale(1.07);
     box-shadow: 0 18px 50px rgba(34, 211, 238, 0.6), 0 0 0 1px rgba(34, 211, 238, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.4);
 }

 .nx-fab__ring {
     position: absolute;
     inset: -4px;
     border-radius: 50%;
     border: 1.5px solid rgba(34, 211, 238, 0.5);
     animation: nx-ping 2.4s ease-out infinite;
     pointer-events: none;
 }

 /* 13. Mini Timer --------------------------------------------------- */
 .nx-mini-timer {
     position: fixed;
     bottom: 28px;
     right: 28px;
     z-index: 550;
     display: none;
     align-items: center;
     gap: 14px;
     padding: 14px 22px;
     background: linear-gradient(180deg, rgba(20, 30, 42, 0.97), rgba(10, 16, 22, 0.97));
     border-radius: var(--r-lg);
     backdrop-filter: blur(12px);
     cursor: pointer;
     animation: nx-fadeIn .2s ease-out;
     box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
 }

 .nx-mini-timer.show {
     display: flex;
 }

 .nx-mini-timer__dot {
     width: 8px;
     height: 8px;
     border-radius: 50%;
     background: var(--cyan);
     box-shadow: 0 0 8px var(--cyan);
 }

 .nx-mini-timer__dot.running {
     animation: nx-pulse 1.4s ease-in-out infinite;
 }

 .nx-mini-timer__time {
     font-family: var(--font-mono);
     font-size: 22px;
     font-weight: 700;
     color: var(--cyan);
     letter-spacing: 0.02em;
     font-variant-numeric: tabular-nums;
     text-shadow: 0 0 16px rgba(34, 211, 238, 0.55);
 }

 .nx-mini-timer__mode {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.18em;
     text-transform: uppercase;
     color: var(--text-3);
     max-width: 120px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
 }

 /* 14. Timer Fullscreen --------------------------------------------- */
 .nx-timer-fs {
     position: fixed;
     inset: 0;
     z-index: 200;
     background: rgba(0, 0, 0, 0.97);
     display: flex;
     flex-direction: column;
     justify-content: flex-start;
     animation: nx-fadeIn .25s ease-out;
     overflow-y: auto;
     overflow-x: hidden;
 }

 .nx-timer-fs::before {
     content: '';
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     width: 600px;
     height: 600px;
     background: radial-gradient(closest-side, rgba(34, 211, 238, 0.05), transparent 70%);
     pointer-events: none;
     z-index: 0;
 }

 .nx-timer-fs__topbar {
     position: relative;
     z-index: 2;
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 24px 32px;
     width: 100%;
 }

 .nx-timer-fs__logo {
     display: flex;
     align-items: center;
     gap: 10px;
 }

 .nx-timer-fs__actions {
     display: flex;
     gap: 8px;
 }

 .nx-timer-fs__btn {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     height: 36px;
     padding: 0 14px;
     background: rgba(13, 20, 28, 0.5);
     border: 1px solid var(--border);
     border-radius: var(--r-sm);
     color: rgba(203, 213, 225, 0.85);
     font-size: 12.5px;
     font-weight: 500;
     letter-spacing: 0.06em;
     transition: all .15s;
 }

 .nx-timer-fs__btn:hover {
     border-color: var(--border-hover);
 }

 .nx-timer-fs__btn--danger {
     border-color: rgba(248, 113, 113, 0.3);
     color: var(--error);
 }

 .nx-timer-fs__btn--danger:hover {
     background: rgba(248, 113, 113, 0.08);
 }

 .nx-timer-subject {
     position: relative;
     z-index: 2;
     display: flex;
     justify-content: center;
     margin-top: 8px;
 }

 .nx-timer-subject__inner {
     display: inline-flex;
     align-items: center;
     gap: 12px;
     padding: 10px 20px;
     border-radius: var(--r-md);
     border: 1px solid rgba(34, 211, 238, 0.2);
     background: rgba(34, 211, 238, 0.04);
     backdrop-filter: blur(8px);
 }

 .nx-timer-subject__dot {
     width: 6px;
     height: 6px;
     border-radius: 50%;
     animation: nx-pulse 2s ease-in-out infinite;
 }

 .nx-timer-subject__disc {
     font-family: var(--font-display);
     font-size: 17px;
     font-weight: 600;
     color: var(--text-1);
     letter-spacing: -0.01em;
 }

 .nx-timer-subject__sep {
     color: rgba(148, 163, 184, 0.4);
 }

 .nx-timer-subject__top {
     font-size: 14px;
     color: rgba(203, 213, 225, 0.75);
 }

 .nx-timer-modes {
     position: relative;
     z-index: 2;
     display: flex;
     justify-content: center;
     margin-top: 24px;
 }

 .nx-timer-modes__inner {
     display: flex;
     gap: 3px;
     padding: 3px;
     background: rgba(13, 20, 28, 0.55);
     border: 1px solid var(--border);
     border-radius: var(--r-md);
     backdrop-filter: blur(8px);
 }

 .nx-timer-mode-btn {
     padding: 6px 14px;
     border-radius: 6px;
     background: transparent;
     border: 1px solid transparent;
     color: rgba(203, 213, 225, 0.6);
     font-size: 11px;
     font-weight: 500;
     letter-spacing: 0.08em;
     text-transform: uppercase;
     transition: all .15s;
 }

 .nx-timer-mode-btn.active {
     font-weight: 600;
 }

 .nx-timer-mode-btn:disabled {
     cursor: not-allowed;
 }

 .nx-timer-ring-area {
     position: relative;
     z-index: 2;
     flex: 1;
     min-height: 0;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-direction: column;
 }

 .nx-timer-ring {
     position: relative;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .nx-timer-ring svg {
     display: block;
 }

 .nx-timer-center {
     position: absolute;
     inset: 0;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     gap: 6px;
 }

 .nx-timer-time {
     font-family: 'Orbitron', var(--font-mono);
     font-weight: 900;
     font-size: clamp(68px, 18vmin, 118px);
     line-height: 1;
     letter-spacing: 5px;
     padding-left: 5px;
     /* compensa trailing do letter-spacing */
     color: #22d3ee;
     text-shadow: 0 0 6px rgba(34, 211, 238, 0.7);
     -webkit-font-smoothing: antialiased;
 }

 .nx-timer-mode-label {
     margin-top: 14px;
     font-family: var(--font-mono);
     font-size: 12px;
     letter-spacing: 0.32em;
     font-weight: 600;
     text-transform: uppercase;
     color: rgba(203, 213, 225, 0.7);
 }

 .nx-timer-dots {
     display: flex;
     gap: 8px;
     margin-top: 14px;
 }

 .nx-timer-pause-elapsed {
     display: none;
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.22em;
     color: rgba(251, 146, 60, 0.65);
     margin-top: 10px;
 }

 .nx-timer-mode-label.is-paused {
     color: rgba(251, 146, 60, 0.85);
 }

 .nx-timer-dot {
     width: 7px;
     height: 7px;
     border-radius: 50%;
     background: transparent;
     border: 1.5px solid rgba(148, 163, 184, 0.3);
     transition: all .15s;
 }

 .nx-timer-dot.filled {
     background: var(--cyan);
     border-color: var(--cyan);
     box-shadow: 0 0 6px var(--cyan);
 }

 .nx-timer-steppers {
     margin-top: 36px;
     display: flex;
     align-items: center;
     gap: 18px;
 }

 .nx-timer-stepper-btn {
     width: 44px;
     height: 44px;
     border-radius: 50%;
     background: rgba(13, 20, 28, 0.55);
     color: var(--cyan);
     font-family: var(--font-mono);
     font-size: 22px;
     display: flex;
     align-items: center;
     justify-content: center;
     border: 1px solid rgba(34, 211, 238, 0.3);
     transition: all .15s;
 }

 .nx-timer-stepper-btn:hover {
     background: rgba(34, 211, 238, 0.08);
 }

 .nx-timer-duration {
     text-align: center;
 }

 .nx-timer-duration-label {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.24em;
     text-transform: uppercase;
     color: var(--text-4);
 }

 .nx-timer-duration-val {
     font-family: var(--font-display);
     font-size: 38px;
     font-weight: 700;
     letter-spacing: -0.03em;
     line-height: 1;
     margin-top: 4px;
 }

 .nx-timer-duration-unit {
     font-size: 16px;
     font-weight: 500;
     color: var(--text-4);
     margin-left: 6px;
 }

 .nx-timer-actions {
     margin-top: 40px;
     display: flex;
     gap: 12px;
     flex-wrap: wrap;
     justify-content: center;
 }

 .nx-timer-btn {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     gap: 10px;
     min-width: 100px;
     height: 56px;
     padding: 0 24px;
     border-radius: var(--r-md);
     font-size: 14px;
     font-weight: 600;
     letter-spacing: 0.14em;
     text-transform: uppercase;
     transition: all .15s;
 }

 .nx-timer-btn--primary {
     min-width: 160px;
     border: none;
     color: #031018;
     font-size: 15px;
     font-weight: 700;
     box-shadow: 0 12px 32px rgba(34, 211, 238, 0.4), 0 0 0 1px rgba(34, 211, 238, 0.66), inset 0 1px 0 rgba(255, 255, 255, 0.35);
 }

 .nx-timer-btn--secondary {
     background: rgba(13, 20, 28, 0.55);
     color: rgba(203, 213, 225, 0.85);
     border: 1px solid rgba(94, 234, 212, 0.18);
 }

 .nx-timer-btn--secondary:hover {
     background: rgba(34, 211, 238, 0.06);
 }

 .nx-timer-btn--danger {
     background: rgba(248, 113, 113, 0.08);
     color: var(--error);
     border: 1px solid rgba(248, 113, 113, 0.35);
 }

 .nx-timer-btn--danger:hover {
     background: rgba(248, 113, 113, 0.16);
 }

 .nx-timer-footer {
     position: relative;
     z-index: 2;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 22px;
     padding: 24px 0 32px;
     flex-wrap: wrap;
     font-family: var(--font-mono);
     font-size: 12px;
     letter-spacing: 0.18em;
     text-transform: uppercase;
 }

 .nx-timer-footer__sep {
     width: 1px;
     height: 12px;
     background: rgba(148, 163, 184, 0.2);
 }

 .nx-timer-footer__status {
     display: flex;
     align-items: center;
     gap: 8px;
 }

 .nx-timer-footer__dot {
     width: 6px;
     height: 6px;
     border-radius: 50%;
 }

 .nx-timer-footer__muted {
     color: rgba(148, 163, 184, 0.5);
 }

 /* 15. Panel System ------------------------------------------------- */
 .panel {
     display: none;
     animation: nx-fadeIn .2s;
 }

 .panel.active {
     display: block;
 }

 /* 16. Section Headers --------------------------------------------- */
 .nx-section-header {
     margin-bottom: 28px;
 }

 .nx-section-eyebrow {
     display: flex;
     align-items: center;
     gap: 8px;
     margin-bottom: 10px;
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.22em;
     text-transform: uppercase;
 }

 .nx-section-eyebrow .label {
     color: var(--cyan);
 }

 .nx-section-eyebrow .sep {
     color: rgba(148, 163, 184, 0.3);
 }

 .nx-section-eyebrow .meta {
     color: var(--text-4);
 }

 .nx-section-title {
     font-family: var(--font-display);
     font-size: 34px;
     font-weight: 600;
     letter-spacing: -0.02em;
     color: var(--text-1);
     line-height: 1.1;
 }

 .nx-section-title strong {
     font-weight: inherit;
 }

 .nx-section-title .hl {
     color: var(--success);
 }

 .nx-section-sub {
     margin-top: 8px;
     font-size: 15px;
     color: rgba(148, 163, 184, 0.75);
     line-height: 1.6;
 }

 .nx-section-sub .hl-cyan {
     color: var(--cyan-bright);
     font-weight: 600;
 }

 /* 17. Insight Cards ------------------------------------------------ */
 .nx-insight-cards {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
     gap: 16px;
     margin-bottom: 28px;
 }

 .nx-insight-card {
     position: relative;
     padding: 20px 22px 18px;
     background: linear-gradient(180deg, rgba(15, 23, 32, 0.75), rgba(10, 16, 22, 0.75));
     border: 1px solid rgba(94, 234, 212, 0.10);
     border-radius: var(--r-lg);
     overflow: hidden;
     transition: border-color .2s;
 }

 .nx-insight-card:hover {
     border-color: rgba(94, 234, 212, 0.22);
 }

 .nx-insight-card__stripe {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 2px;
     border-radius: var(--r-lg) var(--r-lg) 0 0;
 }

 .nx-insight-card__tag {
     display: flex;
     align-items: center;
     gap: 6px;
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.22em;
     text-transform: uppercase;
     color: var(--text-4);
     margin-bottom: 12px;
 }

 .nx-insight-card__tag-dot {
     width: 5px;
     height: 5px;
     border-radius: 50%;
 }

 .nx-insight-card__value {
     font-family: var(--font-display);
     font-size: 36px;
     font-weight: 700;
     letter-spacing: -0.02em;
     line-height: 1;
     margin-bottom: 4px;
 }

 .nx-insight-card__name {
     font-size: 14px;
     color: var(--text-2);
     font-weight: 500;
     margin-bottom: 4px;
 }

 .nx-insight-card__meta {
     font-size: 12px;
     color: var(--text-4);
 }

 /* 18. Progress Bars ------------------------------------------------ */
 .nx-progress {
     height: 4px;
     background: rgba(94, 234, 212, 0.10);
     border-radius: 2px;
     overflow: hidden;
     margin-top: 10px;
 }

 .nx-progress__fill {
     height: 100%;
     border-radius: 2px;
     transition: width .3s;
 }

 .nx-progress__fill--cyan {
     background: linear-gradient(90deg, var(--cyan), var(--cyan-bright));
     box-shadow: 0 0 8px rgba(34, 211, 238, 0.5);
 }

 .nx-progress__fill--green {
     background: linear-gradient(90deg, var(--success), #6ee7b7);
 }

 .nx-progress__fill--red {
     background: linear-gradient(90deg, var(--error), #fca5a5);
 }

 .nx-progress__fill--yellow {
     background: linear-gradient(90deg, var(--warning), #fde68a);
 }

 /* 19. Data Table --------------------------------------------------- */
 .nx-table-wrap {
     border: 1px solid rgba(94, 234, 212, 0.12);
     border-radius: var(--r-lg);
     overflow: hidden;
 }

 .nx-table-head {
     padding: 12px 20px;
     background: rgba(13, 20, 28, 0.7);
     border-bottom: 1px solid rgba(94, 234, 212, 0.10);
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.22em;
     text-transform: uppercase;
     color: var(--text-4);
     display: grid;
 }

 .nx-table-row {
     display: grid;
     padding: 16px 20px;
     border-bottom: 1px solid rgba(94, 234, 212, 0.06);
     align-items: center;
     transition: background .12s;
 }

 .nx-table-row:last-child {
     border-bottom: none;
 }

 .nx-table-row:hover {
     background: rgba(34, 211, 238, 0.03);
 }

 /* 20. Log List ----------------------------------------------------- */
 .nx-log-wrap {
     border: 1px solid rgba(94, 234, 212, 0.10);
     border-radius: var(--r-lg);
     overflow: hidden;
 }

 .nx-log-head {
     padding: 14px 20px;
     background: rgba(13, 20, 28, 0.5);
     border-bottom: 1px solid rgba(94, 234, 212, 0.08);
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.22em;
     text-transform: uppercase;
     color: var(--text-4);
     display: flex;
     align-items: center;
     justify-content: space-between;
 }

 .nx-log-item {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 14px 20px;
     border-bottom: 1px solid rgba(94, 234, 212, 0.06);
     transition: background .12s;
 }

 .nx-log-item:last-child {
     border-bottom: none;
 }

 .nx-log-item:hover {
     background: rgba(34, 211, 238, 0.03);
 }

 .nx-log-item__disc {
     font-size: 13px;
     color: var(--text-2);
     font-weight: 500;
 }

 .nx-log-item__sub {
     font-size: 12px;
     color: var(--text-4);
     margin-top: 2px;
 }

 .nx-log-item__time {
     font-family: var(--font-mono);
     font-size: 13px;
     color: var(--cyan-bright);
     font-weight: 600;
 }

 /* 21. Stat Block --------------------------------------------------- */
 .nx-stat-block {
     padding: 24px;
     background: rgba(13, 20, 28, 0.4);
     border: 1px solid rgba(94, 234, 212, 0.10);
     border-radius: var(--r-lg);
     margin-bottom: 20px;
 }

 .nx-stat-block__title {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.22em;
     text-transform: uppercase;
     color: var(--text-4);
     margin-bottom: 18px;
 }

 .nx-prog-row {
     margin-bottom: 14px;
 }

 .nx-prog-row:last-child {
     margin-bottom: 0;
 }

 .nx-prog-label {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-bottom: 8px;
     font-size: 13px;
 }

 .nx-prog-label span:first-child {
     font-weight: 500;
     color: var(--text-2);
 }

 .nx-prog-label span:last-child {
     font-family: var(--font-mono);
     font-size: 12px;
 }

 /* 22. Modals & Overlays -------------------------------------------- */
 .nx-overlay {
     position: fixed;
     inset: 0;
     z-index: 100;
     background: rgba(4, 8, 13, 0.85);
     backdrop-filter: blur(4px);
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 20px;
     opacity: 0;
     pointer-events: none;
     transition: opacity .2s;
 }

 .nx-overlay.show {
     opacity: 1;
     pointer-events: auto;
 }

 .nx-modal {
     position: relative;
     width: 100%;
     max-width: 440px;
     background: linear-gradient(180deg, rgba(20, 30, 42, 0.97), rgba(10, 16, 22, 0.97));
     border: 1px solid rgba(94, 234, 212, 0.22);
     border-radius: 18px;
     padding: 32px 28px 28px;
     backdrop-filter: blur(12px);
     box-shadow: 0 32px 80px rgba(0, 0, 0, 0.5), 0 0 60px rgba(34, 211, 238, 0.04);
     animation: nx-slideUp .2s ease-out;
     overflow: hidden;
 }

 .nx-modal::before {
     content: '';
     position: absolute;
     top: 0;
     left: 20px;
     right: 20px;
     height: 1px;
     background: linear-gradient(90deg, transparent, rgba(34, 211, 238, 0.55), transparent);
 }

 .nx-modal--sm {
     max-width: 360px;
 }

 .nx-modal--lg {
     max-width: 520px;
 }

 .nx-modal__close {
     position: absolute;
     top: 16px;
     right: 16px;
     width: 30px;
     height: 30px;
     border-radius: 50%;
     background: rgba(13, 20, 28, 0.6);
     border: 1px solid rgba(94, 234, 212, 0.15);
     color: var(--text-3);
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 14px;
     transition: all .15s;
 }

 .nx-modal__close:hover {
     border-color: rgba(94, 234, 212, 0.35);
     color: var(--text-1);
 }

 .nx-modal__title {
     font-family: var(--font-display);
     font-size: 18px;
     font-weight: 700;
     letter-spacing: 0.06em;
     text-transform: uppercase;
     color: var(--cyan);
     margin-bottom: 24px;
 }

 .nx-modal__field {
     margin-bottom: 14px;
 }

 .nx-modal__label {
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.22em;
     text-transform: uppercase;
     color: var(--text-4);
     margin-bottom: 6px;
 }

 .nx-modal__input,
 .nx-modal__select {
     width: 100%;
     height: 44px;
     padding: 0 14px;
     background: rgba(13, 20, 28, 0.7);
     border: 1px solid rgba(94, 234, 212, 0.15);
     border-radius: var(--r-sm);
     color: var(--text-2);
     font-size: 14px;
     outline: none;
     transition: border-color .15s;
 }

 .nx-modal__input:focus,
 .nx-modal__select:focus {
     border-color: rgba(34, 211, 238, 0.5);
 }

 .nx-modal__input::placeholder {
     color: rgba(148, 163, 184, 0.35);
 }

 .nx-modal__select,
 select.nx-modal__input {
     appearance: none;
     cursor: pointer;
 }

 .nx-modal__btns {
     display: flex;
     gap: 10px;
     margin-top: 22px;
 }

 /* Config Plano — modo buttons e range inputs */
 .config-modo-btn {
     flex: 1;
     padding: 12px 8px;
     cursor: pointer;
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.2em;
     text-transform: uppercase;
     transition: all .15s;
     border-radius: var(--r-sm);
     border: 1px solid var(--border);
     background: transparent;
     color: var(--text-4);
 }

 .config-modo-btn.ativo {
     border-color: rgba(34, 211, 238, .5);
     background: rgba(34, 211, 238, .1);
     color: var(--cyan);
 }

 #configPlanoOverlay input[type="range"] {
     -webkit-appearance: none;
     appearance: none;
     width: 100%;
     height: 4px;
     border-radius: 2px;
     background: rgba(34, 211, 238, .15);
     outline: none;
     cursor: pointer;
 }

 #configPlanoOverlay input[type="range"]::-webkit-slider-thumb {
     -webkit-appearance: none;
     width: 16px;
     height: 16px;
     border-radius: 50%;
     background: var(--cyan);
     box-shadow: 0 0 8px rgba(34, 211, 238, .4);
     cursor: pointer;
 }

 #configPlanoOverlay input[type="range"]:disabled {
     opacity: 0.2;
     cursor: default;
 }

 /* Buttons */
 .nx-btn {
     flex: 1;
     height: 46px;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
     border-radius: 10px;
     font-size: 13px;
     font-weight: 600;
     letter-spacing: 0.08em;
     text-transform: uppercase;
     transition: all .15s;
 }

 .nx-btn--primary {
     background: linear-gradient(180deg, var(--cyan), #06b6d4);
     border: none;
     color: #031018;
     box-shadow: 0 8px 24px rgba(34, 211, 238, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.25);
 }

 .nx-btn--primary:hover {
     transform: translateY(-1px);
     box-shadow: 0 12px 32px rgba(34, 211, 238, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.25);
 }

 .nx-btn--secondary {
     background: rgba(13, 20, 28, 0.5);
     border: 1px solid rgba(94, 234, 212, 0.2);
     color: var(--text-2);
 }

 .nx-btn--secondary:hover {
     background: rgba(34, 211, 238, 0.06);
 }

 .nx-btn--danger {
     background: rgba(248, 113, 113, 0.08);
     border: 1px solid rgba(248, 113, 113, 0.35);
     color: var(--error);
 }

 .nx-btn--danger:hover {
     background: rgba(248, 113, 113, 0.16);
 }

 .nx-btn--warning {
     background: rgba(251, 191, 36, 0.08);
     border: 1px solid rgba(251, 191, 36, 0.3);
     color: var(--warning);
 }

 .nx-btn--warning:hover {
     background: rgba(251, 191, 36, 0.16);
 }

 .nx-btn--green {
     background: rgba(52, 211, 153, 0.08);
     border: 1px solid rgba(52, 211, 153, 0.4);
     color: var(--success);
 }

 .nx-btn--green:hover {
     background: rgba(52, 211, 153, 0.15);
 }

 /* Cronograma da Semana -------------------------------------------------- */
 .cron-days-strip {
     display: flex;
     gap: 5px;
     margin-bottom: 12px;
     overflow-x: auto;
     padding-bottom: 2px;
 }

 .cron-day-btn {
     flex: 1;
     min-width: 40px;
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 4px;
     padding: 8px 4px 7px;
     background: transparent;
     border: 1px solid var(--border);
     border-radius: var(--r-sm);
     cursor: pointer;
     transition: all .15s;
 }

 .cron-day-btn:hover {
     border-color: var(--border-hover);
 }

 .cron-day-btn.ativo {
     border-color: rgba(34, 211, 238, .42);
     background: rgba(34, 211, 238, .06);
 }

 .cron-day-nome {
     font-family: var(--font-mono);
     font-size: 9px;
     letter-spacing: .14em;
     color: var(--text-4);
     text-transform: uppercase;
 }

 .cron-day-num {
     font-family: var(--font-display);
     font-size: 16px;
     font-weight: 600;
     color: var(--text-2);
     line-height: 1;
 }

 .cron-day-btn.hoje .cron-day-num {
     color: var(--cyan);
 }

 .cron-day-dot {
     width: 5px;
     height: 5px;
     border-radius: 50%;
     border: 1px solid rgba(34, 211, 238, .2);
     background: transparent;
 }

 .cron-day-dot.estudado {
     background: #34d399;
     border-color: #34d399;
 }

 .cron-day-dot.planejado {
     background: rgba(34, 211, 238, .28);
     border-color: rgba(34, 211, 238, .4);
 }

 .cron-topic-item {
     display: flex;
     align-items: center;
     gap: 10px;
     padding: 10px 12px;
     border: 1px solid var(--border);
     border-radius: var(--r-sm);
     margin-bottom: 6px;
     background: rgba(13, 20, 28, .45);
     transition: border-color .15s;
 }

 .cron-topic-item:hover {
     border-color: var(--border-hover);
 }

 .cron-topic-disc {
     font-family: var(--font-mono);
     font-size: 9px;
     letter-spacing: .12em;
     color: var(--text-4);
     white-space: nowrap;
     text-transform: uppercase;
     padding-right: 10px;
     border-right: 1px solid var(--border);
     flex-shrink: 0;
 }

 .cron-topic-nome {
     flex: 1;
     font-family: var(--font-ui);
     font-size: 13px;
     color: var(--text-2);
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
     min-width: 0;
 }

 .cron-topic-mins {
     font-family: var(--font-mono);
     font-size: 11px;
     font-weight: 700;
     color: var(--cyan);
     white-space: nowrap;
     flex-shrink: 0;
 }

 /* Color chips */
 .nx-color-opts {
     display: flex;
     gap: 8px;
     flex-wrap: wrap;
 }

 .nx-color-opt {
     width: 28px;
     height: 28px;
     border-radius: 50%;
     border: 2px solid transparent;
     cursor: pointer;
     transition: transform .12s;
 }

 .nx-color-opt:hover {
     transform: scale(1.15);
 }

 .nx-color-opt.sel {
     border-color: rgba(255, 255, 255, 0.7);
 }

 /* 23. Session end modal -------------------------------------------- */
 .nx-session-end {
     padding: 8px;
 }

 .nx-session-end__title {
     font-family: var(--font-mono);
     font-size: 12px;
     letter-spacing: 4px;
     color: var(--cyan);
     text-align: center;
     margin-bottom: 14px;
 }

 .nx-session-end__row {
     display: flex;
     justify-content: space-between;
     padding: 5px 0;
     border-bottom: 1px solid rgba(94, 234, 212, 0.06);
 }

 .nx-session-end__row:last-of-type {
     border-bottom: none;
 }

 .nx-session-end__key {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: var(--text-4);
 }

 .nx-session-end__val {
     font-size: 13px;
     color: var(--cyan);
 }

 .nx-session-end__hint {
     font-size: 12px;
     color: var(--text-4);
     text-align: center;
     letter-spacing: 1px;
     line-height: 1.6;
     margin: 16px 0;
 }

 /* 24. Confirm modal ------------------------------------------------ */
 .nx-confirm {
     text-align: center;
     padding: 8px;
 }

 .nx-confirm__icon {
     font-size: 28px;
     margin-bottom: 12px;
 }

 .nx-confirm__title {
     font-family: var(--font-display);
     font-size: 18px;
     font-weight: 700;
     color: var(--cyan);
     letter-spacing: 0.06em;
     margin-bottom: 10px;
 }

 .nx-confirm__msg {
     font-size: 13px;
     color: var(--text-4);
     line-height: 1.7;
     margin-bottom: 24px;
 }

 /* 25. Heatmap ------------------------------------------------------ */
 .nx-heatmap-wrap {
     padding: 28px;
     background: rgba(13, 20, 28, 0.5);
     border: 1px solid var(--border);
     border-radius: var(--r-lg);
 }

 .nx-heatmap-header {
     display: flex;
     align-items: flex-start;
     justify-content: space-between;
     margin-bottom: 20px;
     flex-wrap: wrap;
     gap: 12px;
 }

 .nx-heatmap-title {
     font-family: var(--font-display);
     font-size: 18px;
     font-weight: 600;
     letter-spacing: -0.01em;
     color: var(--text-1);
 }

 .nx-heatmap-sub {
     font-size: 13px;
     color: var(--text-4);
     margin-top: 4px;
 }

 .nx-heatmap-stats {
     font-family: var(--font-mono);
     font-size: 12px;
     color: var(--text-4);
     letter-spacing: 0.08em;
     display: flex;
     gap: 16px;
 }

 .nx-heatmap-stats span {
     color: var(--text-2);
 }

 .nx-heatmap-grid {
     overflow-x: auto;
     padding-bottom: 8px;
 }

 .nx-streak-badge {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 4px 12px;
     border-radius: 999px;
     background: rgba(34, 211, 238, 0.08);
     border: 1px solid rgba(34, 211, 238, 0.25);
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.14em;
     color: var(--cyan);
     margin-top: 8px;
 }

 /* 26. Edital ------------------------------------------------------- */
 .nx-edital-disc {
     border: 1px solid rgba(94, 234, 212, 0.10);
     border-radius: var(--r-lg);
     overflow: hidden;
     margin-bottom: 12px;
     transition: border-color .15s;
 }

 .nx-edital-disc:hover {
     border-color: rgba(94, 234, 212, 0.22);
 }

 .nx-edital-disc__header {
     display: flex;
     align-items: center;
     gap: 12px;
     padding: 16px 20px;
     background: rgba(13, 20, 28, 0.5);
     cursor: pointer;
     transition: background .12s;
     justify-content: space-between;
 }

 .nx-edital-disc__header:hover {
     background: rgba(13, 20, 28, 0.85);
 }

 .nx-edital-disc__left {
     display: flex;
     align-items: center;
     gap: 12px;
     flex: 1;
     min-width: 0;
 }

 .nx-edital-disc__dot {
     width: 8px;
     height: 8px;
     border-radius: 50%;
     flex-shrink: 0;
 }

 .nx-edital-disc__name {
     font-size: 15px;
     font-weight: 600;
     color: var(--text-1);
 }

 .nx-edital-disc__meta {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.1em;
     color: var(--text-4);
 }

 .nx-edital-topic {
     display: flex;
     align-items: center;
     gap: 14px;
     padding: 12px 20px 12px 44px;
     border-top: 1px solid rgba(94, 234, 212, 0.06);
     transition: background .12s;
 }

 .nx-edital-topic:hover {
     background: rgba(34, 211, 238, 0.025);
 }

 .nx-edital-topic__check {
     width: 18px;
     height: 18px;
     border-radius: 5px;
     border: 1px solid rgba(94, 234, 212, 0.25);
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
     cursor: pointer;
     font-size: 11px;
     transition: all .15s;
 }

 .nx-edital-topic__check.done {
     background: rgba(52, 211, 153, 0.15);
     border-color: var(--success);
     color: var(--success);
 }

 .nx-edital-topic__name {
     flex: 1;
     font-size: 14px;
     color: var(--text-2);
 }

 .nx-edital-topic__name.done {
     text-decoration: line-through;
     color: var(--text-4);
 }

 .nx-edital-topic__stage {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.1em;
     color: var(--text-4);
 }

 .nx-edital-topic__btns {
     display: flex;
     gap: 4px;
 }

 .nx-edital-topic__btn {
     width: 26px;
     height: 26px;
     border-radius: 6px;
     background: transparent;
     border: 1px solid rgba(94, 234, 212, 0.15);
     color: var(--text-4);
     font-size: 12px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: all .12s;
 }

 .nx-edital-topic__btn:hover {
     border-color: rgba(94, 234, 212, 0.35);
     color: var(--text-2);
     background: rgba(34, 211, 238, 0.05);
 }

 /* 27. Questões ---------------------------------------------------- */
 .nx-q-form {
     padding: 24px 28px;
     background: rgba(13, 20, 28, 0.5);
     border: 1px solid var(--border);
     border-radius: var(--r-lg);
     margin-bottom: 28px;
 }

 .nx-q-form__title {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.22em;
     text-transform: uppercase;
     color: var(--text-4);
     margin-bottom: 20px;
 }

 .nx-q-row {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 14px;
     margin-bottom: 14px;
 }

 .nx-q-row--3 {
     grid-template-columns: 1fr 1fr 1fr;
 }

 .nx-q-field label {
     display: block;
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.2em;
     text-transform: uppercase;
     color: var(--text-4);
     margin-bottom: 6px;
 }

 .nx-q-input {
     width: 100%;
     height: 42px;
     padding: 0 12px;
     background: rgba(13, 20, 28, 0.7);
     border: 1px solid rgba(94, 234, 212, 0.15);
     border-radius: var(--r-sm);
     color: var(--text-2);
     font-size: 14px;
     outline: none;
     transition: border-color .15s;
 }

 .nx-q-input:focus {
     border-color: rgba(34, 211, 238, 0.5);
 }

 .nx-q-input[readonly] {
     color: var(--text-4);
     cursor: default;
 }

 .nx-q-input--green:focus {
     border-color: rgba(52, 211, 153, 0.5);
 }

 .nx-q-badge {
     display: inline;
     margin-left: 6px;
     padding: 1px 6px;
     border-radius: 4px;
     background: rgba(34, 211, 238, 0.08);
     border: 1px solid rgba(34, 211, 238, 0.2);
     font-family: var(--font-mono);
     font-size: 9px;
     letter-spacing: 0.16em;
     color: var(--cyan);
 }

 .nx-q-preview {
     display: grid;
     grid-template-columns: repeat(4, 1fr) auto;
     gap: 12px;
     align-items: center;
     padding: 16px;
     margin: 16px 0;
     background: rgba(7, 11, 16, 0.5);
     border: 1px solid rgba(94, 234, 212, 0.08);
     border-radius: var(--r-sm);
 }

 .nx-q-preview__item {
     text-align: center;
 }

 .nx-q-preview__label {
     font-family: var(--font-mono);
     font-size: 9px;
     letter-spacing: 0.2em;
     text-transform: uppercase;
     color: var(--text-4);
     margin-bottom: 4px;
 }

 .nx-q-preview__val {
     font-family: var(--font-display);
     font-size: 22px;
     font-weight: 700;
     line-height: 1;
 }

 .nx-q-preview__bar-wrap {
     grid-column: 1 / -1;
 }

 .nx-q-hint {
     font-size: 11px;
     color: var(--text-4);
     margin-bottom: 16px;
 }

 .nx-q-submit {
     width: 100%;
     height: 48px;
     background: linear-gradient(180deg, var(--cyan), #06b6d4);
     border: none;
     border-radius: var(--r-sm);
     color: #031018;
     font-family: var(--font-display);
     font-size: 14px;
     font-weight: 700;
     letter-spacing: 0.08em;
     text-transform: uppercase;
     box-shadow: 0 8px 24px rgba(34, 211, 238, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.25);
     transition: all .15s;
 }

 .nx-q-submit:hover:not(:disabled) {
     transform: translateY(-1px);
     box-shadow: 0 12px 30px rgba(34, 211, 238, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.25);
 }

 .nx-q-submit:disabled {
     opacity: 0.35;
     cursor: not-allowed;
 }

 /* 28. Relatórios --------------------------------------------------- */
 .nx-rel-block {
     padding: 20px 24px;
     background: rgba(13, 20, 28, 0.4);
     border: 1px solid rgba(94, 234, 212, 0.10);
     border-radius: var(--r-lg);
     margin-bottom: 16px;
 }

 .nx-rel-block__title {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.3em;
     text-transform: uppercase;
     color: var(--text-4);
     margin-bottom: 16px;
 }

 .nx-chart-bars {
     display: flex;
     align-items: flex-end;
     gap: 6px;
     height: 120px;
 }

 .nx-chart-col {
     flex: 1;
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 4px;
 }

 .nx-chart-bar {
     width: 100%;
     border-radius: 4px 4px 0 0;
     min-height: 4px;
     background: linear-gradient(180deg, var(--cyan), rgba(34, 211, 238, 0.5));
     box-shadow: 0 0 10px rgba(34, 211, 238, 0.2);
     transition: height .3s;
 }

 .nx-chart-bar.today {
     background: linear-gradient(180deg, var(--cyan-bright), var(--cyan));
     box-shadow: 0 0 16px rgba(34, 211, 238, 0.4);
 }

 .nx-chart-lbl {
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.1em;
     color: var(--text-4);
 }

 .nx-period-btn {
     padding: 5px 12px;
     border-radius: 6px;
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.16em;
     text-transform: uppercase;
     background: transparent;
     border: 1px solid rgba(94, 234, 212, 0.15);
     color: var(--text-4);
     transition: all .15s;
 }

 .nx-period-btn:hover {
     border-color: rgba(94, 234, 212, 0.3);
     color: var(--text-3);
 }

 .nx-period-btn.active {
     border-color: rgba(34, 211, 238, 0.4);
     color: var(--cyan);
     background: rgba(34, 211, 238, 0.07);
 }

 /* 29. Plano -------------------------------------------------------- */
 .nx-plano-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 20px;
     flex-wrap: wrap;
     gap: 10px;
 }

 .nx-plano-btns {
     display: flex;
     gap: 8px;
     align-items: center;
     flex-wrap: wrap;
 }

 .nx-plano-btn {
     padding: 8px 14px;
     border-radius: var(--r-sm);
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.2em;
     text-transform: uppercase;
     background: transparent;
     border: 1px solid rgba(94, 234, 212, 0.25);
     color: rgba(203, 213, 225, 0.6);
     transition: all .15s;
 }

 .nx-plano-btn:hover {
     border-color: var(--cyan);
     color: var(--cyan);
 }

 /* 30. Toast -------------------------------------------------------- */
 .nx-toast {
     position: fixed;
     bottom: 100px;
     left: 50%;
     transform: translateX(-50%) translateY(20px);
     padding: 12px 24px;
     border-radius: 999px;
     background: rgba(20, 30, 42, 0.97);
     border: 1px solid rgba(52, 211, 153, 0.4);
     color: var(--success);
     font-family: var(--font-mono);
     font-size: 12px;
     letter-spacing: 0.2em;
     text-transform: uppercase;
     pointer-events: none;
     opacity: 0;
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
     z-index: 300;
     transition: all .25s;
 }

 .nx-toast.show {
     opacity: 1;
     transform: translateX(-50%) translateY(0);
 }

 /* 31. Painel Tático ------------------------------------------------ */
 .nx-painel-wrap {
     border: 1px solid rgba(94, 234, 212, 0.12);
     border-radius: var(--r-lg);
     overflow: hidden;
 }

 .nx-painel-head {
     display: grid;
     grid-template-columns: 2fr 1fr 1fr 1fr 1.5fr;
     padding: 12px 20px;
     background: rgba(13, 20, 28, 0.7);
     border-bottom: 1px solid rgba(94, 234, 212, 0.10);
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.22em;
     text-transform: uppercase;
     color: var(--text-4);
 }

 .nx-painel-row {
     display: grid;
     grid-template-columns: 2fr 1fr 1fr 1fr 1.5fr;
     padding: 14px 20px;
     border-bottom: 1px solid rgba(94, 234, 212, 0.06);
     align-items: center;
     transition: background .12s;
 }

 .nx-painel-row:last-child {
     border-bottom: none;
 }

 .nx-painel-row:hover {
     background: rgba(34, 211, 238, 0.03);
 }

 .nx-painel-row__disc {
     display: flex;
     align-items: center;
     gap: 10px;
 }

 .nx-painel-row__dot {
     width: 8px;
     height: 8px;
     border-radius: 50%;
     flex-shrink: 0;
 }

 .nx-painel-row__name {
     font-size: 14px;
     color: var(--text-1);
     font-weight: 500;
 }

 .nx-painel-row__val {
     font-family: var(--font-mono);
     font-size: 13px;
     color: var(--text-2);
 }

 .nx-painel-row__pct {
     font-family: var(--font-mono);
     font-size: 12px;
     font-weight: 600;
 }

 /* 32. Login — split screen ---------------------------------------- */
 #loginScreen {
     position: fixed;
     inset: 0;
     z-index: 100;
     display: flex;
     flex-direction: column;
     align-items: stretch;
     justify-content: flex-start;
     padding: 0;
     background: #06080c;
     height: 100vh;
     width: 100vw;
 }

 /* Topbar */
 .nx-ls-bar {
     display: flex !important;
     align-items: center !important;
     justify-content: space-between !important;
     padding: 0 40px !important;
     height: 64px;
     flex-shrink: 0;
     border-bottom: 1px solid rgba(94, 234, 212, 0.08);
     width: 100%;
     position: relative;
     z-index: 2;
 }

 .nx-ls-bar__logo {
     display: flex;
     align-items: center;
     gap: 8px;
     font-family: var(--font-display);
     font-size: 16px;
     font-weight: 700;
     letter-spacing: 0.18em;
     color: var(--cyan);
 }

 .nx-ls-bar__version {
     font-family: var(--font-mono);
     font-size: 12px;
     letter-spacing: 0.1em;
     color: var(--text-4);
 }

 .nx-ls-bar__right {
     display: flex;
     align-items: center;
     gap: 12px;
 }

 .nx-ls-bar__right>span {
     font-size: 13px;
     color: var(--text-4);
 }

 .nx-ls-bar__cta {
     padding: 7px 18px;
     border-radius: var(--r-sm);
     border: 1px solid rgba(34, 211, 238, 0.4);
     background: transparent;
     color: var(--cyan);
     font-size: 13px;
     font-weight: 600;
     letter-spacing: 0.04em;
     transition: all .15s;
 }

 .nx-ls-bar__cta:hover {
     background: rgba(34, 211, 238, 0.08);
     border-color: var(--cyan);
 }

 /* Split layout */
 .nx-ls-split {
     flex: 1;
     display: flex;
     overflow: hidden;
     min-height: 0;
 }

 /* Left panel */
 .nx-ls-left {
     flex: 1.1;
     position: relative;
     overflow: hidden;
     background: transparent;
     border-right: 1px solid rgba(94, 234, 212, 0.08);
 }

 .nx-ls-left__content {
     position: relative;
     z-index: 2;
     height: 100%;
     display: flex;
     flex-direction: column;
     justify-content: center;
     padding: 60px 64px;
 }

 .nx-ls-eyebrow {
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.22em;
     color: rgba(34, 211, 238, 0.6);
     margin-bottom: 24px;
     text-transform: uppercase;
 }

 .nx-ls-headline {
     font-family: var(--font-display);
     font-size: clamp(36px, 3.5vw, 52px);
     font-weight: 700;
     line-height: 1.15;
     color: var(--text-1);
     margin-bottom: 20px;
 }

 .nx-ls-desc {
     font-size: 15px;
     line-height: 1.7;
     color: var(--text-3);
     max-width: 420px;
     margin-bottom: 36px;
 }

 .nx-ls-pills {
     display: flex;
     flex-wrap: wrap;
     gap: 10px;
     margin-bottom: 48px;
 }

 .nx-ls-pill {
     display: inline-flex;
     align-items: center;
     gap: 7px;
     padding: 7px 14px;
     border-radius: 999px;
     border: 1px solid rgba(94, 234, 212, 0.2);
     background: rgba(94, 234, 212, 0.04);
     font-size: 12px;
     font-weight: 500;
     color: var(--text-3);
     letter-spacing: 0.02em;
     transition: all .15s;
 }

 .nx-ls-pill svg {
     color: var(--cyan);
     flex-shrink: 0;
 }

 .nx-ls-stats {
     display: flex;
     align-items: center;
     gap: 0;
     border-top: 1px solid rgba(94, 234, 212, 0.08);
     padding-top: 32px;
 }

 .nx-ls-stat {
     text-align: left;
 }

 .nx-ls-stat__num {
     font-family: var(--font-display);
     font-size: 28px;
     font-weight: 700;
     color: var(--text-1);
     letter-spacing: -0.01em;
     line-height: 1;
 }

 .nx-ls-stat__label {
     font-family: var(--font-mono);
     font-size: 9px;
     letter-spacing: 0.18em;
     color: var(--text-4);
     margin-top: 5px;
     text-transform: uppercase;
 }

 .nx-ls-stat__sep {
     width: 1px;
     height: 36px;
     background: rgba(94, 234, 212, 0.12);
     margin: 0 32px;
 }

 /* Right panel */
 .nx-ls-right {
     width: 480px;
     flex-shrink: 0;
     background: transparent;
     display: flex;
     flex-direction: column;
     justify-content: space-between;
     overflow-y: auto;
     position: relative;
     z-index: 2;
 }

 .nx-ls-form {
     flex: 1;
     display: flex;
     flex-direction: column;
     justify-content: center;
     padding: 64px 56px;
 }

 .nx-ls-form__title {
     font-family: var(--font-display);
     font-size: 32px;
     font-weight: 700;
     color: var(--text-1);
     margin-bottom: 8px;
     letter-spacing: -0.01em;
 }

 .nx-ls-form__sub {
     font-size: 14px;
     color: var(--text-4);
     margin-bottom: 32px;
 }

 .nx-ls-google {
     width: 100%;
     height: 52px;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 12px;
     background: #fff;
     border: none;
     border-radius: 10px;
     color: #1f1f1f;
     font-size: 15px;
     font-weight: 500;
     box-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
     transition: all .15s;
     margin-bottom: 6px;
 }

 .nx-ls-google:hover {
     background: #f5f5f5;
     transform: translateY(-1px);
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
 }

 .nx-ls-or {
     display: flex;
     align-items: center;
     gap: 12px;
     margin: 22px 0;
     color: var(--text-4);
 }

 .nx-ls-or::before,
 .nx-ls-or::after {
     content: '';
     flex: 1;
     height: 1px;
     background: rgba(148, 163, 184, 0.12);
 }

 .nx-ls-or span {
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.18em;
     white-space: nowrap;
 }

 .nx-ls-field {
     margin-bottom: 16px;
 }

 .nx-ls-label {
     display: block;
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.22em;
     color: var(--text-4);
     margin-bottom: 6px;
 }

 .nx-ls-input {
     width: 100%;
     height: 50px;
     padding: 0 16px;
     background: rgba(255, 255, 255, 0.04);
     border: 1px solid rgba(148, 163, 184, 0.12);
     border-radius: 10px;
     color: var(--text-2);
     font-size: 15px;
     outline: none;
     transition: border-color .15s;
 }

 .nx-ls-input:focus {
     border-color: rgba(34, 211, 238, 0.45);
     background: rgba(34, 211, 238, 0.03);
 }

 .nx-ls-input::placeholder {
     color: rgba(148, 163, 184, 0.3);
 }

 .nx-ls-forgot {
     font-size: 12px;
     color: var(--cyan);
     cursor: pointer;
     opacity: 0.8;
     transition: opacity .15s;
 }

 .nx-ls-forgot:hover {
     opacity: 1;
 }

 .nx-ls-submit {
     width: 100%;
     height: 52px;
     margin-top: 8px;
     background: var(--cyan);
     border: none;
     border-radius: 10px;
     color: #031018;
     font-family: var(--font-display);
     font-size: 16px;
     font-weight: 700;
     letter-spacing: 0.03em;
     box-shadow: 0 8px 32px rgba(34, 211, 238, 0.4);
     transition: all .15s;
 }

 .nx-ls-submit:hover {
     background: var(--cyan-bright);
     transform: translateY(-1px);
     box-shadow: 0 12px 40px rgba(34, 211, 238, 0.55);
 }

 .nx-ls-msg,
 .login-msg {
     margin-top: 10px;
     font-size: 12px;
     min-height: 16px;
 }

 /* Compatibilidade com script.js que usa className = 'msg err' | 'login-msg err' etc */
 .msg.err,
 .login-msg.err {
     color: #ff6b6b;
 }

 .msg.ok,
 .login-msg.ok {
     color: #00ff88;
 }

 .msg.loading,
 .login-msg.loading {
     color: rgba(34, 211, 238, 0.7);
 }

 .nx-ls-secure {
     margin-top: 16px;
     font-size: 12px;
     color: var(--text-4);
     text-align: center;
     letter-spacing: 0.01em;
 }

 .nx-ls-footer {
     padding: 20px 56px;
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.14em;
     color: rgba(100, 116, 139, 0.5);
     border-top: 1px solid rgba(94, 234, 212, 0.06);
     text-align: center;
 }

 /* login-box reset — stylr.css turns it into a card; undo that inside the new split layout */
 .nx-ls-form.login-box {
     position: static;
     z-index: auto;
     width: auto;
     max-width: none;
     background: none;
     border: none;
     padding: 64px 56px;
     text-align: left;
     backdrop-filter: none;
     margin: 0;
 }

 .nx-ls-form.login-box::before {
     display: none;
 }

 /* Responsive login */
 @media (max-width: 1100px) {
     .nx-ls-left__content {
         padding: 40px 40px;
     }

     .nx-ls-headline {
         font-size: clamp(28px, 3vw, 40px);
     }

     .nx-ls-right {
         width: 400px;
     }

     .nx-ls-form.login-box {
         padding: 48px 40px;
     }
 }

 @media (max-width: 860px) {
     .nx-ls-left {
         flex: 0.8;
     }

     .nx-ls-left__content {
         padding: 32px 28px;
     }

     .nx-ls-desc {
         display: none;
     }

     .nx-ls-stats {
         display: none;
     }

     .nx-ls-right {
         width: 360px;
     }

     .nx-ls-form.login-box {
         padding: 40px 28px;
     }

     .nx-ls-bar__version {
         display: none;
     }
 }

 @media (max-width: 640px) {
     .nx-ls-left {
         display: none;
     }

     .nx-ls-right {
         width: 100%;
     }

     .nx-ls-bar__version {
         display: none;
     }

     .nx-ls-form.login-box {
         padding: 40px 24px;
     }
 }

 /* 33. Painel Config ----------------------------------------------- */
 .nx-dias-config {
     display: flex;
     flex-direction: column;
     gap: 8px;
 }

 .nx-dia-row {
     display: flex;
     align-items: center;
     gap: 12px;
     padding: 10px 14px;
     background: rgba(13, 20, 28, 0.4);
     border: 1px solid rgba(94, 234, 212, 0.08);
     border-radius: var(--r-sm);
 }

 .nx-dia-row input[type="checkbox"] {
     accent-color: var(--cyan);
     width: 16px;
     height: 16px;
 }

 .nx-dia-row label {
     font-size: 13px;
     color: var(--text-2);
     flex: 1;
 }

 /* 34. Progress geral (edital) ------------------------------------- */
 .nx-prog-geral {
     padding: 16px 20px;
     background: rgba(13, 20, 28, 0.4);
     border: 1px solid rgba(94, 234, 212, 0.10);
     border-radius: var(--r-lg);
     margin-bottom: 20px;
 }

 .nx-prog-geral__top {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 10px;
 }

 .nx-prog-geral__label {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.2em;
     text-transform: uppercase;
     color: var(--text-4);
 }

 .nx-prog-geral__info {
     font-size: 13px;
     color: var(--text-3);
 }

 .nx-prog-geral__pct {
     font-family: var(--font-mono);
     font-size: 14px;
     font-weight: 700;
     color: var(--cyan);
 }

 /* 35. Misc --------------------------------------------------------- */
 .nx-empty {
     padding: 48px 24px;
     text-align: center;
     font-family: var(--font-mono);
     font-size: 12px;
     letter-spacing: 0.14em;
     text-transform: uppercase;
     color: var(--text-4);
 }

 .nx-tag {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     padding: 4px 10px;
     border-radius: 999px;
     background: rgba(34, 211, 238, 0.08);
     border: 1px solid rgba(34, 211, 238, 0.25);
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.2em;
     color: var(--cyan);
 }

 .nx-tag--green {
     background: rgba(52, 211, 153, 0.08);
     border-color: rgba(52, 211, 153, 0.3);
     color: var(--success);
 }

 .nx-tag--red {
     background: rgba(248, 113, 113, 0.08);
     border-color: rgba(248, 113, 113, 0.35);
     color: var(--error);
 }

 .nx-link-btn {
     background: transparent;
     border: 1px solid rgba(94, 234, 212, 0.2);
     border-radius: var(--r-sm);
     padding: 4px 10px;
     color: rgba(203, 213, 225, 0.5);
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.2em;
     text-transform: uppercase;
     transition: all .15s;
 }

 .nx-link-btn:hover {
     border-color: rgba(94, 234, 212, 0.5);
     color: var(--text-2);
 }

 /* 36. Responsive -------------------------------------------------- */
 @media (max-width: 768px) {
     .nx-topbar {
         padding: 0 16px;
         height: 60px;
     }

     .nx-topbar__center {
         display: none;
     }

     .nx-main {
         padding: 24px 16px 100px;
     }

     .nx-hero__title {
         font-size: 30px;
     }

     .nx-hero {
         margin-bottom: 32px;
     }

     .nx-prova-card {
         min-width: 0;
         flex: none;
         width: 100%;
     }

     .nx-cards {
         grid-template-columns: 1fr;
     }

     .nx-tabnav {
         margin-bottom: 20px;
     }

     .nx-section-title {
         font-size: 26px;
     }

     .nx-painel-head,
     .nx-painel-row {
         grid-template-columns: 1fr 1fr 1fr;
     }

     .nx-painel-head> :nth-child(4),
     .nx-painel-head> :nth-child(5),
     .nx-painel-row> :nth-child(4),
     .nx-painel-row> :nth-child(5) {
         display: none;
     }

     .nx-q-row {
         grid-template-columns: 1fr 1fr;
     }

     .nx-q-row--3 {
         grid-template-columns: 1fr;
     }

     .nx-timer-time {
         font-size: 72px;
         padding-left: 5px;
     }

     .nx-timer-fs__topbar {
         padding: 16px;
     }

     .nx-cta-btn {
         height: 46px;
         min-width: 260px;
     }

     .nx-cta-btn__text {
         font-size: 13px;
     }

     .nx-logo-version {
         display: none;
     }
 }

 @media (max-width: 480px) {
     .nx-hero__title {
         font-size: 24px;
     }

     .nx-logo-name {
         letter-spacing: 0.2em;
     }

     .nx-profile-chip__name {
         display: none;
     }

     .nx-timer-modes__inner {
         flex-wrap: wrap;
     }
 }

 /* Telas com altura reduzida (notebooks ~768px de altura) */
 @media (max-height: 800px) {
     .nx-timer-fs__topbar {
         padding: 10px 20px;
     }

     .nx-timer-modes {
         margin-top: 10px;
     }

     .nx-timer-ring svg {
         max-width: min(300px, 60vmin) !important;
         max-height: min(300px, 60vmin) !important;
     }

     .nx-timer-time {
         font-size: clamp(48px, 12vmin, 80px);
     }

     .nx-timer-steppers {
         margin-top: 10px;
     }

     .nx-timer-actions {
         margin-top: 10px;
     }

     .nx-timer-footer {
         padding: 8px 0 4px;
     }
 }

 /* ================================================================
   37. JS Compatibility — show/hide via .show class
   ================================================================ */
 #timerFS {
     display: none;
 }

 #timerFS.show {
     display: flex;
 }

 /* overlays que precisam ficar acima do timer-fullscreen (z-index:350) */
 #contabilizarOverlay {
     z-index: 400;
 }

 #questoesFixacaoOverlay,
 #escolhaQuestoesOverlay,
 #cicloDecisaoOverlay {
     z-index: 400;
 }

 #sairQuestoesOverlay {
     z-index: 700;
 }

 /* Config Plano modal — acima de tudo (incl. topbar) */
 #configPlanoOverlay {
     z-index: 800;
     align-items: flex-start;
     padding-top: 88px;
 }

 #configPlanoOverlay>.nx-modal {
     max-height: calc(100vh - 108px);
     overflow-y: auto;
 }

 #timerMini {
     display: none;
 }

 #timerMini.show {
     display: flex;
 }

 .nx-profile-dropdown {
     display: none;
 }

 .nx-profile-dropdown.show {
     display: block;
 }

 .nx-timer-subject {
     display: none;
 }

 .nx-timer-subject.show {
     display: flex;
 }

 /* 38. Sync dot -------------------------------------------------------- */
 .sync-dot {
     width: 6px;
     height: 6px;
     border-radius: 50%;
     background: var(--success);
     box-shadow: 0 0 8px var(--success), 0 0 2px var(--success);
     animation: nx-pulse 2s ease-in-out infinite;
     flex-shrink: 0;
 }

 .sync-dot.loading {
     background: var(--warning);
     box-shadow: 0 0 8px var(--warning);
 }

 .sync-dot.ok {
     background: var(--success);
     box-shadow: 0 0 8px var(--success);
 }

 .sync-dot.err {
     background: var(--error);
     box-shadow: 0 0 8px var(--error);
     animation: none;
 }

 /* 39. Timer status dot ----------------------------------------------- */
 #statusDot {
     width: 8px;
     height: 8px;
     border-radius: 50%;
     background: var(--success);
     box-shadow: 0 0 8px var(--success);
     transition: background .3s, box-shadow .3s;
 }

 #statusDot.off {
     background: rgba(148, 163, 184, 0.3);
     box-shadow: none;
     animation: none;
 }

 #statusDot.paused {
     background: #f59e0b;
     box-shadow: 0 0 8px #f59e0b;
     animation: dotPause 1.2s ease-in-out infinite;
 }

 @keyframes dotPause {

     0%,
     100% {
         opacity: 1;
     }

     50% {
         opacity: 0.2;
     }
 }

 /* 40. Mode buttons (script.js uses .mode-btn) ------------------------- */
 .mode-btn {
     padding: 10px 22px;
     border-radius: 7px;
     background: transparent;
     border: 1px solid transparent;
     color: rgba(203, 213, 225, 0.6);
     font-size: 13px;
     font-weight: 500;
     letter-spacing: 0.1em;
     text-transform: uppercase;
     cursor: pointer;
     transition: all .15s;
     font-family: var(--font-mono);
 }

 .mode-btn:hover {
     color: rgba(203, 213, 225, 0.9);
 }

 .mode-btn.active {
     color: var(--cyan-bright);
     font-weight: 600;
     border-color: rgba(34, 211, 238, 0.35);
     background: rgba(34, 211, 238, 0.10);
 }

 .mode-btn[data-mode="short"].active {
     color: var(--success);
     border-color: rgba(52, 211, 153, 0.35);
     background: rgba(52, 211, 153, 0.08);
 }

 .mode-btn[data-mode="long"].active {
     color: var(--purple);
     border-color: rgba(167, 139, 250, 0.35);
     background: rgba(167, 139, 250, 0.08);
 }

 /* 41. Timer ring SVG -------------------------------------------------- */
 .nx-timer-ring svg {
     filter: drop-shadow(0 0 8px rgba(34, 211, 238, 0.5));
 }

 .ring-track {
     fill: none;
     stroke: rgba(34, 211, 238, 0.10);
     stroke-width: 3;
 }

 .ring-accent {
     fill: none;
     stroke: rgba(34, 211, 238, 0.22);
     stroke-width: 1;
     stroke-dasharray: 4 8;
 }

 .ring-progress {
     fill: none;
     stroke: #22d3ee;
     stroke-width: 4;
     stroke-linecap: round;
     transition: stroke-dashoffset .8s linear;
 }

 .pct-label {
     margin-top: 12px;
     font-family: var(--font-mono);
     font-size: 13px;
     letter-spacing: 0.2em;
     color: var(--text-4);
     text-align: center;
 }

 /* 42. Heat tooltip ---------------------------------------------------- */
 .heat-tip {
     position: fixed;
     display: none;
     z-index: 999;
     padding: 8px 14px;
     border-radius: var(--r-sm);
     background: rgba(13, 20, 28, 0.95);
     border: 1px solid rgba(34, 211, 238, 0.2);
     backdrop-filter: blur(8px);
     pointer-events: none;
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
 }

 .heat-tip-date {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.14em;
     color: var(--cyan);
 }

 .heat-tip-info {
     font-size: 12px;
     margin-top: 2px;
     color: var(--text-3);
 }

 .heat-tip-info.studied {
     color: var(--success);
 }

 .heat-tip-info.not-studied {
     color: var(--text-4);
 }

 /* 43. Overlays (old class names — JS queries these) ------------------- */
 .ed-overlay,
 .confirm-overlay,
 .profile-overlay,
 .prova-overlay {
     position: fixed;
     inset: 0;
     z-index: 100;
     background: rgba(4, 8, 13, 0.85);
     backdrop-filter: blur(4px);
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 20px;
     opacity: 0;
     pointer-events: none;
     transition: opacity .2s;
 }

 .ed-overlay.show,
 .confirm-overlay.show,
 .profile-overlay.show,
 .prova-overlay.show {
     opacity: 1;
     pointer-events: auto;
 }

 /* 44. Toast compatibility -------------------------------------------- */
 .pm-toast {
     position: fixed;
     bottom: 100px;
     left: 50%;
     transform: translateX(-50%) translateY(20px);
     padding: 12px 24px;
     border-radius: 999px;
     background: rgba(20, 30, 42, 0.97);
     border: 1px solid rgba(52, 211, 153, 0.4);
     color: var(--success);
     font-family: var(--font-mono);
     font-size: 12px;
     letter-spacing: 0.2em;
     text-transform: uppercase;
     pointer-events: none;
     opacity: 0;
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
     z-index: 300;
     transition: all .25s;
 }

 .pm-toast.show {
     opacity: 1;
     transform: translateX(-50%) translateY(0);
 }

 /* 45. Plano responsive (script.js reads .plano-btns-desktop / mobile) - */
 .plano-btns-mobile {
     display: none;
 }

 @media (max-width: 540px) {
     .plano-btns-desktop {
         display: none;
     }

     .plano-btns-mobile {
         display: block;
     }
 }

 /* 46. Relatórios period buttons -------------------------------------- */
 .rel-periodo-btn {
     padding: 5px 12px;
     border-radius: 6px;
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.16em;
     text-transform: uppercase;
     background: transparent;
     border: 1px solid rgba(94, 234, 212, 0.15);
     color: var(--text-4);
     cursor: pointer;
     transition: all .15s;
 }

 .rel-periodo-btn:hover {
     border-color: rgba(94, 234, 212, 0.3);
     color: var(--text-3);
 }

 .rel-periodo-btn.active {
     border-color: rgba(34, 211, 238, 0.4);
     color: var(--cyan);
     background: rgba(34, 211, 238, 0.07);
 }

 /* 47. Questão alternativa (fixacao) ---------------------------------- */
 .questao-alt {
     display: flex;
     align-items: flex-start;
     gap: 12px;
     padding: 14px 16px;
     background: rgba(13, 20, 28, 0.5);
     border: 1px solid rgba(94, 234, 212, 0.12);
     border-radius: var(--r-sm);
     cursor: pointer;
     transition: all .15s;
     margin-bottom: 8px;
 }

 .questao-alt:hover {
     border-color: rgba(34, 211, 238, 0.35);
     background: rgba(34, 211, 238, 0.05);
 }

 .questao-alt.correta {
     border-color: var(--success);
     background: rgba(52, 211, 153, 0.08);
 }

 .questao-alt.errada {
     border-color: var(--error);
     background: rgba(248, 113, 113, 0.08);
 }

 /* 48. Adjust row (timer duration stepper, .adjust-row for JS) --------- */
 .adjust-row {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 18px;
 }

 /* 49. Timer internal (for .timer-fullscreen .modes and .status-bar JS queries) */
 .timer-fullscreen .modes {
     display: flex;
     justify-content: center;
 }

 .timer-fullscreen .status-bar {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 22px;
     flex-wrap: wrap;
 }

 /* 50. Rev buttons (questoes fixacao) ---------------------------------- */
 .rev-btn-1d,
 .rev-btn-5d,
 .rev-btn-7d,
 .rev-btn-sem {
     padding: 10px 18px;
     border-radius: var(--r-sm);
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.14em;
     cursor: pointer;
     transition: all .15s;
 }

 .rev-btn-1d {
     background: rgba(248, 113, 113, 0.08);
     border: 1px solid rgba(248, 113, 113, 0.35);
     color: var(--error);
 }

 .rev-btn-5d {
     background: rgba(251, 191, 36, 0.08);
     border: 1px solid rgba(251, 191, 36, 0.3);
     color: var(--warning);
 }

 .rev-btn-7d {
     background: rgba(52, 211, 153, 0.08);
     border: 1px solid rgba(52, 211, 153, 0.4);
     color: var(--success);
 }

 .rev-btn-sem {
     background: rgba(94, 234, 212, 0.05);
     border: 1px solid rgba(94, 234, 212, 0.15);
     color: var(--text-4);
 }

 /* 51. Blink animation ------------------------------------------------- */
 @keyframes blink {
     50% {
         opacity: 0;
     }
 }

 @keyframes spin {
     to {
         transform: rotate(360deg);
     }
 }

 .blink {
     animation: blink 1s step-end infinite;
 }

 /* 51. Sidebar nav -------------------------------------------------------- */
 .nx-topbar {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     z-index: 50;
 }

 #appScreen {
     padding-top: 72px;
 }

 .nx-sidebar {
     position: fixed;
     left: 0;
     top: 72px;
     bottom: 0;
     width: 220px;
     background: rgba(10, 16, 24, 0.98);
     backdrop-filter: blur(16px);
     border-right: 1px solid rgba(34, 211, 238, 0.12);
     display: flex;
     flex-direction: column;
     padding: 20px 10px 16px;
     z-index: 40;
     overflow-y: auto;
     box-shadow: 2px 0 20px rgba(0, 0, 0, 0.4);
 }

 .nx-sidebar__label {
     font-family: var(--font-mono);
     font-size: 9px;
     letter-spacing: 0.22em;
     color: var(--text-4);
     padding: 0 14px;
     margin-bottom: 12px;
     text-transform: uppercase;
 }

 .nx-sidebar__section {
     font-family: var(--font-mono);
     font-size: 9px;
     letter-spacing: 0.22em;
     color: var(--text-4);
     padding: 0 14px;
     margin: 12px 0 4px;
     text-transform: uppercase;
 }

 .nx-sidebar__btn {
     display: flex;
     align-items: center;
     gap: 10px;
     padding: 10px 14px;
     border-radius: var(--r-md);
     background: transparent;
     border: none;
     color: var(--text-3);
     font-family: var(--font-mono);
     font-size: 12px;
     letter-spacing: 0.08em;
     cursor: pointer;
     transition: all .15s;
     width: 100%;
     text-align: left;
 }

 .nx-sidebar__btn:hover {
     background: rgba(34, 211, 238, 0.07);
     color: var(--text-1);
 }

 .nx-sidebar__btn.active {
     background: rgba(34, 211, 238, 0.12);
     color: var(--cyan);
     border-left: 2px solid var(--cyan);
     padding-left: 12px;
 }

 .nx-sidebar__btn.active svg {
     color: var(--cyan);
 }

 .nx-sidebar__btn svg {
     color: var(--text-4);
     flex-shrink: 0;
     transition: color .15s;
 }

 .nx-content {
     margin-left: 220px;
 }

 @media (max-width: 768px) {
     .nx-sidebar {
         display: none;
     }

     .nx-content {
         margin-left: 0;
     }
 }

 /* ================================================================
   MIND MAP — Resumos
   ================================================================ */

 /* Cards grid (list view) */
 .mm-cards-grid {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
     gap: 16px;
 }

 .mm-card {
     background: rgba(13, 20, 28, 0.7);
     border: 1px solid rgba(34, 211, 238, 0.15);
     border-radius: var(--r-lg);
     overflow: hidden;
     cursor: pointer;
     transition: border-color .15s, transform .15s;
 }

 .mm-card:hover {
     border-color: rgba(34, 211, 238, 0.4);
     transform: translateY(-2px);
 }

 .mm-card__preview {
     height: 140px;
     background: rgba(8, 13, 18, 0.8);
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 12px;
 }

 .mm-card__title {
     padding: 10px 14px 4px;
     font-size: 13px;
     font-weight: 600;
     color: var(--text-1);
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
 }

 .mm-card__meta {
     padding: 0 14px 12px;
     font-size: 11px;
     color: var(--text-4);
     font-family: var(--font-mono);
     letter-spacing: 0.05em;
 }

 /* Editor topbar */
 .mm-topbar {
     display: flex;
     align-items: center;
     gap: 12px;
     height: 44px;
     padding: 0 16px;
     background: rgba(8, 13, 18, 0.95);
     border-bottom: 1px solid rgba(34, 211, 238, 0.1);
     flex-shrink: 0;
     z-index: 10;
 }

 .mm-topbar__back {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     background: transparent;
     border: 1px solid rgba(94, 234, 212, 0.2);
     border-radius: var(--r-sm);
     padding: 0 12px;
     height: 32px;
     color: var(--text-3);
     font-size: 12px;
     font-family: var(--font-mono);
     letter-spacing: 0.06em;
     cursor: pointer;
     transition: all .15s;
     white-space: nowrap;
 }

 .mm-topbar__back:hover {
     border-color: var(--cyan);
     color: var(--cyan);
 }

 .mm-topbar__title {
     min-width: 120px;
     max-width: 520px;
     outline: none;
     color: var(--text-1);
     font-size: 13px;
     font-weight: 600;
     font-family: var(--font-display);
     letter-spacing: -0.01em;
     background: rgba(255, 255, 255, 0.04);
     border: 1px solid rgba(94, 234, 212, 0.2);
     border-radius: var(--r-sm);
     padding: 4px 10px;
     height: 30px;
     transition: border-color .15s, background .15s, width .1s;
 }

 .mm-topbar__title:hover {
     border-color: rgba(94, 234, 212, 0.4);
     background: rgba(255, 255, 255, 0.06);
 }

 .mm-topbar__title:focus {
     border-color: var(--cyan);
     background: rgba(34, 211, 238, 0.05);
 }

 .mm-topbar__title::placeholder {
     color: var(--text-4);
 }

 .mm-topbar__actions {
     display: flex;
     gap: 8px;
 }

 .mm-topbar__btn {
     height: 32px;
     padding: 0 14px;
     border-radius: var(--r-sm);
     background: rgba(13, 20, 28, 0.6);
     border: 1px solid rgba(94, 234, 212, 0.2);
     color: var(--text-2);
     font-size: 12px;
     font-family: var(--font-mono);
     letter-spacing: 0.06em;
     cursor: pointer;
     transition: all .15s;
     white-space: nowrap;
 }

 .mm-topbar__btn:hover {
     border-color: var(--cyan);
     color: var(--cyan);
 }

 .mm-topbar__btn--save {
     background: var(--cyan);
     border-color: var(--cyan);
     color: #031018;
     font-weight: 700;
 }

 .mm-topbar__btn--save:hover {
     opacity: 0.88;
 }

 .mm-topbar__btn--danger {
     border-color: rgba(248, 113, 113, 0.3);
     color: var(--error);
 }

 .mm-topbar__btn--danger:hover {
     background: rgba(248, 113, 113, 0.1);
 }

 /* Botão exportar resumo */
 .mm-export-btn {
     background: #22d3ee;
     color: #031018;
     font-family: var(--font-mono);
     font-size: 12px;
     font-weight: 600;
     letter-spacing: 0.05em;
     padding: 0 3.2em 0 1em;
     height: 34px;
     border-radius: 0.7em;
     border: none;
     display: flex;
     align-items: center;
     box-shadow: inset 0 0 1.4em -0.5em #0891b2;
     overflow: hidden;
     position: relative;
     cursor: pointer;
     white-space: nowrap;
     transition: color .2s;
 }

 .mm-export-btn__icon {
     background: #031018;
     position: absolute;
     right: 0.25em;
     display: flex;
     align-items: center;
     justify-content: center;
     height: 26px;
     width: 26px;
     border-radius: 0.5em;
     box-shadow: 0.1em 0.1em 0.5em 0.1em rgba(8, 145, 178, 0.5);
     transition: width .3s;
 }

 .mm-export-btn__icon svg {
     width: 13px;
     color: #22d3ee;
     transition: transform .3s;
 }

 .mm-export-btn:hover .mm-export-btn__icon {
     width: calc(100% - 0.5em);
 }

 .mm-export-btn:hover .mm-export-btn__icon svg {
     transform: translateX(0.1em);
 }

 .mm-export-btn:active .mm-export-btn__icon {
     transform: scale(0.95);
 }

 /* Botões de ação no painel lateral */
 .mm-panel-actions {
     display: flex;
     flex-direction: column;
     gap: 8px;
     padding: 4px 0 16px;
     border-bottom: 1px solid rgba(94, 234, 212, 0.1);
     margin-bottom: 16px;
 }

 .mm-panel-actions .mm-export-btn {
     width: 100%;
     justify-content: flex-start;
     font-size: 11px;
     height: 32px;
     border-radius: 6px;
 }

 .mm-panel-actions .mm-export-btn__icon {
     height: 24px;
     width: 24px;
     right: 0.25em;
 }

 .mm-panel-btn {
     width: 100%;
     height: 32px;
     display: flex;
     align-items: center;
     gap: 8px;
     padding: 0 12px;
     background: rgba(13, 20, 28, 0.6);
     border: 1px solid rgba(94, 234, 212, 0.2);
     border-radius: 6px;
     color: var(--text-2);
     font-size: 11px;
     font-family: var(--font-mono);
     letter-spacing: 0.06em;
     cursor: pointer;
     transition: all .15s;
 }

 .mm-panel-btn:hover {
     border-color: var(--cyan);
     color: var(--cyan);
     background: rgba(34, 211, 238, 0.06);
 }

 .mm-panel-btn--save {
     border-color: rgba(34, 211, 238, 0.35);
     color: var(--cyan);
 }

 .mm-panel-btn--save:hover {
     background: rgba(34, 211, 238, 0.12);
 }

 .mm-panel-btn--danger {
     border-color: rgba(248, 113, 113, 0.25);
     color: var(--error);
 }

 .mm-panel-btn--danger:hover {
     background: rgba(248, 113, 113, 0.08);
     border-color: rgba(248, 113, 113, 0.5);
 }

 /* Canvas */
 .mm-canvas-wrap {
     flex: 1;
     position: relative;
     overflow: hidden;
     cursor: grab;
     background: #080d12;
     user-select: none;
 }

 .mm-canvas-wrap.panning {
     cursor: grabbing;
 }

 /* Zoom controls */
 .mm-zoom-controls {
     position: absolute;
     bottom: 20px;
     left: 20px;
     z-index: 10;
     display: flex;
     flex-direction: column;
     gap: 2px;
 }

 .mm-zoom-controls button {
     width: 32px;
     height: 32px;
     background: rgba(13, 20, 28, 0.85);
     border: 1px solid rgba(94, 234, 212, 0.2);
     color: var(--text-2);
     font-size: 16px;
     cursor: pointer;
     border-radius: var(--r-sm);
     transition: all .15s;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .mm-zoom-controls button:hover {
     border-color: var(--cyan);
     color: var(--cyan);
 }

 /* Nodes */
 .mm-node {
     position: absolute;
     min-width: 160px;
     max-width: 260px;
     background: rgba(8, 13, 18, 0.92);
     border: 1.5px solid #22d3ee;
     border-radius: 8px;
     cursor: pointer;
     transition: box-shadow .15s;
     backdrop-filter: blur(8px);
 }

 .mm-node:hover,
 .mm-node--selected {
     box-shadow: 0 0 0 2px rgba(34, 211, 238, 0.25), 0 8px 24px rgba(0, 0, 0, 0.4);
 }

 .mm-node--selected {
     box-shadow: 0 0 0 2px rgba(34, 211, 238, 0.5), 0 8px 32px rgba(0, 0, 0, 0.5);
 }

 .mm-node--pilula {
     border-radius: 999px;
     min-width: 120px;
 }

 .mm-node--pilula .mm-node__body {
     padding: 8px 20px;
 }

 .mm-node--pilula .mm-node__notes {
     display: none !important;
 }

 .mm-node--sm {
     min-width: 120px;
     max-width: 180px;
 }

 .mm-node--lg {
     min-width: 220px;
     max-width: 340px;
 }

 /* Node toolbar — só o ✕, visível no hover/seleção */
 .mm-node__toolbar {
     display: none;
     align-items: center;
     justify-content: flex-end;
     padding: 4px 6px 2px;
 }

 .mm-node:hover .mm-node__toolbar,
 .mm-node--selected .mm-node__toolbar {
     display: flex;
 }

 .mm-node__del {
     background: transparent;
     border: none;
     color: rgba(248, 113, 113, 0.45);
     font-size: 11px;
     cursor: pointer;
     padding: 0 2px;
     line-height: 1;
     transition: color .12s;
 }

 .mm-node__del:hover {
     color: var(--error);
 }

 /* Node body */
 .mm-node__body {
     padding: 10px 12px;
     position: relative;
 }

 .mm-node__text {
     width: 100%;
     background: transparent;
     border: none;
     outline: none;
     color: var(--text-1);
     font-size: 13px;
     font-weight: 600;
     font-family: var(--font-display);
     resize: none;
     overflow: hidden;
     line-height: 1.4;
     cursor: text;
 }

 .mm-node__notes {
     width: 100%;
     background: transparent;
     border: none;
     outline: none;
     color: var(--text-3);
     font-size: 11.5px;
     font-family: var(--font-mono);
     resize: none;
     margin-top: 6px;
     border-top: 1px solid rgba(255, 255, 255, 0.06);
     padding-top: 6px;
     line-height: 1.5;
     cursor: text;
     min-height: 40px;
 }

 .mm-node__notes-view {
     margin-top: 6px;
     padding-top: 6px;
     border-top: 1px solid rgba(255, 255, 255, 0.06);
     color: var(--text-3);
     font-size: 11.5px;
     font-family: var(--font-mono);
     line-height: 1.5;
     white-space: pre-wrap;
     word-break: break-word;
     pointer-events: none;
 }

 /* Handles (connection points) */
 .mm-handle {
     position: absolute;
     width: 12px;
     height: 12px;
     border-radius: 50%;
     background: rgba(34, 211, 238, 0.2);
     border: 2px solid rgba(34, 211, 238, 0.5);
     cursor: crosshair;
     transition: all .12s;
     z-index: 5;
     opacity: 0;
 }

 .mm-node:hover .mm-handle,
 .mm-node--selected .mm-handle {
     opacity: 1;
 }

 .mm-handle--left {
     left: -7px;
     top: 50%;
     transform: translate(0, -50%);
 }

 .mm-handle--right {
     right: -7px;
     top: 50%;
     transform: translate(0, -50%);
 }

 .mm-handle--top {
     top: -7px;
     left: 50%;
     transform: translate(-50%, 0);
 }

 .mm-handle--bottom {
     bottom: -7px;
     left: 50%;
     transform: translate(-50%, 0);
 }

 .mm-handle--left:hover {
     background: var(--cyan);
     border-color: var(--cyan);
     transform: translate(0, -50%) scale(1.3);
 }

 .mm-handle--right:hover {
     background: var(--cyan);
     border-color: var(--cyan);
     transform: translate(0, -50%) scale(1.3);
 }

 .mm-handle--top:hover {
     background: var(--cyan);
     border-color: var(--cyan);
     transform: translate(-50%, 0) scale(1.3);
 }

 .mm-handle--bottom:hover {
     background: var(--cyan);
     border-color: var(--cyan);
     transform: translate(-50%, 0) scale(1.3);
 }

 /* Edges */
 .mm-edge {
     cursor: pointer;
     pointer-events: stroke;
 }

 .mm-edge:hover {
     stroke: rgba(34, 211, 238, 0.9) !important;
     stroke-width: 2.5 !important;
 }

 .mm-edge--selected {
     stroke: var(--cyan) !important;
 }

 /* Properties panel */
 .mm-props-panel {
     width: 260px;
     flex-shrink: 0;
     background: rgba(8, 13, 18, 0.97);
     border-left: 1px solid rgba(34, 211, 238, 0.1);
     overflow-y: auto;
     padding: 20px 16px;
 }

 .mm-props-panel__title {
     font-size: 14px;
     font-weight: 700;
     color: var(--text-1);
     margin-bottom: 4px;
 }

 .mm-props-panel__sub {
     font-size: 11px;
     color: var(--text-4);
     margin-bottom: 20px;
     font-family: var(--font-mono);
 }

 .mm-props__section {
     margin-bottom: 18px;
 }

 .mm-props__label {
     font-size: 11px;
     font-weight: 600;
     color: var(--text-4);
     letter-spacing: 0.12em;
     text-transform: uppercase;
     margin-bottom: 8px;
     font-family: var(--font-mono);
 }

 .mm-props__input {
     width: 100%;
     background: rgba(13, 20, 28, 0.6);
     border: 1px solid rgba(94, 234, 212, 0.15);
     border-radius: var(--r-sm);
     color: var(--text-1);
     font-size: 13px;
     padding: 8px 10px;
     resize: none;
     outline: none;
     font-family: var(--font-display);
     transition: border-color .15s;
 }

 .mm-props__input:focus {
     border-color: rgba(34, 211, 238, 0.4);
 }

 .mm-props__notes {
     min-height: 80px;
     font-family: var(--font-mono);
     font-size: 12px;
 }

 .mm-props__btns {
     display: flex;
     gap: 6px;
 }

 .mm-props__btn {
     flex: 1;
     height: 32px;
     border-radius: var(--r-sm);
     background: rgba(13, 20, 28, 0.6);
     border: 1px solid rgba(94, 234, 212, 0.15);
     color: var(--text-3);
     font-size: 11px;
     font-family: var(--font-mono);
     letter-spacing: 0.06em;
     cursor: pointer;
     transition: all .15s;
 }

 .mm-props__btn:hover,
 .mm-props__btn.active {
     border-color: var(--cyan);
     color: var(--cyan);
     background: rgba(34, 211, 238, 0.06);
 }

 .mm-props__colors {
     display: flex;
     gap: 8px;
     flex-wrap: wrap;
 }

 .mm-props__color {
     width: 24px;
     height: 24px;
     border-radius: 50%;
     border: 2px solid transparent;
     cursor: pointer;
     transition: all .12s;
 }

 .mm-props__color:hover {
     transform: scale(1.2);
 }

 .mm-props__color.active {
     border-color: white;
     transform: scale(1.1);
 }

 .mm-props__del-btn {
     width: 100%;
     height: 34px;
     border-radius: var(--r-sm);
     background: rgba(248, 113, 113, 0.08);
     border: 1px solid rgba(248, 113, 113, 0.3);
     color: var(--error);
     font-size: 12px;
     font-family: var(--font-mono);
     letter-spacing: 0.06em;
     cursor: pointer;
     transition: all .15s;
 }

 .mm-props__del-btn:hover {
     background: rgba(248, 113, 113, 0.15);
 }

 .mm-props__empty {
     padding: 32px 0;
     text-align: center;
     color: var(--text-4);
     font-size: 12px;
     font-family: var(--font-mono);
     letter-spacing: 0.1em;
 }

 /* ================================================================
   RESPONSIVIDADE COMPLEMENTAR
   ================================================================ */

 /* Botão hambúrguer — escondido no desktop */
 .nx-menu-btn {
     display: none;
     align-items: center;
     justify-content: center;
     width: 36px;
     height: 36px;
     border-radius: var(--r-sm);
     background: transparent;
     border: 1px solid rgba(94, 234, 212, 0.2);
     color: var(--text-2);
     cursor: pointer;
     transition: all .15s;
     flex-shrink: 0;
 }

 .nx-menu-btn:hover {
     border-color: rgba(94, 234, 212, 0.4);
     color: var(--cyan);
 }

 .nx-menu-btn.is-open {
     border-color: rgba(94, 234, 212, 0.45);
     color: var(--cyan);
     background: rgba(34, 211, 238, 0.08);
 }

 /* Backdrop do drawer mobile */
 .nx-mobile-backdrop {
     display: none;
     position: fixed;
     inset: 0;
     top: 72px;
     z-index: 198;
     background: rgba(4, 8, 13, 0.75);
     backdrop-filter: blur(3px);
 }

 .nx-mobile-backdrop.show {
     display: block;
     animation: nx-fadeIn .2s ease-out;
 }

 @media (max-width: 768px) {

     /* Exibir hambúrguer */
     .nx-menu-btn {
         display: flex;
     }

     /* Sidebar como drawer lateral ao abrir */
     .nx-sidebar.open {
         display: flex !important;
         z-index: 199;
         animation: nx-slideInLeft .22s ease-out;
     }

     /* NX-HERO: padding interno — sobrepõe inline style */
     .nx-hero {
         padding-left: 16px !important;
         padding-right: 16px !important;
     }

     /* NX-MODAL: largura máxima em mobile */
     .nx-modal,
     .nx-modal--sm,
     .nx-modal--lg {
         max-width: 94vw;
     }

     /* MIND MAP: painel lateral oculto */
     .mm-props-panel {
         display: none;
     }

     /* MIND MAP topbar: wrap em telas pequenas */
     .mm-topbar {
         flex-wrap: wrap;
         height: auto;
         min-height: 44px;
         padding: 8px 12px;
         gap: 8px;
     }

     .mm-topbar__title {
         min-width: 0;
         flex: 1;
         max-width: none;
     }

     .mm-topbar__actions {
         flex-wrap: wrap;
         gap: 6px;
     }
 }

 @media (max-width: 480px) {

     /* NX-INSIGHT-CARDS: 1 coluna */
     .nx-insight-cards {
         grid-template-columns: 1fr;
     }

     /* NX-INSIGHT-CARD valor: fonte menor */
     .nx-insight-card__value {
         font-size: 28px;
     }

     /* MODAL btns: coluna em mobile pequeno */
     .nx-modal__btns {
         flex-direction: column;
     }

     /* LOG ROW: compactar para não vazar */
     .log-date {
         min-width: 70px;
         font-size: 11px;
     }

     .log-time-val {
         min-width: 50px;
         font-size: 12px;
     }

     .log-sessions {
         display: none;
     }
 }

 @media (max-width: 400px) {

     /* MM-CARDS-GRID: 1 coluna em telas muito pequenas */
     .mm-cards-grid {
         grid-template-columns: 1fr;
     }

     /* NX-Q-ROW extra pequeno */
     .nx-q-row {
         grid-template-columns: 1fr !important;
     }
 }

 @keyframes nx-slideInLeft {
     from {
         transform: translateX(-100%);
         opacity: 0;
     }

     to {
         transform: translateX(0);
         opacity: 1;
     }
 }

 /* ── Modal de Planos ─────────────────────────────────────────────── */
 .nx-planos-wrap {
     min-height: 100vh;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     padding: 48px 20px 32px;
 }

 .nx-planos-header {
     text-align: center;
     margin-bottom: 40px;
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 12px;
 }

 .nx-planos-title {
     font-family: var(--font-display);
     font-size: clamp(22px, 4vw, 34px);
     font-weight: 900;
     letter-spacing: 0.14em;
     color: var(--cyan);
     text-shadow: 0 0 32px rgba(34, 211, 238, 0.5);
 }

 .nx-planos-sub {
     font-family: var(--font-mono);
     font-size: 12px;
     letter-spacing: 0.12em;
     color: var(--text-4);
     text-transform: uppercase;
 }

 .nx-planos-cards {
     display: flex;
     gap: 24px;
     align-items: flex-start;
     flex-wrap: wrap;
     justify-content: center;
     width: 100%;
     max-width: 860px;
 }

 .nx-plano-card {
     flex: 1;
     min-width: 280px;
     max-width: 380px;
     background: linear-gradient(160deg, rgba(13, 20, 28, 0.98), rgba(8, 13, 18, 0.98));
     border: 1px solid rgba(148, 163, 184, 0.15);
     border-radius: var(--r-xl);
     padding: 32px 28px 28px;
     display: flex;
     flex-direction: column;
     gap: 0;
     position: relative;
     transition: border-color .2s;
 }

 .nx-plano-card:hover {
     border-color: rgba(148, 163, 184, 0.3);
 }

 .nx-plano-card--destaque {
     border-color: rgba(34, 211, 238, 0.45);
     box-shadow: 0 0 40px rgba(34, 211, 238, 0.1), 0 20px 60px rgba(0, 0, 0, 0.5);
 }

 .nx-plano-card--destaque:hover {
     border-color: rgba(34, 211, 238, 0.7);
 }

 .nx-plano-card__rec {
     position: absolute;
     top: -14px;
     left: 50%;
     transform: translateX(-50%);
     background: linear-gradient(90deg, #22d3ee, #00cc88);
     color: #031018;
     font-family: var(--font-mono);
     font-size: 10px;
     font-weight: 700;
     letter-spacing: 0.15em;
     padding: 4px 16px;
     border-radius: 20px;
     white-space: nowrap;
 }

 .nx-plano-card__label {
     font-family: var(--font-mono);
     font-size: 11px;
     font-weight: 700;
     letter-spacing: 0.22em;
     color: var(--text-3);
     margin-bottom: 16px;
 }

 .nx-plano-card__price {
     display: flex;
     align-items: baseline;
     gap: 2px;
     margin-bottom: 4px;
     flex-wrap: wrap;
 }

 .nx-plano-card__currency {
     font-family: var(--font-mono);
     font-size: 22px;
     font-weight: 700;
     color: var(--cyan);
     align-self: flex-start;
     margin-top: 6px;
 }

 .nx-plano-card__value {
     font-family: var(--font-display);
     font-size: 56px;
     font-weight: 900;
     color: var(--cyan);
     line-height: 1;
     letter-spacing: -0.02em;
 }

 .nx-plano-card__period {
     font-family: var(--font-mono);
     font-size: 11px;
     color: var(--text-4);
     letter-spacing: 0.04em;
     align-self: flex-end;
     padding-bottom: 10px;
     padding-left: 6px;
 }

 .nx-plano-card__economy {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     background: rgba(34, 211, 238, 0.08);
     border: 1px solid rgba(34, 211, 238, 0.3);
     color: var(--cyan);
     font-family: var(--font-mono);
     font-size: 10px;
     font-weight: 700;
     letter-spacing: 0.14em;
     padding: 6px 14px;
     border-radius: var(--r-md);
     margin-bottom: 4px;
     align-self: flex-start;
 }

 .nx-plano-card__list {
     list-style: none;
     margin: 20px 0 24px;
     padding: 0;
     display: flex;
     flex-direction: column;
     gap: 10px;
     flex: 1;
 }

 .nx-plano-card__list li {
     font-size: 13px;
     color: var(--text-2);
     display: flex;
     align-items: center;
     gap: 10px;
     letter-spacing: 0.01em;
 }

 .nx-plano-card__list li::before {
     content: '✓';
     font-size: 13px;
     font-weight: 700;
     color: var(--cyan);
     flex-shrink: 0;
 }

 .nx-plano-card__list li.no {
     color: var(--text-4);
     text-decoration: line-through;
 }

 .nx-plano-card__list li.no::before {
     content: '✗';
     color: rgba(148, 163, 184, 0.3);
 }

 .nx-soon {
     font-family: var(--font-mono);
     font-size: 10px;
     color: var(--text-4);
     letter-spacing: 0.1em;
 }

 .nx-plano-card__btn {
     display: block;
     text-align: center;
     padding: 14px 0;
     background: rgba(148, 163, 184, 0.08);
     border: 1px solid rgba(148, 163, 184, 0.2);
     color: var(--text-1);
     font-family: var(--font-mono);
     font-size: 12px;
     font-weight: 700;
     letter-spacing: 0.16em;
     border-radius: var(--r-md);
     cursor: pointer;
     text-decoration: none;
     transition: all .2s;
 }

 .nx-plano-card__btn:hover {
     background: rgba(148, 163, 184, 0.15);
     border-color: rgba(148, 163, 184, 0.4);
 }

 .nx-plano-card__btn--cyan {
     background: linear-gradient(135deg, #22d3ee, #00cc88);
     border-color: transparent;
     color: #031018;
 }

 .nx-plano-card__btn--cyan:hover {
     box-shadow: 0 0 28px rgba(34, 211, 238, 0.45);
     background: linear-gradient(135deg, #38e4ff, #00e09a);
 }

 .nx-planos-footer {
     margin-top: 28px;
     display: flex;
     align-items: center;
     gap: 8px;
     font-family: var(--font-mono);
     font-size: 11px;
     color: var(--text-4);
     letter-spacing: 0.08em;
 }

 @media (max-width: 640px) {
     .nx-plano-card {
         min-width: 100%;
     }

     .nx-plano-card__value {
         font-size: 44px;
     }

     .nx-planos-wrap {
         padding: 32px 16px 24px;
     }
 }

 /* ── REDAÇÃO ────────────────────────────────────────────────────────── */
 .rd-wrap {
     max-width: 820px;
     margin: 0 auto;
     padding: 4px 0 40px;
     display: flex;
     flex-direction: column;
     gap: 20px;
 }

 .rd-header {
     display: flex;
     align-items: flex-start;
     justify-content: space-between;
     flex-wrap: wrap;
     gap: 12px;
 }

 .rd-eyebrow {
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.18em;
     color: var(--cyan);
     margin-bottom: 6px;
 }

 .rd-title {
     font-family: var(--font-display);
     font-size: 26px;
     font-weight: 700;
     color: var(--text-1);
     line-height: 1.1;
 }

 .rd-sub {
     font-size: 12px;
     color: var(--text-4);
     margin-top: 5px;
     font-family: var(--font-mono);
 }

 .rd-limit-badge {
     display: flex;
     align-items: center;
     gap: 6px;
     background: rgba(34, 211, 238, 0.06);
     border: 1px solid rgba(34, 211, 238, 0.15);
     border-radius: 20px;
     padding: 6px 14px;
     font-family: var(--font-mono);
     font-size: 11px;
     color: var(--text-4);
     white-space: nowrap;
 }

 .rd-limit-badge.warn {
     border-color: rgba(251, 191, 36, 0.3);
     color: #fbbf24;
 }

 .rd-limit-badge.empty {
     border-color: rgba(248, 113, 113, 0.3);
     color: #f87171;
 }

 .rd-config {
     background: rgba(255, 255, 255, 0.02);
     border: 1px solid rgba(34, 211, 238, 0.1);
     border-radius: 14px;
     padding: 20px;
     display: flex;
     flex-direction: column;
     gap: 16px;
 }

 .rd-config-row {
     display: flex;
     gap: 20px;
     flex-wrap: wrap;
 }

 .rd-config-row .rd-field {
     flex: 1;
     min-width: 200px;
 }

 .rd-field-label {
     font-family: var(--font-mono);
     font-size: 9px;
     letter-spacing: 0.16em;
     color: var(--text-4);
     margin-bottom: 8px;
 }

 .rd-pills {
     display: flex;
     flex-wrap: wrap;
     gap: 6px;
 }

 .rd-pill {
     padding: 6px 14px;
     border-radius: 20px;
     font-size: 12px;
     font-family: var(--font-mono);
     font-weight: 600;
     cursor: pointer;
     border: 1px solid rgba(34, 211, 238, 0.15);
     background: transparent;
     color: var(--text-4);
     transition: all .15s;
 }

 .rd-pill:hover {
     border-color: rgba(34, 211, 238, 0.35);
     color: var(--text-2);
 }

 .rd-pill.active {
     background: rgba(34, 211, 238, 0.12);
     border-color: rgba(34, 211, 238, 0.4);
     color: var(--cyan);
 }

 .rd-input {
     width: 100%;
     background: rgba(255, 255, 255, 0.04);
     border: 1px solid rgba(34, 211, 238, 0.15);
     border-radius: 10px;
     color: var(--text-1);
     font-size: 13px;
     font-family: var(--font-mono);
     padding: 10px 14px;
     outline: none;
     transition: border-color .15s;
     box-sizing: border-box;
 }

 .rd-input:focus {
     border-color: rgba(34, 211, 238, 0.45);
 }

 .rd-input::placeholder {
     color: rgba(148, 163, 184, 0.3);
 }

 .rd-textarea-wrap {
     position: relative;
 }

 .rd-textarea {
     width: 100%;
     min-height: 220px;
     resize: vertical;
     outline: none;
     background: rgba(255, 255, 255, 0.03);
     border: 1px solid rgba(34, 211, 238, 0.15);
     border-radius: 14px;
     color: var(--text-1);
     font-size: 14px;
     font-family: var(--font-body, sans-serif);
     padding: 16px 16px 36px;
     line-height: 1.7;
     transition: border-color .15s;
     box-sizing: border-box;
 }

 .rd-textarea:focus {
     border-color: rgba(34, 211, 238, 0.4);
 }

 .rd-textarea::placeholder {
     color: rgba(148, 163, 184, 0.25);
 }

 .rd-wordcount {
     position: absolute;
     bottom: 12px;
     right: 14px;
     font-family: var(--font-mono);
     font-size: 10px;
     color: var(--text-4);
     pointer-events: none;
 }

 .rd-submit {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
     padding: 14px 28px;
     border-radius: 12px;
     border: none;
     cursor: pointer;
     background: linear-gradient(135deg, #7c3aed, #6d28d9);
     color: #fff;
     font-size: 14px;
     font-weight: 700;
     letter-spacing: 0.04em;
     box-shadow: 0 4px 20px rgba(124, 58, 237, 0.35);
     transition: transform .15s, box-shadow .15s, opacity .15s;
     align-self: flex-start;
 }

 .rd-submit:hover {
     transform: translateY(-1px);
     box-shadow: 0 8px 28px rgba(124, 58, 237, 0.5);
 }

 .rd-submit:disabled {
     opacity: 0.45;
     cursor: not-allowed;
     transform: none;
     box-shadow: none;
 }

 .rd-loading {
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 14px;
     padding: 32px;
     background: rgba(255, 255, 255, 0.02);
     border: 1px solid rgba(34, 211, 238, 0.1);
     border-radius: 14px;
 }

 .rd-loading__dots {
     display: flex;
     gap: 7px;
 }

 .rd-loading__dots span {
     width: 8px;
     height: 8px;
     border-radius: 50%;
     background: var(--cyan);
     opacity: 0.4;
     animation: nx-assist-bounce 1.2s ease-in-out infinite;
 }

 .rd-loading__dots span:nth-child(2) {
     animation-delay: .2s;
 }

 .rd-loading__dots span:nth-child(3) {
     animation-delay: .4s;
 }

 .rd-loading__text {
     font-family: var(--font-mono);
     font-size: 12px;
     color: var(--text-4);
     letter-spacing: 0.06em;
 }

 .rd-resultado {
     display: flex;
     flex-direction: column;
     gap: 18px;
     animation: nx-fadeIn .3s ease;
 }

 .rd-score-header {
     display: flex;
     align-items: center;
     gap: 24px;
     background: rgba(255, 255, 255, 0.03);
     border: 1px solid rgba(34, 211, 238, 0.15);
     border-radius: 16px;
     padding: 22px 26px;
 }

 .rd-score-circle {
     display: flex;
     align-items: baseline;
     gap: 3px;
     flex-shrink: 0;
 }

 .rd-score-num {
     font-family: var(--font-display);
     font-size: 54px;
     font-weight: 800;
     line-height: 1;
     color: var(--cyan);
 }

 .rd-score-sep {
     font-size: 26px;
     color: var(--text-4);
 }

 .rd-score-max {
     font-size: 26px;
     color: var(--text-4);
     font-weight: 600;
 }

 .rd-score-info {
     flex: 1;
 }

 .rd-score-label {
     font-family: var(--font-mono);
     font-size: 9px;
     letter-spacing: 0.18em;
     color: var(--text-4);
 }

 .rd-score-banca {
     font-size: 13px;
     font-weight: 600;
     color: var(--text-2);
     margin: 4px 0 10px;
 }

 .rd-score-bar-track {
     height: 6px;
     background: rgba(255, 255, 255, 0.07);
     border-radius: 3px;
     overflow: hidden;
 }

 .rd-score-bar-fill {
     height: 100%;
     border-radius: 3px;
     background: var(--cyan);
     transition: width .8s ease;
 }

 .rd-criterios {
     display: flex;
     flex-direction: column;
     gap: 10px;
 }

 .rd-criterio {
     background: rgba(255, 255, 255, 0.02);
     border: 1px solid rgba(255, 255, 255, 0.06);
     border-radius: 12px;
     padding: 14px 16px;
 }

 .rd-criterio-top {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 8px;
 }

 .rd-criterio-nome {
     font-family: var(--font-mono);
     font-size: 11px;
     letter-spacing: 0.1em;
     color: var(--text-2);
     font-weight: 600;
 }

 .rd-criterio-nota {
     font-family: var(--font-display);
     font-size: 16px;
     font-weight: 700;
 }

 .rd-criterio-nota.full {
     color: #34d399;
 }

 .rd-criterio-nota.mid {
     color: #fbbf24;
 }

 .rd-criterio-nota.low {
     color: #f87171;
 }

 .rd-criterio-bar-track {
     height: 4px;
     background: rgba(255, 255, 255, 0.06);
     border-radius: 2px;
     overflow: hidden;
     margin-bottom: 10px;
 }

 .rd-criterio-bar-fill {
     height: 100%;
     border-radius: 2px;
     transition: width .6s ease;
 }

 .rd-criterio-bar-fill.full {
     background: #34d399;
 }

 .rd-criterio-bar-fill.mid {
     background: #fbbf24;
 }

 .rd-criterio-bar-fill.low {
     background: #f87171;
 }

 .rd-criterio-feedback {
     font-size: 12.5px;
     color: var(--text-4);
     line-height: 1.6;
 }

 .rd-feedback-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 12px;
 }

 .rd-feedback-card {
     background: rgba(255, 255, 255, 0.02);
     border: 1px solid rgba(255, 255, 255, 0.06);
     border-radius: 12px;
     padding: 16px;
 }

 .rd-feedback-card--ok {
     border-color: rgba(52, 211, 153, 0.2);
 }

 .rd-feedback-card--fix {
     border-color: rgba(251, 191, 36, 0.2);
 }

 .rd-feedback-card-title {
     font-family: var(--font-mono);
     font-size: 10px;
     letter-spacing: 0.12em;
     margin-bottom: 10px;
     font-weight: 700;
 }

 .rd-feedback-card--ok .rd-feedback-card-title {
     color: #34d399;
 }

 .rd-feedback-card--fix .rd-feedback-card-title {
     color: #fbbf24;
 }

 .rd-feedback-card ul {
     margin: 0;
     padding-left: 16px;
     display: flex;
     flex-direction: column;
     gap: 6px;
 }

 .rd-feedback-card li {
     font-size: 12.5px;
     color: var(--text-4);
     line-height: 1.5;
 }

 .rd-avaliacao-wrap {
     background: rgba(124, 58, 237, 0.06);
     border: 1px solid rgba(124, 58, 237, 0.2);
     border-radius: 12px;
     padding: 18px 20px;
 }

 .rd-avaliacao-label {
     font-family: var(--font-mono);
     font-size: 9px;
     letter-spacing: 0.16em;
     color: #a78bfa;
     margin-bottom: 8px;
 }

 .rd-avaliacao-text {
     font-size: 13.5px;
     color: var(--text-3);
     line-height: 1.7;
 }

 .rd-nova {
     align-self: flex-start;
     padding: 10px 20px;
     border-radius: 10px;
     border: 1px solid rgba(34, 211, 238, 0.25);
     background: transparent;
     color: var(--cyan);
     font-family: var(--font-mono);
     font-size: 12px;
     font-weight: 600;
     cursor: pointer;
     transition: all .15s;
 }

 .rd-nova:hover {
     background: rgba(34, 211, 238, 0.08);
     border-color: rgba(34, 211, 238, 0.5);
 }

 /* modo de envio */
 .rd-mode-tabs {
     display: flex;
     gap: 8px;
     flex-wrap: wrap;
 }

 .rd-mode-tab {
     display: flex;
     align-items: center;
     gap: 7px;
     padding: 10px 18px;
     border-radius: 12px;
     border: 1px solid rgba(34, 211, 238, 0.15);
     background: rgba(255, 255, 255, 0.02);
     color: var(--text-4);
     font-size: 13px;
     font-family: var(--font-mono);
     font-weight: 600;
     cursor: pointer;
     transition: all .15s;
 }

 .rd-mode-tab:hover {
     border-color: rgba(34, 211, 238, 0.35);
     color: var(--text-2);
 }

 .rd-mode-tab.active {
     background: rgba(34, 211, 238, 0.1);
     border-color: rgba(34, 211, 238, 0.4);
     color: var(--cyan);
 }

 /* select banca */
 .rd-select {
     width: 100%;
     background: rgba(255, 255, 255, 0.04);
     border: 1px solid rgba(34, 211, 238, 0.15);
     border-radius: 10px;
     color: var(--text-1);
     font-size: 13px;
     font-family: var(--font-mono);
     padding: 10px 14px;
     outline: none;
     cursor: pointer;
     transition: border-color .15s;
     appearance: none;
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
     background-repeat: no-repeat;
     background-position: right 12px center;
 }

 .rd-select:focus {
     border-color: rgba(34, 211, 238, 0.45);
 }

 .rd-select option {
     background: #0b1118;
     color: #e2e8f0;
 }

 /* upload area */
 .rd-upload-area {
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     gap: 10px;
     min-height: 160px;
     border: 2px dashed rgba(34, 211, 238, 0.2);
     border-radius: 14px;
     background: rgba(34, 211, 238, 0.02);
     cursor: pointer;
     transition: border-color .2s, background .2s;
     padding: 28px;
 }

 .rd-upload-area:hover {
     border-color: rgba(34, 211, 238, 0.45);
     background: rgba(34, 211, 238, 0.05);
 }

 .rd-upload-title {
     font-family: var(--font-mono);
     font-size: 13px;
     font-weight: 600;
     color: var(--text-3);
 }

 .rd-upload-sub {
     font-size: 11px;
     color: var(--text-4);
     font-family: var(--font-mono);
 }

 /* file preview */
 .rd-file-preview {
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 12px;
     padding: 16px;
     background: rgba(255, 255, 255, 0.02);
     border: 1px solid rgba(34, 211, 238, 0.15);
     border-radius: 14px;
 }

 .rd-pdf-badge {
     display: flex;
     align-items: center;
     gap: 10px;
     background: rgba(248, 113, 113, 0.08);
     border: 1px solid rgba(248, 113, 113, 0.2);
     border-radius: 10px;
     padding: 12px 18px;
     color: #fca5a5;
     font-family: var(--font-mono);
     font-size: 13px;
 }

 .rd-remove-file {
     padding: 7px 16px;
     border-radius: 8px;
     border: 1px solid rgba(248, 113, 113, 0.3);
     background: transparent;
     color: #f87171;
     font-size: 12px;
     font-family: var(--font-mono);
     cursor: pointer;
     transition: all .15s;
 }

 .rd-remove-file:hover {
     background: rgba(248, 113, 113, 0.1);
 }

 @media (max-width: 600px) {
     .rd-feedback-grid {
         grid-template-columns: 1fr;
     }

     .rd-config-row {
         flex-direction: column;
     }

     .rd-score-num {
         font-size: 40px;
     }

     .rd-mode-tabs {
         gap: 6px;
     }

     .rd-mode-tab {
         padding: 9px 14px;
         font-size: 12px;
     }
 }

 /* ── ASSISTENTE NEXUS ───────────────────────────────────────────────── */
 .nx-topbar__assist-btn {
     width: 34px;
     height: 34px;
     border-radius: 10px;
     background: rgba(124, 58, 237, 0.15);
     border: 1px solid rgba(124, 58, 237, 0.3);
     color: #a78bfa;
     cursor: pointer;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: background .15s, border-color .15s, color .15s, transform .12s;
     flex-shrink: 0;
 }

 .nx-topbar__assist-btn:hover {
     background: rgba(124, 58, 237, 0.3);
     border-color: rgba(124, 58, 237, 0.6);
     color: #c4b5fd;
     transform: scale(1.06);
 }

 .nx-topbar__assist-btn.active {
     background: rgba(124, 58, 237, 0.35);
     border-color: rgba(124, 58, 237, 0.7);
     color: #ddd6fe;
 }

 /* backdrop mobile */
 .nx-assist-backdrop {
     display: none;
     position: fixed;
     inset: 0;
     z-index: 56;
     background: rgba(4, 8, 15, 0.7);
     backdrop-filter: blur(3px);
 }

 .nx-assist-backdrop.show {
     display: block;
     animation: nx-fadeIn .2s ease;
 }

 /* painel */
 .nx-assist {
     position: fixed;
     top: 68px;
     right: 16px;
     z-index: 57;
     width: 400px;
     height: calc(100vh - 86px);
     max-height: 580px;
     background: #0b1118;
     border: 1px solid rgba(34, 211, 238, 0.2);
     border-radius: 18px;
     flex-direction: column;
     box-shadow: 0 32px 80px rgba(0, 0, 0, 0.8), 0 0 0 1px rgba(34, 211, 238, 0.06);
     overflow: hidden;
     animation: nx-fadeIn 0.18s ease-out;
 }

 /* handle mobile */
 .nx-assist__handle {
     display: none;
 }

 /* header */
 .nx-assist__header {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 14px 18px;
     border-bottom: 1px solid rgba(34, 211, 238, 0.1);
     background: rgba(34, 211, 238, 0.025);
     flex-shrink: 0;
 }

 .nx-assist__header-left {
     display: flex;
     align-items: center;
     gap: 10px;
 }

 .nx-assist__header-right {
     display: flex;
     align-items: center;
     gap: 4px;
 }

 .nx-assist__dot {
     width: 8px;
     height: 8px;
     border-radius: 50%;
     background: var(--cyan);
     box-shadow: 0 0 8px var(--cyan);
     animation: nx-pulse 2s ease-in-out infinite;
 }

 .nx-assist__title {
     font-family: var(--font-mono);
     font-size: 11px;
     font-weight: 600;
     letter-spacing: 0.12em;
     color: var(--cyan);
 }

 .nx-assist__icon-btn {
     background: transparent;
     border: none;
     color: var(--text-4);
     cursor: pointer;
     width: 32px;
     height: 32px;
     border-radius: 8px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: background .15s, color .15s;
 }

 .nx-assist__icon-btn:hover {
     background: rgba(34, 211, 238, 0.1);
     color: var(--cyan);
 }

 /* messages */
 .nx-assist__msgs {
     flex: 1;
     overflow-y: auto;
     padding: 18px 16px;
     display: flex;
     flex-direction: column;
     gap: 10px;
     scrollbar-width: thin;
     scrollbar-color: rgba(34, 211, 238, 0.15) transparent;
 }

 .nx-assist__msgs::-webkit-scrollbar {
     width: 3px;
 }

 .nx-assist__msgs::-webkit-scrollbar-thumb {
     background: rgba(34, 211, 238, 0.2);
     border-radius: 3px;
 }

 /* suggestion chips */
 .nx-assist__sugg-wrap {
     display: flex;
     flex-direction: column;
     gap: 8px;
     padding-bottom: 4px;
     overflow-y: auto;
     scrollbar-width: none;
 }

 .nx-assist__sugg-label {
     font-family: var(--font-mono);
     font-size: 9px;
     letter-spacing: 0.14em;
     color: var(--text-4);
     text-transform: uppercase;
     margin-bottom: 6px;
 }

 .nx-assist__sugg-btn {
     background: rgba(34, 211, 238, 0.04);
     border: 1px solid rgba(34, 211, 238, 0.12);
     border-left: 3px solid rgba(34, 211, 238, 0.3);
     border-radius: 10px;
     color: #94a3b8;
     font-size: 12px;
     font-family: var(--font-mono);
     padding: 11px 14px;
     text-align: left;
     cursor: pointer;
     transition: background .15s, border-color .15s, color .15s;
     line-height: 1.4;
 }

 .nx-assist__sugg-btn:hover {
     background: rgba(34, 211, 238, 0.09);
     border-color: rgba(34, 211, 238, 0.3);
     border-left-color: var(--cyan);
     color: #e2e8f0;
 }

 /* chat bubbles */
 .nx-assist__msg {
     max-width: 90%;
     line-height: 1.6;
     font-size: 13.5px;
     padding: 11px 14px;
     border-radius: 16px;
     white-space: pre-wrap;
     word-break: break-word;
     animation: nx-fadeIn 0.15s ease-out;
 }

 .nx-assist__msg--user {
     background: rgba(34, 211, 238, 0.12);
     border: 1px solid rgba(34, 211, 238, 0.22);
     color: #e2e8f0;
     align-self: flex-end;
     border-bottom-right-radius: 4px;
     font-family: var(--font-body, sans-serif);
 }

 .nx-assist__msg--model {
     background: rgba(255, 255, 255, 0.05);
     border: 1px solid rgba(255, 255, 255, 0.08);
     color: #cbd5e1;
     align-self: flex-start;
     border-bottom-left-radius: 4px;
     font-family: var(--font-body, sans-serif);
 }

 /* typing */
 .nx-assist__typing {
     display: flex;
     align-items: center;
     gap: 5px;
     padding: 13px 14px;
     background: rgba(255, 255, 255, 0.04);
     border: 1px solid rgba(255, 255, 255, 0.08);
     border-radius: 16px;
     border-bottom-left-radius: 4px;
     align-self: flex-start;
 }

 .nx-assist__typing span {
     width: 6px;
     height: 6px;
     border-radius: 50%;
     background: rgba(34, 211, 238, 0.5);
     animation: nx-assist-bounce 1.2s ease-in-out infinite;
 }

 .nx-assist__typing span:nth-child(2) {
     animation-delay: 0.2s;
 }

 .nx-assist__typing span:nth-child(3) {
     animation-delay: 0.4s;
 }

 @keyframes nx-assist-bounce {

     0%,
     60%,
     100% {
         transform: translateY(0);
         opacity: 0.5;
     }

     30% {
         transform: translateY(-6px);
         opacity: 1;
     }
 }

 /* input */
 .nx-assist__input-wrap {
     display: flex;
     align-items: flex-end;
     gap: 10px;
     padding: 14px 16px;
     border-top: 1px solid rgba(34, 211, 238, 0.1);
     background: rgba(11, 17, 24, 0.95);
     flex-shrink: 0;
 }

 .nx-assist__input {
     flex: 1;
     resize: none;
     outline: none;
     background: rgba(255, 255, 255, 0.05);
     border: 1px solid rgba(34, 211, 238, 0.18);
     border-radius: 14px;
     color: #e2e8f0;
     font-size: 13px;
     font-family: var(--font-mono);
     padding: 11px 15px;
     line-height: 1.5;
     max-height: 120px;
     overflow-y: auto;
     transition: border-color .15s, background .15s;
     scrollbar-width: none;
 }

 .nx-assist__input:focus {
     border-color: rgba(34, 211, 238, 0.5);
     background: rgba(255, 255, 255, 0.07);
 }

 .nx-assist__input::placeholder {
     color: rgba(148, 163, 184, 0.35);
 }

 .nx-assist__send {
     width: 42px;
     height: 42px;
     border-radius: 50%;
     background: linear-gradient(135deg, #7c3aed, #6d28d9);
     border: none;
     color: #fff;
     cursor: pointer;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
     transition: transform .15s, opacity .15s, box-shadow .15s;
     box-shadow: 0 4px 16px rgba(124, 58, 237, 0.4);
 }

 .nx-assist__send:hover {
     transform: scale(1.08);
     box-shadow: 0 6px 20px rgba(124, 58, 237, 0.6);
 }

 .nx-assist__send:disabled {
     opacity: 0.4;
     cursor: not-allowed;
     transform: none;
     box-shadow: none;
 }

 @media (max-width: 768px) {
     .nx-assist {
         top: auto;
         bottom: 0;
         right: 0;
         left: 0;
         width: 100%;
         border-radius: 24px 24px 0 0;
         height: auto;
         max-height: 80vh;
         min-height: 420px;
         border-left: none;
         border-right: none;
         border-bottom: none;
         animation: nx-slide-up 0.28s cubic-bezier(0.32, 0.72, 0, 1);
     }

     .nx-assist__handle {
         display: block;
         width: 40px;
         height: 4px;
         background: rgba(255, 255, 255, 0.15);
         border-radius: 2px;
         margin: 10px auto 0;
         flex-shrink: 0;
     }

     .nx-assist__header {
         padding: 10px 20px 12px;
     }

     .nx-assist__msgs {
         padding: 14px 20px;
     }

     .nx-assist__sugg-btn {
         padding: 11px 14px;
         font-size: 12px;
     }

     .nx-assist__sugg-wrap {
         gap: 6px;
     }

     .nx-assist__input-wrap {
         padding: 12px 20px 20px;
     }

     .nx-assist__input {
         font-size: 15px;
         padding: 13px 16px;
     }

     .nx-assist__send {
         width: 48px;
         height: 48px;
     }

     .nx-assist__msg {
         font-size: 14px;
     }
 }

 /* ── Toast de notificação ─────────────────────────────────────────── */
 .nx-toast {
     display: flex;
     align-items: center;
     gap: 10px;
     padding: 13px 20px;
     border-radius: 12px;
     font-family: var(--font-ui);
     font-size: 13px;
     font-weight: 500;
     letter-spacing: .02em;
     line-height: 1.4;
     box-shadow: 0 8px 32px rgba(0, 0, 0, .55), 0 2px 8px rgba(0, 0, 0, .3);
     pointer-events: auto;
     max-width: min(420px, 90vw);
     animation: nx-toast-in .22s cubic-bezier(.34, 1.56, .64, 1) both;
     will-change: transform, opacity;
 }

 .nx-toast--hide {
     animation: nx-toast-out .2s ease forwards;
 }

 .nx-toast--error {
     background: rgba(24, 10, 10, .95);
     border: 1px solid rgba(248, 113, 113, .4);
     color: #fca5a5;
 }

 .nx-toast--warn {
     background: rgba(24, 18, 4, .95);
     border: 1px solid rgba(251, 191, 36, .35);
     color: #fde68a;
 }

 .nx-toast--success {
     background: rgba(4, 18, 10, .95);
     border: 1px solid rgba(52, 211, 153, .3);
     color: #6ee7b7;
 }

 .nx-toast--info {
     background: rgba(4, 12, 22, .95);
     border: 1px solid rgba(34, 211, 238, .3);
     color: #67e8f9;
 }

 .nx-toast__icon {
     font-size: 16px;
     flex-shrink: 0;
 }

 .nx-toast__msg {
     flex: 1;
 }

 @keyframes nx-toast-in {
     from {
         opacity: 0;
         transform: translateY(16px) scale(.94);
     }

     to {
         opacity: 1;
         transform: translateY(0) scale(1);
     }
 }

 @keyframes nx-toast-out {
     from {
         opacity: 1;
         transform: translateY(0) scale(1);
     }

     to {
         opacity: 0;
         transform: translateY(8px) scale(.96);
     }
 }