.hover
{
	background-color:Green;
}
.rr-webpages-readability-fallback{
	color: #cc0000;
	font-weight: 600;
	margin: 6px 0 10px 0;
}
.rr-webpages-add{
	width: auto;
	border-collapse: collapse;
	margin: 6px 0 10px 0;
}
.rr-webpages-add td{
	vertical-align: middle;
}
.rr-webpages-add-label,
.rr-webpages-add-action{
	white-space: nowrap;
	padding-left: 1.2em;
}
.rr-webpages-add-label{
	font-weight: 600;
	padding-right: 4em;
	vertical-align: top;
}
.rr-webpages-add-fields{
	width: auto;
}
.rr-webpages-field{
	margin-bottom: 6px;
}
.rr-webpages-field label{
	display: inline-block;
	min-width: 44px;
	margin-right: 0.35em;
}
.rr-webpages-title{
	width: 28em;
	max-width: 28em;
	box-sizing: border-box;
}
.rr-webpages-url{
	width: 28em;
	max-width: 28em;
	box-sizing: border-box;
}
@media (max-width: 700px){
	.rr-webpages-add,
	.rr-webpages-add tr,
	.rr-webpages-add td{
		display: block;
		width: 100%;
	}
	.rr-webpages-add-label,
	.rr-webpages-add-action{
		padding: 4px 0;
	}
	.rr-webpages-field label{
		display: block;
		min-width: 0;
		margin: 0 0 4px 0;
	}
	.rr-webpages-title,
	.rr-webpages-url{
		width: 100%;
		max-width: 100%;
	}
}
a { 
font-family: Montserrat, Helvetica Neueu, Helvetica, Arial, sans-serif;
color: #000066; 
}
td { 
font-size: 0.9rem;
font-family: Montserrat, Helvetica Neueu, Helvetica, Arial, sans-serif;
}
th { 
font-family: Montserrat, Helvetica Neueu, Helvetica, Arial, sans-serif;
}
p { 
font-size: 0.9rem;
font-family: Montserrat, Helvetica Neueu, Helvetica, Arial, sans-serif;
}
h1 { 
font-size: 1.3rem;
font-family: Montserrat, Helvetica Neueu, Helvetica, Arial, sans-serif;
color: #CC0033; 
}
h2 { 
font-size: 1.2rem;
font-family: Montserrat, Helvetica Neueu, Helvetica, Arial, sans-serif;
color: #CC0033; 
}
h3 { 
font-size: 0.9rem;
font-family: Montserrat, Helvetica Neueu, Helvetica, Arial, sans-serif;
color: #CC0033; 
}
h4 { 
font-size: 0.8rem;
font-family: Montserrat, Helvetica Neueu, Helvetica, Arial, sans-serif;
color: #CC0033; 
}
h5 { 
font-size: 0.8rem;
font-family: Montserrat, Helvetica Neueu, Helvetica, Arial, sans-serif;
color: #CC0033; 
}
h6 { 
font-size: 0.8rem;
font-family: Montserrat, Helvetica Neueu, Helvetica, Arial, sans-serif;
color: #CC0033; 
}
.p_small { 
font-size: small;
font-family: Montserrat, Helvetica Neueu, Helvetica, Arial, sans-serif;
color: #555555; 
}

.explodingdiv { 
margin: 0;
padding: 0;
}
.groupTxtLight {
line-height: 170%;
background-color:#EEEEEE;
}
.groupTxtLight2 {
line-height: 170%;
background-color:#EEEEEE;
padding-left:2px;
padding-right:2px;
}
.groupTxtDark  {
line-height: 170%;
background-color:#777777;
color: #777777;
}
.groupTxtDarkLeft  {
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
line-height: 170%;
background-color:#777777;
color: #777777;
}
.groupTxtDarkRight  {
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
line-height: 170%;
background-color:#777777;
color: #777777;
}
.groupTxtDarkLeftRight  {
border-radius: 6px;
line-height: 170%;
background-color:#777777;
color: #777777;
}
.groupTxtSpace  {
line-height: 170%;
background-color:#aaaaaa;
}
.groupTxtFading  {
line-height: 170%;
background-color:#999999;
color: #777777;
}
#rowhighlighttable tbody tr.ruled {
 background:#FF8822;
}
.alert { 
font-size: large;
font-family: Montserrat, Helvetica Neueu, Helvetica, Arial, sans-serif;
color: #000066; 
}
.alert_body { 
font-size: small;
font-family: Montserrat, Helvetica Neueu, Helvetica, Arial, sans-serif;
color: #000066; 
}
.btn{
    display: inline;
    height: 25px;
    width: 82px;
    background: #F1F8E0;
    border: 2px solid rgba(0, 0, 0, 0.59);
		margin-right: 3px;
		margin-bottom: 3px;
}
.btn_selected {
    display: inline;
    height: 25px;
    width: 82px;
    background: #33CC33;
    border: 1px solid rgba(33, 68, 72, 0.59);
		margin-right: 3px;
		margin-bottom: 3px;
}

table.listtable
{ 
font-family:arial;
background-color:#EEEEEE;
width:90%;
border-style:solid;
border-color:black;
border-width:5px;
}

table.listtable th
{
border-style: dotted;
border-width: 1px 1px 1px 1px;
background-color: #ffff00;
color: #000000;
font-family: Arial;
border-spacing: 0;
border-color: gray gray gray gray;
}


table.listtable tr
{ 
padding: 0;
border-style: dotted;
border-spacing: 0;
border-width: 1px 1px 1px 1px;
border-color: gray gray gray gray;
}

table.listtable td
{  
background-color:#eeeeee;
color:green;
border-style:solid;
border-width:1px;
text-align:center;
}


.ruler
{ 
font-family:arial;
background-color:#EEEEEE;
border-spacing: 0px;
padding: 0px 0px 0px 0px;
}

.ruler th
{
text-align: left;
padding: 6px 6px 6px 6px;
border-width: 1px 1px 1px 1px;
border-color: green green green green;
}
.ruler th:hover {

}

.ruler tr
{ 
border-width: 1px 6px 6px 1px;
padding: 6px 6px 6px 6px;
border-color: green green green green;
}
.ruler tr:hover {
  background-color: #ffff99;
  cursor:pointer;
}

.ruler td
{  
padding: 2px 10px 2px 0px;
border-style:dashed;
border-width: 0px 0px 1px 0px;
border-color: #cccccc #cccccc #cccccc #cccccc;
text-align:left;
}



TABLE.bar
{ 
font-family:arial;
background-color:#EEEEEE;
border-spacing: 0px;
padding: 0px 0px 0px 0px;
}

TABLE.bar th
{
padding: 0px 0px 0px 0px;
border-width: 1px 1px 1px 1px;
border-color: green green green green;
}


table.bar tr
{ 
border-width: 1px 1px 1px 1px;
padding: 6px 6px 6px 6px;
border-color: green green green green;
}

table.bar td
{  
padding: 0px 0px 0px 0px;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: #bbbbbb #bbbbbb #bbbbbb #bbbbbb;
background-color:#eeeeee;
text-align:left;
}

TABLE.blank
{ 
border-style: none;
}

TABLE.blank th
{
border-style: none;
}


table.blank tr
{ 
border-style: none;
padding: 0px 0px 0px 0px;
}

table.blank td
{  
border-style: none;
padding: 0px 0px 0px 0px;
}

.rr-admin-metrics {
	background: #f6f2ec;
	color: #111827;
}

.rr-admin-container {
	padding: 24px;
	max-width: 1200px;
	margin: 0 auto;
	text-align: left;
}

.rr-admin-metrics h1,
.rr-admin-metrics h2,
.rr-admin-metrics h3 {
	text-align: left;
}

