/* =============================================================
   Cleaned & Optimised Stylesheet – 2025‑07‑31
   ‑ consolidated rules, removed duplicates, introduced CSS vars
   ============================================================= */

:root{
  /* ---- colour palette ---- */
  --clr-bg-body:     radial-gradient(circle,rgba(59,59,59,1.00) 0%, rgba(37,37,37,1.00) 100%);
  --clr-text-body:   #333;
	--clr-accent:   #D49D26;
	--clr-btn-txt:   #1D1D1D;
  --clr-header-bg:   #FFFFFF;
  --clr-header-btn:  hsl(0 0% 69%);
  --clr-header-btn-h:hsl(0 0% 45%);
  --clr-seg-act-bg:  rgba(255,255,255,.40);
  --clr-beat-line:   #444;
  --clr-danger:      #BB5858;
	  --clr-dangerhover:      #c00000;
	--clr-shadow:      0px 0px 30px hsla(0,0%,0%,0.17);
  --rad-div:      	 10px;

  /* ---- spacing & sizing ---- */
  --btn-py: 5px;        /* button y‑padding */
  --btn-px:10px;        /* button x‑padding */
}

/* ---------------- Base ---------------- */
*{box-sizing:border-box;}
body{
  font: 16px/1.4 "Open Sans", Arial, Helvetica, sans-serif;
  background:var(--clr-bg-body);
  color:var(--clr-text-body);
  margin:0;
}

.logocontainer{
    width: 677px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 64px;
    padding-right: 64px;
    padding-bottom: 64px;
    padding-left: 64px;
}

main{padding:20px;}

header{
	box-shadow: var(--clr-shadow);
	display: flex;
	align-items: center;
	justify-content: flex-start;          /* ensin vasemmalle… */
	  position: relative;
	width: 100%;/* mahdollistaa absoluuttisen keskityksen */
	padding: 10px;
	margin: 8px 0;
	background: var(--clr-header-bg);
	text-align: center;
}

header #headernapit{      /* form tai div jossa Start & Fork */
  margin-left:auto;       /* työntää ryhmän oikeaan reunaan */
  display:flex;
  align-items:center;
}

.header-title-group{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  display:flex;
  align-items:center;
  gap:10px;
}

/* ---------------- Etusivu ---------------- */

#maintitle{
	margin-top: 200px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: auto;
	color: #FFFFFF;
	text-align: center;
}
#login {
	max-width: 400px;
	margin: auto;
	background-color: #FFFFFF;
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 60px;
	padding-bottom: 60px;
	border-radius: var(--rad-div);
display:flex;
  align-items:center;
}

/* ---------------- Buttons ---------------- */
button{                           /* default button */
	font-family: inherit;
	font-size: 14px;
	padding: var(--btn-py) var(--btn-px);
	cursor: pointer;
	height: var(--rh);
	background: var(--clr-accent);
	color: var(--clr-btn-txt);
	border-radius: 100px;
	border: none;
	margin-left: 4px;
	margin-right: 4px;
	font-weight: bold;
}
button:hover{background:var(--clr-header-btn-h);}  


.btn-danger{background:var(--clr-danger);color:#fff;font-weight:bold;}
.btn-danger:hover{background:var(--clr-dangerhover);}

/* Header‑buttons share same float originally → now flex‑order manageable */
.header-btn{margin-right:5px;}

.closebtn{
	background-color: hsla(0,0%,0%,0.00);
	font-size: x-large;
	font-variant: normal;
	font-weight: bold;
	float: right;
}

.closebtn:hover{
	background-color: hsla(0,0%,0%,0.00);
	font-size: x-large;
	font-variant: normal;
	font-weight: bolder;
	float: right;
	color: var(--clr-accent);
}
/* ---------------- Timeline ---------------- */
.timeline{

	box-shadow: var(--clr-shadow);
  background:var(--clr-header-bg);
  border:1px solid #999;
  margin-bottom:30px;
  padding:10px;
		border-radius: var(--rad-div);
}
.timeline-header{position:relative;margin-bottom:10px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}

.timeline-track{
	position: relative;
	height: 60px;
	background: #eee;
	overflow: visible;
	border-width: 1px;
	border-color: #1D1D1D;
}
.timeline-track.has-beats{margin-top:100px;}  /* space for beat labels */

/* ---------------- Segment ---------------- */
.segment{
  position:absolute;inset-block:0;
  padding:3px;
  display:flex;flex-direction:column;gap:4px;
  font-size:12px;
  overflow:hidden;white-space:nowrap;text-overflow:ellipsis;
}
.segment .segment-title{font-weight:bold;}
.segment:focus-within{outline:2px solid limegreen;}

/* Drag handles */
.handle{
  position:absolute;top:0;bottom:0;width:8px;
  background:rgba(255,255,255,0.34);
  cursor:ew-resize;
  transition:background .15s,opacity .15s;
  opacity:0;pointer-events:none;
}
.segment.selected .handle{opacity:1;pointer-events:auto;}
.handle-left{left:0;} .handle-right{right:0;}
.handle:hover{background:rgba(255,255,255,0.81);outline:1px solid limegreen;} 

/* ---------------- ACT segments ---------------- */

.is-hidden {
  display: none !important;
}

.act-segment{
  position:absolute;z-index:100;border-left:dashed;font-weight:bold;pointer-events:none;
}
.act-segment::after{
  content:attr(data-act) " ";
  position:absolute;left:6px;bottom:4px;
  font-size:12px;font-weight:600;color:var(--clr-text-body);
  background:var(--clr-seg-act-bg);
  padding:3px 5px;
  pointer-events:none;
}


/* ---------------- Beat guide ---------------- */
.beat-line{
  position:absolute;inset-block:0;width:1px;background:var(--clr-beat-line);
  z-index:10;pointer-events:none;
}
.beat-label{
  position:absolute;top:-32px;transform:rotate(-45deg);transform-origin:left bottom;
  font-size:10px;color:var(--clr-beat-line);white-space:nowrap;
  pointer-events:none;z-index:901;
}

/* ---------------- Summary ---------------- */
#summary{
	box-shadow: var(--clr-shadow);
	max-width: 820px;
	margin: auto;
	background-color: #FFFFFF;
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 60px;
	padding-bottom: 60px;
	border-radius: var(--rad-div);
	 font-family: "Courier New", Courier, monospace !important;
}
#summary h2{font-size:18px;margin-bottom:8px;}
#summary h3{font-size:16px;margin:20px 0 10px;border-top:1px solid #999;padding-top:10px;}
#summary h4{font-size:14px;margin-bottom:4px;background:#c0c0c0;display:inline-block;font-weight:bold;transition: background 3s ease;}
.summary-highlight {
  background: #25C363 !important;
}

.scene-text{
  font-size:13px;
  margin:0 0 12px;
  cursor:text;
}

.scene-line{
  min-height:1.35em;
  white-space:pre-wrap;
}

.dialogue-line{
  position:relative;
  max-width:58%;
  margin-left:auto;
  margin-right:auto;
  text-align:center;
}


/* Inline editor */
.inline-edit{font:inherit; font-size:13px;font-family:inherit;outline:none;margin-left:-2px;line-height:1.45;}
.inline-edit-shell{margin:0 0 12px;position:relative;}
.dialogue-edit-shell{position:relative;}
.dialogue-editor-wrap{display:flex;align-items:flex-start;gap:8px;}
.dialogue-gutter{
  width:24px;
  flex:0 0 24px;
  position:relative;
  overflow:hidden;
  user-select:none;
  pointer-events:none;
  align-self:stretch;
}
.dialogue-gutter-line{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  font-size:13px;
  line-height:1.45;
  padding-top:1px;
}
.dialogue-gutter-spacer{
  width:100%;
  flex:0 0 auto;
}
.dialogue-layout-mirror{
  position:absolute;
  left:-99999px;
  top:0;
  visibility:hidden;
  pointer-events:none;
  white-space:pre-wrap;
  overflow-wrap:break-word;
}
.dialogue-line-marker{
  display:inline-block;
  width:0;
  overflow:hidden;
  padding:0;
  margin:0;
}
.inline-scene-edit{width:100%;flex:1 1 auto;min-width:0;resize:vertical;overflow:hidden;min-height:2em;}
.dialogue-toolbar{display:none;gap:6px;flex-wrap:wrap;margin:10px 0 6px;}
.dialogue-toolbar.is-visible{display:flex;}
.dialogue-toolbar button{min-width:38px;padding:4px 8px;font-size:18px;line-height:1.1;}
.dialogue-toolbar button:disabled{opacity:0.45;cursor:default;}
.dialogue-toolbar-floating{position:absolute;left:-72px;top:0;flex-direction:column;margin:0;}
.inline-dialogue-toolbar{left:-72px;}
#segment-editor .dialogue-toolbar-floating{left:-58px;}
.dialogue-status{display:none !important;}

/* Segment editor panel */
#segment-editor{
	box-shadow: var(--clr-shadow);
	padding: 20px;
	margin-bottom: 30px;
	background: #fff;
	border-radius: var(--rad-div);
	
}
#ed-text{
 width: 100%;
  flex:1 1 auto;
  min-width:0;
  resize: vertical;
  overflow: auto;
  min-height: 2em; /* voit laittaa hyvin matalaksi */
  max-height: 60vh;
  line-height:1.45;
}
#ed-label{width:90%;}
#ed-color{width:9%;}

/* ---------------- Timeline settings & modals ---------------- */
.timeline-settings{display:none;}
.timeline-settings.open{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}

.modal{

	position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
       background:rgba(0,0,0,0.20);z-index:2000;}
.modal.hidden{display:none;}
.modal-inner{background:hsla(0,0%,100%,0.80);padding:20px;min-width:240px;	box-shadow: var(--clr-shadow);
	border-radius: var(--rad-div);}


/* ---------------- Header form & inputs ---------------- */
#project-name,
#project-author{
  font-size:20px;
  font-weight:bold;
  margin:0;
  font-family:inherit;
  padding:6px 10px;
}
#project-name{width:260px;}
#project-author{width:200px;font-size:16px;font-weight:600;}
#headernapit form{display:inline-block;margin:0;}

main.timeline-page{
  display:block;
}

.timeline-top-row{
  margin-bottom:24px;
}

section.timeline-layout{
  position:relative;
  max-width:1490px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(260px,300px) minmax(0,820px) minmax(260px,300px);
  gap:24px;
  align-items:start;
  justify-content:center;
}

.timeline-main-column{
  grid-column:2;
  min-width:0;
  max-width:820px;
  width:100%;
  margin:0 auto;
}

.scene-track{
  margin-bottom:12px;
}

.segment.selected .handle{
  opacity:1;
  pointer-events:auto;
}

