:root{ --bg:#0b0f14; --panel:#111827; --muted:#9aa0aa; --text:#e5e7eb; --acc:#22d3ee; --line:#1f2937; --ok:#10b981; --warn:#f59e0b; --bad:#ef4444 }
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0; font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu; background:var(--bg); color:var(--text)}
code{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace}
.container{max-width:1200px; margin:0 auto; padding:24px}
header{display:flex; gap:16px; align-items:center; justify-content:space-between; margin-bottom:16px}
.brand{display:flex; align-items:center; gap:12px}
.logo{width:40px; height:40px; border-radius:12px; background:linear-gradient(135deg,var(--acc),#60a5fa); display:grid; place-items:center; font-weight:800; color:#000}
.title h1{margin:0}
.title small{display:block; color:var(--muted); font-weight:500}
.controls{display:flex; flex-wrap:wrap; gap:8px}
.search{position:relative}
.search input{background:#0f1623; border:1px solid var(--line); color:var(--text); padding:10px 36px 10px 12px; border-radius:10px; outline:none; width:280px}
.search .ico{position:absolute; right:10px; top:50%; transform:translateY(-50%); color:var(--muted); font-size:12px}
.filters{display:flex; gap:8px; flex-wrap:wrap}
.chip{background:#0f1623; border:1px solid var(--line); padding:8px 10px; border-radius:10px; display:flex; gap:8px; align-items:center}
.chip>select,.chip>input{background:transparent; border:none; color:var(--text); outline:none}
.btn{background:#0f1623; border:1px solid var(--line); color:var(--text); padding:8px 12px; border-radius:10px; cursor:pointer}
.btn:hover{border-color:#334155}
.btn-primary{background:linear-gradient(135deg,var(--acc),#60a5fa); color:#0b1220; border-color:transparent}
.btn-lg{padding:12px 16px; font-weight:700}
.btn-ghost{background:transparent}
.btn-small{padding:6px 10px; font-size:12px}
.hero{border:1px solid var(--line); background:linear-gradient(180deg, rgba(34,211,238,0.08), transparent); border-radius:16px; padding:20px; margin:10px 0}
.hero h2{margin:0 0 6px 0}
.hero p{margin:0 0 12px 0; color:var(--muted)}
.bar{display:flex; align-items:center; justify-content:space-between; gap:16px; margin:12px 0}
.summary{color:var(--muted)}
.grid{display:grid; grid-template-columns:repeat(12,1fr); gap:12px}
.card{grid-column:span 6; background:var(--panel); border:1px solid var(--line); border-radius:16px; overflow:hidden; display:flex; flex-direction:column}
@media (min-width:1000px){.card{grid-column:span 4}}
@media (max-width:640px){.card{grid-column:span 12}}
.input-select{background:#0f1623; border:1px solid var(--line); color:var(--text); padding:10px 12px; border-radius:10px; min-width:220px}

/* Mobile tweaks */
@media (max-width:480px){
  .container{padding:16px}
  header{flex-direction:column; align-items:stretch; gap:12px}
  .controls{flex-direction:column; align-items:stretch; gap:10px}
  .search input{width:100%}
  .filters{flex-direction:column}
  .chip{width:100%; justify-content:space-between}
  .hero-actions{display:flex; flex-direction:column; gap:8px}
  .grid{gap:10px}
  .card-head{flex-direction:column; align-items:flex-start}
  .card-foot{justify-content:stretch; gap:8px}
  .card-foot .btn{flex:1}
  .detail header{flex-direction:column; align-items:stretch; gap:10px}
  .detail .grid-2{grid-template-columns:1fr}
  .kv{grid-template-columns:1fr}
  .window-controls{flex-wrap:wrap; gap:6px}
  .schedule{grid-auto-columns:minmax(140px, 1fr)}
  .schedule .day{min-width:140px; padding:8px}
  .schedule .task{font-size:11px}
}
.card-head{display:flex; align-items:flex-start; justify-content:space-between; gap:8px; padding:14px 14px 0}
.card-title h3{margin:0 0 4px 0; font-size:16px}
.card-title .sub{color:var(--muted); font-size:12px; display:flex; gap:10px; flex-wrap:wrap}
.pill{border:1px solid var(--line); padding:6px 8px; border-radius:999px; font-size:12px; color:var(--muted)}
.card-body{padding:12px 14px 0}
.tags{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px}
.tags .tag{background:#0f1623; border:1px solid var(--line); padding:4px 8px; border-radius:999px; font-size:12px; color:var(--muted)}
.meta{display:grid; grid-template-columns:repeat(2,1fr); gap:8px; margin:0}
.meta dt{color:var(--muted); font-weight:600}
.meta dd{margin:0}
.card-foot{padding:12px 14px 14px; display:flex; justify-content:flex-end}
.card-foot .btn{margin-left:8px}
.dropzone{border:1px dashed #334155; border-radius:16px; padding:28px; background:#0f1623; color:var(--muted); text-align:center}
.dropzone.hidden{display:none}
.hidden{display:none}
.badge{font-size:11px; padding:2px 6px; border:1px solid var(--line); border-radius:6px; color:var(--muted)}
.badge.exists{border-color:var(--acc); color:#a5f3fc; background:rgba(34,211,238,0.08)}
.dir-list{display:grid; grid-template-columns:1fr; gap:6px}
.dir-item{display:flex; flex-wrap:wrap; align-items:center; gap:8px; background:#0f1623; border:1px solid var(--line); border-radius:10px; padding:8px 10px}
.dir-item .label{flex:1}
.dir-item .matches{display:flex; flex-wrap:wrap; gap:6px}
.detail{max-width:900px; margin:0 auto}
.detail header{display:flex; align-items:flex-start; justify-content:space-between; gap:16px}
.detail h1{margin:0}
.detail .pill{margin-top:6px}
.detail .grid-2{display:grid; grid-template-columns:1fr 1fr; gap:16px}
@media (max-width:800px){.detail .grid-2{grid-template-columns:1fr}}
.section{background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:16px}
.section h2{margin:0 0 10px 0; font-size:16px}
.section h2{display:flex; align-items:center; gap:8px}
.section h2::after{content:""; flex:1; height:1px; background:var(--line); opacity:.6}
.window-controls{display:inline-flex; gap:8px; margin-left:auto; align-items:center}
.btn-toggle.active{border-color:#60a5fa; color:#a5f3fc}
.cal-shift{margin-right:8px}
#win-label{margin:0 8px; color:#a5b4fc}
.kv{display:grid; grid-template-columns:200px 1fr; gap:8px; align-items:start}
@media (max-width:640px){.kv{grid-template-columns:1fr}}
.kv .k{color:var(--muted); font-weight:600}
.text{color:var(--text); white-space:pre-wrap}

/* Cronograma semanal */
.schedule{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(160px,1fr); gap:8px; overflow-x:auto; padding-bottom:8px; -webkit-overflow-scrolling:touch}
.schedule .day{background:#0f1623; border:1px solid var(--line); border-radius:10px; padding:10px; min-width:160px; position:relative; display:flex; flex-direction:column; gap:6px; overflow:hidden}
.schedule .day.today{outline:2px solid #60a5fa; outline-offset:0}
.schedule .day .d{display:flex; align-items:center; justify-content:space-between; font-size:12px; color:var(--muted); margin-bottom:6px}
.schedule .task{background:#0b1220; border:1px solid #0b1220; border-radius:8px; padding:6px 8px; font-size:12px; margin:0; display:flex; align-items:flex-start; gap:8px}
.schedule .task .tag{display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:6px; font-size:12px; flex:0 0 auto}
.schedule .task .rid{font-size:11px; color:#a5f3fc; border:1px solid #1f2a44; padding:2px 6px; border-radius:6px; flex:0 0 auto}
.schedule .task .text{flex:1 1 auto; min-width:0; white-space:normal; word-break:break-word}
.schedule .task details{margin-top:4px}
.schedule .task details summary{cursor:pointer; color:#a5b4fc}
.timeline .task details{margin-top:4px}
.timeline .task details summary{cursor:pointer; color:#a5b4fc}
.task .period{font-size:11px; color:#a3a3a3}
.schedule .more{font-size:12px; color:#a5b4fc; cursor:pointer; margin-top:4px}
.timeline{display:grid; grid-auto-flow:row; gap:6px}
.timeline .trow{display:flex; align-items:flex-start; gap:8px}
.timeline .trow .tdate{min-width:90px; color:#a5b4fc; font-size:12px}
.timeline .trow .tbody{flex:1; display:flex; flex-direction:column; gap:6px}
.timeline .task{align-items:flex-start}
.timeline .task .rid{margin-left:2px}
.timeline .task .text{flex:1 1 auto; min-width:0; white-space:normal; word-break:break-word}
.task-regar .tag{background:#0ea5e9; color:#001b2b}
.task-podar .tag{background:#a78bfa; color:#0b0f14}
.task-adubar .tag{background:#f59e0b; color:#0b0f14}
.task-capinar .tag{background:#10b981; color:#001b2b}
.task-outro .tag{background:#94a3b8; color:#0b0f14}
.task-semear .tag{background:#34d399; color:#05321f}
.task-transplantar .tag{background:#fbbf24; color:#3d2d00}
.task-colher_prev .tag{background:#60a5fa; color:#001b2b}
.task-colher .tag{background:#3b82f6; color:#001b2b}
.schedule .empty{color:var(--muted); font-size:12px}

/* Rotations collapsible */
details.rot{border:1px solid var(--line); border-radius:12px; margin:10px 0; overflow:hidden; background:#0f1623}
details.rot summary{cursor:pointer; padding:10px 12px; list-style:none; outline:none}
details.rot[open] summary{border-bottom:1px solid var(--line)}
details.rot .body{padding:12px}

@media (min-width: 1100px){
  .schedule{grid-auto-columns:minmax(200px,1fr)}
}