.rr-admin-table {
	border-collapse: collapse;
	width: 100%;
	margin: 8px 0 20px;
	background: #ffffff;
	color: #111827;
}

.rr-admin-table th,
.rr-admin-table td {
	border: 1px solid #d1d5db;
	padding: 6px 8px;
	text-align: left;
}

.rr-admin-metric-label {
	cursor: help;
	border-bottom: 1px dotted #94a3b8;
}

.rr-blur-demo-card{
	max-width:680px;
	margin:12px auto 6px;
	padding:16px 18px;
	border-radius:12px;
	border:2px solid #b8c2d3;
	background:#f6f6f6;
	color:#222;
	text-align:center;
	box-sizing:border-box;
}

.rr-blur-demo-text{
	display:inline-block;
	line-height:1.35;
	font-size:20px;
	font-family:"Segoe UI", Arial, sans-serif;
}

.rr-dark .rr-blur-demo-card{
	background:#0f172a;
	color:#e6e7eb;
	border-color:#4b5565;
}

.blur-char{position:relative;display:inline-block;vertical-align:baseline;line-height:1em;padding:0;min-width:0.52em;text-align:center;font-size:1em;font-weight:inherit;}
.blur-text{color:transparent;visibility:visible;}
.blur-box{position:absolute;left:-0.01em;right:-0.01em;top:var(--box-top,-0.06em);bottom:var(--box-bottom,-0.06em);border-radius:4px;background:rgba(0,0,0,0.6);box-shadow:0 0 1px rgba(0,0,0,0.35);pointer-events:none;transition:opacity 0.12s ease;}
.blur-char:hover .blur-box{opacity:0;}
.blur-char:hover .blur-text{color:inherit;}
.shape-tall{--box-top:-0.02em;--box-bottom:0.14em;}
.shape-desc{--box-top:-0.02em;--box-bottom:-0.24em;}
.shape-short{--box-top:0.10em;--box-bottom:0.10em;}
.blur-style-heavy .blur-box{background:rgba(45,49,58,0.78);box-shadow:0 0 3px rgba(0,0,0,0.38);}
.rr-dark .blur-style-heavy .blur-box{background:rgba(235,239,247,0.82);box-shadow:0 0 3px rgba(0,0,0,0.4);}

.rr-admin-table th {
	background: #f2f4f7;
	color: #111827;
	font-weight: 700;
}

@media (prefers-color-scheme: dark){
	.rr-admin-metrics {
		background: #0f172a;
		color: #e6e7eb;
	}

	.rr-admin-metrics a {
		color: #b8c1ff;
	}

	.rr-admin-table {
		background: #1f2937;
		color: #e6e7eb;
	}

	.rr-admin-table th {
		background: #2a2c31;
		color: #e6e7eb;
		border-color: #3a3d44;
	}

	.rr-admin-table td {
		border-color: #3a3d44;
	}

	.rr-admin-metric-label {
		border-bottom-color: #64748b;
	}
}

:root{
	--rr-chrome-light: #c1c0be;
	--rr-chrome-dark: #121418;
}
body {
	margin: 20px 10px;
	background: var(--rr-chrome-light, #f6f2ec);
	color: #111111;
	text-align: center;
}
@media (prefers-color-scheme: dark){
	html, body { background: #1d1e22; }
}

.progress {
	--progress-value: .3243;
	--color: hsl(calc(240 * (1 - var(--progress-value))), 100%, calc(30% + 20% * var(--progress-value)));
}

.rr-modal-overlay{
	display:none;
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.35);
	z-index:9999;
}
.rr-modal-box{
	background:#ffffff;
	color:#222;
	border-radius:8px;
	max-width:520px;
	margin:80px auto;
	padding:16px;
	box-sizing:border-box;
	overflow:hidden;
}
.rr-modal-box h3{ margin:0 0 0.5em 0; font-weight:700; }
.rr-modal-box .btn{ min-height:36px; height:36px; line-height:36px; padding:0 12px; border-radius:6px; }
body.rr-dark .rr-modal-box{ background:#1e1e1e; color:#f0f0f0; border:1px solid #3a3a3a; }
body.rr-dark .rr-modal-box a, body.rr-dark .rr-modal-box label{ color:inherit; }

.circle-progress {
    width: 70px;
      height: 70px;
}

.circle-progress-value {
    stroke-width: 12px;
      stroke: var(--color);
        stroke-dasharray: 5.98 2;
          transition: stroke 0.4s;
}

.circle-progress-circle {
    stroke-width: 3px;
    stroke: hsl(228, 8%, 10%);
}

.circle-progress-text {
    font-weight: bold;
    font-size: 22px;
      fill: var(--color);
        transform: translateX(0.2em);
          transition: fill 0.4s;
}

a {
	color: hsl(228, 8%, 50%);
	text-decoration-offset: 4px;
}

/* Guts-only Light/Dark mode */
#rr-popup.rr-dark, body.rr-dark { background-color: var(--rr-chrome-dark, #1d1e22) !important; color: #e6e7eb; }
body.rr-dark a { color: #b8c1ff; }
body.rr-dark h1, body.rr-dark h2 { color: #ff6b6b; }
body.rr-dark h3, body.rr-dark h4, body.rr-dark h5, body.rr-dark h6 { color: #e6e7eb; }
#guts.rr-guts-light {
  background-color: #f2f4f7 !important;
  color: #111111;
}
#guts.rr-guts-light a { color: #000066; }

#guts.rr-guts-dark {
  background-color: #1d1e22 !important;
  color: #e6e7eb;
}
#guts.rr-guts-dark a { color: #b8c1ff; }
/* Keep tables readable in dark mode */
#guts.rr-guts-dark table, #guts.rr-guts-dark th, #guts.rr-guts-dark td { color: inherit; }

/* Vocab training: align MATCH/ORDERING with MCQ left margin */
#qwrap .rr-vocab-indent{
  padding-left: 52px;
  box-sizing: border-box;
}
/* Vocab category loading state */
.rr-vocab-loading{
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  max-width: 520px;
  margin-left: 12%;
  margin-right: auto;
  text-align: left;
}
.rr-vocab-loader-text{
  font-weight: 600;
  color: #7c7468;
  letter-spacing: 0.2px;
}
.rr-vocab-loader-glyph{
  font-size: 56px;
  line-height: 1;
  color: #7c7468;
  animation: rrVocabGlyphPulse 1.2s infinite ease-in-out;
}
@keyframes rrVocabGlyphPulse{
  0%, 100%{ transform: scale(0.9); opacity: 0.5; }
  50%{ transform: scale(1.05); opacity: 1; }
}
/* Ordering needs a touch more indent to visually match the MATCH columns */
#qwrap .ord-shell.rr-vocab-indent{
  padding-left: 62px;
}
#ord_wrap{
  padding: calc(var(--ord-item-h, 32px) / 2) 0;
  box-sizing: border-box;
}
#guts .mc-opt{
  cursor: pointer;
  transition: background-color 120ms ease, color 120ms ease, border-color 120ms ease;
}
#guts .mc-opt:hover{
  background-color: #eef6ff;
}
#guts .mc-opt.mc-correct{
  background-color: #44FF44 !important;
  color: #000000 !important;
}
#guts .mc-opt.mc-wrong{
  background-color: #ff4d4f !important;
  color: #ffffff !important;
}
#guts #sideB .dropareahover{
  background-color: #e8f4ff !important;
  border-color: #3a8dff !important;
  box-shadow: inset 0 0 0 1px rgba(58, 141, 255, 0.35);
}
@media (max-width: 640px){
  #qwrap .rr-vocab-indent{ padding-left: 14px; }
  #qwrap .ord-shell.rr-vocab-indent{ padding-left: 18px; }
}
@media (prefers-color-scheme: dark){
  #guts.rr-guts-dark .mc-opt:hover{
    background-color: #2b3340;
  }
  #guts.rr-guts-dark .rr-vocab-loader-text{
    color: #a6afbf;
  }
  #guts.rr-guts-dark .rr-vocab-loader-glyph{
    color: #a6afbf;
  }
  #guts.rr-guts-dark .mc-opt.mc-correct{
    background-color: #0b5d24 !important;
    color: #e8ffe8 !important;
  }
  #guts.rr-guts-dark .mc-opt.mc-wrong{
    background-color: #b8000f !important;
    color: #ffffff !important;
  }
  #guts.rr-guts-dark #sideB .dropareahover{
    background-color: #243244 !important;
    border-color: #7bb7ff !important;
    box-shadow: inset 0 0 0 1px rgba(123, 183, 255, 0.35);
  }
}