#segment-editor,
#summary{
  max-width:820px;
  margin-left:auto;
  margin-right:auto;
}

#timeline-notes-panel{
  grid-column:3;
  align-self:start;
  box-shadow:var(--clr-shadow);
  background:#fff;
  border-radius:var(--rad-div);
  padding:20px;
  position:sticky;
  top:24px;
  width:100%;
  max-width:300px;
  margin:0;
  z-index:10;
}

.notes-panel-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
	
}

#timeline-notes-panel .notes-title{
  display:block;
  font-weight:700;
  margin:0;
}

#notes-minimize{
  min-width:34px;
  padding:2px 10px;
  font-size:20px;
  line-height:1;
}

#timeline-notes-panel.is-minimized .notes-panel-body{
  display:none;
}

#timeline-notes-panel.is-minimized{
 
	min-width:94px;
}

.settings-check-row{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:0;
}

.settings-check-row input{
  margin:0;
}

#timeline-notes{
  width:100%;
  min-height:420px;
  resize:vertical;
  font:14px/1.5 "Open Sans", Arial, Helvetica, sans-serif;
  border:1px solid #ccc;
  border-radius:8px;
  padding:12px;
}

@media (max-width: 1320px){
  section.timeline-layout{
    display:block;
    max-width:900px;
  }

  #timeline-notes-panel{
    position:static;
    width:100%;
    max-width:820px;
    margin:24px auto 0;
  }
}



@media (max-width: 1100px){
  .inline-dialogue-toolbar{
    position:static;
    flex-direction:row;
    margin:0 0 6px;
  }
}

@media (max-width: 980px){
  .header-title-group{
    position:static;
    transform:none;
    margin-left:12px;
    flex:1 1 auto;
    justify-content:center;
    flex-wrap:wrap;
  }

  header{
    flex-wrap:wrap;
    gap:8px;
  }

  #project-name,
  #project-author{
    width:min(100%, 260px);
  }
}

/* ---------------- v9 dashboard & collaboration ---------------- */
.button-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:var(--btn-py) var(--btn-px);
  background:var(--clr-accent);
  color:var(--clr-btn-txt);
  border-radius:100px;
  font-weight:bold;
  text-decoration:none;
  margin-left:4px;
  margin-right:4px;
}
.button-link:hover{background:var(--clr-header-btn-h);}
.save-indicator{
  margin-left:8px;
  font-size:13px;
  color:#555;
  min-width:62px;
}
.save-indicator[data-state="saving"]{color:#8a6700;}
.save-indicator[data-state="error"]{color:#b10000;}
.dashboard-header{
  justify-content:space-between;
  padding-inline:24px;
}
.dashboard-brand{font-size:24px;font-weight:700;}
.dashboard-userbar{display:flex;align-items:center;gap:12px;}
.pill{background:#efefef;border-radius:999px;padding:6px 12px;font-weight:600;}
.dashboard-main{max-width:1180px;margin:0 auto;padding:32px 20px 48px;}
.auth-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;}
.auth-card{
  background:#fff;
  border-radius:var(--rad-div);
  box-shadow:var(--clr-shadow);
  padding:28px;
}
.stack-form{display:grid;gap:14px;}
.stack-form label{display:grid;gap:6px;font-weight:600;}
.stack-form input{padding:10px 12px;border:1px solid #c7c7c7;border-radius:8px;font:inherit;}
.auth-links{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px;}
.auth-links a{color:#333;}
.muted{color:#666;}
.flash{margin-bottom:18px;padding:14px 16px;border-radius:10px;background:#fff;box-shadow:var(--clr-shadow);}
.flash-error{border-left:4px solid #b10000;}
.flash-success{border-left:4px solid #2f8f3f;}
.dashboard-actions{margin-bottom:24px;}
.create-project-row{display:flex;gap:12px;align-items:end;flex-wrap:wrap;}
.create-project-row .grow{flex:1 1 320px;display:grid;gap:6px;font-weight:600;}
.create-project-row input{padding:10px 12px;border:1px solid #c7c7c7;border-radius:8px;font:inherit;}
.project-sections{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px;}
.project-list{list-style:none;padding:0;margin:0;display:grid;gap:12px;}
.project-row{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:14px;border:1px solid #ececec;border-radius:10px;min-width:0;}
.project-row > div:first-child{min-width:0;flex:1 1 auto;overflow:hidden;}
.project-row > div:first-child strong{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.project-meta{font-size:13px;color:#666;margin-top:4px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.project-actions,
.project-actions-container{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:0 0 auto;margin-left:auto;flex-wrap:nowrap;}
.project-actions form,
.project-actions-container form{margin:0;}
.single-card-wrap{max-width:560px;}
.narrow-card{margin:0 auto;}
.collaborator-panel{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid #e3e3e3;
  display:grid;
  gap:10px;
}
.collaborator-tags{display:flex;flex-wrap:wrap;gap:8px;}
.collaborator-chip{display:inline-flex;align-items:center;gap:6px;background:#f1f1f1;border-radius:999px;padding:6px 10px;font-size:13px;}
.collaborator-remove{min-width:24px;padding:0 6px;line-height:1.2;font-size:16px;background:#ddd;}
.collaborator-form{display:flex;gap:8px;flex-wrap:wrap;}
.collaborator-form input{flex:1 1 220px;padding:8px 10px;border:1px solid #c7c7c7;border-radius:8px;font:inherit;}
.collaborator-status{font-size:13px;color:#666;min-height:1.2em;}
#ed-text{overflow:auto;max-height:60vh;}
@media (max-width: 960px){
  .header-title-group{position:static;transform:none;margin:0 auto;}
  header{flex-wrap:wrap;gap:10px;}
  #headernapit{margin-left:0;width:100%;justify-content:flex-end;}
}

.modal-share{max-width:640px;width:min(92vw,640px);}
.collaborator-status.is-error{color:#b42318;}

.segment.is-locked-by-other {
  outline: 2px dashed rgba(130, 130, 130, 0.85);
  opacity: 0.8;
}

.segment.is-locked-by-other::after {
  content: "🔒";
  position: absolute;
  top: 2px;
  right: 4px;
  font-size: 12px;
}

.summary h4.is-locked-by-other,
.summary .scene-text.is-locked-by-other {
  background: rgba(0, 0, 0, 0.04);
}

/* ---------------- v12 layout, sticky notes, share ---------------- */
header{
  margin:0 0 8px;
}

main.timeline-page{
  width:100%;
  max-width:none;
  padding:20px 20px 40px;
}

.timeline-top-row,
.timeline-top-row .timeline,
.timeline{
  width:100%;
  max-width:none;
}

section.timeline-layout{
  max-width:1968px;
  grid-template-columns:minmax(0, 550px) minmax(0, 820px) minmax(0, 550px);
  gap:24px;
}

.timeline-main-column{
  grid-column:2;
  position:relative;
  overflow:visible;
}

#timeline-notes-panel{
  grid-column:3;
  justify-self:end;
  width:min(100%, 280px);
  background:#f8ea79;
  border:1px solid rgba(0,0,0,0.08);
}

#timeline-notes,
#timeline-notes::placeholder{
  background:#fff6b3;
}

#timeline-notes{
  background:#fff6b3;
  border-color:rgba(0,0,0,0.15);
}

.scene-row{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0, 1fr) 240px;
  gap:24px;
  align-items:start;
  margin:0 -264px 18px 0;
  padding-right:264px;
}

.scene-main{
  position:relative;
  min-width:0;
}

.scene-header-row{
  display:flex;
  align-items:center;
  gap:10px;
}

.scene-sticky-notes{
  position:static;
  width:240px;
  z-index:4;
}

.scene-sticky-notes-header{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  margin-bottom:10px;
}

.scene-sticky-notes-header .add-sticky-note{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0;
  min-width:44px;
  padding:4px 12px;
  font-size:12px;
  overflow:hidden;
  white-space:nowrap;
  transition:min-width .18s ease, gap .18s ease, padding .18s ease;
}

.scene-sticky-notes-header .add-sticky-note .add-sticky-note-plus{
  display:inline-block;
  line-height:1;
}

.scene-sticky-notes-header .add-sticky-note .add-sticky-note-label{
  max-width:0;
  opacity:0;
  overflow:hidden;
  transition:max-width .18s ease, opacity .18s ease, margin-left .18s ease;
}

.scene-sticky-notes-header .add-sticky-note:hover,
.scene-sticky-notes-header .add-sticky-note:focus-visible{
  justify-content:flex-start;
  gap:6px;
  min-width:112px;
}

.scene-sticky-notes-header .add-sticky-note:hover .add-sticky-note-label,
.scene-sticky-notes-header .add-sticky-note:focus-visible .add-sticky-note-label{
  max-width:80px;
  opacity:1;
}

.scene-sticky-notes-stack{
  display:grid;
  gap:12px;
}

.sticky-note-card{
  background:#f8ea79;
  border:1px solid rgba(0,0,0,0.10);
  border-radius:12px;
  box-shadow:0 8px 20px rgba(0,0,0,0.08);
  padding:12px;
}

.sticky-note-card-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
}

.sticky-note-card-title{
  font-weight:700;
  font-size:13px;
  line-height:1.3;
  color:#5e4f00;
}

.sticky-note-card-actions,
.sticky-note-tools{
  display:flex;
  align-items:center;
  gap:6px;
}

.sticky-note-tools{
  justify-content:space-between;
}

.sticky-note-tools-left{
  display:flex;
  align-items:center;
  gap:6px;
}

.sticky-note-delete{
  margin-left:auto;
}

.sticky-note-card button,
.sticky-note-tools button,
.share-link-row button{
  border-radius:999px;
}

.sticky-note-card-body{
  display:grid;
  gap:10px;
  margin-top:10px;
}

.sticky-note-card.is-minimized .sticky-note-card-body{
  display:none;
}

.sticky-note-text{
  width:100%;
  min-height:120px;
  resize:vertical;
  border:1px solid rgba(0,0,0,0.12);
  border-radius:10px;
  padding:10px 12px;
  font:14px/1.45 "Open Sans", Arial, Helvetica, sans-serif;
  background:#fff8c7;
}

.sticky-note-links,
.sticky-note-attachments{
  display:grid;
  gap:8px;
}

.sticky-note-link-item,
.sticky-note-file,
.sticky-note-image-wrap{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
  background:rgba(255,255,255,0.5);
  border-radius:10px;
  padding:8px 10px;
}

.sticky-note-link-item a,
.sticky-note-file a{
  min-width:0;
  word-break:break-word;
  color:#2f4f9a;
}

.sticky-note-image-wrap{
  flex-direction:column;
  align-items:stretch;
}

.sticky-note-image{
  width:100%;
  display:block;
  border-radius:10px;
}

.sticky-attachment-delete,
.sticky-link-delete,
.sticky-note-delete,
.sticky-note-toggle{
  align-self:flex-start;
  min-width:34px;
  min-height:34px;
  padding:4px 8px;
  line-height:1;
}

.dialogue-toolbar{
  gap:4px;
}

.dialogue-toolbar button{
  min-width:32px;
  width:32px;
  height:32px;
  padding:0;
  border-radius:999px;
  font-size:16px;
}

.dialogue-toolbar-floating{
  left:-42px;
}

.inline-dialogue-toolbar{
  left:-42px;
}

#segment-editor .dialogue-toolbar-floating{
  left:-36px;
}

.dialogue-editor-wrap{
  gap:4px;
}

.dialogue-gutter{
  width:18px;
  flex-basis:18px;
}

.dialogue-gutter-line{
  font-size:12px;
}

.share-popup-section{
  display:grid;
  gap:8px;
  margin-top:10px;
  padding-top:8px;
  padding-bottom:12px;
  border-bottom:1px solid #e3e3e3;
}

.share-link-row{
  display:flex;
  gap:8px;
}

#share-link-input{
  flex:1 1 auto;
  min-width:0;
  padding:10px 12px;
  border:1px solid #c7c7c7;
  border-radius:10px;
  font:inherit;
}

@media (max-width: 1600px){
  section.timeline-layout{
    grid-template-columns:minmax(0, 380px) minmax(0, 820px) minmax(0, 380px);
  }
  .scene-sticky-notes{width:220px;}
  #timeline-notes-panel{width:min(100%, 250px);}
}

@media (max-width: 1320px){
  section.timeline-layout{
    display:block;
    max-width:980px;
  }
  .scene-row{
    display:block;
    margin-right:0;
    padding-right:0;
  }
  .scene-sticky-notes{
    position:static;
    width:auto;
    margin:10px 0 0;
  }
  #timeline-notes-panel{
    position:static;
    width:100%;
    max-width:820px;
    margin:24px auto 0;
  }
}

/* ---------------- v12 alignment hotfix ---------------- */
section.timeline-layout{
  position:relative;
  display:block;
  width:100%;
  max-width:none;
}

.timeline-main-column{
  position:relative;
  overflow:visible;
  width:min(820px, calc(100vw - 420px));
  max-width:820px;
  min-width:0;
  margin:0 auto;
}

#segment-editor,
#summary{
  max-width:820px;
  margin-left:auto;
  margin-right:auto;
}

#timeline-notes-panel{
  position:absolute;
  right:0;
  top:0;
  width:280px;
  max-width:280px;
  min-width:0;
  margin:0;
}

.scene-row{
  position:relative;
  display:block;
  margin:0 0 18px;
  padding-right:0;
  transition:min-height 0.15s ease;
}

.scene-sticky-notes{
  position:absolute;
  left:calc(100% + 64px);
  top:0;
  width:240px;
  z-index:4;
}

@media (max-width: 1600px){
  .timeline-main-column{
    width:min(820px, calc(100vw - 380px));
  }

  .scene-sticky-notes{
    left:calc(100% + 48px);
    width:220px;
  }

  #timeline-notes-panel{
    width:250px;
    max-width:250px;
  }
}

@media (max-width: 1320px){
  .timeline-main-column{
    width:min(820px, 100%);
  }

  .scene-sticky-notes{
    position:static;
    width:auto;
    margin:10px 0 0;
  }

  #timeline-notes-panel{
    position:static;
    width:100%;
    max-width:820px;
    margin:24px auto 0;
  }
}

/* ---------------- v13.1 dashboard/header/admin/sticky overrides ---------------- */
header.timeline-headerbar,
.dashboard-header{
  position:sticky;
  top:0;
  z-index:1000;
  margin:0;
  background:rgba(255,255,255,0.8);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow:0 12px 30px rgba(0,0,0,0.14);
}

header.timeline-headerbar{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:14px;
  align-items:center;
  padding:10px 14px;
}

.header-left-fixed,
.header-right-fixed,
.header-collapsible,
#headernapit,
.header-title-group,
.header-field{
  display:flex;
  align-items:center;
}

.header-left-fixed{gap:8px;}
.header-right-fixed{justify-self:end;}
.header-collapsible{gap:12px; min-width:0; justify-content:center;}
.header-title-group{gap:12px; min-width:0; flex-wrap:wrap;}
.header-field{gap:8px; min-width:0;}
.header-field-label{
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:#5b5b5b;
  font-weight:700;
  white-space:nowrap;
}
#project-name,
#project-author{
  border:0;
  border-radius:16px;
  background:rgba(255,255,255,0.95);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,0.12);
  font-weight:700;
}
#project-name{width:min(280px, 28vw);}
#project-author{width:min(180px, 18vw);}
#headernapit{gap:8px;}
#new.dashboard-link{
  order:99;
  background:rgba(128,128,128,0.42);
  color:#fff;
}
#new.dashboard-link:hover{background:rgba(128,128,128,0.6);}
.header-mobile-toggle{display:none;}

.save-indicator{font-size:13px; color:#616161; white-space:nowrap;}

.dashboard-header{
  justify-content:flex-end;
  padding:14px 22px;
}
.dashboard-brand{display:none;}
.dashboard-main{max-width:1080px; margin:0 auto; padding-top:40px;}
.logocontainer{display:flex; justify-content:center; align-items:center; width:auto; padding:48px 0 32px;}
.logocontainer img{max-width:320px; width:100%; height:auto;}
.create-project-row.align-fields{align-items:end;}
.create-project-row.align-fields button,
.create-project-row.align-fields input{height:40px;}
.create-project-row.align-fields button{align-self:end; min-width:96px;}

.account-menu{position:relative; margin-right:auto;}
.account-pill{background:rgba(128,128,128,0.42); color:#fff;}
.account-menu-popover{
  position:absolute;
  left:0;
  top:calc(100% - 2px);
  min-width:170px;
  display:grid;
  gap:4px;
  padding:10px;
  background:rgba(255,255,255,0.96);
  border-radius:14px;
  box-shadow:0 18px 38px rgba(0,0,0,0.14);
  opacity:0;
  pointer-events:none;
  transform:translateY(4px);
  transition:opacity .18s ease, transform .18s ease;
}
.account-menu-popover::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-10px;
  height:10px;
}
.account-menu-popover.is-open{opacity:1; pointer-events:auto; transform:translateY(0);}
.account-menu-action{
  display:block;
  text-decoration:none;
  color:#222;
  background:#f3f3f3;
  border-radius:10px;
  padding:9px 12px;
  font:inherit;
  border:0;
  text-align:left;
}
.account-menu-action:hover{background:#ece08d;}
.account-settings-modal-inner{width:min(92vw, 440px);}
.admin-card{margin-top:24px;}
.admin-toolbar{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:16px;}
.admin-stat-pill{background:#f3f3f3; border-radius:999px; padding:8px 12px; font-weight:700;}
.admin-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:18px; margin-bottom:18px;}
.compact-list{gap:8px;}
.compact-row{padding:10px 12px;}
.admin-user-list .project-actions{justify-content:flex-end;}
.maintenance-body{min-height:100vh; display:grid; place-items:center; background:var(--clr-bg-body);}
.maintenance-main{max-width:480px; width:min(92vw, 480px);}

#timeline-notes-panel{
  background:#f8ea79;
  border-radius:14px;
  padding:10px 12px;
  transition:width .28s ease, max-width .28s ease, padding .28s ease;
}
.notes-panel-header{
  position:relative;
  min-height:28px;
  display:flex;
  align-items:center;
  padding-right:34px;
}
#timeline-notes-panel .notes-title{
  display:block;
  margin:0;
  font-size:14px;
  line-height:1;
}
#notes-minimize{
  position:absolute;
  top:0;
  right:0;
  width:24px;
  height:24px;
  min-width:24px;
  padding:0;
  border-radius:999px;
  line-height:1;
  font-size:14px;
}
#timeline-notes-panel .notes-panel-body{
  max-height:520px;
  overflow:hidden;
  opacity:1;
  transition:max-height .3s ease, opacity .24s ease;
}
#timeline-notes-panel.is-minimized{
  width:86px;
  max-width:86px;
  padding:10px 10px;
}
#timeline-notes-panel.is-minimized .notes-panel-body{
  max-height:0;
  opacity:0;
}
#timeline-notes-panel.is-minimized .notes-title{
  font-size:13px;
}

