/* DUVY news: real text and responsive art, using the shared UI typography. */

.team.is-board #duvy-tutorial-news{position:relative;display:flex;flex-direction:column;padding:0;margin:0;border-radius:14px;background:#edeae0;color:var(--duv-ink);font-family:var(--duv-font-ui);overflow:visible;animation:none}
.tutorial-layout{box-sizing:border-box;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.35fr) minmax(0,1fr);gap:clamp(12px,2vw,32px);align-items:center;flex:1 0 auto;min-width:0;min-height:min-content;padding:clamp(18px,2vw,34px) clamp(22px,3vw,48px) 24px;background:radial-gradient(ellipse at 45% 48%,#fff8,transparent 67%);border-radius:inherit}
.tutorial-duvy-column,.tutorial-nest-column{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.team .tutorial-character{display:block;position:relative;flex:none;min-height:0;margin:0;padding:0;border:0!important;background:transparent!important;box-shadow:none!important;transform:none!important;cursor:pointer;line-height:0;color:inherit}
.tutorial-duvy{width:min(100%,310px,calc(clamp(215px,36vh,395px) * .833333))}
.tutorial-duvy>img{display:block;width:100%;height:auto}
.tutorial-character:focus-visible{outline:2px dashed var(--duv-blue);outline-offset:5px;border-radius:48%}
.tutorial-intro{text-align:center;min-width:0}
.tutorial-intro p,.tutorial-intro h2,.tutorial-intro h3{margin:0;font-family:inherit}
.tutorial-kicker{font-size:clamp(10px,.8vw,14px);font-weight:600;letter-spacing:.24em}
.team.is-board #tutorial-title{font-family:inherit;font-size:clamp(37px,4.5vw,76px);font-weight:600;line-height:1.05;letter-spacing:-.055em;margin:10px 0 12px;color:var(--duv-ink)}
#tutorial-title span{color:var(--duv-blue-action)}
.tutorial-intro h3{font-size:clamp(20px,1.8vw,31px);font-weight:500;line-height:1.2;letter-spacing:-.03em}
.tutorial-intro .tutorial-pitch{max-width:440px;margin:20px auto;font-size:clamp(13px,1.1vw,18px);line-height:1.6;color:#3f5d68;text-wrap:balance}
.team .tutorial-concept{display:inline-flex;align-items:center;justify-content:center;gap:12px;max-width:100%;padding:10px 17px;border:1px solid #adc3cb;border-radius:9px;background:#fff9;color:var(--duv-ink);font-family:inherit;font-size:clamp(12px,.9vw,15px);font-weight:500;line-height:1.35;box-shadow:none;transform:none}
.team .tutorial-concept:hover,.team .tutorial-concept:focus-visible{background:var(--duv-blue-action);border-color:var(--duv-blue-action);color:#fff}
.tutorial-intro .tutorial-session-tip{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;max-width:350px;font-size:clamp(12px,.85vw,14px);font-weight:400;line-height:1.6;letter-spacing:normal;color:var(--duv-muted);margin:22px auto 0;text-align:center}
.tutorial-session-tip>svg{flex:0 0 28px;width:28px;height:28px;margin:0;fill:var(--duv-blue-action);stroke:var(--duv-blue-action);stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}.tutorial-session-tip>span{min-width:0;text-wrap:balance}.tutorial-document-status:empty{display:none}.tutorial-document-status{font-size:11px;line-height:1.5;margin-top:7px!important}
.tutorial-note{position:relative;text-align:center;color:#1b5877;font-family:var(--duv-font-note)}
.tutorial-note strong{font-family:inherit;display:block;font-size:clamp(16px,1.25vw,22px);font-weight:600;line-height:1.5}
.tutorial-note p{margin:2px 0 0;font-family:inherit;font-size:clamp(11px,.9vw,15px);line-height:1.5}
.tutorial-duvy-note{margin-top:3px;margin-left:30px}
.tutorial-nest{width:min(82%,245px,clamp(160px,27vh,295px));aspect-ratio:1;margin:5px 0!important}
.tutorial-nest>img{display:block;width:100%;height:100%;object-fit:contain}
.tutorial-unread{position:absolute;right:1%;top:6%;display:grid;place-items:center;min-width:34px;aspect-ratio:1;padding:4px;border-radius:50%;background:var(--duv-green-deep);color:#fff;border:2px solid #edeae0;font:500 clamp(18px,1.6vw,28px)/1 var(--duv-font-ui)}
.tutorial-notification-note{margin-bottom:4px;align-self:stretch;padding-right:18px}
.tutorial-home-note{margin-top:5px;max-width:90%}
@media(min-width:1001px) and (max-height:750px){.tutorial-layout{padding-top:18px;padding-bottom:20px}.tutorial-duvy{width:min(100%,212px)}.tutorial-nest{width:min(82%,180px)}.tutorial-pitch{margin-top:14px!important;margin-bottom:14px!important}.tutorial-intro .tutorial-session-tip{margin-top:15px}}
@media(max-width:1000px){.tutorial-layout{grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr) minmax(0,1fr);padding:20px 22px;gap:10px}.tutorial-duvy-note{margin-left:10px}.tutorial-duvy-note>svg{left:-22px}.tutorial-note strong{font-size:15px}.tutorial-note p{font-size:11px}.tutorial-unread{min-width:29px;font-size:18px}.tutorial-home-note>svg{left:-16px}}
@media(max-width:850px){.tutorial-layout{grid-template-columns:1fr 1fr;align-content:start;gap:26px 18px;padding:25px 22px 36px}.tutorial-intro{grid-column:1/-1;grid-row:1}.tutorial-duvy-column{grid-column:1;grid-row:2}.tutorial-nest-column{grid-column:2;grid-row:2}.team.is-board #tutorial-title{font-size:42px}.tutorial-intro .tutorial-pitch{font-size:14px;max-width:360px;margin:14px auto}.tutorial-intro h3{font-size:23px}.tutorial-intro .tutorial-session-tip{margin-top:14px}.tutorial-duvy{width:min(100%,192px)}.tutorial-nest{width:min(82%,145px)}.tutorial-duvy-note{margin-left:0}.tutorial-note strong{font-size:14px}.tutorial-note p{font-size:11px}.tutorial-note>svg{width:25px}.tutorial-notification-note{padding-right:8px}.tutorial-notification-note>svg{right:-8px}.tutorial-home-note>svg{left:-15px}.tutorial-duvy-note>svg{left:-17px}.tutorial-unread{min-width:24px;font-size:15px}}

/* The article grows with its live text on narrow or short screens. */
.team.is-board .news-slot:has(> #duvy-tutorial-news:not([hidden])){grid-template-rows:auto;flex-basis:auto}
.team.is-board .news-slot > #duvy-tutorial-news{min-height:max-content}

/* Static pencil illustrations. Connectors follow measured targets at every size. */
.tutorial-duvy-column,.tutorial-nest-column{box-sizing:border-box;padding-inline:22px}
.tutorial-duvy-note,.tutorial-home-note{margin:18px 0 0;max-width:260px;width:100%}
.tutorial-notification-note{align-self:center;width:100%;max-width:260px;padding:0;margin:0 0 20px}
.tutorial-note strong,.tutorial-note p{text-wrap:balance}
.tutorial-arrows{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;fill:none;stroke:#1b5877;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.tutorial-character,.tutorial-character img{animation:none!important;transition:none!important;transform:none!important;filter:none!important}
@media(max-width:1000px){.tutorial-duvy-column,.tutorial-nest-column{padding-inline:18px}.tutorial-duvy-note,.tutorial-home-note{margin:16px 0 0;max-width:100%}.tutorial-notification-note{padding:0;margin:0 0 16px}}

.tutorial-note strong,.tutorial-note p{width:fit-content;max-width:100%;margin-inline:auto}

@media(max-width:520px){.tutorial-layout{grid-template-columns:minmax(0,1fr);gap:30px;padding-inline:20px}.tutorial-intro{grid-column:1;grid-row:1}.tutorial-duvy-column{grid-column:1;grid-row:2}.tutorial-nest-column{grid-column:1;grid-row:3}.tutorial-duvy-column,.tutorial-nest-column{padding-inline:24px}.tutorial-nest{width:min(100%,180px)}.tutorial-note strong{font-size:16px}.tutorial-note p{font-size:13px;line-height:1.5}.tutorial-note{max-width:250px}}

/* Pencil habitat belongs to each illustration, so it follows responsive reflow. */
.team .tutorial-character{isolation:isolate;z-index:0}
.tutorial-character::before{content:'';display:block;position:absolute;pointer-events:none;z-index:-1;left:50%;bottom:-4%;width:min(180%,calc(100vw - 48px));height:90%;transform:translateX(-50%);background:url('tutorial-entorno-lapiz.webp') center bottom/contain no-repeat;opacity:.78}
.tutorial-character::after{content:'';display:block;position:absolute;pointer-events:none;z-index:-1;inset:-7% -17% 2%;border:1px solid #5489a04a;border-right-color:transparent;border-bottom-color:transparent;border-radius:48% 52% 45% 55%;transform:rotate(-12deg)}
.tutorial-duvy-column{padding-top:10px}
.tutorial-nest::before{width:min(195%,calc(100vw - 48px));height:110%;bottom:-6%;opacity:.73}
.tutorial-nest::after{inset:-13% -15% 0;transform:rotate(10deg);border-top-style:dashed}
.tutorial-duvy-note,.tutorial-home-note{margin-top:24px}
.tutorial-arrows{z-index:2}
@media(max-width:1000px){.tutorial-character::before{width:170%}.tutorial-nest::before{width:185%}}
@media(max-width:520px){.tutorial-character::before,.tutorial-nest::before{width:min(170%,calc(100vw - 64px))}.tutorial-character::after{inset:-5% -10% 3%}.tutorial-duvy-note,.tutorial-home-note{margin-top:25px}}

/* Corvo joins the existing pencil news: same typography and measured arrows. */
.tutorial-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.2fr) minmax(0,.9fr) minmax(0,.85fr);gap:clamp(12px,1.4vw,25px);padding-inline:clamp(22px,2vw,38px)}
.tutorial-corvo-column{position:relative;box-sizing:border-box;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-inline:22px}
.tutorial-duvy{width:min(100%,265px,calc(clamp(215px,32vh,355px) * .833333))}
.team .tutorial-corvo{cursor:default;width:min(100%,285px,calc(clamp(245px,37vh,390px) * .833333))}
.tutorial-corvo>img{display:block;width:100%;height:auto}
.team .tutorial-character.tutorial-corvo>img{transform:scaleX(-1)!important}
.tutorial-corvo-note{margin:24px 0 0;max-width:260px;width:100%}
.tutorial-corvo::after{transform:rotate(9deg);border-top-style:dashed}
@media(min-width:1101px) and (max-height:750px){.tutorial-duvy{width:min(100%,195px)}.team .tutorial-corvo{width:min(100%,220px)}.tutorial-note strong{font-size:17px}.tutorial-note p{font-size:12px}.tutorial-intro .tutorial-pitch{font-size:14px}}
@media(max-width:1100px){
 .tutorial-layout{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 16px;align-content:start;padding:25px 22px 36px}
 .tutorial-intro{grid-column:1/-1;grid-row:1}
 .tutorial-duvy-column{grid-column:1;grid-row:2}
 .tutorial-nest-column{grid-column:2;grid-row:2}
 .tutorial-corvo-column{grid-column:3;grid-row:2;padding-inline:18px}
 .tutorial-duvy{width:min(100%,192px)}.team .tutorial-corvo{width:min(100%,218px)}
 .team.is-board #tutorial-title{font-size:42px}
 .tutorial-intro .tutorial-pitch{font-size:14px;max-width:440px;margin:14px auto}
 .tutorial-intro h3{font-size:23px}.tutorial-intro .tutorial-session-tip{margin-top:14px}
 .tutorial-note strong{font-size:15px}.tutorial-note p{font-size:12px}
}
@media(max-width:650px){
 .tutorial-layout{grid-template-columns:minmax(0,1fr);gap:32px;padding-inline:20px}
 .tutorial-intro{grid-column:1;grid-row:1}
 .tutorial-duvy-column{grid-column:1;grid-row:2}
 .tutorial-nest-column{grid-column:1;grid-row:3}
 .tutorial-corvo-column{grid-column:1;grid-row:4;padding-inline:24px}
 .tutorial-nest{width:min(100%,180px)}.tutorial-note strong{font-size:16px}.tutorial-note p{font-size:13px}
 .tutorial-corvo-note{max-width:250px}
}

/* Libélula aprobada: verde reservado al estado sin pendientes. */
.team .tutorial-nest>img.tutorial-dragonfly{position:absolute;left:1%;top:-7%;width:49%;height:auto;object-fit:contain;z-index:3;pointer-events:none}
.team .tutorial-nest>img.tutorial-dragonfly[hidden]{display:none!important}
.tutorial-peace-note{margin-top:14px;color:var(--duv-green-deep,#4B6640);max-width:290px}
.tutorial-peace-note strong{font-size:clamp(14px,1vw,17px)}
.tutorial-peace-note p{font-size:clamp(11px,.8vw,13px)}
.team.is-board #duvy-tutorial-news .tutorial-peace-note,.team.is-board #duvy-tutorial-news .tutorial-peace-note strong,.team.is-board #duvy-tutorial-news .tutorial-peace-note p{color:var(--duv-green-deep,#4B6640)}
@media(min-width:1101px){
 .tutorial-nest{width:min(82%,195px,23vh)}
 .tutorial-nest-column .tutorial-notification-note{margin-bottom:12px}
 .tutorial-nest-column .tutorial-home-note{margin-top:14px}
 .tutorial-peace-note{margin-top:8px}
 .tutorial-home-note p{font-size:13px}
 .tutorial-nest-column .tutorial-note{max-width:310px}
}

.team .duvy-nest .duvy-nest-art>img.duvy-dragonfly{position:absolute;left:4%;top:-9%;width:49%;height:auto;object-fit:contain;z-index:4;pointer-events:none;filter:none;animation:none;transform:none}
.team .duvy-nest .duvy-nest-art>img.duvy-dragonfly[hidden]{display:none!important}

/* Gentle Live DUV star shimmer; no layout movement. */
.team .tutorial-session-tip svg{animation:duv-session-star 2s ease-in-out infinite}
@keyframes duv-session-star{0%,100%{opacity:1;filter:drop-shadow(0 0 7px #176c9870)}50%{opacity:.12;filter:drop-shadow(0 0 0 transparent)}}
@media(prefers-reduced-motion:reduce){.team .tutorial-session-tip svg{animation:none}}

/* Only the nest rests on a leafy branch; the birds retain their grass. */
.team .tutorial-nest::before{background-image:url('tutorial-rama-lapiz.webp');width:165%;height:55%;bottom:-7%;opacity:.85}