
/* v71 clean relayout */
:root{
  --v71-bg-1:#050b12;
  --v71-bg-2:#081726;
  --v71-panel:rgba(10,20,31,.86);
  --v71-panel-2:rgba(14,28,42,.9);
  --v71-line:rgba(255,255,255,.08);
  --v71-soft:rgba(255,255,255,.04);
  --v71-soft-2:rgba(255,255,255,.06);
  --v71-text:#eef8ff;
  --v71-muted:#9eb4c4;
  --v71-accent:#33daff;
  --v71-shadow:0 22px 54px rgba(0,0,0,.28);
  --v71-radius:26px;
  --v71-gap:18px;
}
html{color-scheme:dark;}
body{
  background:
    radial-gradient(circle at top right, rgba(31,135,196,.28), transparent 28%),
    radial-gradient(circle at bottom left, rgba(29,212,255,.16), transparent 22%),
    linear-gradient(180deg, #07101a 0%, #04080d 100%);
}

/* top bars */
.fp-topnav,
.dash-topbar{
  position:sticky;
  top:14px;
  z-index:90;
  backdrop-filter: blur(20px);
  background:linear-gradient(180deg, rgba(8,20,32,.92), rgba(5,12,20,.9));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 18px 40px rgba(0,0,0,.24);
  border-radius:24px;
}
.has-topnav .fp-topnav{width:min(1840px, calc(100% - 32px)); margin:14px auto 18px; padding:10px 14px;}
.dashboard-page .dash-topbar{margin-bottom:20px;}
.fp-navlinks,.dash-nav{gap:8px; flex-wrap:wrap;}
.fp-navlinks a,.dash-nav a{
  padding:10px 14px;
  border-radius:14px;
  transition:.18s ease;
}
.fp-navlinks a.active,.dash-nav a.active{
  background:rgba(51,218,255,.18);
  color:#fff;
  box-shadow:inset 0 0 0 1px rgba(51,218,255,.24);
}
.topbar-actions,.dash-actions{gap:10px;}
.topbar-btn,.dash-chip{
  min-height:42px;
  border-radius:999px;
  padding:0 16px;
  white-space:nowrap;
}

/* dashboard */
.dashboard-shell{max-width:1840px; margin:0 auto; padding:16px 16px 40px;}
.dash-hero{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(360px,.8fr);
  gap:18px;
  padding:24px 26px;
  margin-bottom:22px;
  background:linear-gradient(180deg, rgba(13,28,42,.92), rgba(8,18,29,.88));
  border:1px solid rgba(255,255,255,.08);
  border-radius:28px;
  box-shadow:var(--v71-shadow);
}
.template-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
  gap:22px;
}
.template-card{
  overflow:hidden;
  border-radius:28px;
  background:linear-gradient(180deg, rgba(13,28,42,.92), rgba(8,18,29,.88));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:var(--v71-shadow);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.template-card:hover{transform:translateY(-3px); border-color:rgba(51,218,255,.22); box-shadow:0 28px 60px rgba(0,0,0,.3);}
.template-thumb{background:#08131d;}
.template-thumb img{display:block; width:100%; aspect-ratio:4/5; object-fit:cover;}
.template-content{padding:18px 20px 20px;}
.open-template{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 16px;
  border-radius:14px;
  background:linear-gradient(135deg, #41e2ff, #d9fcff);
  color:#03111d;
  font-weight:900;
  text-decoration:none;
}

/* shared workspace */
.app-shell{
  min-height:auto;
  width:min(1840px, calc(100% - 32px));
  margin:0 auto 26px;
  padding:0;
  gap:var(--v71-gap);
  align-items:start;
}
.has-topnav .template-switcher{display:none !important;}
.fulltime-page .app-shell{grid-template-columns:clamp(410px, 26vw, 520px) minmax(780px, 1fr) clamp(410px, 26vw, 520px);}
.standings-page .app-shell{grid-template-columns:clamp(410px, 26vw, 520px) minmax(780px, 1fr) clamp(410px, 26vw, 520px);}
.ptw-page .app-shell{grid-template-columns:clamp(390px, 24vw, 470px) minmax(780px, 1fr) clamp(390px, 24vw, 470px);}
.daily-recap-page .app-shell{grid-template-columns:clamp(430px, 27vw, 560px) minmax(780px, 1fr) clamp(430px, 27vw, 560px);}
.moment-page .app-shell,
.quotes-page .app-shell{grid-template-columns:clamp(390px, 24vw, 470px) minmax(780px, 1fr) clamp(390px, 24vw, 470px);}

.sidebar{
  position:sticky;
  top:98px;
  max-height:calc(100vh - 112px);
  overflow:auto;
  padding:0 6px 6px 0;
  border-right:none;
  background:transparent;
  backdrop-filter:none;
  scrollbar-width:thin;
  scrollbar-color:rgba(86,130,159,.65) transparent;
}
.sidebar::-webkit-scrollbar{width:10px;height:10px;}
.sidebar::-webkit-scrollbar-thumb{background:rgba(86,130,159,.65); border-radius:999px;}
.sidebar::-webkit-scrollbar-track{background:transparent;}

.sidebar > .brand-card,
.sidebar > .panel,
.sidebar > .rows-horizontal-panel,
.sidebar > .v68-toolbox,
.sidebar > .v68-espn-panel,
.moment-sidebar > .tool-panel,
.quotes-sidebar > .panel{
  margin-bottom:14px;
  border:1px solid var(--v71-line);
  border-radius:24px;
  background:linear-gradient(180deg, rgba(13,28,42,.96), rgba(8,18,29,.9));
  box-shadow:var(--v71-shadow);
}
.sidebar > .brand-card{padding:18px 18px 16px;}
.brand-card h1{font-size:34px; letter-spacing:-.035em;}
.brand-card .subcopy{font-size:13px; line-height:1.55; color:var(--v71-muted);}
.eyebrow{letter-spacing:.18em; font-size:11px;}

.panel{
  border-radius:24px;
  border-color:var(--v71-line);
  background:linear-gradient(180deg, rgba(13,28,42,.96), rgba(8,18,29,.9));
  box-shadow:var(--v71-shadow);
}
.panel-head{gap:10px; margin-bottom:14px;}
.panel h2{font-size:19px; letter-spacing:-.02em;}
.pill{
  border-radius:999px;
  padding:6px 10px;
  font-size:10.5px;
  letter-spacing:.08em;
}

/* cleaner tools */
button,
input,
select,
textarea{font:inherit;}
button:not(.v68-tool-arrow):not(.tool-arrow):not(.tool-tab):not(.v68-tool-tab){
  min-height:42px;
  padding:10px 14px;
  border-radius:14px;
  white-space:normal;
  line-height:1.2;
}
.secondary-btn,
.ghost-btn,
.small-btn,
.button-row button,
.field button{
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.045);
  color:var(--v71-text);
}
input[type="text"], input[type="number"], input[type="url"], input[type="date"], select, textarea, input[type="file"]{
  min-height:46px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(4,10,16,.72);
}
.field, .compact-field{gap:7px;}
.field span, .subsection-title, .range-head span{font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--v71-muted);}
.grid{gap:12px;}
.compact-control-list, .mini-control-grid, .controls-section{gap:12px;}

/* tool tabs */
.v68-toolbox{padding-bottom:10px;}
.v68-slider-head,
.tool-slider-head{display:grid; grid-template-columns:34px minmax(0,1fr) 34px; gap:8px; align-items:center; margin-bottom:10px;}
.v68-tool-tabs, .tool-tabs{
  display:flex;
  gap:8px;
  overflow:auto;
  scrollbar-width:none;
  padding-bottom:2px;
}
.v68-tool-tabs::-webkit-scrollbar,.tool-tabs::-webkit-scrollbar{display:none;}
.v68-tool-tab, .tool-tab,
.v68-tool-arrow, .tool-arrow{
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.05);
  color:var(--v71-text);
}
.v68-tool-tab, .tool-tab{
  flex:0 0 auto;
  white-space:nowrap;
  min-width:max-content;
  padding:10px 15px;
  border-radius:14px;
  font-size:12px;
  font-weight:800;
}
.v68-tool-arrow, .tool-arrow{
  display:grid; place-items:center; width:34px; height:34px; padding:0; border-radius:12px;
}
.v68-tool-tab.is-active, .tool-tab.is-active{background:rgba(51,218,255,.18); border-color:rgba(51,218,255,.22);}
.v68-tool-page{padding-right:6px;}