.scene-header-row{justify-content:flex-start; gap:12px; flex-wrap:wrap;}
.scene-last-edited{font-size:10px; color:#B7B7B7; line-height:1.2;}
.scene-sticky-notes{left:calc(100% + 92px); width:270px;}
.scene-sticky-notes-header{justify-content:flex-start;}
.scene-sticky-notes-header .add-sticky-note{
  min-width:28px;
  width:28px;
  height:28px;
  padding:0;
  border-radius:999px;
  background:rgba(255,255,255,0.72);
  color:#545454;
  transition:min-width .32s ease, width .32s ease, gap .32s ease, background-color .32s ease, color .32s ease, padding .32s ease;
}
.scene-sticky-notes-header .add-sticky-note .add-sticky-note-plus{font-size:16px; font-weight:700;}
.scene-sticky-notes-header .add-sticky-note .add-sticky-note-label{font-size:11px;}
.scene-sticky-notes-header .add-sticky-note:hover,
.scene-sticky-notes-header .add-sticky-note:focus-visible{
  width:auto;
  min-width:72px;
  padding:0 12px;
  background:#f8ea79;
  color:#2b2b2b;
}
.sticky-note-card{padding:10px 12px 10px;}
.sticky-note-card-header{align-items:center;}
.sticky-note-card-actions{gap:4px;}
.sticky-note-card-body{
  display:block;
  max-height:640px;
  overflow:hidden;
  opacity:1;
  transform:translateY(0);
  transition:max-height .32s ease, opacity .22s ease, transform .32s ease, margin-top .32s ease;
  margin-top:8px;
}
.sticky-note-card-body-inner{display:grid; gap:8px;}
.sticky-note-card.is-minimized .sticky-note-card-body{
  max-height:0;
  opacity:0;
  transform:translateY(-4px);
  margin-top:0;
}
.sticky-note-card-title{font-size:12px;}
.sticky-note-toggle{
  width:28px;
  height:28px;
  min-width:28px;
  min-height:28px;
  padding:0;
  border-radius:999px;
  transition:transform .32s ease, background-color .2s ease;
}
.sticky-note-card:not(.is-minimized) .sticky-note-toggle{transform:rotate(180deg);}
.sticky-note-text{min-height:110px; padding:12px; margin:0;}
.sticky-note-tools{align-items:center; gap:8px;}
.sticky-note-tools button,
.sticky-note-link-add,
.sticky-note-attachment-add,
.sticky-note-delete,
.sticky-link-delete,
.sticky-attachment-delete{
  width:26px;
  height:26px;
  min-width:26px;
  min-height:26px;
  padding:0;
  font-size:13px;
  border-radius:999px;
}
.sticky-note-link-add,
.sticky-note-attachment-add{display:inline-flex; align-items:center; justify-content:center;}
.sticky-note-links,
.sticky-note-attachments{gap:6px;}
.sticky-note-link-item,
.sticky-note-file{align-items:center;}
.sticky-note-link-item a,
.sticky-note-file a{font-size:12px; line-height:1.25;}
.sticky-note-image-wrap{
  position:relative;
  padding:0;
  background:transparent;
}
.sticky-note-image{display:block; width:100%; border-radius:12px;}
.sticky-attachment-delete--overlay{
  position:absolute;
  top:8px;
  right:8px;
}
.dialogue-editor-wrap{position:relative; display:block;}
.dialogue-gutter{
  position:absolute;
  left:-24px;
  top:0;
  width:18px;
  flex:0 0 18px;
  overflow:hidden;
}
.inline-scene-edit,
#ed-text{width:100%; margin-left:0;}
.dialogue-toolbar button.is-hidden{display:none;}
.dialogue-toolbar-floating{left:-52px;}
.inline-dialogue-toolbar{left:-52px;}
#segment-editor .dialogue-toolbar-floating{left:-46px;}

@media (max-width: 1600px){
  .scene-sticky-notes{left:calc(100% + 72px); width:250px;}
}

@media (max-width: 1320px){
  .scene-sticky-notes{position:static; width:auto; margin-top:12px;}
  #timeline-notes-panel{position:static; width:120px; max-width:100%; margin:24px 0 0 auto;}
}

@media (max-width: 980px){
  header.timeline-headerbar{
    grid-template-columns:auto auto 1fr;
  }
  .header-mobile-toggle{
    display:inline-flex;
    align-items:center;
    gap:8px;
    justify-self:start;
  }
  .header-collapsible{
    position:absolute;
    top:calc(100% + 8px);
    right:14px;
    left:auto;
    width:min(92vw, 420px);
    display:none;
    flex-direction:column;
    align-items:stretch;
    padding:12px;
    background:rgba(255,255,255,0.96);
    border-radius:16px;
    box-shadow:0 18px 40px rgba(0,0,0,0.18);
    z-index:1100;
  }
  .header-collapsible.is-open{display:flex;}
  .header-collapsible > *{width:100%;}
  .header-title-group{flex-direction:column; align-items:stretch; gap:10px;}
  #project-name,
  #project-author{width:100%;}
  #headernapit{justify-content:flex-start; flex-wrap:wrap;}
  .header-collapsible > #export-open{align-self:flex-start;}
}
.timeline-headerbar .header-title-group{position:static; left:auto; top:auto; transform:none;}
.timeline-headerbar #headernapit{margin-left:0;}
.timeline-headerbar .header-collapsible{position:static;}
.dashboard-header .account-menu{margin-right:auto;}

/* --------------------------------------------------------------------------
   v26-2 Focus Mode + block editor
   -------------------------------------------------------------------------- */
:root {
  --paper-width: 820px;
  --script-font: "Courier New", Courier, monospace;
  --ui-font: "Open Sans", Arial, sans-serif;
}

body {
  font-family: var(--ui-font);
}

.collab-avatar-row {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 72px;
}

.collab-avatar,
.collaborator-chip {
  --collab-color: #888;
  border: 2px solid var(--collab-color);
}

.collab-avatar {
  display: inline-flex;
  width: 27px;
  height: 27px;
  border-radius: 999px;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 12px;
  background: #fff;
  color: #111;
}

.segment.is-locked,
.scene-preview.is-locked-by-other,
.focus-editor.is-locked-by-other {
  --lock-color: #888;
  box-shadow: inset 0 0 0 3px var(--lock-color), 0 0 0 1px rgba(0,0,0,.12);
}

.segment.is-locked-by-other {
  cursor: not-allowed;
  opacity: .8;
}

.segment.selected {
  outline: 3px solid #2ecc71 !important;
  outline-offset: 2px;
}

.script-paper-readonly,
.script-paper,
.focus-editor {
  max-width: var(--paper-width);
  margin: 0 auto;
}

.script-paper-readonly,
.focus-editor {
  background: #fff;
  color: #111;
  border-radius: 4px;
  box-shadow: 0 18px 45px rgba(0,0,0,.18);
}

.script-paper-readonly {
  padding: 46px 52px 70px;
}

.summary h2 span {
  font-weight: 400;
  margin-left: 12px;
  color: #666;
  font-size: .75em;
}

.scene-preview {
  border-left: 4px solid transparent;
  padding: 18px 10px 22px 20px;
  margin: 0 0 24px;
  cursor: pointer;
  border-radius: 3px;
}

.scene-preview:hover,
.scene-preview:focus {
  background: rgba(0,0,0,.035);
  outline: none;
}

.scene-preview-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid #ddd;
  margin-bottom: 16px;
}