/* Ensure the containing TD matches the mode to avoid visible patch */
td.rr-guts-td-light { background-color: inherit !important; }
td.rr-guts-td-dark { background-color: inherit !important; }

/* Lesson/reading tables: shared header styling */
.rr-lesson-table thead tr { background: var(--rr-table-head-bg, #f2f4f7); }
.rr-lesson-table thead th { color: var(--rr-table-head-fg, #334155); font-weight: 700; }

/* Tables: dark mode adjustments */
#guts.rr-guts-dark table { background-color: transparent; }
#guts.rr-guts-dark table.listtable { background-color: #2a2c31; border-color: #3a3d44; }
#guts.rr-guts-dark table.listtable th { background-color: #3a3d44; color: #e6e7eb; border-color: #5a5f6d; }
#guts.rr-guts-dark table.listtable tr { border-color: #3a3d44; }
#guts.rr-guts-dark table.listtable td { background-color: #2a2c31; color: #e6e7eb; border-color: #3a3d44; }

#guts.rr-guts-dark table.ruler { background-color: #2a2c31; }
#guts.rr-guts-dark table.ruler th { border-color: #5a5f6d; }
#guts.rr-guts-dark table.ruler tr { border-color: #3a3d44; }
#guts.rr-guts-dark table.ruler td { border-color: #3a3d44; }
#guts.rr-guts-dark #rowhighlighttable tbody tr:hover {
  background-color: #1f2a44 !important;
  box-shadow: inset 0 0 0 1px #60a5fa;
}
#guts.rr-guts-dark #rowhighlighttable tbody tr:hover td,
#guts.rr-guts-dark #rowhighlighttable tbody tr:hover th,
#guts.rr-guts-dark #rowhighlighttable tbody tr:hover td a,
#guts.rr-guts-dark #rowhighlighttable tbody tr:hover th a { color: #ffffff !important; }

#guts.rr-guts-dark table.bar { background-color: #2a2c31; }
#guts.rr-guts-dark table.bar th { border-color: #5a5f6d; }
#guts.rr-guts-dark table.bar tr { border-color: #3a3d44; }
#guts.rr-guts-dark table.bar td { background-color: #2a2c31; border-color: #3a3d44; }

/* jQuery UI Tabs: dark mode overrides (guts only) */
#guts.rr-guts-dark .ui-widget-content { background: #1d1e22; color: #e6e7eb; border: 1px solid #3a3d44; }
#guts.rr-guts-dark .ui-widget-header { background: #2a2c31; color: #e6e7eb; border: 1px solid #3a3d44; }
#guts.rr-guts-dark .ui-tabs .ui-tabs-nav { background: #2a2c31; border-bottom-color: #3a3d44; }
#guts.rr-guts-dark .ui-tabs .ui-tabs-nav li { background: #2a2c31; border-color: #3a3d44; background-image: none; }
#guts.rr-guts-dark .ui-tabs .ui-tabs-nav li a { color: #cfd3dc; }
#guts.rr-guts-dark .ui-tabs .ui-tabs-nav li.ui-tabs-active { background: #495063; border-color: #6a6f82; box-shadow: inset 0 -3px 0 #ff6b6b; }
#guts.rr-guts-dark .ui-tabs .ui-tabs-nav li.ui-tabs-active a { color: #ffffff; font-weight: 600; }
#guts.rr-guts-dark .ui-tabs .ui-tabs-nav li:hover { background: #353841; border-color: #5a5f6d; }
#guts.rr-guts-dark .ui-state-default, 
#guts.rr-guts-dark .ui-widget-content .ui-state-default, 
#guts.rr-guts-dark .ui-widget-header .ui-state-default { background: #2a2c31; color: #cfd3dc; border: 1px solid #3a3d44; background-image: none; }
#guts.rr-guts-dark .ui-state-hover, 
#guts.rr-guts-dark .ui-widget-content .ui-state-hover, 
#guts.rr-guts-dark .ui-widget-header .ui-state-hover { background: #353841; color: #ffffff; border-color: #5a5f6d; background-image: none; }
#guts.rr-guts-dark .ui-state-active, 
#guts.rr-guts-dark .ui-widget-content .ui-state-active, 
#guts.rr-guts-dark .ui-widget-header .ui-state-active { background: #495063; color: #ffffff; border-color: #6a6f82; background-image: none; }

/* Headings: improve contrast in dark mode */
#guts.rr-guts-dark h1,
#guts.rr-guts-dark h2 { color: #ff6b6b; }
#guts.rr-guts-dark h3,
#guts.rr-guts-dark h4,
#guts.rr-guts-dark h5,
#guts.rr-guts-dark h6 { color: #e6e7eb; }

/* Edit dialog theme tokens (reusable) */
.rr-edit-surface {
  background-color: #ffffff;
  color: #111111;
  border-color: currentColor;
}
.rr-edit-field {
  background-color: #f8f9fb;
  color: #111111;
  border-color: #c4c7cc;
}
.rr-dark .rr-edit-surface,
body.rr-dark .rr-edit-surface,
#guts.rr-guts-dark .rr-edit-surface {
  background-color: #1d1e22 !important;
  color: #e6e7eb !important;
  border-color: #3a3d44 !important;
}
.rr-dark .rr-edit-field,
body.rr-dark .rr-edit-field,
#guts.rr-guts-dark .rr-edit-field {
  background-color: #2a2f38 !important;
  color: #e6e7eb !important;
  border-color: #4a4f57 !important;
}
.rr-edit-dialog input,
.rr-edit-dialog select,
.rr-edit-dialog textarea {
  background: inherit;
  color: inherit;
  border: 1px solid currentColor;
}
.rr-edit-dialog label,
.rr-edit-dialog td,
.rr-edit-dialog th {
  color: inherit;
}
.rr-dark .rr-edit-dialog input,
body.rr-dark .rr-edit-dialog input,
#guts.rr-guts-dark .rr-edit-dialog input,
.rr-dark .rr-edit-dialog select,
body.rr-dark .rr-edit-dialog select,
#guts.rr-guts-dark .rr-edit-dialog select,
.rr-dark .rr-edit-dialog textarea,
body.rr-dark .rr-edit-dialog textarea,
#guts.rr-guts-dark .rr-edit-dialog textarea {
  background-color: #2a2f38 !important;
  color: #e6e7eb !important;
  border-color: #4a4f57 !important;
}

/* Backstop: mode dropdown must remain dark-friendly even if class gets dropped. */
#guts.rr-guts-dark #mode-select{
  background-color: #2a2f38 !important;
  color: #e6e7eb !important;
  border-color: #4a4f57 !important;
}
.rr-dark .rr-edit-dialog label,
body.rr-dark .rr-edit-dialog label,
#guts.rr-guts-dark .rr-edit-dialog label {
  color: #e6e7eb !important;
}