/* main stage */
.main-stage{
  min-width:0;
  min-height:calc(100vh - 112px);
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(12,26,40,.94), rgba(7,14,22,.92));
  border-radius:30px;
  box-shadow:var(--v71-shadow);
  padding:18px;
}
.preview-header{display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:16px; padding:4px 6px 0;}
.preview-label{margin:0 0 4px; color:var(--v71-accent); text-transform:uppercase; font-weight:900; letter-spacing:.14em; font-size:12px;}
.preview-header h2{margin:0; font-size:34px; letter-spacing:-.03em;}
.status-dot{display:inline-flex; align-items:center; gap:8px; min-height:38px; padding:0 14px; border-radius:999px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.04); color:var(--v71-muted); font-weight:800;}
.status-dot span{width:10px; height:10px; border-radius:50%; background:#33daff; box-shadow:0 0 0 5px rgba(51,218,255,.12);}
.canvas-stage{
  display:grid; place-items:center;
  min-height:calc(100vh - 240px);
  border-radius:26px;
  border:1px solid rgba(255,255,255,.06);
  background:radial-gradient(circle at top, rgba(255,255,255,.05), rgba(255,255,255,.02) 30%, transparent 60%), rgba(255,255,255,.02);
  padding:24px;
  overflow:auto;
}
canvas{max-width:100%; height:auto; display:block; box-shadow:0 22px 52px rgba(0,0,0,.28); border-radius:24px;}

/* recent update + quotes specifics */
.moment-sidebar .brand-card,
.quotes-sidebar .brand-card{margin-bottom:14px;}
.moment-page .tool-panel,
.quotes-page .panel{padding:16px;}

/* daily recap ensure ESPN visible */
.daily-recap-page .v68-espn-panel,
.daily-recap-page .sync-espn-subgroup,
.daily-recap-page .espn-toolbar,
.daily-recap-page .espn-sync-panel{display:block !important;}
.daily-recap-page .v68-espn-panel{margin-top:14px;}

/* remove old inner rails if already duplicated */
.standings-page.v68-page .controls-rail,
.daily-recap-page.v68-page .controls-rail{display:none;}
.standings-page.v68-page .stage-grid,
.daily-recap-page.v68-page .stage-grid{grid-template-columns:1fr;}

/* responsive */
@media (max-width: 1520px){
  .fulltime-page .app-shell,
  .standings-page .app-shell,
  .ptw-page .app-shell,
  .daily-recap-page .app-shell,
  .moment-page .app-shell,
  .quotes-page .app-shell{grid-template-columns:1fr;}
  .sidebar{position:static; max-height:none; padding-right:0;}
  .main-stage{min-height:auto; order:-1;}
  .canvas-stage{min-height:auto;}
}
@media (max-width: 980px){
  .dashboard-shell{padding:12px 12px 32px;}
  .dash-hero{grid-template-columns:1fr; padding:20px;}
  .template-grid{grid-template-columns:1fr;}
  .has-topnav .fp-topnav{width:calc(100% - 18px); margin:9px auto 14px;}
  .app-shell{width:calc(100% - 18px);}
  .preview-header h2{font-size:28px;}
}