.scene-preview h4,
.focus-editor h2 {
  font-family: var(--script-font);
  text-transform: uppercase;
  letter-spacing: .02em;
}

.last-edited {
  --collab-color: #888;
  color: #555;
  border-left: 3px solid var(--collab-color);
  padding-left: 8px;
  font-size: 12px;
  white-space: nowrap;
}

.screenplay-line,
.screenplay-block {
  font-family: var(--script-font);
  font-size: 15px;
  line-height: 1.52;
  min-height: 1.52em;
  white-space: pre-wrap;
}

.screenplay-character {
  text-align: center;
  text-transform: uppercase;
  margin-top: 1em;
}

.screenplay-dialogue {
  width: 56%;
  margin-left: auto;
  margin-right: auto;
}

.screenplay-parenthetical {
  width: 42%;
  margin-left: auto;
  margin-right: auto;
}

.screenplay-transition {
  text-align: right;
  text-transform: uppercase;
  margin-top: 1em;
}

.screenplay-shot {
  text-transform: uppercase;
  margin-top: 1em;
}

.focus-editor {
  padding: 34px 44px 62px;
}

.focus-editor-topbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 22px;
}

.focus-kicker,
.focus-status {
  color: #777;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.focus-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.focus-heading-row,
.block-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 16px;
}

.heading-button-group {
  display: flex;
  gap: 5px;
}

.heading-button-group button,
.block-toolbar button,
.focus-actions button,
.btn-subtle {
  border: 0;
  border-radius: 999px;
  padding: 7px 11px;
  background: #e3a416;
  color: #111;
  font-weight: 700;
  cursor: pointer;
}

.heading-button-group button.is-active,
.block-toolbar button.is-active {
  background: #111;
  color: #fff;
}

#focus-location {
  flex: 1 1 260px;
  min-width: 220px;
  border: 1px solid #b8b8b8;
  border-radius: 7px;
  padding: 9px 10px;
  font-family: var(--script-font);
  text-transform: uppercase;
}

.focus-paper {
  border: 1px solid #ddd;
  padding: 54px 66px 70px;
  background: #fff;
  min-height: 520px;
}

.screenplay-block {
  outline: none;
  padding: 2px 4px;
  border-radius: 3px;
}

.screenplay-block:focus {
  background: rgba(46, 204, 113, .12);
  box-shadow: inset 0 0 0 1px rgba(46, 204, 113, .35);
}

.screenplay-block:empty::before {
  content: attr(data-placeholder);
  color: #aaa;
}

.focus-suggestions {
  position: absolute;
  z-index: 9999;
  background: #fff;
  border: 1px solid #aaa;
  border-radius: 8px;
  box-shadow: 0 12px 28px rgba(0,0,0,.18);
  padding: 6px;
}

.focus-suggestions button {
  display: block;
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  padding: 7px 9px;
  border-radius: 5px;
  font-family: var(--script-font);
}

.focus-suggestions button:hover {
  background: #f1f1f1;
}

.hotkey-guide-control {
  position: fixed;
  left: 16px;
  bottom: 14px;
  z-index: 800;
  background: rgba(255,255,255,.9);
  color: #111;
  border-radius: 999px;
  padding: 8px 12px;
  box-shadow: 0 5px 20px rgba(0,0,0,.18);
  font-size: 13px;
}

.hotkey-guide-panel {
    position: fixed;
    left: 16px;
    right: 16px;
    bottom: 58px;
    z-index: 799;
    display: none;
    background: rgba(255,255,255,.96);
    color: #111;
    border-radius: 14px;
    padding: 14px 18px;
    box-shadow: 0 12px 40px rgba(0,0,0,.22);
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px 16px;
    font-size: small;
}

.hotkey-guide-panel.is-visible {
  display: grid;
}

.hotkey-guide-panel kbd {
  font-family: var(--script-font);
  background: #111;
  color: #fff;
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 12px;
}

.logistics-main {
  max-width: 1180px;
}

.logistics-card {
  overflow-x: auto;
}

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

.logistics-table th,
.logistics-table td {
  border-bottom: 1px solid #ddd;
  padding: 9px 8px;
  text-align: left;
  vertical-align: top;
}

.logistics-table input {
  width: 100%;
  box-sizing: border-box;
}

@media (max-width: 900px) {
  .script-paper-readonly,
  .focus-editor {
    padding: 26px 18px 40px;
  }
  .focus-paper {
    padding: 34px 22px 48px;
  }
  .screenplay-dialogue {
    width: 78%;
  }
  .screenplay-parenthetical {
    width: 64%;
  }
  .focus-editor-topbar {
    flex-direction: column;
  }
}

/* --------------------------------------------------------------------------
   v26-2.1 refinement pass: screenplay view, Focus Mode controls, notes, header
   -------------------------------------------------------------------------- */