/* Login page (global) */
.rr-login-card{
  background: var(--rr-modal-bg);
  color: var(--rr-modal-text);
  border: 1px solid var(--rr-modal-border);
  border-radius: 16px;
  box-shadow: var(--rr-modal-shadow);
  padding: 22px 24px;
}
.rr-login-row{
  display: flex;
  gap: 16px;
  align-items: flex-end;
  flex-wrap: wrap;
}
.rr-login-fields{
  flex: 1 1 260px;
  min-width: 240px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.rr-login-actions{
  flex: 0 0 auto;
}
.rr-login-label{
  display: block;
}
.rr-login-label-text{
  display: none;
}
.rr-login-input-wrap{
  display: flex;
  align-items: stretch;
  border: 1px solid var(--rr-modal-surface-border);
  border-radius: 10px;
  background: var(--rr-modal-surface);
  transition: border-color .12s ease, box-shadow .12s ease;
}
.rr-login-input-wrap:focus-within{
  border-color: var(--rr-modal-accent);
  box-shadow: 0 0 0 3px rgba(59,130,246,0.25);
}
.rr-login-input-field{
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: inherit;
  padding: 10px 12px;
  font-size: 16px;
  line-height: 1.2;
}
.rr-login-input-field::placeholder{
  color: #6b7280;
}
.rr-dark .rr-login-input-field::placeholder,
body.rr-dark .rr-login-input-field::placeholder,
#guts.rr-guts-dark .rr-login-input-field::placeholder{
  color: #9aa3b2;
}
.rr-login-input-icon,
.rr-login-input-action{
  width: 40px;
  border-left: 1px solid var(--rr-modal-surface-border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: inherit;
  opacity: 0.7;
  background: transparent;
}
.rr-login-input-action{
  background: transparent;
  padding: 0;
  border: 0;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  line-height: 1;
}
.rr-dark .rr-login-input-action,
body.rr-dark .rr-login-input-action,
#guts.rr-guts-dark .rr-login-input-action{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.rr-login-input-action:hover,
.rr-login-input-action:focus{
  opacity: 1;
  color: var(--rr-modal-accent);
}
.rr-login-icon{
  width: 18px;
  height: 18px;
}
.rr-login-icon-hide{
  display: none;
}
.rr-login-input-action.is-visible .rr-login-icon-hide{
  display: inline;
}
.rr-login-input-action.is-visible .rr-login-icon-show{
  display: none;
}
.rr-btn-primary{
  height: 42px;
  min-width: 120px;
  font-size: 16px;
  padding: 0 18px;
  background: #2b6cb0;
  color: #ffffff;
  border: 2px solid #2b6cb0;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  transition: background .12s ease, border-color .12s ease;
}
.rr-btn-primary:hover{
  background: #2f76c2;
  border-color: #1f4f86;
}
.rr-btn-primary:active{
  background: #245a96;
  border-color: #1f4f86;
}
.rr-btn-secondary{
  height: 42px;
  min-width: 120px;
  font-size: 16px;
  padding: 0 18px;
  background: transparent;
  color: inherit;
  border: 2px solid var(--rr-modal-border);
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.rr-btn-secondary:hover{
  background: var(--rr-modal-surface);
  border-color: var(--rr-modal-accent);
  color: var(--rr-modal-accent);
}
.rr-btn-secondary:active{
  background: var(--rr-modal-surface);
  border-color: var(--rr-modal-accent);
}
.rr-btn-accent{
  height: 48px;
  min-width: 180px;
  padding: 0 22px;
  border: 2px solid #f68b1e;
  border-radius: 8px;
  background: #f68b1e;
  color: #ffffff;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: background .12s ease, border-color .12s ease, transform .08s ease;
}
.rr-btn-accent:hover{
  background: #e07b12;
  border-color: #c86e0e;
}
.rr-btn-accent:active{
  background: #d67410;
  border-color: #b45f0d;
  transform: translateY(1px);
}
.rr-google-create{
  display: flex;
  gap: 24px;
  align-items: flex-start;
}
.rr-google-col{
  min-width: 238px;
}
.rr-login-divider{
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 8px 0 14px;
  color: #6b7280;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.rr-login-divider--below{
  margin: 18px 0 10px;
}
.rr-login-divider::before,
.rr-login-divider::after{
  content: "";
  flex: 1;
  height: 1px;
  background: var(--rr-modal-surface-border);
}
.rr-login-rule{
  border: 0;
  border-top: 1px solid var(--rr-modal-surface-border);
  margin: 16px 0 10px;
}
.rr-login-trial-cta{
  font-size: 13px;
  line-height: 1.4;
  color: inherit;
}
.rr-login-trial-cta a{
  color: var(--rr-modal-accent);
}
.rr-login-trial-cta a:hover{
  text-decoration: underline;
}
.rr-login-links{
  text-align: center;
  margin: 6px 0 10px;
  font-size: 14px;
}
.rr-login-links a{
  color: inherit;
}
.rr-login-links a:hover{
  color: var(--rr-modal-accent);
  text-decoration: underline;
}
.rr-login-links-sep{
  display: inline-block;
  margin: 0 8px;
  color: var(--rr-modal-surface-border);
}
.rr-trial-actions{
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}
.rr-trial-btn{
  min-width: 200px;
  white-space: normal;
}
.rr-trial-spacer{
  display: block;
  width: 100%;
}
.rr-trial-spacer--field{
  height: 42px;
}
.rr-trial-spacer--actions{
  height: 22px;
}
.rr-login-logo-cell{
  padding-right: 0;
}
.rr-login-logo{
  display: inline-block;
  margin-right: -12px;
}
#login_flipper_wrap{
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: 0.3px;
}
#login_flipper{
  display: inline-flex;
  gap: 1px;
  flex-wrap: wrap;
  align-items: flex-end;
}
#login_flipper .letter{
  display: inline-block;
  position: relative;
  font-size: 28px;
  font-weight: 800;
  line-height: 1.1;
}

/* Brain stack (readability) */
.brain-stack { vertical-align: middle; }
.brain-cell { position: relative; width: 16px; height: 16px; display: inline-block; margin-right: 2px; }
.brain-dim { opacity: 0.25; filter: grayscale(100%); }
#guts.rr-guts-dark .brain-dim { opacity: 0.40; filter: grayscale(100%) brightness(1.7) contrast(1.25); }
.brain-fill { position: absolute; top: 0; left: 0; height: 16px; overflow: hidden; display: block; }
.brain-img { display: block; }
#guts.rr-guts-dark .brain-img { filter: brightness(1.45) contrast(1.2); }

