/* 2026-11-02 15:03~15:04 대표님: 시작 카드·보안 카드 흰 상자 모양이 폭에 따라 깨짐(휴대폰은 납작·제각각, PC 창을 줄이면 셋째 카드만 가운데·좁음, 설명 들여쓰기) → 모든 폭에서 PC와 같은 규칙.
   - 흰 그림 상자 높이는 PC와 같은 340px 하나(휴대폰 350폭에서 거의 정사각형), 안 내용은 세로 가운데
   - 1100px 이상: 3칸(영어 글이 길어 1024에서 넘쳐서 1100으로) / 그 아래: 1칸, 카드 폭 최대 560px, 왼쪽 기준선에 붙임
   - 카드 안 제목·설명·그림은 같은 왼쪽 시작점 (DESIGN-PARTS-RULES §6) */
@layer daytoyear-type{
html body #start .answer-cards,html body #security .bento{display:grid!important;gap:40px 24px!important}
@media (min-width:1100px){html body #start .answer-cards,html body #security .bento{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media (max-width:1099px){html body #start .answer-cards,html body #security .bento{grid-template-columns:minmax(0,560px)!important;justify-content:start!important}}
html body #start .answer-cards>.answer-card{grid-column:auto!important;width:auto!important;max-width:none!important;align-items:stretch!important;justify-items:stretch!important;text-align:left!important}
html body #start .answer-card p.card-answer,html body #start .answer-card h3{max-width:none!important;margin-left:0!important;margin-right:0!important;align-self:stretch!important}
html body #start .answer-card .broker-line-figure{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important;align-self:stretch!important;height:auto!important}
html body #start .answer-card .broker-line-stage,html body #start .answer-card .od-stage{height:340px!important;min-height:340px!important;max-height:none!important;width:100%!important;max-width:none!important;box-sizing:border-box!important;display:flex!important;flex-direction:column!important;justify-content:center!important}
html body #start .answer-card .sk-stage,html body #start .answer-card .od-stage{align-items:stretch!important}
html body #start .answer-card .broker-line-stage:not(.sk-stage){flex-direction:row!important;align-items:center!important;justify-content:center!important}
html body #security section.card .vis{height:340px!important;min-height:340px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:stretch!important;box-sizing:border-box!important}
}
/* 2026-11-02 정렬·줄바꿈 검수(데모·How it works 안쪽까지): 보안 카드 "DAYtoYEAR" 글자가 좁은 PC 폭에서 "DAYtoYEA / R"로 쪼개짐 → 한 덩어리 */
@layer daytoyear-type{html body #security .va-k{white-space:nowrap!important}
/* How it works 대화 말풍선·카드 글: 마지막 줄에 한 어절만 남지 않게 */
html body #experience :where(p,div,span,b,strong,em,small,li){text-wrap:balance}}
/* 2026-11-02 17:26 대표님 "ㅇㅇ 이렇게 하자": 보안 섹션 제목을 "쓰던 ChatGPT·Claude로 써요."로, 아래에 연결할 수 있는 AI 이름표 */
@layer daytoyear-type{html body .security-head .ai-names{display:flex!important;gap:8px;flex-wrap:wrap;margin:14px 0 0!important}html body .security-head .ai-names span{display:inline-block;border:1px solid #DCDDD6;background:#fff;border-radius:999px;padding:3px 14px;font-size:16px!important;line-height:1.5;color:#16201E!important}}
