/* Planejamento: apresentação apenas; o shell e a lógica do ciclo são compartilhados. */
.content:has(> #view-planejamento.active){padding:32px 40px 104px;}
.content:has(> #view-planejamento.active) .topbar{align-items:center;margin-bottom:24px;}
.content:has(> #view-planejamento.active) .topbar>div:first-child{min-width:0;}
.content:has(> #view-planejamento.active) #plan-sub{overflow-wrap:anywhere;}
.planning-cycle-actions{display:none;align-items:center;gap:8px;flex-wrap:wrap;}
.content:has(> #view-planejamento.active) .planning-cycle-actions:not([hidden]){display:flex;}
.planning-cycle-actions .btn{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:8px 12px;font-size:12px;line-height:1.4;gap:8px;white-space:nowrap;border:1px solid var(--app-border);background:var(--app-panel);color:var(--app-copy);box-shadow:none;}
.planning-cycle-actions .btn:hover{background:var(--app-panel-soft);color:var(--app-title);}
.planning-cycle-actions #btn-remover-ciclo{color:var(--app-danger-text);}
.planning-cycle-actions .btn:focus-visible,#view-planejamento button:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
.planning-icon{display:inline-block;flex:none;width:16px;height:16px;background:currentColor;mask:var(--planning-icon) center/contain no-repeat;}
.planning-icon-edit{--planning-icon:url("assets/planejamento/pencil.svg");}
.planning-icon-restart{--planning-icon:url("assets/planejamento/rotate-ccw.svg");}
.planning-icon-add{--planning-icon:url("assets/planejamento/plus.svg");width:15px;height:15px;}
.planning-icon-check{--planning-icon:url("assets/planejamento/check.svg");width:15px;height:15px;}
.planning-icon-timer{--planning-icon:url("assets/planejamento/timer.svg");width:18px;height:18px;}
body:has(#view-planejamento.active):has(#pl-actions:not([hidden])) #fab-timer:not(.is-active){display:none;}

#view-planejamento .planning-summary{display:grid;grid-template-columns:196px minmax(0,1fr);gap:28px;align-items:center;margin-bottom:24px;padding:22px 24px;}
#view-planejamento .planning-completed{display:flex;align-items:center;gap:12px;}
#view-planejamento #pl-voltas{font-size:32px;font-weight:650;line-height:1.2;letter-spacing:-.03em;color:var(--app-title);}
#view-planejamento .planning-completed .card-eyebrow{max-width:82px;font-size:12px;line-height:1.5;}
#view-planejamento .planning-progress{min-width:0;border-left:1px solid var(--app-border);padding-left:28px;}
#view-planejamento .planning-progress-head,#view-planejamento .planning-progress-foot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;}
#view-planejamento .planning-progress-head .card-eyebrow{font-size:13px;font-weight:600;color:var(--app-title);}
#view-planejamento .planning-progress-time{font-size:12px;color:var(--app-copy);font-variant-numeric:tabular-nums;white-space:nowrap;}
#view-planejamento .planning-progress-time b{font-weight:500;}
#view-planejamento .planning-progress .progress-track{height:8px;margin:12px 0;}
#view-planejamento .planning-progress-foot{font-size:11px;line-height:1.4;color:var(--app-muted);font-variant-numeric:tabular-nums;}
#view-planejamento #pl-progresso-pct{color:var(--accent-text);font-weight:500;}

#pl-content>.planning-layout{grid-template-columns:minmax(0,72fr) minmax(260px,28fr);grid-template-rows:auto 1fr;grid-template-areas:"sequence composition" "sequence timer";gap:24px;align-items:start;}
#view-planejamento .planning-sequence{grid-area:sequence;}
#view-planejamento .planning-composition{grid-area:composition;}
#view-planejamento .planning-timer-shortcut{grid-area:timer;display:flex;align-items:center;justify-content:center;justify-self:end;gap:9px;min-height:44px;width:auto;padding:0 18px;font-size:13px;font-weight:600;}
#view-planejamento .planning-sequence{padding:0;overflow:hidden;}
#view-planejamento .planning-sequence>.card-head{justify-content:space-between;gap:6px 14px;padding:14px 20px 0;margin-bottom:2px;flex-wrap:wrap;}
#view-planejamento .planning-sequence .card-eyebrow,#view-planejamento .planning-composition .card-eyebrow{font-size:15px;font-weight:550;color:var(--app-title);}
#view-planejamento #btn-ver-finalizados{margin-left:auto;min-height:28px;padding:4px 8px;background:var(--app-panel-soft);border:0;border-radius:6px;font-size:11px;color:var(--app-muted);}
#view-planejamento #btn-ver-finalizados:hover{color:var(--accent-text);}
#view-planejamento .cycle-sequencia-resumo{margin:0;padding:0 20px 10px;font-size:12px;line-height:1.5;font-weight:500;color:var(--app-copy);}
#view-planejamento #pl-list{--cycle-index-width:56px;--cycle-progress-width:136px;--cycle-actions-width:68px;--cycle-gap:14px;--cycle-inset:18px;padding-bottom:10px;}
#view-planejamento .cycle-columns{grid-template-columns:minmax(0,1fr) var(--cycle-index-width) var(--cycle-progress-width) var(--cycle-actions-width);gap:var(--cycle-gap);padding:8px var(--cycle-inset) 10px calc(var(--cycle-inset) + 7px + var(--cycle-gap));font-size:10px;color:var(--app-muted);border-color:var(--app-border);}
#view-planejamento .cycle-columns>span:last-child{text-align:center;}
#view-planejamento .cycle-row{gap:var(--cycle-gap);min-height:48px;padding:8px var(--cycle-inset);border-color:var(--app-border);}
#view-planejamento .cycle-row>.disc-dot{width:7px;height:7px;flex:none;}
#view-planejamento .cycle-row-main{min-width:0;}
#view-planejamento .cycle-intercalado .cycle-row-top{grid-template-columns:minmax(0,1fr) var(--cycle-index-width) var(--cycle-progress-width);gap:var(--cycle-gap);align-items:center;margin:0;}
#view-planejamento .cycle-name{display:flex;align-items:center;flex-wrap:wrap;gap:7px;font-size:13px;line-height:1.5;font-weight:500;color:var(--app-title);overflow-wrap:anywhere;}
#view-planejamento .cycle-discipline-name{min-width:0;}
#view-planejamento .cycle-block-index{font-size:11px;color:var(--app-muted);white-space:nowrap;}
#view-planejamento .cycle-progress{display:flex;flex-direction:column;gap:6px;min-width:0;}
#view-planejamento .cycle-time{font-size:12px;line-height:1.4;color:var(--app-copy);}
#view-planejamento .cycle-bar{height:3px;width:100%;margin:0;background:var(--app-panel-soft);}
#view-planejamento .cycle-row.current{min-height:64px;background:color-mix(in srgb,var(--accent-soft) 65%,var(--app-panel));box-shadow:inset 3px 0 var(--accent);}
#view-planejamento .cycle-row.current .cycle-name{font-size:14px;font-weight:600;}
#view-planejamento .cycle-row .badge-proximo{margin:0;padding:3px 6px;border-radius:4px;background:var(--app-panel);color:var(--accent-text);font-size:9px;font-weight:650;letter-spacing:.035em;line-height:1.25;}
#view-planejamento .cycle-row .cycle-actions{width:var(--cycle-actions-width);justify-content:flex-end;gap:4px;}
#view-planejamento .cycle-row .icon-btn{width:32px;height:32px;padding:0;color:var(--app-muted);border:1px solid transparent;border-radius:6px;}
#view-planejamento .cycle-row.current .icon-btn{border-color:var(--app-border);background:var(--app-panel);color:var(--accent-text);}
#view-planejamento .cycle-row .icon-btn:hover{border-color:var(--app-border);background:var(--accent-soft);color:var(--accent-text);}
#view-planejamento .cycle-row.done{opacity:1;background:var(--app-panel-soft);}
#view-planejamento .cycle-row.done .cycle-name,#view-planejamento .cycle-row.done .cycle-time{color:var(--app-muted);}
#view-planejamento .cycle-check{color:var(--accent-text);padding:0 8px;}
#view-planejamento .cycle-manual{font-size:10px;}
#view-planejamento .cycle-group-head{flex-wrap:wrap;gap:8px;padding:14px var(--cycle-inset) 6px;margin:0;border-color:var(--app-border);}
#view-planejamento .cycle-group-head b{min-width:0;overflow-wrap:anywhere;color:var(--app-title);}
#view-planejamento .cycle-group-head>span:last-child{margin-left:auto;font-size:11px;color:var(--app-muted);}
#view-planejamento .cycle-agrupado .cycle-row{padding-left:calc(var(--cycle-inset) + 15px);}
#view-planejamento .cycle-agrupado .cycle-row-top{grid-template-columns:minmax(0,1fr) var(--cycle-progress-width);gap:var(--cycle-gap);}
#view-planejamento .cycle-agrupado .cycle-progress{display:flex;}
#view-planejamento .cycle-agrupado .cycle-time{text-align:left;}
#view-planejamento .cycle-agrupado .cycle-name{font-size:12px;}

/* Centraliza o tempo com as outras colunas, sem contar a barra na altura. */
@media(min-width:601px){
  #view-planejamento .cycle-progress{position:relative;gap:0;}
  #view-planejamento .cycle-progress .cycle-bar{position:absolute;top:calc(100% + 6px);left:0;}
}

#pl-content>.planning-layout>.planning-composition:last-child{max-width:none;width:auto;padding:22px;}
#view-planejamento .planning-composition>.card-head{margin-bottom:22px;}
#view-planejamento #pl-ring{display:flex;justify-content:center;}
#view-planejamento #pl-ring svg{width:168px;height:168px;max-width:100%;}
#view-planejamento #pl-ring text:first-of-type{font-size:24px;font-weight:600;letter-spacing:-.025em;}
#view-planejamento #pl-ring-legend{margin-top:22px;}
#view-planejamento .ring-legend-row{align-items:baseline;gap:9px;padding:7px 0;font-size:12px;line-height:1.45;}
#view-planejamento .ring-legend-row .disc-dot{width:6px;height:6px;align-self:center;flex:none;}
#view-planejamento .ring-legend-row .name{white-space:normal;overflow:visible;overflow-wrap:anywhere;color:var(--app-title);}
#view-planejamento .ring-legend-row .val{flex:none;white-space:nowrap;font-size:11px;color:var(--app-muted);}

@media(max-width:1200px){
  #pl-content>.planning-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;grid-template-areas:"timer" "sequence" "composition";}
  #view-planejamento .planning-summary{grid-template-columns:144px minmax(0,1fr);gap:20px;}
  #view-planejamento .planning-progress{padding-left:20px;}
}
@media(max-width:760px){
  #view-planejamento .planning-timer-shortcut{width:100%;justify-self:stretch;}
  .content:has(> #view-planejamento.active){padding:24px 16px 104px;}
  .content:has(> #view-planejamento.active) .topbar{gap:18px;}
  .content:has(> #view-planejamento.active) .topbar-actions{width:100%;}
  .planning-cycle-actions .btn{min-height:40px;}
  #view-planejamento .planning-summary{grid-template-columns:minmax(0,1fr);gap:18px;padding:18px;}
  #view-planejamento .planning-progress{border-left:0;border-top:1px solid var(--app-border);padding:18px 0 0;}
  #view-planejamento #pl-list{--cycle-index-width:42px;--cycle-progress-width:112px;--cycle-gap:10px;--cycle-inset:16px;}
  #view-planejamento .planning-sequence>.card-head{padding:12px 16px 0;gap:6px 10px;}
  #view-planejamento .cycle-sequencia-resumo{padding:0 16px 10px;}
  #pl-content>.planning-layout>.planning-composition:last-child{padding:20px;}
}
@media(max-width:600px){
  #view-planejamento #pl-list{--cycle-actions-width:92px;}
  #view-planejamento .cycle-columns{display:none;}
  #view-planejamento .cycle-row{align-items:start;position:relative;min-height:100px;padding:14px 16px;}
  #view-planejamento .cycle-row>.disc-dot{margin-top:6px;}
  #view-planejamento .cycle-intercalado .cycle-row-top{grid-template-columns:42px minmax(0,1fr);gap:12px 10px;}
  #view-planejamento .cycle-intercalado .cycle-name{grid-column:1/-1;min-height:20px;font-size:13px;}
  #view-planejamento .cycle-intercalado .cycle-block-index{grid-column:1;align-self:center;}
  #view-planejamento .cycle-intercalado .cycle-progress{grid-column:2;margin-right:calc(var(--cycle-actions-width) + 10px);min-height:44px;justify-content:center;}
  #view-planejamento .cycle-row .cycle-actions{position:absolute;right:16px;bottom:12px;}
  #view-planejamento .cycle-row .icon-btn{width:44px;height:44px;}
  #view-planejamento .cycle-row.current{min-height:108px;}
  #view-planejamento .cycle-row.current .cycle-name{font-size:14px;}
  #view-planejamento .cycle-time{font-size:11px;}
  #view-planejamento .cycle-row.done .cycle-time{white-space:normal;}
  #view-planejamento .cycle-agrupado .cycle-row-top{grid-template-columns:minmax(0,1fr);gap:6px;}
  #view-planejamento .cycle-agrupado .cycle-progress{grid-column:1;margin-right:calc(var(--cycle-actions-width) + 10px);min-height:44px;justify-content:center;}
  #view-planejamento .cycle-agrupado .cycle-time,#view-planejamento .cycle-agrupado .cycle-bar{grid-column:auto;grid-row:auto;}
  #view-planejamento .cycle-group-head>span:last-child{flex-basis:100%;margin:0 0 0 15px;}
}