/* Read column ticks */
.tick-glyph { color: #2e7d32; }
#guts.rr-guts-dark .tick-glyph { color: #8bd48b; }
.read-count { color: #2e7d32; }
#guts.rr-guts-dark .read-count { color: #cfe9cf; }

/* Message boxes (Instructions, alerts, etc.) */
.rr-msg-wrap {
  border-radius: 12px !important;
  overflow: hidden;
  border: 2px solid #b9c0cb !important;
  padding: 12px;
  background-color: #f2f4f7 !important;
  color: #111111 !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.12) !important;
  display: table !important;
  margin-bottom: 0;
}
.rr-msg {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background-color: transparent !important;
  width: 100%;
}
.rr-msg-icon-cell{
  width: 48px;
  vertical-align: top;
  padding-right: 8px;
}
.rr-msg-icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  font-size: 24px;
  line-height: 1;
}
.rr-msg td,
.rr-msg tr,
table.rr-msg td,
table.rr-msg tr {
  background-color: transparent !important;
}
#guts.rr-guts-dark .rr-msg-wrap,
body.rr-dark .rr-msg-wrap {
  background-color: #1d1e22 !important;
  color: #e6e7eb !important;
  border-color: #3a3d44 !important;
  box-shadow: 0 10px 28px rgba(2, 6, 23, 0.55) !important;
}
.rr-msg-center { margin-left: auto; margin-right: auto; }
.rr-msg-left { margin-left: 0; margin-right: 0; }
.rr-msg-close {
  display: inline-flex;
  width: 13px;
  height: 13px;
  align-items: center;
  justify-content: center;
  line-height: 1;
  font-size: 9px;
  text-align: center;
  border: 1px solid currentColor;
  background: transparent;
  color: inherit;
  text-decoration: none;
  border-radius: 3px;
  font-weight: 700;
  font-family: inherit;
}
.rr-msg-close:hover { opacity: 0.9; background: rgba(15, 23, 42, 0.08); }
body.rr-dark .rr-msg-close:hover { background: rgba(255, 255, 255, 0.12); }
#guts.rr-guts-dark .rr-msg {
  background-color: #1d1e22;
  color: #e6e7eb;
  border-color: #3a3d44;
  box-shadow: 0 10px 28px rgba(2, 6, 23, 0.55);
}
#guts.rr-guts-dark .rr-msg .alert { color: #ffd1d1; }
#guts.rr-guts-dark table.rr-msg .alert { color: #ffd1d1 !important; }
body.rr-dark .rr-msg .alert { color: #ffd1d1 !important; }
#guts.rr-guts-dark .rr-msg .alert_body { color: #e6e7eb; }
#guts.rr-guts-dark table.rr-msg .alert_body { color: #e6e7eb !important; }
body.rr-dark .rr-msg .alert_body { color: #e6e7eb !important; }

/* Chips (global) */
.chip-row{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:6px 0;overflow-x:auto;}
.chip{appearance:none;border:1px solid #d7d7d7;background:#f7f7f7;border-radius:999px;padding:6px 10px;font:inherit;cursor:pointer;white-space:nowrap;transition:background .12s ease,border-color .12s ease,color .12s ease;}
.chip:hover{background:#eee;}
/* Generic selected fallback */
.chip.is-selected{background:#e0f0ff;color:#0f2e5d;border:2px solid #3a8dff;font-weight:600;}
.chip.is-selected:hover{background:#d9ecff;}
/* Dark mode (guts-only) base and selected flips */
#guts.rr-guts-dark .chip{border-color:#4a4f57;background:#2b2f36;color:#ffffff;}
#guts.rr-guts-dark .chip:hover{background:#343a42;}
#guts.rr-guts-dark .chip.is-selected{background:#f7f7f7;color:#0f2e5d;border:2px solid #3a8dff;}
#guts.rr-guts-light .chip.is-selected{background:#2b2f36;color:#ffffff;border:2px solid #3a8dff;}

/* Suggested reading modal (global) */
.suggest-overlay{
  position:fixed;
  inset:0;
  z-index:9998;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(17,24,39,0.45);
}
.suggest-card{
  position:relative;
  display:inline-block;
  max-width:720px;
  padding:12px 14px;
  margin:0;
  border:1px solid #d8dce3;
  border-radius:10px;
  background:#f8f9fc;
  color:#1a1d27;
  font-family:"Segoe UI",Arial,sans-serif;
  box-shadow:0 14px 30px rgba(0,0,0,0.24);
  text-align:left;
}
.suggest-card h3{
  margin:0 0 6px 0;
  font-size:16px;
  font-weight:700;
  padding-right:28px;
}
.suggest-close{
  position:absolute;
  top:8px;
  right:8px;
  border:1px solid #cbd5e1;
  border-radius:999px;
  width:24px;
  height:24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  background:#ffffff;
  color:#475569;
  font-size:14px;
  line-height:1;
}
.suggest-close:hover{
  background:#e5e7eb;
  border-color:#94a3b8;
  color:#1f2937;
}
.suggest-card .meta{
  font-size:14px;
  line-height:1.5;
}
.suggest-card .actions{
  margin-top:10px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-start;
}
.suggest-btn-primary{
  min-height:38px;
  line-height:1.25;
  padding:8px 16px;
  border-radius:6px;
  background:#2b6cb0;
  color:#fff;
  border:1px solid #2b6cb0;
  cursor:pointer;
  white-space:nowrap;
  min-width:140px;
}
.suggest-btn-primary:hover{
  background:#245ea0;
  border-color:#245ea0;
  box-shadow:0 0 0 2px rgba(43,108,176,0.2);
}
.suggest-btn-primary:active{
  background:#1f518b;
  border-color:#1f518b;
  box-shadow:0 0 0 2px rgba(43,108,176,0.3);
}
.suggest-btn-secondary{
  min-height:38px;
  line-height:1.25;
  padding:8px 18px;
  border-radius:6px;
  background:#ffffff;
  color:#2b6cb0;
  border:1px solid #2b6cb0;
  cursor:pointer;
  white-space:nowrap;
  min-width:140px;
}
.suggest-btn-secondary:hover{
  background:#eaf2ff;
  border-color:#245ea0;
  color:#1f4f8b;
  box-shadow:0 0 0 2px rgba(36,94,160,0.18);
}
.suggest-btn-secondary:active{
  background:#dbe7ff;
  border-color:#1f4f8b;
  color:#1f4f8b;
  box-shadow:0 0 0 2px rgba(36,94,160,0.28);
}
.rr-dark .suggest-overlay{
  background:rgba(0,0,0,0.6);
}
.rr-dark .suggest-card,
.suggest-card.rr-dark{
  border-color:#334155;
  background:#0f172a;
  color:#e6e7eb;
  box-shadow:0 14px 30px rgba(0,0,0,0.45);
}
.rr-dark .suggest-close,
.suggest-card.rr-dark .suggest-close{
  background:#111827;
  color:#cbd5e1;
  border-color:#1f2937;
}
.rr-dark .suggest-close:hover,
.suggest-card.rr-dark .suggest-close:hover{
  background:#1f2937;
  color:#e6e7eb;
  border-color:#334155;
}
.rr-dark .suggest-card .meta strong,
.suggest-card.rr-dark .meta strong{
  color:#e6e7eb;
}
.rr-dark .suggest-btn-primary,
.suggest-card.rr-dark .suggest-btn-primary{
  background:#2b6cb0;
  color:#e6e7eb;
  border-color:#2b6cb0;
}
.rr-dark .suggest-btn-primary:hover,
.suggest-card.rr-dark .suggest-btn-primary:hover{
  background:#2f74c2;
  border-color:#2f74c2;
  box-shadow:0 0 0 2px rgba(96,165,250,0.25);
}
.rr-dark .suggest-btn-primary:active,
.suggest-card.rr-dark .suggest-btn-primary:active{
  background:#275fa3;
  border-color:#275fa3;
  box-shadow:0 0 0 2px rgba(96,165,250,0.35);
}
.rr-dark .suggest-btn-secondary,
.suggest-card.rr-dark .suggest-btn-secondary{
  background:#0b1220;
  color:#7fb4ff;
  border:1px solid #60a5fa;
}
.rr-dark .suggest-btn-secondary:hover,
.suggest-card.rr-dark .suggest-btn-secondary:hover{
  background:#101a2b;
  color:#cfe4ff;
  border-color:#8ab4ff;
  box-shadow:0 0 0 2px rgba(138,180,255,0.22);
}
.rr-dark .suggest-btn-secondary:active,
.suggest-card.rr-dark .suggest-btn-secondary:active{
  background:#0a1324;
  color:#cfe4ff;
  border-color:#7aa6ff;
  box-shadow:0 0 0 2px rgba(138,180,255,0.32);
}
.rr-edit-dialog label,
.rr-edit-dialog td,
.rr-edit-dialog th {
  color: inherit;
}
.rr-dark .rr-edit-dialog label,
.rr-dark .rr-edit-dialog td,
.rr-dark .rr-edit-dialog th,
body.rr-dark .rr-edit-dialog label,
body.rr-dark .rr-edit-dialog td,
body.rr-dark .rr-edit-dialog th,
#guts.rr-guts-dark .rr-edit-dialog label,
#guts.rr-guts-dark .rr-edit-dialog td,
#guts.rr-guts-dark .rr-edit-dialog th {
  color: #e6e7eb !important;
}

.rr-voice {
  text-decoration: underline dotted rgba(58, 141, 255, 0.55);
  text-underline-offset: 2px;
  cursor: pointer;
}
.rr-voice:hover,
.rr-voice:focus {
  background: rgba(58, 141, 255, 0.12);
  border-radius: 3px;
}
#guts.rr-guts-dark .rr-voice {
  text-decoration-color: rgba(123, 183, 255, 0.7);
}
#guts.rr-guts-dark .rr-voice:hover,
#guts.rr-guts-dark .rr-voice:focus {
  background: rgba(123, 183, 255, 0.2);
}

/* Reader overlay (full reading modal) */
.rr-reader-open{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  border-radius: 8px;
  border: 1px solid var(--rr-modal-surface-border);
  background: var(--rr-modal-surface);
  color: inherit;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.rr-reader-open:hover,
.rr-reader-open:focus{
  border-color: var(--rr-modal-accent);
  box-shadow: 0 0 0 2px rgba(59,130,246,0.15);
}
.rr-reader-overlay{
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: var(--rr-modal-backdrop);
  z-index: 90;
}
.rr-reader-modal{
  background: var(--rr-modal-bg);
  color: var(--rr-modal-text);
  border-radius: 12px;
  box-shadow: var(--rr-modal-shadow);
  border: 1px solid var(--rr-modal-border);
  width: min(900px, calc(100% - 32px));
  max-height: calc(100% - 32px);
  padding: 16px 18px;
  box-sizing: border-box;
  font-family: "Segoe UI", Arial, sans-serif;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.rr-reader-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.rr-reader-title{
  font-size: 18px;
  font-weight: 700;
}
.rr-reader-close{
  min-width: 32px;
  height: 32px;
  border-radius: 8px;
  border: 1px solid var(--rr-modal-surface-border);
  background: var(--rr-modal-surface);
  color: inherit;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
}
.rr-reader-controls{
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  font-weight: 600;
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid var(--rr-modal-border);
  background: rgba(0,0,0,0.04);
  box-shadow: inset 0 1px 0 rgba(0,0,0,0.06);
  width: max-content;
  max-width: 100%;
}
.rr-dark .rr-reader-controls,
#guts.rr-guts-dark .rr-reader-controls{
  background: rgba(255,255,255,0.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
}
.rr-reader-controls-inline{
  margin-left: auto;
  display: inline-flex;
  width: max-content;
  flex: 0 0 auto;
}
.rr-reader-controls label{
  font-size: 12px;
  font-weight: 700;
}
.rr-reader-controls select,
.rr-reader-controls input[type=range]{
  height: 26px;
}
.rr-reader-body{
  border: 1px solid var(--rr-modal-surface-border);
  background: var(--rr-modal-surface);
  border-radius: 10px;
  padding: 12px 14px;
  max-height: 65vh;
  overflow: auto;
  scroll-behavior: smooth;
  font-family: var(--rr-reader-font, "Georgia, 'Times New Roman', serif") !important;
  font-size: var(--rr-reader-size, 18px) !important;
  line-height: var(--rr-reader-line, 1.6) !important;
}
.rr-reader-body,
.rr-reader-body *{
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}
@media (max-width: 860px){
  .rr-reader-header{
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .rr-reader-controls-inline{
    width: 100%;
    order: 3;
  }
}

/* Options/Lesson popups: Color Scheme + Language + US/UK (global, no JS-injected <style>) */
:root{
  --rr-modal-backdrop: rgba(0,0,0,0.45);
  --rr-modal-bg: #f7f3ec;
  --rr-modal-text: #0f172a;
  --rr-modal-border: #d8cfc1;
  --rr-modal-shadow: 0 18px 50px rgba(0,0,0,0.25);
  --rr-modal-surface: #f2ede5;
  --rr-modal-surface-border: #d8cfc1;
  --rr-modal-accent: #3b82f6;
  --rr-modal-success: #22c55e;
  --rr-modal-glyph-bg: #e2e8f0;
  --rr-modal-glyph-text: #0f172a;
  --rr-modal-glyph-border: #cbd5e1;
  --rr-table-scroll-track: var(--rr-modal-surface);
  --rr-table-scroll-thumb: var(--rr-modal-border);
  --rr-table-scroll-thumb-hover: var(--rr-modal-text);
}
.rr-dark{
  --rr-modal-backdrop: rgba(0,0,0,0.60);
  --rr-modal-bg: #0f172a;
  --rr-modal-text: #e5e7eb;
  --rr-modal-border: #334155;
  --rr-modal-shadow: 0 18px 50px rgba(0,0,0,0.45);
  --rr-modal-surface: #111827;
  --rr-modal-surface-border: #1f2937;
  --rr-modal-glyph-bg: #1f2937;
  --rr-modal-glyph-text: #e5e7eb;
  --rr-modal-glyph-border: #334155;
}

/* Guts-only dark mode should get the same modal tokens (Speed Options lives inside #guts). */
#guts.rr-guts-dark{
  --rr-modal-backdrop: rgba(0,0,0,0.60);
  --rr-modal-bg: #0f172a;
  --rr-modal-text: #e5e7eb;
  --rr-modal-border: #334155;
  --rr-modal-shadow: 0 18px 50px rgba(0,0,0,0.45);
  --rr-modal-surface: #111827;
  --rr-modal-surface-border: #1f2937;
  --rr-modal-glyph-bg: #1f2937;
  --rr-modal-glyph-text: #e5e7eb;
  --rr-modal-glyph-border: #334155;
}

table{
  scrollbar-color: var(--rr-table-scroll-thumb) var(--rr-table-scroll-track);
  scrollbar-width: thin;
}
table::-webkit-scrollbar{
  height: 10px;
  width: 10px;
}
table::-webkit-scrollbar-track{
  background: var(--rr-table-scroll-track);
}
table::-webkit-scrollbar-thumb{
  background-color: var(--rr-table-scroll-thumb);
  border: 2px solid var(--rr-table-scroll-track);
}
table::-webkit-scrollbar-thumb:hover{
  background-color: var(--rr-table-scroll-thumb-hover);
}
table::-webkit-scrollbar-corner{
  background: var(--rr-table-scroll-track);
}

.rr-scheme-backdrop{
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--rr-modal-backdrop);
  z-index: 80;
}

#rr-scheme-overlay .scheme-modal,
#rr-lang-overlay .scheme-modal,
#rr-usuk-overlay .scheme-modal,
#rr-password-overlay .scheme-modal{
  background: var(--rr-modal-bg);
  color: var(--rr-modal-text);
  border-radius: 12px;
  box-shadow: var(--rr-modal-shadow);
  min-width: 320px;
  max-width: 680px;
  padding: 18px;
  font-family: "Segoe UI", Arial, sans-serif;
  border: 1px solid var(--rr-modal-border);
}

.rr-pw-meter-row{
  display: flex;
  align-items: center;
  gap: 8px;
}
.rr-pw-meter{
  width: 160px;
  height: 10px;
}
.rr-pw-strength{
  font-size: 13px;
  font-weight: 600;
}

/* Speed Options modal (global styles; layout only, colors come from tokens/classes). */
#spe_opts_modal{ z-index: 9999; }
#spe_opts_modal .spe-opts-modal{
  background: var(--rr-modal-bg);
  color: var(--rr-modal-text);
  border-radius: 12px;
  box-shadow: var(--rr-modal-shadow);
  border: 1px solid var(--rr-modal-border);
  max-width: 520px;
  width: calc(100% - 24px);
  padding: 18px;
  box-sizing: border-box;
  overflow: hidden;
  font-family: "Segoe UI", Arial, sans-serif;
}
#spe_opts_modal .spe-opts-title{
  margin: 0 0 12px 0;
  font-size: 18px;
  font-weight: 700;
  color: inherit;
}

/* Flash Options modal (global styles; layout only, colors come from tokens/classes). */
#flash_opts_modal{ z-index: 9999; }
#flash_opts_modal .flash-opts-modal{
  background: var(--rr-modal-bg);
  color: var(--rr-modal-text);
  border-radius: 12px;
  box-shadow: var(--rr-modal-shadow);
  border: 1px solid var(--rr-modal-border);
  max-width: 520px;
  width: calc(100% - 24px);
  padding: 18px;
  box-sizing: border-box;
  overflow: hidden;
  font-family: "Segoe UI", Arial, sans-serif;
}
#flash_opts_modal .flash-opts-title{
  margin: 0 0 12px 0;
  font-size: 18px;
  font-weight: 700;
  color: inherit;
}
#flash_opts_modal .flash-opts-speed-title{
  font-size: 14px;
  font-weight: 600;
  margin: 0 0 8px 0;
}
#flash_opts_modal .flash-speed-option{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--rr-modal-surface-border);
  border-radius: 8px;
  background: var(--rr-modal-surface);
  color: inherit;
  cursor: pointer;
  transition: border-color .12s ease, box-shadow .12s ease;
}
#flash_opts_modal .flash-speed-option:hover{
  border-color: var(--rr-modal-accent);
  box-shadow: 0 0 0 2px rgba(59,130,246,0.15);
}
#flash_opts_modal .flash-speed-option.is-selected{
  border-color: var(--rr-modal-success);
  box-shadow: 0 0 0 2px rgba(34,197,94,0.18);
}
#flash_opts_modal .flash-speed-option input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
#flash_opts_modal .flash-opts-preview{
  margin-top: 12px;
  border: 1px solid var(--rr-modal-surface-border);
  border-radius: 10px;
  background: var(--rr-modal-surface);
  padding: 12px;
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#flash_opts_modal .flash-opts-actions{
  margin-top: 12px;
  display: flex;
  justify-content: flex-end;
}