.visually-hidden{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}
.button-icon{width:16px;height:16px;display:inline-block;vertical-align:-3px;pointer-events:none;}
.icon-button{display:inline-flex;align-items:center;justify-content:center;gap:0;min-width:32px;height:32px;padding:0 8px;}
.header-action-button{display:inline-flex!important;align-items:center;justify-content:center;gap:6px;height:32px;min-width:72px;padding:6px 12px!important;line-height:1;text-decoration:none;white-space:nowrap;}
.timeline-headerbar .header-collapsible{justify-content:flex-end;}
.timeline-headerbar #headernapit{margin-left:auto;justify-content:flex-end;gap:8px;}
.timeline-headerbar .collab-avatar-row{margin-left:auto;}
#new.dashboard-link,
.dashboard-header .dashboard-link{background:rgba(128,128,128,0.42);color:#fff;}
#new.dashboard-link:hover,
.dashboard-header .dashboard-link:hover{background:rgba(128,128,128,0.6);}

.segment:hover .handle,
.segment.selected .handle{opacity:1;pointer-events:auto;}

/* Full screenplay summary: one paper, no card stack. */
:root{--paper-width:960px;}
#summary{
  width:min(var(--paper-width), calc(100vw - 520px));
  max-width:var(--paper-width);
  min-width:640px;
  margin:0 auto;
  padding:0;
  background:transparent;
  box-shadow:none;
  border-radius:0;
  font-family:var(--script-font)!important;
}
.summary-meta{
  width:100%;
  margin:0 auto 12px;
  color:#222;
  font:14px/1.4 var(--script-font);
}
.summary-meta span{margin-left:12px;color:#777;}
.script-paper-readonly{
  max-width:var(--paper-width);
  min-height:calc(100vh - 260px);
  padding:72px 82px 96px;
  border-radius:8px;
  box-shadow:0 20px 60px rgba(0,0,0,.22);
}
.scene-summary-row{
  position:relative;
  margin:0 0 2.2em;
}
.scene-preview{
  border-left:0;
  padding:0;
  margin:0;
  border-radius:0;
  cursor:pointer;
}
.scene-preview:hover,
.scene-preview:focus{background:transparent;outline:none;}
.scene-preview:hover .scene-preview-header h4,
.scene-preview:focus .scene-preview-header h4{box-shadow:inset 0 -0.5em 0 rgba(212,157,38,.18);}
.scene-preview-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  border-bottom:0;
  margin:0 0 .8em;
}
.scene-preview h4{
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  display:block!important;
  font-size:15px!important;
  line-height:1.5;
  text-transform:uppercase;
  letter-spacing:0;
}
.scene-number{display:inline-block;min-width:2.4em;}
.scene-preview-body{padding-left:0;}
.last-edited{font-size:10px;color:#999;white-space:nowrap;margin-top:.25em;}
.screenplay-line,
.screenplay-block{font-size:15px;line-height:1.5;}
.screenplay-line{margin:0 0 .15em;}
.screenplay-character{margin-top:1em;}
.screenplay-dialogue{width:50%;}
.screenplay-parenthetical{width:38%;}

/* Scene-specific sticky notes in the full script view. Default: closed. */
.scene-notes-panel{
  position:absolute;
  right:calc(100% + 24px);
  top:0;
  width:260px;
  z-index:5;
  font-family:var(--ui-font);
}
.scene-notes-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-width:86px;
  height:32px;
  padding:6px 10px;
  background:#f8ea79;
  color:#2b2b2b;
  box-shadow:0 8px 24px rgba(0,0,0,.10);
}
.scene-notes-toggle strong{background:rgba(255,255,255,.72);border-radius:999px;padding:1px 7px;}
.scene-notes-body{
  display:none;
  margin-top:8px;
  padding:12px;
  background:#f8ea79;
  border-radius:14px;
  box-shadow:0 12px 34px rgba(0,0,0,.14);
}
.scene-notes-panel.is-open .scene-notes-body{display:block;}
.scene-notes-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;}
.scene-note-add{width:28px;height:28px;min-width:28px;padding:0;background:rgba(255,255,255,.72);}
.scene-notes-stack{display:grid;gap:10px;}
.scene-note-card{display:grid;gap:7px;}
.scene-note-text{
  width:100%;
  min-height:110px;
  resize:vertical;
  border:1px solid rgba(0,0,0,.14);
  border-radius:10px;
  padding:10px;
  background:#fff8c7;
  font:14px/1.45 var(--ui-font);
}
.scene-note-card-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.scene-note-author,.scene-notes-status{font-size:11px;color:#6a5b00;}
.scene-note-delete{width:26px;height:26px;min-width:26px;padding:0;background:var(--clr-danger);}
.scene-note-delete:hover{background:var(--clr-dangerhover);}
.scene-notes-empty{margin:0;font-size:13px;}

/* Timeline notes panel: do not clip manually resized notes. */
#timeline-notes-panel .notes-panel-body{max-height:none;overflow:visible;}
#timeline-notes-panel:not(.is-minimized) .notes-panel-body{display:block;opacity:1;}
#timeline-notes-panel:not(.is-minimized){height:auto;}
#timeline-notes{min-height:calc(100vh - 190px);max-height:none;}

/* Focus Mode: compact top bar, heading dropdowns and per-block controls. */
.focus-editor{max-width:1040px;padding:26px 46px 62px;overflow:visible;}
.focus-editor-topbar{align-items:center;margin-bottom:18px;}
.focus-editing-label{font:13px/1.3 var(--ui-font);color:#666;text-transform:uppercase;letter-spacing:.08em;}
.focus-editing-label strong{color:#111;letter-spacing:0;text-transform:none;}
.focus-actions{margin-left:auto;}
.focus-close-button{background:transparent;color:#111;box-shadow:none;}
.focus-close-button:hover{background:rgba(0,0,0,.06);}
.focus-heading-row{display:grid;grid-template-columns:132px minmax(260px,1fr) 160px;gap:10px;align-items:center;margin-bottom:20px;}
.heading-select,
#focus-location{
  height:40px;
  border:1px solid #b8b8b8;
  border-radius:8px;
  padding:8px 10px;
  background:#fff;
  font-family:var(--script-font);
  font-size:15px;
  text-transform:uppercase;
}
#focus-location{width:100%;min-width:0;}
.focus-paper{border:0;padding:58px 78px 78px;background:#fff;min-height:560px;box-shadow:inset 0 0 0 1px #e1e1e1;overflow:visible;}
.screenplay-block-row{position:relative;min-height:1.5em;}
.block-row-tools{
  position:absolute;
  left:-196px;
  top:-2px;
  display:flex;
  align-items:center;
  gap:6px;
  opacity:.18;
  transition:opacity .15s ease;
  font-family:var(--ui-font);
}
.screenplay-block-row:focus-within .block-row-tools,
.screenplay-block-row.is-active-block .block-row-tools{opacity:1;}
.block-type-select{
  width:128px;
  height:30px;
  border:1px solid #ccc;
  border-radius:999px;
  background:#fff;
  padding:3px 8px;
  font:12px var(--ui-font);
}
.block-add-after,
.block-delete{
  width:30px;height:30px;min-width:30px;padding:0;
  display:inline-flex;align-items:center;justify-content:center;
}
.block-add-after{background:#25C363;color:#fff;font-size:18px;line-height:1;}
.block-add-after:hover{background:#1d9c4f;}
.block-delete{background:var(--clr-danger);}
.block-delete:hover{background:var(--clr-dangerhover);}
.screenplay-block{padding:1px 3px;}
.screenplay-block:focus{background:rgba(212,157,38,.10);box-shadow:inset 0 0 0 1px rgba(212,157,38,.36);}

/* Hotkey guide: checkbox and helper stay on the same bottom row. */
.hotkey-guide-control{left:16px;bottom:14px;z-index:805;}
.hotkey-guide-panel{
  left:164px;
  right:16px;
  bottom:14px;
  z-index:804;
  padding:8px 12px;
  border-radius:999px;
  grid-template-columns:none;
  gap:8px 14px;
  align-items:center;
  min-height:38px;
  overflow-x:auto;
}
.hotkey-guide-panel.is-visible{display:flex;flex-wrap:wrap;}
.hotkey-guide-panel div{white-space:nowrap;font-size:12px;}
.hotkey-guide-panel kbd{font-size:11px;}

/* Dashboard and logistics polish. */
.project-actions .button-link,
.project-actions button{min-width:72px;height:32px;padding:5px 12px;display:inline-flex;align-items:center;justify-content:center;}
.logistics-main > .auth-card,
.logistics-main > form.auth-card{margin-bottom:24px;}
.admin-date-range{display:flex;align-items:end;gap:10px;flex-wrap:wrap;}
.admin-date-range label{display:grid;gap:4px;font-size:12px;font-weight:700;}
.admin-date-range input{height:32px;border:1px solid #c7c7c7;border-radius:8px;padding:4px 8px;font:inherit;}
.admin-date-range button,.admin-date-range .button-link{height:32px;}

@media (max-width: 1500px){
  #summary{width:min(900px, calc(100vw - 400px));min-width:0;}
  :root{--paper-width:900px;}
  .scene-notes-panel{right:calc(100% + 16px);width:230px;}
  .script-paper-readonly{padding-left:70px;padding-right:70px;}
}
@media (max-width: 1160px){
  #summary{width:min(900px, 100%);}
  .scene-notes-panel{position:static;width:auto;margin:8px 0 20px;}
  .scene-notes-body{max-width:340px;}
  .focus-heading-row{grid-template-columns:1fr;}
  .block-row-tools{position:static;opacity:1;margin-bottom:4px;}
  .focus-paper{padding:34px 24px 52px;}
  .hotkey-guide-panel{left:16px;bottom:58px;border-radius:14px;}
}
.screenplay-block-row .block-row-tools{opacity:0;pointer-events:none;}
.screenplay-block-row:hover .block-row-tools,
.screenplay-block-row:focus-within .block-row-tools,
.screenplay-block-row.is-active-block .block-row-tools{opacity:1;pointer-events:auto;}
.block-delete .button-icon,
.scene-note-delete .button-icon{filter:brightness(0) invert(1);}


/* --------------------------------------------------------------------------
   v26-2.2 refinement pass: Focus controls, notes, act markers, touch timeline
   -------------------------------------------------------------------------- */
.handle,.segment{touch-action:none;}
#actdiv.is-hidden,#actdiv_exp.is-hidden{display:none!important;}
.summary-meta{color:#fff!important;text-shadow:0 1px 2px rgba(0,0,0,.35);}
.summary-meta span{color:rgba(255,255,255,.82)!important;}
.summary-act-marker{
  margin:2.2em 0 1.1em;
  font:700 15px/1.4 var(--script-font);
  text-transform:uppercase;
  color:#111;
  letter-spacing:.02em;
}
.scene-preview-header{justify-content:flex-start!important;align-items:flex-start!important;gap:14px;}
.scene-preview h4{
  text-align:left!important;
  align-self:flex-start;
  max-width:72%;
  background:#d2d2d2!important;
  padding:0 .35em!important;
  display:inline!important;
  box-shadow:none!important;
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
}
.scene-preview:hover .scene-preview-header h4,
.scene-preview:focus .scene-preview-header h4{box-shadow:none!important;background:#c8c8c8!important;}

/* Move Focus Mode block tools fully outside the paper. */
.focus-paper{position:relative;}
.screenplay-block-row.block-row-dialogue .screenplay-block,
.screenplay-block-row.block-row-parenthetical .screenplay-block{display:block;}
.screenplay-block-row.block-row-dialogue .screenplay-block{width:50%;margin-left:auto;margin-right:auto;}
.screenplay-block-row.block-row-parenthetical .screenplay-block{width:38%;margin-left:auto;margin-right:auto;}
.screenplay-block-row.block-row-character .screenplay-block{text-align:center;}
.block-row-tools{left:-330px!important;top:-3px;z-index:30;background:rgba(255,255,255,.92);padding:3px 5px;border-radius:999px;box-shadow:0 6px 18px rgba(0,0,0,.08);}
.block-type-select{width:142px;}

/* Scene notes: hidden for empty scenes until hover; open to the left of paper. */
.scene-notes-panel{right:calc(100% + 86px)!important;width:280px;z-index:15;}
.scene-notes-panel.is-open{z-index:90;}
.scene-notes-panel.is-empty.is-collapsed .scene-notes-toggle{opacity:0;transform:translateX(10px);pointer-events:none;min-width:32px;width:32px;justify-content:center;}
.scene-summary-row:hover .scene-notes-panel.is-empty.is-collapsed .scene-notes-toggle,
.scene-notes-panel.is-empty.is-collapsed:focus-within .scene-notes-toggle{opacity:1;transform:none;pointer-events:auto;}
.scene-notes-panel.is-open .scene-notes-body{display:block;}
.scene-notes-body{max-height:calc(100vh - 180px);overflow:auto;}
.scene-note-links,.scene-note-attachments{display:grid;gap:5px;margin-top:6px;font-size:12px;}
.scene-note-links strong,.scene-note-attachments strong{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#6a5b00;}
.scene-note-links a{color:#004f9f;text-decoration:underline;overflow-wrap:anywhere;}
.scene-note-attachments{grid-template-columns:1fr;}
.scene-note-attachment{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.45);border-radius:10px;padding:6px;}
.scene-note-attachment a{display:flex;align-items:center;gap:6px;min-width:0;color:#111;text-decoration:none;}
.scene-note-attachment img{width:54px;height:42px;object-fit:cover;border-radius:7px;border:1px solid rgba(0,0,0,.12);}
.scene-note-file-pill{display:inline-block;max-width:170px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.scene-note-upload{display:inline-flex;align-items:center;justify-content:center;height:26px;border-radius:999px;background:rgba(255,255,255,.72);font-size:12px;font-weight:700;padding:0 9px;cursor:pointer;}
.scene-note-upload input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none;}
.scene-note-delete-attachment{width:24px;height:24px;min-width:24px;padding:0;background:var(--clr-danger);margin-left:auto;}
.scene-note-delete-attachment:hover{background:var(--clr-dangerhover);}
.scene-note-delete-attachment .button-icon{filter:brightness(0) invert(1);}

/* Hotkey guide groups: same row, easier scanning. */
.hotkey-guide-panel{gap:10px 28px!important;}
.hotkey-group{display:flex;align-items:center;gap:10px;margin-right:18px;padding-right:18px;border-right:1px solid rgba(0,0,0,.14);}
.hotkey-group:last-child{border-right:0;margin-right:0;padding-right:0;}
.hotkey-block-types{gap:8px 10px;}
.hotkey-block-types strong{font-size:12px;margin-right:3px;}
.hotkey-guide-panel .hotkey-group div{white-space:nowrap;font-size:12px;}

@media (max-width:1500px){
  .scene-notes-panel{right:calc(100% + 42px)!important;width:250px;}
  .block-row-tools{left:-285px!important;}
}
@media (max-width:1160px){
  .scene-notes-panel{right:auto!important;}
  .block-row-tools{left:auto!important;}
  .scene-preview h4{max-width:100%;}
}

/* --------------------------------------------------------------------------
   v26-2.3 refinement pass: cleaner screenplay view, notes, modals and guide
   -------------------------------------------------------------------------- */
.header-action-button,
.header-dashboard-button{
  font-size:14px!important;
  font-weight:700!important;
  line-height:1!important;
  gap:7px;
}
.header-dashboard-button{display:inline-flex;align-items:center;justify-content:center;height:32px;padding:6px 12px!important;text-decoration:none;white-space:nowrap;}
.modal-inner{position:relative;font-size:14px;}
.modal-inner h3{font-size:20px;line-height:1.25;margin:0 42px 16px 0;}
.modal-inner p,.modal-inner label,.modal-inner input,.modal-inner select,.modal-inner button{font-size:14px;}
.modal-close-button,
.closebtn.modal-close-button{
  position:absolute;
  top:12px;
  right:12px;
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  padding:0!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.72)!important;
  color:#111!important;
  float:none!important;
  margin:0!important;
  box-shadow:none!important;
}
.modal-close-button:hover{background:rgba(212,157,38,.22)!important;}
.collaborator-remove{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;min-width:22px;padding:0;margin-left:6px;background:rgba(0,0,0,.08);}
.collaborator-remove .button-icon{width:12px;height:12px;}

/* Read-only screenplay paper: scene headings should read as screenplay text. */
.scene-summary-row{position:relative;padding-bottom:1.3em;margin-bottom:.9em;}
.scene-preview,
.scene-preview-header,
.scene-preview h4{box-shadow:none!important;filter:none!important;text-shadow:none!important;}
.scene-preview-header{background:transparent!important;border:0!important;margin-bottom:.85em!important;}
.scene-preview h4{
  display:inline!important;
  width:auto!important;
  max-width:100%!important;
  text-align:left!important;
  background:#d0d0d0!important;
  padding:0 .34em!important;
  line-height:1.52!important;
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
}
.scene-number{min-width:0!important;margin-right:.35em;}
.scene-preview:hover .scene-preview-header h4,
.scene-preview:focus .scene-preview-header h4{background:#c8c8c8!important;box-shadow:none!important;}

/* Keep the main timeline notes with the viewport while scrolling.
   The top value is dynamic: JS keeps this panel below the visible timeline at
   the top of the page, then docks it near the header as the timeline scrolls
   away. */
:root{
  --timeline-notes-top: 249px;
  --timeline-notes-docked-top: 76px;
}
#timeline-notes-panel{
    position: fixed!important;
    top: var(--timeline-notes-top)!important;
    right: 24px!important;
    width: 300px!important;
    max-width: calc(100vw - 48px)!important;
    z-index: 120!important;
}
#timeline-notes-panel.is-minimized{width:auto!important;max-width:none!important;}
@media (max-width:1160px){
  #timeline-notes-panel{position:static!important;width:100%!important;max-width:820px!important;margin:24px auto 0!important;}
}

/* Scene notes open by expanding the same pill/container instead of swapping UI. */
.scene-notes-panel{transition:width .22s ease, transform .22s ease;}
.scene-notes-panel .scene-notes-toggle{position:relative;z-index:2;}
.scene-notes-panel .scene-notes-body{
  display:block!important;
  max-height:0;
  opacity:0;
  overflow:hidden;
  margin-top:0;
  padding-top:0;
  padding-bottom:0;
  transform:translateY(-4px) scaleY(.98);
  transform-origin:top;
  transition:max-height .26s ease, opacity .2s ease, padding .2s ease, margin .2s ease, transform .2s ease;
}
.scene-notes-panel.is-open .scene-notes-body{
  max-height:calc(100vh - 190px);
  opacity:1;
  overflow:auto;
  margin-top:8px;
  padding:12px;
  transform:none;
}
.scene-summary-row.is-note-hover .scene-notes-panel.is-empty.is-collapsed .scene-notes-toggle,
.scene-summary-row:hover .scene-notes-panel.is-empty.is-collapsed .scene-notes-toggle,
.scene-notes-panel.is-empty.is-collapsed:hover .scene-notes-toggle,
.scene-notes-panel.is-empty.is-collapsed:focus-within .scene-notes-toggle{
  opacity:1!important;
  transform:none!important;
  pointer-events:auto!important;
}
.scene-note-attachment a > img{width:54px;height:42px;object-fit:cover;border-radius:7px;border:1px solid rgba(0,0,0,.12);}
.scene-note-delete-attachment .button-icon,
.scene-note-delete .button-icon{
  width:14px!important;
  height:14px!important;
  object-fit:contain!important;
  border:0!important;
  border-radius:0!important;
  filter:brightness(0) invert(1);
}
.scene-note-links a{display:inline-block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom;}

/* Focus mode block editing: show controls only for the selected/focused block. */
.focus-paper .screenplay-block.screenplay-dialogue,
.focus-paper .screenplay-block-row.block-row-dialogue .screenplay-block{
  display:block!important;
  width:50%!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:left!important;
}
.focus-paper .screenplay-block.screenplay-parenthetical,
.focus-paper .screenplay-block-row.block-row-parenthetical .screenplay-block{
  display:block!important;
  width:38%!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:left!important;
}
.focus-paper .screenplay-block-row .block-row-tools{opacity:0!important;pointer-events:none!important;}
.focus-paper .screenplay-block-row.is-active-block .block-row-tools,
.focus-paper .screenplay-block-row:focus-within .block-row-tools{opacity:1!important;pointer-events:auto!important;}
.focus-close-button{
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  padding:0!important;
  border-radius:999px!important;
  background:rgba(0,0,0,.06)!important;
}
.focus-close-button:hover{background:rgba(212,157,38,.25)!important;}

/* Hotkey guide: same row, readable groups, frosted background. */
.hotkey-guide-panel{
  background:rgba(255,255,255,.72)!important;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:0 12px 34px rgba(0,0,0,.18)!important;
}
.hotkey-block-types span{display:inline-flex;align-items:center;gap:4px;margin-right:2px;}
.hotkey-group{margin-top:2px;margin-bottom:2px;}
.hotkey-group + .hotkey-group{margin-left:4px;}

/* --------------------------------------------------------------------------
   v26-2.3 dynamic timeline notes autosize fix
   --------------------------------------------------------------------------
   Restores text-content based autosizing after the dynamic top-position patch.
   The older stylesheet contains a full-height min-height rule for #timeline-notes;
   these final overrides must stay near the end of the file so the textarea can
   shrink to its content and grow only until the viewport-safe max height.
*/
#timeline-notes-panel:not(.is-minimized){
  height:auto!important;
}
#timeline-notes-panel .notes-panel-body{
  max-height:none!important;
  overflow:visible!important;
}
#timeline-notes{
  box-sizing:border-box!important;
  display:block!important;
  width:100%!important;
  min-height:110px!important;
  height:auto;
  max-height:var(--timeline-notes-max-height, calc(100vh - 240px))!important;
  overflow-y:hidden!important;
  resize:none;
  field-sizing:content;
}
#timeline-notes.is-scrollable{
  overflow-y:auto!important;
}

/* --------------------------------------------------------------------------
   v26-2.3 dialogue centering hotfix
   --------------------------------------------------------------------------
   Dialogue blocks should visually sit centered on the screenplay page. Earlier
   rules centered only the dialogue column, then a later Focus Mode override set
   text-align:left. Keep this override at the end of the stylesheet.
*/
.scene-preview-body .screenplay-line.screenplay-dialogue,
.script-paper-readonly .screenplay-line.screenplay-dialogue,
.screenplay-block-row.block-row-dialogue .screenplay-block,
.focus-paper .screenplay-block.screenplay-dialogue,
.focus-paper .screenplay-block-row.block-row-dialogue .screenplay-block{
  display:block!important;
  width:50%!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}

@media (max-width:900px){
  .scene-preview-body .screenplay-line.screenplay-dialogue,
  .script-paper-readonly .screenplay-line.screenplay-dialogue,
  .screenplay-block-row.block-row-dialogue .screenplay-block,
  .focus-paper .screenplay-block.screenplay-dialogue,
  .focus-paper .screenplay-block-row.block-row-dialogue .screenplay-block{
    width:78%!important;
  }
}


.dashboard-version{
  max-width:1080px;
  margin:-28px auto 24px;
  padding:0 20px;
  color:rgba(255,255,255,0.42);
  font-size:11px;
  line-height:1.4;
  text-align:center;
  letter-spacing:0.03em;
  user-select:none;
}

/* v26_2-5 feedback button and modal */
.feedback-header-button{
  border:0;
  background:rgba(128,128,128,0.42);
  color:#fff;
  margin-left:auto;
}
.feedback-header-button:hover{background:rgba(128,128,128,0.6);}
.feedback-header-button .button-icon{width:17px;height:17px;}
.feedback-modal-inner{width:min(92vw, 520px);}
.feedback-field{display:grid;gap:8px;font-weight:700;margin:14px 0;}
.feedback-field textarea{
  width:100%;
  min-height:150px;
  resize:vertical;
  border:1px solid #c7c7c7;
  border-radius:10px;
  padding:10px 12px;
  font:inherit;
  line-height:1.45;
}
.feedback-send-button{display:inline-flex;align-items:center;justify-content:center;width:max-content;min-height:34px;}
.dashboard-header.is-authenticated .feedback-header-button{margin-left:0;}
@media (max-width: 640px){
  .feedback-header-button span{display:none;}
  .feedback-header-button{min-width:32px;padding-inline:8px!important;}
}

/* v26_2-5 modal backdrop blur
   Applies the same frosted/blurred background treatment to all modal popups:
   feedback, account settings, export, share, fork and future .modal overlays. */
.modal{
  background:rgba(24,24,24,0.34)!important;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.modal-inner{
  background:rgba(255,255,255,0.84)!important;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.feedback-status{min-height:18px;margin:4px 0 12px;font-size:13px;}
.feedback-status.is-error{color:#9b1c1c;}
.feedback-status.is-success{color:#1f6b3a;}
.feedback-send-button:disabled{opacity:.6;cursor:wait;}

/* v26_2-5 admin feedback page */
.admin-feedback-shell{
  max-width:1080px;
  margin:0 auto;
  padding:28px 20px 48px;
}
.admin-feedback-card{width:100%;}
.admin-feedback-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}
.admin-feedback-heading h1{margin:0 0 4px;}
.feedback-admin-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}
.feedback-admin-item{
  border:1px solid rgba(0,0,0,.12);
  border-radius:14px;
  background:rgba(255,255,255,.62);
  padding:14px;
}
.feedback-admin-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 12px;
  align-items:center;
  color:#555;
  font-size:12px;
  margin-bottom:10px;
}
.feedback-admin-meta strong{color:#111;font-size:13px;}
.feedback-admin-message{
  white-space:normal;
  line-height:1.5;
  font-size:14px;
}
.feedback-admin-agent{
  margin-top:12px;
  color:#777;
  font-size:11px;
  word-break:break-word;
}
@media (max-width:640px){
  .admin-feedback-heading{display:block;}
  .admin-feedback-heading .admin-stat-pill{margin-top:10px;width:max-content;}
}


/* v26_2-6 launch page for logged-out users */
.launch-page{
  display:grid;
  gap:34px;
  padding-bottom:56px;
}
.launch-hero{
  max-width:960px;
  margin:0 auto;
  color:#fff;
  text-align:center;
  display:grid;
  justify-items:center;
  gap:18px;
}
.launch-logo{
  padding:44px 0 8px;
}
.launch-kicker{
  margin:0;
  color:rgba(255,255,255,0.78);
  font-size:14px;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-weight:700;
}
.launch-hero h1{
  max-width:760px;
  margin:0;
  color:#fff;
  font-size:clamp(34px, 6vw, 72px);
  line-height:.95;
  letter-spacing:-.055em;
}
.launch-promise{
  max-width:680px;
  margin:0;
  color:rgba(255,255,255,0.76);
  font-size:18px;
  line-height:1.55;
}
.launch-cta-row{
  display:flex;
  justify-content:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:2px;
}
.launch-cta{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding-inline:20px;
  font-size:15px;
}
.launch-video-placeholder{
  width:min(920px, 100%);
  min-height:300px;
  margin-top:12px;
  border:1px solid rgba(255,255,255,0.20);
  border-radius:22px;
  background:rgba(255,255,255,0.08);
  box-shadow:var(--clr-shadow);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  display:grid;
  place-items:center;
  align-content:center;
  gap:10px;
  color:#fff;
}
.launch-video-placeholder span{
  color:rgba(255,255,255,0.68);
  font-size:14px;
}
.launch-play-dot{
  width:58px;
  height:58px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:var(--clr-accent);
  color:var(--clr-btn-txt);
  font-size:22px;
  line-height:1;
  padding-left:3px;
  box-shadow:0 12px 32px rgba(0,0,0,0.22);
}
.launch-auth-section{
  max-width:980px;
  margin:0 auto;
  display:grid;
  gap:18px;
}
.launch-auth-copy{
  text-align:center;
  color:#fff;
}
.launch-auth-copy h2{
  margin:0 0 6px;
  color:#fff;
  font-size:30px;
}
.launch-auth-copy p{
  margin:0;
  color:rgba(255,255,255,0.72);
}
.launch-auth-grid{
  width:100%;
}
@media (max-width: 720px){
  .launch-page{gap:26px;}
  .launch-video-placeholder{min-height:220px;border-radius:16px;}
  .launch-hero h1{letter-spacing:-.035em;}
}

/* v26_2-6 quick start guide */
.launch-secondary-link{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 18px;
  border:1px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.10)!important;
  color:#fff!important;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.launch-secondary-link:hover{background:rgba(255,255,255,.18)!important;}
.quick-start-header{justify-content:flex-start;}
.quick-start-main{
  max-width:1080px;
  margin:0 auto;
  padding:24px 20px 56px;
}
.quick-start-hero{
  max-width:820px;
  margin:0 auto 28px;
  text-align:center;
  color:#fff;
}
.quick-start-logo{padding:28px 0 10px;}
.quick-start-hero h1{
  margin:0 auto 14px;
  color:#fff;
  font-size:clamp(32px, 5vw, 58px);
  line-height:1;
  letter-spacing:-.045em;
}
.quick-start-hero p{
  max-width:720px;
  margin:0 auto;
  color:rgba(255,255,255,.74);
  font-size:17px;
  line-height:1.55;
}
.quick-start-interactive{
  display:grid;
  grid-template-columns:minmax(0, .95fr) minmax(320px, 1.05fr);
  gap:18px;
  align-items:stretch;
  margin:26px 0;
}
.quick-start-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
}
.quick-start-card{
  min-height:210px;
  display:flex;
  flex-direction:column;
  gap:10px;
  cursor:pointer;
  transition:transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.quick-start-card:hover,
.quick-start-card:focus-visible,
.quick-start-card.is-previewed{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.34);
  box-shadow:0 18px 42px rgba(0,0,0,.22);
}
.quick-start-card.is-locked{
  outline:2px solid var(--clr-accent);
  outline-offset:3px;
}
.quick-start-step-number{
  width:34px;
  height:34px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:var(--clr-accent);
  color:var(--clr-btn-txt);
  font-weight:800;
}
.quick-start-card h2,
.quick-start-video h2{margin:0 0 8px;}
.quick-start-card p{margin:0;color:#555;line-height:1.5;}
.quick-start-video{
  margin-top:0;
  min-height:100%;
}
.quick-start-video-placeholder{
  width:100%;
  min-height:360px;
  margin-top:12px;
}
.quick-start-detail-preview{
  margin-top:12px;
  min-height:360px;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.quick-start-detail-preview[hidden],
.quick-start-video-placeholder[hidden]{display:none!important;}
.quick-start-gif-placeholder{
  min-height:220px;
  border:1px dashed rgba(255,255,255,.28);
  border-radius:18px;
  display:grid;
  place-items:center;
  text-align:center;
  padding:24px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.04)),
    repeating-linear-gradient(45deg, rgba(255,255,255,.05) 0 12px, rgba(255,255,255,.02) 12px 24px);
  color:rgba(255,255,255,.72);
  font-weight:800;
  letter-spacing:.02em;
}
.quick-start-detail-preview p{
  margin:0;
  color:#444;
  font-size:16px;
  line-height:1.6;
}
.quick-start-lock-hint{
  color:#777;
  font-size:13px;
}
.quick-start-actions{
  display:flex;
  justify-content:center;
  margin-top:24px;
}
@media (max-width: 980px){
  .quick-start-interactive{grid-template-columns:1fr;}
  .quick-start-video{order:-1;}
}
@media (max-width: 560px){
  .quick-start-grid{grid-template-columns:1fr;}
  .quick-start-card{min-height:0;}
  .quick-start-video-placeholder,
  .quick-start-detail-preview{min-height:300px;}
}

/* v26_2-6 legal/static page links */
.launch-legal-links,
.dashboard-legal-links{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:10px 16px;
  margin-top:18px;
  font-size:12px;
  letter-spacing:0.02em;
}
.launch-legal-links a,
.dashboard-legal-links a{
  color:rgba(255,255,255,0.72);
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,0.22);
}
.launch-legal-links a:hover,
.dashboard-legal-links a:hover{
  color:#fff;
  border-bottom-color:rgba(255,255,255,0.7);
}
.dashboard-footer{
  max-width:1080px;
  margin:-28px auto 24px;
  padding:0 20px;
  text-align:center;
  user-select:none;
}
.dashboard-footer .dashboard-version{
  max-width:none;
  margin:10px 0 0;
  padding:0;
}
.legal-main{
  max-width:900px;
  margin:0 auto;
  padding:92px 20px 56px;
}
.legal-card{
  background:rgba(255,255,255,0.9);
  border:1px solid rgba(255,255,255,0.45);
  border-radius:18px;
  box-shadow:0 18px 60px rgba(0,0,0,0.22);
  padding:34px;
  color:#202020;
}
.legal-card h1{margin-top:0;font-size:34px;line-height:1.1;}
.legal-card h2{margin-top:30px;font-size:19px;}
.legal-card p,
.legal-card li{line-height:1.65;color:#333;}
.legal-card .muted{color:#666;}
.legal-back-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:28px;
}


/* v26_2-6 launch auth layout consistency */
.launch-auth-grid{
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  align-items:stretch;
}
.launch-auth-grid > .auth-card{
  min-width:0;
  height:100%;
}
@media (max-width: 720px){
  .launch-auth-grid{
    grid-template-columns:1fr;
  }
}

/* v26_2-6 signup pause notice */
.signup-paused-notice{
  border:1px solid #d8d8d8;
  border-radius:14px;
  padding:16px;
  background:#f4f4f4;
  color:#333;
}
.signup-paused-notice strong{
  display:block;
  color:#111;
  margin-bottom:6px;
}
.signup-paused-notice p{
  margin:0;
  color:#555;
}

/* v26_2-7 dashboard announcement */
.dashboard-announcement{
  margin:0 0 24px;
  border-left:4px solid rgba(221, 166, 35, .85);
  background:rgba(255,255,255,.94);
}
.dashboard-announcement-label{
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#8a6412;
  margin-bottom:8px;
}
.dashboard-announcement-text{
  color:#202020;
  font-size:16px;
  line-height:1.5;
  white-space:normal;
}
.admin-announcement-form{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin:0 0 18px;
  padding:16px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:14px;
  background:rgba(0,0,0,.03);
}
.admin-announcement-form h3{margin:0;}
.admin-announcement-form textarea{
  width:100%;
  min-height:110px;
  resize:vertical;
}
.admin-announcement-meta{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  color:#666;
  font-size:13px;
}
.admin-announcement-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

/* v26_2-7 access request flow */
.share-button-with-badge{position:relative;}
.icon-badge-wrap{position:relative;display:inline-flex;align-items:center;justify-content:center;}
.share-pending-badge{
  position:absolute;
  top:-7px;
  left:-9px;
  width:14px;
  height:14px;
  border-radius:999px;
  background:#d92d20;
  color:#fff;
  font-size:10px;
  font-weight:800;
  line-height:14px;
  text-align:center;
  box-shadow:0 0 0 2px rgba(255,255,255,.9);
}
.access-request-body{min-height:100vh;}
.access-request-page{display:flex;justify-content:center;align-items:flex-start;}
.access-request-card{width:min(92vw,560px);text-align:left;}
.access-request-card h1{margin-top:0;font-size:28px;line-height:1.15;}
.access-request-form{margin-top:18px;}
.access-login-modal-inner{width:min(92vw,420px);}
.access-requests-panel{
  display:grid;
  gap:10px;
  padding:12px;
  border:1px solid rgba(217,45,32,.25);
  border-radius:14px;
  background:rgba(217,45,32,.06);
}
.access-requests-panel h4{margin:0;font-size:15px;}
.access-request-list{display:grid;gap:8px;}
.access-request-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px;
  border-radius:12px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(0,0,0,.06);
}
.access-request-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;}
.access-request-actions form{margin:0;}
.access-request-actions button{height:32px;padding:0 12px;}
@media (max-width: 560px){
  .access-request-row{align-items:flex-start;flex-direction:column;}
  .access-request-actions{width:100%;justify-content:flex-start;}
}


/* v26_2-8: Scene notes are also visible in Focus Mode and stay outside the editor paper. */
.focus-editor-body{
  position:relative;
  display:block;
}
.focus-editor-body > .scene-notes-panel{
  position:absolute;
  left:calc(-280px - 56px)!important;
  right:auto!important;
  top:0;
  width:280px;
  z-index:12;
}
.focus-editor-body > .scene-notes-panel.is-collapsed{
  width:auto;
}
.focus-editor-body > .scene-notes-panel.is-open .scene-notes-toggle{
  opacity:1!important;
  transform:none!important;
  pointer-events:auto!important;
}
.focus-editor-body > .scene-notes-panel.is-open .scene-notes-body{
  display:block;
}
@media (max-width:1500px){
  .focus-editor-body > .scene-notes-panel{
    left:calc(-250px - 40px)!important;
    right:auto!important;
    width:250px;
  }
}
@media (max-width:1160px){
  .focus-editor-body > .scene-notes-panel{
    position:static!important;
    width:auto!important;
    margin:0 0 16px;
  }
}

/* v26_2-9 timeline zoom + Audition-style overview scrollbar */
.timeline-zoom-viewport{
  width:100%;
  overflow:hidden;
  border:1px solid #1d1d1d;
  background:#eee;
  border-radius:6px;
  position:relative;
  cursor:default;
}
.timeline-zoom-viewport .timeline-track{
  border:0;
  min-width:100%;
  width:100%;
  margin-bottom:0;
}
.timeline-zoom-viewport .timeline-track.has-beats{
  margin-top:100px;
}
.timeline-zoom-control{
  margin-top:8px;
  padding:2px 0 4px;
}
.timeline-zoom-overview{
  position:relative;
  height:18px;
  border:1px solid rgba(0,0,0,.55);
  border-radius:5px;
  background:linear-gradient(180deg, rgba(255,255,255,.32), rgba(0,0,0,.08)), #cfcfcf;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.22);
  overflow:hidden;
  cursor:pointer;
}
.timeline-zoom-overview::before{
  content:"";
  position:absolute;
  inset:3px 5px;
  border-top:1px solid rgba(0,0,0,.18);
  border-bottom:1px solid rgba(255,255,255,.42);
  pointer-events:none;
}
.timeline-zoom-thumb{
  position:absolute;
  top:2px;
  bottom:2px;
  left:0;
  min-width:32px;
  border:1px solid rgba(40,40,40,.65);
  border-radius:4px;
  background:rgba(80,80,80,.28);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22), 0 0 3px rgba(0,0,0,.22);
  cursor:grab;
  touch-action:none;
}
.timeline-zoom-thumb:active{cursor:grabbing;}
.timeline-zoom-thumb.is-full{cursor:default;}
.timeline-zoom-handle{
  position:absolute;
  top:0;
  bottom:0;
  width:9px;
  background:rgba(255,255,255,.32);
  cursor:ew-resize;
}
.timeline-zoom-handle-left{left:0;border-radius:3px 0 0 3px;border-right:1px solid rgba(0,0,0,.35);}
.timeline-zoom-handle-right{right:0;border-radius:0 3px 3px 0;border-left:1px solid rgba(0,0,0,.35);}
.timeline-zoom-handle:hover{background:rgba(255,255,255,.6);}
.timeline-zoom-viewport .segment{
  min-width:0;
}
.timeline-zoom-viewport .segment-title{
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Focus Mode scene-level tools. */
.focus-actions{
  display:flex;
  align-items:center;
  gap:8px;
}
.focus-color-control{
  width:32px;
  height:32px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.16);
  background:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  overflow:hidden;
}
.focus-color-control input[type="color"]{
  width:42px;
  height:42px;
  border:0;
  padding:0;
  background:transparent;
  cursor:pointer;
}
.focus-delete-scene{
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(0,0,0,.08);
  color:#222;
  font:700 12px/1 var(--ui-font);
  box-shadow:none;
}
.focus-delete-scene:hover{background:rgba(0,0,0,.14);}
.focus-delete-scene.is-confirming{
  background:var(--clr-danger);
  color:#fff;
}
.focus-delete-scene.is-confirming:hover{background:var(--clr-dangerhover);}


/* v26_2-9: Focus Mode scene tools placement refinements. */
.focus-title-tools{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.focus-title-tools .focus-color-control{
  flex:0 0 auto;
}
.focus-editor-footer{
  display:flex;
  justify-content:flex-end;
  margin-top:18px;
}
.focus-editor-footer .focus-delete-scene{
  min-width:116px;
}
@media (max-width: 700px){
  .focus-editor-topbar{align-items:flex-start;}
  .focus-title-tools{flex-wrap:wrap;}
  .focus-editor-footer{justify-content:stretch;}
  .focus-editor-footer .focus-delete-scene{width:100%;}
}

.dashboard-import-panel {
  margin-top: 14px;
  border-top: 1px solid rgba(0,0,0,0.08);
  padding-top: 12px;
}

.dashboard-import-panel summary {
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 22px;
  border-radius: 999px;
  border: 0;
  background: #dca321;
  color: #111;
  font-weight: 400;
  line-height: 1;
  width: fit-content;
  list-style: none;
}

.dashboard-import-panel summary::-webkit-details-marker {
  display: none;
}

.dashboard-import-panel summary::marker {
  content: '';
}

.dashboard-import-panel[open] summary {
  margin-bottom: 8px;
}

.import-pdf-form {
  margin-top: 12px;
  display: grid;
  gap: 10px;
  max-width: 720px;
}

.import-pdf-form input[type="file"] {
  margin-top: 6px;
  width: 100%;
  border: 1px dashed rgba(0,0,0,0.22);
  border-radius: 12px;
  padding: 12px;
  background: rgba(255,255,255,0.65);
}

.import-pdf-form .button-link {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 22px;
  border: 0;
  border-radius: 999px;
  background: #dca321;
  color: #111;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
}

.import-pdf-form .button-link:hover {
  filter: brightness(.96);
}

/* v26_2-10 mobile launch auth stacking fix */
@media (max-width: 1100px) {
  .launch-auth-grid,
  .auth-grid.launch-auth-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: min(100%, 560px) !important;
    max-width: 560px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .launch-auth-grid > .auth-card,
  .auth-grid.launch-auth-grid > .auth-card {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }
}

/* v26_2-10 quick start final content */
.quick-start-tips{
  max-width:880px;
  margin:30px auto 0;
}
.quick-start-tips h2,
.quick-start-bottom-cta h2{
  margin:0 0 14px;
}
.quick-start-tips ul{
  margin:0;
  padding-left:20px;
  display:grid;
  gap:8px;
  color:#444;
  line-height:1.55;
}
.quick-start-bottom-cta{
  max-width:760px;
  margin:34px auto 0;
  text-align:center;
  color:#fff;
}
.quick-start-bottom-cta p{
  margin:0 auto 18px;
  color:rgba(255,255,255,.74);
  line-height:1.55;
}
.quick-start-bottom-cta .quick-start-actions{
  gap:12px;
  flex-wrap:wrap;
}