/* My Documents (global, no injected CSS) */
.doc-panel{
  max-width: 840px;
  margin: 0;
  padding: 8px 0;
  font-family: "Segoe UI", Arial, sans-serif;
  color: inherit;
  background: transparent;
}
.doc-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}
.doc-upload{
  background: var(--rr-modal-surface);
  border: 1px solid var(--rr-modal-surface-border);
  border-radius: 12px;
  padding: 14px;
  margin-top: 12px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.05);
  color: inherit;
}
.rr-dark .doc-upload,
body.rr-dark .doc-upload,
#guts.rr-guts-dark .doc-upload{ box-shadow: none; }
.doc-upload h2{ margin: 0; font-size: 20px; }
.doc-upload p{ margin: 2px 0; font-size: 13px; color: inherit; opacity: 0.85; }
.doc-upload .file-row{
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 10px;
}
.doc-upload .file-row input[type=file]{ display: none; }
.doc-upload .file-row label{
  padding: 10px 14px;
  border: 1px dashed var(--rr-modal-border);
  border-radius: 10px;
  cursor: pointer;
  background: var(--rr-modal-bg);
  color: inherit;
  transition: border-color .12s ease, background .12s ease;
}
.doc-upload .file-row label:hover{
  border-color: var(--rr-modal-accent);
  background: rgba(59,130,246,0.10);
}
.doc-upload .file-name{
  font-size: 13px;
  color: inherit;
  opacity: 0.85;
  min-width: 120px;
}
.doc-upload .actions{
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: 8px;
  flex-wrap: wrap;
}
.doc-upload .hint{
  font-size: 12px;
  color: inherit;
  opacity: 0.75;
  margin-top: 4px;
}
.doc-desc-input{ min-width: 180px; }

.doc-list{
  background: var(--rr-modal-bg);
  border: 1px solid var(--rr-modal-border);
  border-radius: 12px;
  padding: 10px;
  color: inherit;
}
.doc-row{
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px;
  border-bottom: 1px solid var(--rr-modal-surface-border);
}
.doc-row:last-child{ border-bottom: none; }
.doc-title{ font-weight: 600; flex: 1; min-width: 200px; }
.doc-desc{ font-size: 12px; color: inherit; opacity: 0.75; flex: 1; min-width: 140px; }
.doc-meta{ font-size: 12px; color: inherit; opacity: 0.75; min-width: 80px; }
.doc-actions{ display: flex; gap: 8px; justify-content: flex-end; }

.doc-edit-overlay{ z-index: 9999; }
.doc-edit-panel{
  max-width: 760px;
  width: calc(100% - 24px);
  background: var(--rr-modal-bg);
  color: var(--rr-modal-text);
  border-radius: 14px;
  border: 1px solid var(--rr-modal-border);
  box-shadow: var(--rr-modal-shadow);
  padding: 18px;
  font-family: "Segoe UI", Arial, sans-serif;
  box-sizing: border-box;
}
.doc-edit-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.doc-edit-title{ font-size: 18px; font-weight: 700; color: inherit; }
.doc-edit-body textarea{
  width: 100%;
  min-height: 360px;
  font-size: 14px;
  font-family: "Segoe UI", monospace;
  box-sizing: border-box;
}
.doc-edit-actions{
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 10px;
}
#rr-scheme-overlay .scheme-modal h3,
#rr-lang-overlay .scheme-modal h3,
#rr-usuk-overlay .scheme-modal h3{
  margin: 0 0 12px;
  font-size: 18px;
  color: inherit;
}
#rr-usuk-overlay .scheme-subtitle{
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.35;
  opacity: 0.9;
}

/* Grid layouts */
#rr-scheme-overlay .scheme-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  margin-top: 8px;
}
#rr-lang-overlay .scheme-grid,
#rr-usuk-overlay .scheme-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 10px;
  margin-top: 8px;
}
@media (max-width: 420px){
  #rr-lang-overlay .scheme-grid,
  #rr-usuk-overlay .scheme-grid{
    grid-template-columns: 1fr;
  }
}

/* Scheme (color) options */
#rr-scheme-overlay .scheme-option{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--rr-modal-surface-border);
  border-radius: 8px;
  background: var(--rr-modal-surface);
  cursor: pointer;
  transition: border-color .12s ease, box-shadow .12s ease;
}
#rr-scheme-overlay .scheme-option:hover{
  border-color: var(--rr-modal-accent);
  box-shadow: 0 0 0 2px rgba(59,130,246,0.15);
}
#rr-scheme-overlay .scheme-option input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
#rr-scheme-overlay .scheme-swatch{
  width: 28px;
  height: 28px;
  border-radius: 6px;
  border: 1px solid rgba(0,0,0,0.08);
}
#rr-scheme-overlay .scheme-label{
  font-size: 14px;
  font-weight: 600;
  color: inherit;
}
#rr-scheme-overlay .scheme-preview{
  margin-top: 14px;
  padding: 12px;
  border: 1px solid var(--rr-modal-surface-border);
  border-radius: 10px;
  background: var(--rr-modal-surface);
}
#rr-scheme-overlay .scheme-preview-card{ border-radius: 8px; padding: 12px; }
#rr-scheme-overlay .scheme-preview-badge{
  display: inline-block;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}
#rr-scheme-overlay .scheme-preview-title{ font-size: 16px; font-weight: 700; margin: 8px 0 4px 0; }
#rr-scheme-overlay .scheme-preview-body{ font-size: 14px; line-height: 1.4; }

/* Language + US/UK options */
#rr-lang-overlay .lang-option,
#rr-usuk-overlay .lang-option{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--rr-modal-surface-border);
  border-radius: 8px;
  background: var(--rr-modal-surface);
  color: inherit;
  cursor: pointer;
  transition: border-color .12s ease, box-shadow .12s ease;
  width: 100%;
  text-align: left;
}
#rr-lang-overlay .lang-option:hover,
#rr-usuk-overlay .lang-option:hover{
  border-color: var(--rr-modal-accent);
  box-shadow: 0 0 0 2px rgba(59,130,246,0.15);
}
#rr-lang-overlay .lang-option.is-selected,
#rr-usuk-overlay .lang-option.is-selected{
  border-color: var(--rr-modal-success);
  box-shadow: 0 0 0 2px rgba(34,197,94,0.18);
}
#rr-lang-overlay .scheme-label,
#rr-usuk-overlay .scheme-label{
  font-size: 14px;
  font-weight: 600;
  color: inherit;
}
#rr-lang-overlay .lang-glyph,
#rr-usuk-overlay .lang-glyph{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 24px;
  padding: 0 6px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 700;
  background: var(--rr-modal-glyph-bg);
  color: var(--rr-modal-glyph-text);
  border: 1px solid var(--rr-modal-glyph-border);
}

/* Actions */
#rr-scheme-overlay .scheme-actions,
#rr-lang-overlay .scheme-actions,
#rr-usuk-overlay .scheme-actions{
  margin-top: 14px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
#rr-scheme-overlay .scheme-actions button,
#rr-lang-overlay .scheme-actions button,
#rr-usuk-overlay .scheme-actions button{
  padding: 8px 14px;
  border-radius: 8px;
  border: 1px solid var(--rr-modal-accent);
  background: var(--rr-modal-accent);
  color: #fff;
  cursor: pointer;
  font-size: 14px;
}

/* Bottom-left actions (Options/Logout): glyph-only, highlight on hover/tap */
.rr-bottom-action { cursor: pointer; }
.rr-bottom-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  transition: color 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
}
.rr-bottom-action:hover .rr-bottom-icon,
.rr-bottom-action:active .rr-bottom-icon,
.rr-bottom-action:focus .rr-bottom-icon {
  background-color: rgba(59,130,246,0.12);
  box-shadow: 0 0 0 2px rgba(59,130,246,0.18), 0 0 14px rgba(59,130,246,0.35);
  filter: drop-shadow(0 0 8px rgba(59,130,246,0.55));
}
body.rr-dark .rr-bottom-action:hover .rr-bottom-icon,
body.rr-dark .rr-bottom-action:active .rr-bottom-icon,
body.rr-dark .rr-bottom-action:focus .rr-bottom-icon,
#guts.rr-guts-dark .rr-bottom-action:hover .rr-bottom-icon,
#guts.rr-guts-dark .rr-bottom-action:active .rr-bottom-icon,
#guts.rr-guts-dark .rr-bottom-action:focus .rr-bottom-icon {
  background-color: rgba(96,165,250,0.18);
  box-shadow: 0 0 0 2px rgba(96,165,250,0.28), 0 0 16px rgba(96,165,250,0.42);
  filter: drop-shadow(0 0 10px rgba(96,165,250,0.65));
}
.rr-sparkline {
	max-width: 720px;
	width: 100%;
	overflow-x: hidden;
	--rr-sparkline-bg: #f7f7f7;
	--rr-sparkline-border: #cfcfcf;
	--rr-sparkline-axis: #e0e0e0;
	--rr-sparkline-line: #909090;
	--rr-sparkline-text: #666666;
	--rr-sparkline-hard: #d97a1f;
	--rr-sparkline-basic: #e5c24b;
	--rr-sparkline-web: #3a7fb0;
	--rr-sparkline-custom: #2b9b4b;
	--rr-sparkline-other: #666666;
	--rr-sparkline-flash: #7c4d1f;
	--rr-sparkline-point-hover: #222222;
	--rr-sparkline-comp-low: #c5312a;
	--rr-sparkline-comp-midlow: #e07c2c;
	--rr-sparkline-comp-mid: #2a6fd4;
	--rr-sparkline-comp-high: #2e9d52;
}
.rr-sparkline.rr-sparkline--wide{
	overflow-x: auto;
}

.rr-sparkline__svg {
	display: block;
	width: 100%;
	height: 120px;
	background: var(--rr-sparkline-bg);
	border: 1px solid var(--rr-sparkline-border);
	border-radius: 8px;
}

.rr-sparkline__svg--wide {
	width: auto;
	min-width: 100%;
}

.rr-sparkline__point {
	cursor: pointer;
	transition: fill 120ms ease, transform 120ms ease;
	transform-box: fill-box;
	transform-origin: center;
}

.rr-sparkline__point:hover {
	fill: var(--rr-sparkline-point-hover);
	transform: scale(1.35);
}

.rr-sparkline__range {
	font-size: 12px;
	color: var(--rr-sparkline-text);
	margin: 2px 0 12px 0;
}
.rr-comp-cta-wrap{
	margin: 10px auto 0 auto;
	display: flex;
	justify-content: center;
}
.rr-comp-actions{
	margin-top: 12px;
}
.rr-comp-cta{
	background: #2563eb;
	color: #ffffff;
	border: 1px solid #1d4ed8;
	border-radius: 8px;
	padding: 8px 16px;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 6px 16px rgba(37, 99, 235, 0.28);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.rr-comp-cta:hover{
	transform: translateY(-1px);
	box-shadow: 0 10px 20px rgba(37, 99, 235, 0.35);
}
.rr-comp-cta--pulse{
	animation: rr-comp-pulse 1.6s ease-in-out infinite;
}
.rr-comp-ghost{
	background: transparent;
	color: #1f2937;
	border: 1px solid #94a3b8;
	border-radius: 8px;
	padding: 8px 16px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}
.rr-comp-panel{
	margin-top: 14px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
}
.rr-comp-panel--left{
	justify-content: flex-start;
}
.rr-comp-panel.is-hidden{
	display: none;
}
@keyframes rr-comp-pulse{
	0% { box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.35); }
	70% { box-shadow: 0 0 0 12px rgba(37, 99, 235, 0); }
	100% { box-shadow: 0 0 0 0 rgba(37, 99, 235, 0); }
}

@media (prefers-color-scheme: dark) {
	.rr-sparkline {
		--rr-sparkline-bg: #1b1b1b;
		--rr-sparkline-border: #3a3a3a;
		--rr-sparkline-axis: #2a2a2a;
		--rr-sparkline-line: #6b6b6b;
		--rr-sparkline-text: #b0b0b0;
		--rr-sparkline-hard: #f2a24d;
		--rr-sparkline-basic: #f3d366;
		--rr-sparkline-web: #5aa6d6;
		--rr-sparkline-custom: #4dc36d;
		--rr-sparkline-other: #b0b0b0;
		--rr-sparkline-flash: #d38b3d;
		--rr-sparkline-point-hover: #ffffff;
		--rr-sparkline-comp-low: #f06a63;
		--rr-sparkline-comp-midlow: #f2a85b;
		--rr-sparkline-comp-mid: #6aa6ff;
		--rr-sparkline-comp-high: #6ee18a;
	}
	body.rr-dark .rr-comp-cta{
		background: #3b82f6;
		border-color: #1d4ed8;
		color: #f8fafc;
		box-shadow: 0 6px 16px rgba(59, 130, 246, 0.25);
	}
	body.rr-dark .rr-comp-cta:hover{
		box-shadow: 0 10px 20px rgba(59, 130, 246, 0.35);
	}
	body.rr-dark .rr-comp-ghost{
		color: #e5e7eb;
		border-color: #64748b;
	}
	@keyframes rr-comp-pulse{
		0% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.35); }
		70% { box-shadow: 0 0 0 12px rgba(59, 130, 246, 0); }
		100% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0); }
	}
}
