/* 自動生成ファイル（tools/build.py）。直接編集しないこと。元は design-rough/plan-a〜d/index.html */
/* ===== 案A キラキラピンク ===== */
.tpl-a { --font-sans: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", "Meiryo", sans-serif;
    --font-display: "Hiragino Maru Gothic ProN", "Rounded Mplus 1c", "BIZ UDPGothic", sans-serif;

    
    --bg-canvas: #261820;
    --sheet-bg: linear-gradient(160deg, #fff9fc 0%, #fff0f7 50%, #fef3ef 100%);
    --sheet-border: #df6da3;
    --sheet-inner-border: #efb86e;

    --header-bg: linear-gradient(135deg, #c63676 0%, #e45a97 48%, #f18fb5 80%, #f5c094 100%);
    --header-border: #e5b05c;

    --card-bg: rgba(255, 255, 255, 0.94);
    --card-border: #eea5c8;
    --label-bg: linear-gradient(90deg, #c63676 0%, #e25c98 65%, #ec84ae 100%);
    --label-border-bottom: #e5b05c;
    --label-text: #ffffff;

    --sub-label-bg: linear-gradient(90deg, #fce2ef 0%, #fdf0e6 100%);
    --sub-label-border: #eba4c6;
    --sub-label-text: #98245c;

    --accent-primary: #d43f80;
    --accent-secondary: #e872a7;
    --accent-gold: #c8923b;
    --accent-gold-light: #f9ebd2;
    --divider-line: #f0bdd6;
    --divider-Accent: #e5b05c;

    --text-main: #381e2c;
    --text-muted: #7d5268;
    --empty-slot-bg: rgba(252, 232, 242, 0.5);
    --empty-slot-border: #eabdd3; }
.tpl-a, .tpl-a * { box-sizing: border-box;
    margin: 0;
    padding: 0; }
.tpl-a { font-family: var(--font-sans);
    background: var(--bg-canvas);
    color: var(--text-main);
    padding: 20px 24px 36px;
    line-height: 1.5; }
.tpl-a .precure-sheet { width: 1080px;
    min-height: 1420px;
    background: var(--sheet-bg);
    border: 3px solid var(--sheet-border);
    border-radius: 22px;
    padding: 18px 24px 16px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
    display: flex;
    flex-direction: column;
    justify-content: space-between; }
.tpl-a .precure-sheet::before { content: "";
    position: absolute;
    inset: 8px;
    border: 1.5px solid var(--sheet-inner-border);
    border-radius: 16px;
    opacity: 0.65;
    pointer-events: none; }
.tpl-a .bg-decor-svg { position: absolute;
    pointer-events: none;
    z-index: 0;
    opacity: 0.22; }
.tpl-a .bg-decor-top-right { top: -30px;
    right: -30px;
    width: 270px;
    height: 270px; }
.tpl-a .bg-decor-bottom-left { bottom: -30px;
    left: -30px;
    width: 250px;
    height: 250px; }
.tpl-a .sheet-content { position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 11px;
    flex: 1; }
.tpl-a .sheet-header { background: var(--header-bg);
    border: 2px solid var(--header-border);
    border-radius: 13px;
    padding: 9px 16px;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 3px 12px rgba(198, 54, 118, 0.22); }
.tpl-a .header-sparkles { position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.35; }
.tpl-a .header-left { position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    min-width: 0; }
.tpl-a .title-row { display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: nowrap; }
.tpl-a .sheet-title { font-family: "Hiragino Kaku Gothic StdN", "Hiragino Kaku Gothic Std", "Hiragino Sans", "BIZ UDPGothic", "Noto Sans CJK JP", "Noto Sans JP", "Meiryo", sans-serif;
    font-size: 28px;
    font-weight: 900;
    letter-spacing: 0.04em;
    line-height: 1.15;
    -webkit-text-stroke: 1.5px #ffffff;
    paint-order: stroke fill;
    text-shadow: 0 2px 6px rgba(110, 20, 62, 0.48), 0 0 2px rgba(110, 20, 62, 0.35);
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap; }
.tpl-a .sheet-title svg { flex-shrink: 0; }
.tpl-a .sheet-no-badge { background: rgba(255, 255, 255, 0.28);
    border: 1.5px solid #fff3d1;
    padding: 2px 11px;
    border-radius: 999px;
    font-size: 13.5px;
    font-weight: 900;
    letter-spacing: 0.05em;
    white-space: nowrap;
    flex-shrink: 0; }
.tpl-a .sheet-subtitle { font-size: 11.5px;
    color: rgba(255, 255, 255, 0.96);
    font-weight: 600;
    white-space: nowrap; }
.tpl-a .header-right { position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 4px;
    flex-shrink: 0; }
.tpl-a .date-box { background: rgba(255, 255, 255, 0.94);
    color: #8c2255;
    padding: 3px 11px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    border: 1px solid #e5b05c;
    white-space: nowrap;
    flex-shrink: 0; }
.tpl-a .header-credit-mini { font-size: 10.5px;
    color: rgba(255, 255, 255, 0.94);
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0; }
.tpl-a .section-card { background: var(--card-bg);
    border: 1.5px solid var(--card-border);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 7px rgba(212, 63, 128, 0.07);
    display: flex;
    flex-direction: column; }
.tpl-a .section-header { background: var(--label-bg);
    color: var(--label-text);
    padding: 4.5px 12px;
    font-size: 12.5px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: space-between;
    letter-spacing: 0.02em;
    border-bottom: 2px solid var(--label-border-bottom); }
.tpl-a .section-header .title-with-icon { display: flex;
    align-items: center;
    gap: 6px; }
.tpl-a .header-motif { color: #ffe7a8;
    font-size: 12px; }
.tpl-a .section-header .sub-hint { font-size: 10.5px;
    font-weight: 600;
    color: #fff5fb;
    background: rgba(120, 18, 66, 0.28);
    padding: 1px 8px;
    border-radius: 999px; }
.tpl-a .section-body { padding: 9px 13px;
    flex: 1; }
.tpl-a .profile-grid { display: grid;
    grid-template-columns: 1fr 210px;
    gap: 12px;
    align-items: stretch; }
.tpl-a .top-left-stack { display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 11px;
    min-width: 0; }
.tpl-a .profile-fields { display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
    flex: 1; }
.tpl-a .profile-row-1 { display: grid;
    grid-template-columns: 1.6fr 0.8fr;
    gap: 10px;
    flex: 1; }
.tpl-a .profile-row-2 { display: grid;
    grid-template-columns: 0.9fr 0.9fr 1.6fr;
    gap: 10px;
    flex: 1; }
.tpl-a .profile-fields .section-body { display: flex;
    align-items: center; }
.tpl-a .field-value { font-size: 16px;
    font-weight: 700;
    color: var(--text-main);
    min-height: 32px;
    display: flex;
    align-items: center; }
.tpl-a .avatar-box { width: 210px;
    min-height: 268px;
    height: 100%;
    border-radius: 13px;
    border: 2.5px solid var(--accent-primary);
    box-shadow: inset 0 0 0 2px var(--accent-gold), 0 4px 12px rgba(212, 63, 128, 0.14);
    position: relative;
    overflow: hidden;
    background: linear-gradient(155deg, #ffdbe9 0%, #f9b8d4 48%, #fce1cb 100%);
    display: flex;
    align-items: center;
    justify-content: center; }
.tpl-a .avatar-cover-svg { position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; }
.tpl-a .crop-guide { position: absolute;
    width: 14px;
    height: 14px;
    border-color: rgba(255, 255, 255, 0.92);
    border-style: solid;
    z-index: 2;
    pointer-events: none; }
.tpl-a .crop-tl { top: 8px; left: 8px; border-width: 2.5px 0 0 2.5px; border-radius: 3px 0 0 0; }
.tpl-a .crop-tr { top: 8px; right: 8px; border-width: 2.5px 2.5px 0 0; border-radius: 0 3px 0 0; }
.tpl-a .crop-bl { bottom: 8px; left: 8px; border-width: 0 0 2.5px 2.5px; border-radius: 0 0 0 3px; }
.tpl-a .crop-br { bottom: 8px; right: 8px; border-width: 0 2.5px 2.5px 0; border-radius: 0 0 3px 0; }
.tpl-a .avatar-overlay-info { position: relative;
    z-index: 2;
    background: rgba(255, 250, 253, 0.92);
    border: 1.5px solid var(--accent-gold);
    border-radius: 10px;
    padding: 8px 10px;
    max-width: 190px;
    text-align: center;
    box-shadow: 0 3px 10px rgba(152, 36, 92, 0.18); }
.tpl-a .avatar-label { display: block;
    font-size: 12.5px;
    font-weight: 800;
    color: #a62460; }
.tpl-a .avatar-sub { display: block;
    font-size: 10.5px;
    font-weight: 600;
    color: var(--text-muted);
    margin-top: 2px; }
.tpl-a .two-col-fav { display: grid;
    grid-template-columns: 1.05fr 1.25fr;
    gap: 12px; }
.tpl-a .numbered-list { display: flex;
    flex-direction: column;
    gap: 6px; }
.tpl-a .numbered-item { display: flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(90deg, #fff5fa 0%, #fffbfd 100%);
    border: 1px solid var(--divider-line);
    border-left: 3.5px solid var(--accent-primary);
    border-radius: 8px;
    padding: 5px 10px;
    min-height: 32px; }
.tpl-a .num-badge { width: 22px;
    height: 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, #c63676, #ec73a8);
    border: 1px solid #f5d293;
    color: #fff;
    font-size: 11.5px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0; }
.tpl-a .free-note-box { margin-top: 6px;
    background: #fff9fc;
    border: 1.5px dashed #e296bc;
    border-radius: 8px;
    padding: 5px 10px;
    font-size: 12.5px;
    min-height: 48px; }
.tpl-a .free-note-label { font-size: 10.5px;
    font-weight: 700;
    color: var(--sub-label-text);
    display: block;
    margin-bottom: 2px; }
.tpl-a .text-area-box { font-size: 13px;
    line-height: 1.6;
    color: var(--text-main);
    min-height: 158px;
    padding: 3px 2px;
    white-space: pre-wrap; }
.tpl-a .series-recommend-table { width: 100%;
    border-collapse: separate;
    border-spacing: 0 5px; }
.tpl-a .series-recommend-table th { font-size: 11px;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-bottom: 1.5px solid var(--sub-label-border);
    text-align: left;
    padding: 3px 10px;
    border-radius: 5px; }
.tpl-a .series-recommend-row td { background: #fff8fb;
    border-top: 1px solid var(--divider-line);
    border-bottom: 1px solid var(--divider-line);
    padding: 5.5px 10px;
    font-size: 13px;
    vertical-align: middle; }
.tpl-a .series-recommend-row td:first-child { border-left: 3.5px solid var(--accent-primary);
    border-radius: 7px 0 0 7px;
    width: 34%;
    font-weight: 700; }
.tpl-a .series-recommend-row td:last-child { border-right: 1px solid var(--divider-line);
    border-radius: 0 7px 7px 0;
    font-size: 12.5px;
    border-left: 2px dotted var(--accent-secondary); }
.tpl-a .bottom-split-no1 { display: grid;
    grid-template-columns: 1.28fr 1fr;
    gap: 12px;
    flex: 1; }
.tpl-a .watched-header-bar { display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--sub-label-bg);
    border: 1px solid var(--sub-label-border);
    border-left: 3.5px solid var(--accent-primary);
    padding: 4px 10px;
    border-radius: 6px;
    margin-bottom: 6px;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--sub-label-text); }
.tpl-a .watched-grid { display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3.5px 10px; }
.tpl-a .watched-item { display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11.2px;
    padding: 2px 6px;
    border-bottom: 1px dashed var(--divider-line); }
.tpl-a .watch-mark { width: 19px;
    height: 19px;
    border-radius: 50%;
    background: linear-gradient(135deg, #fbd6e8, #f7bed9);
    border: 1px solid #df73a7;
    color: #9e1f5a;
    font-weight: 800;
    font-size: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0; }
.tpl-a .watch-mark.triangle { background: var(--accent-gold-light);
    border-color: var(--accent-gold);
    color: #9c6510; }
.tpl-a .extra-series-divider { grid-column: 1 / -1;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-left: 3px solid var(--accent-gold);
    padding: 2px 8px;
    border-radius: 4px;
    margin-top: 2px; }
.tpl-a .right-column-stack { display: flex;
    flex-direction: column;
    gap: 11px; }
.tpl-a .sub-section-tag { display: inline-block;
    font-size: 11px;
    font-weight: 700;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-left: 3px solid var(--accent-primary);
    padding: 2px 8px;
    border-radius: 4px;
    margin-bottom: 5px; }
.tpl-a .movies-two-col { display: grid;
    grid-template-columns: 1.05fr 1.15fr;
    gap: 12px; }
.tpl-a .songs-episodes-grid { display: grid;
    grid-template-columns: 0.82fr 1.38fr;
    gap: 12px; }
.tpl-a .episode-table { width: 100%;
    border-collapse: separate;
    border-spacing: 0 4px; }
.tpl-a .episode-table th { font-size: 10.5px;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-bottom: 1.5px solid var(--sub-label-border);
    text-align: left;
    padding: 3px 8px;
    border-radius: 4px; }
.tpl-a .episode-row td { background: #fff8fb;
    border-top: 1px solid var(--divider-line);
    border-bottom: 1px solid var(--divider-line);
    padding: 4.5px 8px;
    font-size: 11.8px;
    height: 29px; }
.tpl-a .episode-row td:first-child { border-left: 3px solid var(--accent-primary);
    border-radius: 6px 0 0 6px;
    font-weight: 700;
    width: 36%; }
.tpl-a .episode-row td.ep-num { width: 13%;
    text-align: center;
    font-weight: 800;
    color: var(--sub-label-text);
    background: #fce8f2;
    border-left: 1px dotted var(--divider-line);
    border-right: 1px dotted var(--divider-line); }
.tpl-a .episode-row td:last-child { border-right: 1px solid var(--divider-line);
    border-radius: 0 6px 6px 0; }
.tpl-a .episode-row.is-empty td { background: var(--empty-slot-bg);
    border-color: var(--empty-slot-border);
    color: transparent; }
.tpl-a .sheet-footer { position: relative;
    z-index: 1;
    margin-top: 8px;
    padding-top: 7px;
    border-top: 2px dotted var(--accent-secondary);
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
    color: var(--text-muted); }
.tpl-a .footer-left { display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap; }
.tpl-a .fanmade-badge { background: linear-gradient(90deg, #fce0ee, #faecd8);
    border: 1px solid var(--accent-secondary);
    color: #98245c;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10.5px; }
.tpl-a .footer-credit { font-weight: 700;
    color: #7c1c4b;
    background: #fff9fc;
    padding: 3px 12px;
    border-radius: 999px;
    border: 1.5px solid var(--accent-gold); }

/* ===== 案B ネイビー×スター ===== */
.tpl-b { --font-sans: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", "Meiryo", sans-serif;
    --font-display: "Hiragino Kaku Gothic ProN", "BIZ UDPGothic", sans-serif;

    
    --bg-canvas: #0b0f1c;
    --sheet-bg: linear-gradient(165deg, #0f1833 0%, #17264e 52%, #1d3163 100%);
    --sheet-border: #d9b23e;
    --sheet-inner-border: rgba(217, 178, 62, 0.48);

    --header-bg:
      radial-gradient(circle at 86% 25%, rgba(240, 194, 75, 0.28) 0%, transparent 45%),
      linear-gradient(135deg, #0d152e 0%, #1b3168 55%, #2b4c94 100%);
    --header-border: #e5be53;

    --card-bg: #f6f8fe;
    --card-border: #4a66a8;
    --label-bg: linear-gradient(90deg, #121f45 0%, #213875 65%, #2d4c99 100%);
    --label-border-bottom: #d9b23e;
    --label-text: #ffffff;

    --sub-label-bg: linear-gradient(90deg, #dce5f8 0%, #eaf0fc 100%);
    --sub-label-border: #8fa6d8;
    --sub-label-text: #162957;

    --accent-navy: #1d336b;
    --accent-blue: #355bb5;
    --accent-gold: #e5b842;
    --accent-gold-dark: #9c7112;
    --divider-line: #c4d2ee;

    --text-main: #151f36;
    --text-muted: #4e5f85;
    --empty-slot-bg: #eaeff9;
    --empty-slot-border: #c2cfe8; }
.tpl-b, .tpl-b * { box-sizing: border-box;
    margin: 0;
    padding: 0; }
.tpl-b { font-family: var(--font-sans);
    background: var(--bg-canvas);
    color: var(--text-main);
    padding: 20px 24px 36px;
    line-height: 1.5; }
.tpl-b .precure-sheet { width: 1080px;
    min-height: 1420px;
    background: var(--sheet-bg);
    border: 3px solid var(--sheet-border);
    border-radius: 18px;
    padding: 18px 24px 16px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 20px 55px rgba(0, 0, 0, 0.65);
    display: flex;
    flex-direction: column;
    justify-content: space-between; }
.tpl-b .precure-sheet::before { content: "";
    position: absolute;
    inset: 8px;
    border: 1.5px solid var(--sheet-inner-border);
    border-radius: 12px;
    pointer-events: none; }
.tpl-b .bg-decor-svg { position: absolute;
    pointer-events: none;
    z-index: 0;
    opacity: 0.2; }
.tpl-b .bg-decor-top-right { top: -40px;
    right: -40px;
    width: 310px;
    height: 310px; }
.tpl-b .bg-decor-bottom-left { bottom: -40px;
    left: -40px;
    width: 270px;
    height: 270px; }
.tpl-b .sheet-content { position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 11px;
    flex: 1; }
.tpl-b .sheet-header { background: var(--header-bg);
    border: 2px solid var(--header-border);
    border-radius: 12px;
    padding: 9px 16px;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 5px 16px rgba(0, 0, 0, 0.38); }
.tpl-b .header-constellation { position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.4; }
.tpl-b .header-left { position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    min-width: 0; }
.tpl-b .title-row { display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: nowrap; }
.tpl-b .sheet-title { font-family: "Hiragino Kaku Gothic StdN", "Hiragino Kaku Gothic Std", "Hiragino Sans", "BIZ UDPGothic", "Noto Sans CJK JP", "Noto Sans JP", "Meiryo", sans-serif;
    font-size: 28px;
    font-weight: 900;
    letter-spacing: 0.04em;
    line-height: 1.15;
    color: #ffffff;
    -webkit-text-stroke: 1.5px #ffffff;
    paint-order: stroke fill;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.65), 0 0 3px rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap; }
.tpl-b .sheet-title svg { flex-shrink: 0; }
.tpl-b .sheet-no-badge { background: linear-gradient(135deg, #f5d36c 0%, #d49f2a 100%);
    color: #0e1733;
    padding: 2px 11px;
    border-radius: 5px;
    font-size: 13.5px;
    font-weight: 900;
    letter-spacing: 0.05em;
    white-space: nowrap;
    flex-shrink: 0; }
.tpl-b .sheet-subtitle { font-size: 11.5px;
    color: #dbe6ff;
    font-weight: 500;
    white-space: nowrap; }
.tpl-b .header-right { position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 4px;
    flex-shrink: 0; }
.tpl-b .date-box { background: rgba(13, 22, 48, 0.88);
    color: #f6d87a;
    padding: 3px 11px;
    border-radius: 6px;
    font-size: 11.5px;
    font-weight: 700;
    border: 1px solid rgba(240, 194, 75, 0.7);
    white-space: nowrap;
    flex-shrink: 0; }
.tpl-b .header-credit-mini { font-size: 10.5px;
    color: #c7d6f7;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0; }
.tpl-b .section-card { background: var(--card-bg);
    border: 1.5px solid var(--card-border);
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.24);
    display: flex;
    flex-direction: column; }
.tpl-b .section-header { background: var(--label-bg);
    color: var(--label-text);
    padding: 4.5px 12px;
    font-size: 12.5px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 2px solid var(--label-border-bottom);
    letter-spacing: 0.03em; }
.tpl-b .section-header .title-with-icon { display: flex;
    align-items: center;
    gap: 6px; }
.tpl-b .star-icon { color: var(--accent-gold); }
.tpl-b .section-header .sub-hint { font-size: 10.5px;
    font-weight: 600;
    color: #f6d87a;
    background: rgba(9, 16, 38, 0.45);
    border: 1px solid rgba(229, 184, 66, 0.45);
    padding: 1px 8px;
    border-radius: 4px; }
.tpl-b .section-body { padding: 9px 13px;
    flex: 1; }
.tpl-b .profile-grid { display: grid;
    grid-template-columns: 1fr 210px;
    gap: 12px;
    align-items: stretch; }
.tpl-b .top-left-stack { display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 11px;
    min-width: 0; }
.tpl-b .profile-fields { display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
    flex: 1; }
.tpl-b .profile-row-1 { display: grid;
    grid-template-columns: 1.6fr 0.8fr;
    gap: 10px;
    flex: 1; }
.tpl-b .profile-row-2 { display: grid;
    grid-template-columns: 0.9fr 0.9fr 1.6fr;
    gap: 10px;
    flex: 1; }
.tpl-b .profile-fields .section-body { display: flex;
    align-items: center; }
.tpl-b .field-value { font-size: 16px;
    font-weight: 700;
    color: var(--text-main);
    min-height: 32px;
    display: flex;
    align-items: center; }
.tpl-b .avatar-box { width: 210px;
    min-height: 268px;
    height: 100%;
    border-radius: 10px;
    border: 2.5px solid var(--accent-gold);
    box-shadow: inset 0 0 0 2px #1c3269, 0 4px 14px rgba(0, 0, 0, 0.35);
    position: relative;
    overflow: hidden;
    background: linear-gradient(155deg, #101d3f 0%, #1e3875 55%, #2a529e 100%);
    display: flex;
    align-items: center;
    justify-content: center; }
.tpl-b .avatar-cover-svg { position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; }
.tpl-b .crop-guide { position: absolute;
    width: 14px;
    height: 14px;
    border-color: rgba(246, 216, 122, 0.9);
    border-style: solid;
    z-index: 2;
    pointer-events: none; }
.tpl-b .crop-tl { top: 8px; left: 8px; border-width: 2.5px 0 0 2.5px; }
.tpl-b .crop-tr { top: 8px; right: 8px; border-width: 2.5px 2.5px 0 0; }
.tpl-b .crop-bl { bottom: 8px; left: 8px; border-width: 0 0 2.5px 2.5px; }
.tpl-b .crop-br { bottom: 8px; right: 8px; border-width: 0 2.5px 2.5px 0; }
.tpl-b .avatar-overlay-info { position: relative;
    z-index: 2;
    background: rgba(14, 24, 52, 0.9);
    border: 1.5px solid var(--accent-gold);
    border-radius: 8px;
    padding: 8px 10px;
    max-width: 190px;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45); }
.tpl-b .avatar-label { display: block;
    font-size: 12.5px;
    font-weight: 800;
    color: #f6d87a; }
.tpl-b .avatar-sub { display: block;
    font-size: 10.5px;
    font-weight: 600;
    color: #c2d2f2;
    margin-top: 2px; }
.tpl-b .two-col-fav { display: grid;
    grid-template-columns: 1.05fr 1.25fr;
    gap: 12px; }
.tpl-b .numbered-list { display: flex;
    flex-direction: column;
    gap: 6px; }
.tpl-b .numbered-item { display: flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(90deg, #edf2fc 0%, #ffffff 100%);
    border: 1px solid var(--divider-line);
    border-left: 4px solid var(--accent-navy);
    border-radius: 6px;
    padding: 5px 10px;
    min-height: 32px; }
.tpl-b .num-badge { width: 22px;
    height: 22px;
    border-radius: 4px;
    background: linear-gradient(135deg, #162754, #2c4994);
    border: 1px solid var(--accent-gold);
    color: #f7d97e;
    font-size: 11.5px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0; }
.tpl-b .free-note-box { margin-top: 6px;
    background: #eaeff9;
    border: 1.5px dashed #7c95cc;
    border-radius: 6px;
    padding: 5px 10px;
    font-size: 12.5px;
    min-height: 48px; }
.tpl-b .free-note-label { font-size: 10.5px;
    font-weight: 700;
    color: var(--sub-label-text);
    display: block;
    margin-bottom: 2px; }
.tpl-b .text-area-box { font-size: 13px;
    line-height: 1.6;
    color: var(--text-main);
    min-height: 158px;
    padding: 3px 2px;
    white-space: pre-wrap; }
.tpl-b .series-recommend-table { width: 100%;
    border-collapse: separate;
    border-spacing: 0 5px; }
.tpl-b .series-recommend-table th { font-size: 11px;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-bottom: 1.5px solid var(--accent-gold);
    text-align: left;
    padding: 3px 10px;
    border-radius: 4px; }
.tpl-b .series-recommend-row td { background: #ffffff;
    border-top: 1px solid var(--divider-line);
    border-bottom: 1px solid var(--divider-line);
    padding: 5.5px 10px;
    font-size: 13px;
    vertical-align: middle; }
.tpl-b .series-recommend-row td:first-child { border-left: 4px solid var(--accent-navy);
    border-radius: 6px 0 0 6px;
    width: 34%;
    font-weight: 700; }
.tpl-b .series-recommend-row td:last-child { border-right: 1px solid var(--divider-line);
    border-radius: 0 6px 6px 0;
    font-size: 12.5px;
    border-left: 2px dotted #8fa6d8; }
.tpl-b .bottom-split-no1 { display: grid;
    grid-template-columns: 1.28fr 1fr;
    gap: 12px;
    flex: 1; }
.tpl-b .watched-header-bar { display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--sub-label-bg);
    border: 1px solid var(--sub-label-border);
    border-left: 4px solid var(--accent-navy);
    padding: 4px 10px;
    border-radius: 5px;
    margin-bottom: 6px;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--sub-label-text); }
.tpl-b .watched-grid { display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3.5px 10px; }
.tpl-b .watched-item { display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11.2px;
    padding: 2px 6px;
    border-bottom: 1px dashed var(--divider-line); }
.tpl-b .watch-mark { width: 19px;
    height: 19px;
    border-radius: 4px;
    background: var(--accent-navy);
    border: 1px solid var(--accent-gold);
    color: #f6d87a;
    font-weight: 800;
    font-size: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0; }
.tpl-b .watch-mark.triangle { background: #d99b26;
    border-color: #9c680c;
    color: #ffffff; }
.tpl-b .extra-series-divider { grid-column: 1 / -1;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-left: 3.5px solid var(--accent-gold);
    padding: 2px 8px;
    border-radius: 4px;
    margin-top: 2px; }
.tpl-b .right-column-stack { display: flex;
    flex-direction: column;
    gap: 11px; }
.tpl-b .sub-section-tag { display: inline-block;
    font-size: 11px;
    font-weight: 700;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-left: 3.5px solid var(--accent-navy);
    padding: 2px 8px;
    border-radius: 4px;
    margin-bottom: 5px; }
.tpl-b .movies-two-col { display: grid;
    grid-template-columns: 1.05fr 1.15fr;
    gap: 12px; }
.tpl-b .songs-episodes-grid { display: grid;
    grid-template-columns: 0.82fr 1.38fr;
    gap: 12px; }
.tpl-b .episode-table { width: 100%;
    border-collapse: separate;
    border-spacing: 0 4px; }
.tpl-b .episode-table th { font-size: 10.5px;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-bottom: 1.5px solid var(--accent-gold);
    text-align: left;
    padding: 3px 8px;
    border-radius: 4px; }
.tpl-b .episode-row td { background: #ffffff;
    border-top: 1px solid var(--divider-line);
    border-bottom: 1px solid var(--divider-line);
    padding: 4.5px 8px;
    font-size: 11.8px;
    height: 29px; }
.tpl-b .episode-row td:first-child { border-left: 3.5px solid var(--accent-navy);
    border-radius: 5px 0 0 5px;
    font-weight: 700;
    width: 36%; }
.tpl-b .episode-row td.ep-num { width: 13%;
    text-align: center;
    font-weight: 800;
    color: var(--sub-label-text);
    background: #e1eaf9;
    border-left: 1px dotted #9ab0de;
    border-right: 1px dotted #9ab0de; }
.tpl-b .episode-row td:last-child { border-right: 1px solid var(--divider-line);
    border-radius: 0 5px 5px 0; }
.tpl-b .episode-row.is-empty td { background: var(--empty-slot-bg);
    border-color: var(--empty-slot-border);
    color: transparent; }
.tpl-b .sheet-footer { position: relative;
    z-index: 1;
    margin-top: 8px;
    padding-top: 7px;
    border-top: 1.5px dashed rgba(229, 184, 66, 0.6);
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
    color: #c8d5f2; }
.tpl-b .footer-left { display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap; }
.tpl-b .fanmade-badge { background: rgba(240, 194, 75, 0.22);
    border: 1px solid rgba(240, 194, 75, 0.7);
    color: #ffe28a;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10.5px; }
.tpl-b .footer-credit { font-weight: 700;
    color: #0e1733;
    background: linear-gradient(135deg, #f6d87a 0%, #dfb043 100%);
    padding: 3px 12px;
    border-radius: 6px; }

/* ===== 案C ホワイト×レインボー ===== */
.tpl-c { --font-sans: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", "Meiryo", sans-serif;
    --font-display: "Hiragino Kaku Gothic ProN", "Rounded Mplus 1c", "BIZ UDPGothic", sans-serif;

    
    --bg-canvas: #1e2330;
    --rainbow-bar: linear-gradient(90deg, #e84882 0%, #f48b3b 20%, #dec22c 40%, #37b878 60%, #3596e8 80%, #8d58e6 100%);
    --rainbow-soft: linear-gradient(125deg, #ff6b9d 0%, #ffa952 22%, #edd84c 42%, #4fd190 62%, #4eb3f7 82%, #a272f5 100%);
    --rainbow-pastel: linear-gradient(90deg, #fde8f0 0%, #fef0e4 20%, #fcf8e3 40%, #e5f7ee 60%, #e6f2fc 80%, #f1eafc 100%);

    --sheet-bg: linear-gradient(180deg, #ffffff 0%, #f7faff 55%, #f2f6fc 100%);
    --sheet-border: #c5d1e8;

    --header-bg: linear-gradient(125deg, #e84882 0%, #f48b3b 22%, #dec22c 43%, #37b878 64%, #3596e8 83%, #8d58e6 100%);
    --header-text: #ffffff;
    --header-border: rgba(255, 255, 255, 0.9);

    --card-bg: #ffffff;
    --card-border: #cdd8ed;
    --label-bg: linear-gradient(90deg, #25304d 0%, #36466e 60%, #445887 100%);
    --label-text: #ffffff;

    --sub-label-bg: var(--rainbow-pastel);
    --sub-label-border: #b8c7e6;
    --sub-label-text: #25304d;

    --accent-pink: #e84882;
    --accent-blue: #3596e8;
    --accent-orange: #f29a38;
    --accent-green: #37b878;
    --accent-purple: #8d58e6;
    --divider-line: #d5dfef;

    --text-main: #1e2638;
    --text-muted: #56637e;
    --empty-slot-bg: #f5f8fc;
    --empty-slot-border: #d6e0f0; }
.tpl-c, .tpl-c * { box-sizing: border-box;
    margin: 0;
    padding: 0; }
.tpl-c { font-family: var(--font-sans);
    background: var(--bg-canvas);
    color: var(--text-main);
    padding: 20px 24px 36px;
    line-height: 1.5; }
.tpl-c .precure-sheet { width: 1080px;
    min-height: 1420px;
    background: var(--sheet-bg);
    border: 2.5px solid var(--sheet-border);
    border-radius: 20px;
    padding: 22px 24px 18px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
    display: flex;
    flex-direction: column;
    justify-content: space-between; }
.tpl-c .precure-sheet::before { content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 7px;
    background: var(--rainbow-bar); }
.tpl-c .precure-sheet::after { content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 6px;
    background: var(--rainbow-bar); }
.tpl-c .bg-decor-svg { position: absolute;
    pointer-events: none;
    z-index: 0;
    opacity: 0.18; }
.tpl-c .bg-decor-top-right { top: 15px;
    right: -20px;
    width: 250px;
    height: 250px; }
.tpl-c .bg-decor-bottom-left { bottom: 10px;
    left: -20px;
    width: 230px;
    height: 230px; }
.tpl-c .sheet-content { position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 11px;
    flex: 1; }
.tpl-c .sheet-header { background: var(--header-bg);
    border: 2px solid var(--header-border);
    border-radius: 13px;
    padding: 9px 16px;
    color: var(--header-text);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(37, 48, 77, 0.16); }
.tpl-c .header-left { position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    min-width: 0; }
.tpl-c .title-row { display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: nowrap; }
.tpl-c .sheet-title { font-family: "Hiragino Kaku Gothic StdN", "Hiragino Kaku Gothic Std", "Hiragino Sans", "BIZ UDPGothic", "Noto Sans CJK JP", "Noto Sans JP", "Meiryo", sans-serif;
    font-size: 28px;
    font-weight: 900;
    letter-spacing: 0.04em;
    line-height: 1.15;
    -webkit-text-stroke: 1.5px #ffffff;
    paint-order: stroke fill;
    text-shadow: 0 2px 6px rgba(20, 28, 48, 0.48), 0 0 2px rgba(20, 28, 48, 0.35);
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap; }
.tpl-c .sheet-title svg { flex-shrink: 0; }
.tpl-c .sheet-no-badge { background: #202738;
    color: #ffffff;
    padding: 2px 11px;
    border-radius: 999px;
    font-size: 13.5px;
    font-weight: 900;
    letter-spacing: 0.05em;
    white-space: nowrap;
    flex-shrink: 0; }
.tpl-c .sheet-subtitle { font-size: 11.5px;
    color: rgba(255, 255, 255, 0.96);
    font-weight: 700;
    text-shadow: 0 1px 3px rgba(20, 28, 48, 0.3);
    white-space: nowrap; }
.tpl-c .header-right { position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 4px;
    flex-shrink: 0; }
.tpl-c .date-box { background: rgba(255, 255, 255, 0.95);
    color: #202738;
    padding: 3px 11px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    border: 1px solid rgba(32, 39, 56, 0.18);
    white-space: nowrap;
    flex-shrink: 0; }
.tpl-c .header-credit-mini { font-size: 10.5px;
    color: #ffffff;
    font-weight: 700;
    text-shadow: 0 1px 3px rgba(20, 28, 48, 0.35);
    white-space: nowrap;
    flex-shrink: 0; }
.tpl-c .section-card { background: var(--card-bg);
    border: 1.5px solid var(--card-border);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(32, 39, 56, 0.05);
    display: flex;
    flex-direction: column; }
.tpl-c .section-header { background: var(--label-bg);
    color: var(--label-text);
    padding: 4.5px 12px 6.5px;
    font-size: 12.5px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    letter-spacing: 0.02em; }
.tpl-c .section-header::after { content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
    background: var(--rainbow-bar); }
.tpl-c .section-header .title-with-icon { display: flex;
    align-items: center;
    gap: 6px; }
.tpl-c .prism-diamond { display: inline-block;
    width: 10px;
    height: 10px;
    background: var(--rainbow-soft);
    transform: rotate(45deg);
    border-radius: 1.5px; }
.tpl-c .section-header .sub-hint { font-size: 10.5px;
    font-weight: 600;
    background: rgba(255, 255, 255, 0.16);
    padding: 1px 8px;
    border-radius: 999px; }
.tpl-c .section-body { padding: 9px 13px;
    flex: 1; }
.tpl-c .profile-grid { display: grid;
    grid-template-columns: 1fr 210px;
    gap: 12px;
    align-items: stretch; }
.tpl-c .top-left-stack { display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 11px;
    min-width: 0; }
.tpl-c .profile-fields { display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
    flex: 1; }
.tpl-c .profile-row-1 { display: grid;
    grid-template-columns: 1.6fr 0.8fr;
    gap: 10px;
    flex: 1; }
.tpl-c .profile-row-2 { display: grid;
    grid-template-columns: 0.9fr 0.9fr 1.6fr;
    gap: 10px;
    flex: 1; }
.tpl-c .profile-fields .section-body { display: flex;
    align-items: center; }
.tpl-c .field-value { font-size: 16px;
    font-weight: 700;
    color: var(--text-main);
    min-height: 32px;
    display: flex;
    align-items: center; }
.tpl-c .avatar-box { width: 210px;
    min-height: 268px;
    height: 100%;
    border-radius: 13px;
    background:
      linear-gradient(#ffffff, #ffffff) padding-box,
      var(--rainbow-bar) border-box;
    border: 3px solid transparent;
    box-shadow: 0 4px 14px rgba(37, 48, 77, 0.14);
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center; }
.tpl-c .avatar-cover-svg { position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; }
.tpl-c .crop-guide { position: absolute;
    width: 14px;
    height: 14px;
    border-color: rgba(37, 48, 77, 0.75);
    border-style: solid;
    z-index: 2;
    pointer-events: none; }
.tpl-c .crop-tl { top: 8px; left: 8px; border-width: 2.5px 0 0 2.5px; }
.tpl-c .crop-tr { top: 8px; right: 8px; border-width: 2.5px 2.5px 0 0; }
.tpl-c .crop-bl { bottom: 8px; left: 8px; border-width: 0 0 2.5px 2.5px; }
.tpl-c .crop-br { bottom: 8px; right: 8px; border-width: 0 2.5px 2.5px 0; }
.tpl-c .avatar-overlay-info { position: relative;
    z-index: 2;
    background: rgba(255, 255, 255, 0.94);
    border: 1.5px solid #9ab0de;
    border-radius: 10px;
    padding: 8px 10px;
    max-width: 190px;
    text-align: center;
    box-shadow: 0 3px 12px rgba(32, 39, 56, 0.16); }
.tpl-c .avatar-label { display: block;
    font-size: 12.5px;
    font-weight: 800;
    color: #25304d; }
.tpl-c .avatar-sub { display: block;
    font-size: 10.5px;
    font-weight: 600;
    color: var(--text-muted);
    margin-top: 2px; }
.tpl-c .two-col-fav { display: grid;
    grid-template-columns: 1.05fr 1.25fr;
    gap: 12px; }
.tpl-c .numbered-list { display: flex;
    flex-direction: column;
    gap: 6px; }
.tpl-c .numbered-item { display: flex;
    align-items: center;
    gap: 8px;
    background: #f9fbff;
    border: 1px solid var(--divider-line);
    border-left: 4px solid var(--accent-pink);
    border-radius: 8px;
    padding: 5px 10px;
    min-height: 32px; }
.tpl-c .numbered-item:nth-child(1) { border-left-color: var(--accent-pink); }
.tpl-c .numbered-item:nth-child(2) { border-left-color: var(--accent-blue); }
.tpl-c .numbered-item:nth-child(3) { border-left-color: var(--accent-orange); }
.tpl-c .numbered-item:nth-child(4) { border-left-color: var(--accent-green); }
.tpl-c .numbered-item:nth-child(5) { border-left-color: var(--accent-purple); }
.tpl-c .num-badge { width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #25304d;
    color: #fff;
    font-size: 11.5px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0; }
.tpl-c .numbered-item:nth-child(1) .num-badge { background: var(--accent-pink); }
.tpl-c .numbered-item:nth-child(2) .num-badge { background: var(--accent-blue); }
.tpl-c .numbered-item:nth-child(3) .num-badge { background: var(--accent-orange); }
.tpl-c .numbered-item:nth-child(4) .num-badge { background: var(--accent-green); }
.tpl-c .numbered-item:nth-child(5) .num-badge { background: var(--accent-purple); }
.tpl-c .free-note-box { margin-top: 6px;
    background: var(--rainbow-pastel);
    border: 1.5px dashed #a8b8db;
    border-radius: 8px;
    padding: 5px 10px;
    font-size: 12.5px;
    min-height: 48px; }
.tpl-c .free-note-label { font-size: 10.5px;
    font-weight: 700;
    color: var(--sub-label-text);
    display: block;
    margin-bottom: 2px; }
.tpl-c .text-area-box { font-size: 13px;
    line-height: 1.6;
    color: var(--text-main);
    min-height: 158px;
    padding: 3px 2px;
    white-space: pre-wrap; }
.tpl-c .series-recommend-table { width: 100%;
    border-collapse: separate;
    border-spacing: 0 5px; }
.tpl-c .series-recommend-table th { font-size: 11px;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-bottom: 2px solid #9ab0de;
    text-align: left;
    padding: 3px 10px;
    border-radius: 5px; }
.tpl-c .series-recommend-row td { background: #f9fbff;
    border-top: 1px solid var(--divider-line);
    border-bottom: 1px solid var(--divider-line);
    padding: 5.5px 10px;
    font-size: 13px;
    vertical-align: middle; }
.tpl-c .series-recommend-row:nth-child(1) td:first-child { border-left: 4px solid var(--accent-pink); }
.tpl-c .series-recommend-row:nth-child(2) td:first-child { border-left: 4px solid var(--accent-blue); }
.tpl-c .series-recommend-row:nth-child(3) td:first-child { border-left: 4px solid var(--accent-orange); }
.tpl-c .series-recommend-row td:first-child { border-radius: 7px 0 0 7px;
    width: 34%;
    font-weight: 700; }
.tpl-c .series-recommend-row td:last-child { border-right: 1px solid var(--divider-line);
    border-radius: 0 7px 7px 0;
    font-size: 12.5px;
    border-left: 2px dotted #b6c5e3; }
.tpl-c .bottom-split-no1 { display: grid;
    grid-template-columns: 1.28fr 1fr;
    gap: 12px;
    flex: 1; }
.tpl-c .watched-header-bar { display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--sub-label-bg);
    border: 1px solid var(--sub-label-border);
    border-left: 4px solid var(--accent-pink);
    padding: 4px 10px;
    border-radius: 6px;
    margin-bottom: 6px;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--sub-label-text); }
.tpl-c .watched-grid { display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3.5px 10px; }
.tpl-c .watched-item { display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11.2px;
    padding: 2px 6px;
    border-bottom: 1px dashed var(--divider-line); }
.tpl-c .watch-mark { width: 19px;
    height: 19px;
    border-radius: 50%;
    background: linear-gradient(135deg, #e3f0ff, #fce6f1);
    border: 1px solid #6b9ce8;
    color: #1f4f9c;
    font-weight: 800;
    font-size: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0; }
.tpl-c .watch-mark.triangle { background: #fff1d6;
    border-color: #e09b2d;
    color: #b06c08; }
.tpl-c .extra-series-divider { grid-column: 1 / -1;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-left: 4px solid var(--accent-purple);
    padding: 2px 8px;
    border-radius: 4px;
    margin-top: 2px; }
.tpl-c .right-column-stack { display: flex;
    flex-direction: column;
    gap: 11px; }
.tpl-c .sub-section-tag { display: inline-block;
    font-size: 11px;
    font-weight: 700;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-left: 3.5px solid var(--accent-blue);
    padding: 2px 8px;
    border-radius: 4px;
    margin-bottom: 5px; }
.tpl-c .movies-two-col { display: grid;
    grid-template-columns: 1.05fr 1.15fr;
    gap: 12px; }
.tpl-c .songs-episodes-grid { display: grid;
    grid-template-columns: 0.82fr 1.38fr;
    gap: 12px; }
.tpl-c .episode-table { width: 100%;
    border-collapse: separate;
    border-spacing: 0 4px; }
.tpl-c .episode-table th { font-size: 10.5px;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-bottom: 2px solid #9ab0de;
    text-align: left;
    padding: 3px 8px;
    border-radius: 4px; }
.tpl-c .episode-row td { background: #f9fbff;
    border-top: 1px solid var(--divider-line);
    border-bottom: 1px solid var(--divider-line);
    padding: 4.5px 8px;
    font-size: 11.8px;
    height: 29px; }
.tpl-c .episode-row td:first-child { border-left: 3.5px solid var(--accent-blue);
    border-radius: 6px 0 0 6px;
    font-weight: 700;
    width: 36%; }
.tpl-c .episode-row:nth-child(odd) td:first-child { border-left-color: var(--accent-pink); }
.tpl-c .episode-row td.ep-num { width: 13%;
    text-align: center;
    font-weight: 800;
    color: var(--sub-label-text);
    background: var(--rainbow-pastel);
    border-left: 1px dotted #b6c5e3;
    border-right: 1px dotted #b6c5e3; }
.tpl-c .episode-row td:last-child { border-right: 1px solid var(--divider-line);
    border-radius: 0 6px 6px 0; }
.tpl-c .episode-row.is-empty td { background: var(--empty-slot-bg);
    border-color: var(--empty-slot-border);
    color: transparent; }
.tpl-c .sheet-footer { position: relative;
    z-index: 1;
    margin-top: 8px;
    padding-top: 7px;
    border-top: 2px dotted #a8b8db;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
    color: var(--text-muted); }
.tpl-c .footer-left { display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap; }
.tpl-c .fanmade-badge { background: #25304d;
    color: #ffffff;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10.5px; }
.tpl-c .footer-credit { font-weight: 700;
    color: #202738;
    background: var(--rainbow-pastel);
    padding: 3px 12px;
    border-radius: 999px;
    border: 1.5px solid #9ab0de; }

/* ===== 案D クラシカルラベンダー ===== */
.tpl-d { --font-sans: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", "Meiryo", sans-serif;
    --font-display: "Hiragino Mincho ProN", "Yu Mincho", "Hiragino Kaku Gothic ProN", serif;

    
    --bg-canvas: #1c1624;
    --sheet-bg: linear-gradient(160deg, #faf7fc 0%, #f1e9f8 52%, #f8f1ea 100%);
    --sheet-border: #b89249;
    --sheet-inner-border: #c5a365;

    --header-bg: linear-gradient(135deg, #3f245e 0%, #683d91 48%, #985692 82%, #c99255 100%);
    --header-border: #d6b16a;

    --card-bg: rgba(255, 255, 255, 0.94);
    --card-border: #cbb3e3;
    --label-bg: linear-gradient(90deg, #432763 0%, #643c8f 65%, #7e52a8 100%);
    --label-border-bottom: #c9a35b;
    --label-text: #ffffff;

    --sub-label-bg: linear-gradient(90deg, #ece2f7 0%, #f7efe4 100%);
    --sub-label-border: #c2a8de;
    --sub-label-text: #442866;

    --accent-purple: #57367d;
    --accent-lavender: #8c65b5;
    --accent-gold: #b89249;
    --accent-gold-light: #f9edd6;
    --divider-line: #d6c3eb;

    --text-main: #281c36;
    --text-muted: #65527a;
    --empty-slot-bg: rgba(238, 229, 248, 0.55);
    --empty-slot-border: #d2bfe6; }
.tpl-d, .tpl-d * { box-sizing: border-box;
    margin: 0;
    padding: 0; }
.tpl-d { font-family: var(--font-sans);
    background: var(--bg-canvas);
    color: var(--text-main);
    padding: 20px 24px 36px;
    line-height: 1.5; }
.tpl-d .precure-sheet { width: 1080px;
    min-height: 1420px;
    background: var(--sheet-bg);
    border: 3px solid var(--sheet-border);
    border-radius: 18px;
    padding: 18px 24px 16px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.5);
    display: flex;
    flex-direction: column;
    justify-content: space-between; }
.tpl-d .precure-sheet::before { content: "";
    position: absolute;
    inset: 8px;
    border: 1.5px solid var(--sheet-inner-border);
    border-radius: 12px;
    opacity: 0.65;
    pointer-events: none; }
.tpl-d .bg-decor-svg { position: absolute;
    pointer-events: none;
    z-index: 0;
    opacity: 0.2; }
.tpl-d .bg-decor-top-right { top: -20px;
    right: -20px;
    width: 260px;
    height: 260px; }
.tpl-d .bg-decor-bottom-left { bottom: -20px;
    left: -20px;
    width: 250px;
    height: 250px; }
.tpl-d .sheet-content { position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 11px;
    flex: 1; }
.tpl-d .sheet-header { background: var(--header-bg);
    border: 2px solid var(--header-border);
    border-radius: 12px;
    padding: 9px 16px;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 14px rgba(63, 36, 94, 0.25); }
.tpl-d .header-left { position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    min-width: 0; }
.tpl-d .title-row { display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: nowrap; }
.tpl-d .sheet-title { font-family: "Hiragino Kaku Gothic StdN", "Hiragino Kaku Gothic Std", "Hiragino Sans", "BIZ UDPGothic", "Noto Sans CJK JP", "Noto Sans JP", "Meiryo", sans-serif;
    font-size: 28px;
    font-weight: 900;
    letter-spacing: 0.04em;
    line-height: 1.15;
    -webkit-text-stroke: 1.5px #ffffff;
    paint-order: stroke fill;
    text-shadow: 0 2px 6px rgba(32, 12, 54, 0.55), 0 0 3px rgba(32, 12, 54, 0.4);
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap; }
.tpl-d .sheet-title svg { flex-shrink: 0; }
.tpl-d .sheet-no-badge { background: rgba(255, 245, 222, 0.24);
    border: 1.5px solid #f3d79b;
    color: #fff6df;
    padding: 2px 11px;
    border-radius: 999px;
    font-size: 13.5px;
    font-weight: 900;
    font-family: var(--font-sans);
    white-space: nowrap;
    flex-shrink: 0; }
.tpl-d .sheet-subtitle { font-size: 11.5px;
    color: #f6ebff;
    font-weight: 500;
    white-space: nowrap; }
.tpl-d .header-right { position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 4px;
    flex-shrink: 0; }
.tpl-d .date-box { background: rgba(255, 252, 245, 0.95);
    color: #442866;
    padding: 3px 11px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    border: 1px solid #c9a35b;
    white-space: nowrap;
    flex-shrink: 0; }
.tpl-d .header-credit-mini { font-size: 10.5px;
    color: #f2e3ff;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0; }
.tpl-d .section-card { background: var(--card-bg);
    border: 1.5px solid var(--card-border);
    border-radius: 11px;
    overflow: hidden;
    box-shadow: 0 2px 7px rgba(84, 56, 117, 0.07);
    display: flex;
    flex-direction: column; }
.tpl-d .section-header { background: var(--label-bg);
    color: var(--label-text);
    padding: 4.5px 12px;
    font-size: 12.5px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 2px solid var(--label-border-bottom);
    letter-spacing: 0.02em; }
.tpl-d .section-header .title-with-icon { display: flex;
    align-items: center;
    gap: 6px; }
.tpl-d .magia-icon { color: #f7dfb0; }
.tpl-d .section-header .sub-hint { font-size: 10.5px;
    font-weight: 600;
    color: #f7e6c4;
    background: rgba(34, 16, 56, 0.35);
    border: 1px solid rgba(201, 163, 91, 0.45);
    padding: 1px 8px;
    border-radius: 999px; }
.tpl-d .section-body { padding: 9px 13px;
    flex: 1; }
.tpl-d .profile-grid { display: grid;
    grid-template-columns: 1fr 210px;
    gap: 12px;
    align-items: stretch; }
.tpl-d .top-left-stack { display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 11px;
    min-width: 0; }
.tpl-d .profile-fields { display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
    flex: 1; }
.tpl-d .profile-row-1 { display: grid;
    grid-template-columns: 1.6fr 0.8fr;
    gap: 10px;
    flex: 1; }
.tpl-d .profile-row-2 { display: grid;
    grid-template-columns: 0.9fr 0.9fr 1.6fr;
    gap: 10px;
    flex: 1; }
.tpl-d .profile-fields .section-body { display: flex;
    align-items: center; }
.tpl-d .field-value { font-size: 16px;
    font-weight: 700;
    color: var(--text-main);
    min-height: 32px;
    display: flex;
    align-items: center; }
.tpl-d .avatar-box { width: 210px;
    min-height: 268px;
    height: 100%;
    border-radius: 11px;
    border: 2.5px solid var(--accent-gold);
    box-shadow: inset 0 0 0 2px var(--accent-purple), 0 4px 12px rgba(87, 54, 125, 0.16);
    position: relative;
    overflow: hidden;
    background: linear-gradient(155deg, #e7d8f5 0%, #d2b8eb 50%, #edd9be 100%);
    display: flex;
    align-items: center;
    justify-content: center; }
.tpl-d .avatar-cover-svg { position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; }
.tpl-d .crop-guide { position: absolute;
    width: 14px;
    height: 14px;
    border-color: rgba(87, 54, 125, 0.85);
    border-style: solid;
    z-index: 2;
    pointer-events: none; }
.tpl-d .crop-tl { top: 8px; left: 8px; border-width: 2.5px 0 0 2.5px; }
.tpl-d .crop-tr { top: 8px; right: 8px; border-width: 2.5px 2.5px 0 0; }
.tpl-d .crop-bl { bottom: 8px; left: 8px; border-width: 0 0 2.5px 2.5px; }
.tpl-d .crop-br { bottom: 8px; right: 8px; border-width: 0 2.5px 2.5px 0; }
.tpl-d .avatar-overlay-info { position: relative;
    z-index: 2;
    background: rgba(253, 250, 255, 0.93);
    border: 1.5px solid var(--accent-gold);
    border-radius: 9px;
    padding: 8px 10px;
    max-width: 190px;
    text-align: center;
    box-shadow: 0 3px 10px rgba(68, 40, 102, 0.18); }
.tpl-d .avatar-label { display: block;
    font-size: 12.5px;
    font-weight: 800;
    color: #442866; }
.tpl-d .avatar-sub { display: block;
    font-size: 10.5px;
    font-weight: 600;
    color: var(--text-muted);
    margin-top: 2px; }
.tpl-d .two-col-fav { display: grid;
    grid-template-columns: 1.05fr 1.25fr;
    gap: 12px; }
.tpl-d .numbered-list { display: flex;
    flex-direction: column;
    gap: 6px; }
.tpl-d .numbered-item { display: flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(90deg, #f6f0fc 0%, #fdfbff 100%);
    border: 1px solid var(--divider-line);
    border-left: 3.5px solid var(--accent-purple);
    border-radius: 8px;
    padding: 5px 10px;
    min-height: 32px; }
.tpl-d .num-badge { width: 22px;
    height: 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, #432763, #7a4ea3);
    border: 1px solid #e0be7b;
    color: #f9e6b3;
    font-size: 11.5px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0; }
.tpl-d .free-note-box { margin-top: 6px;
    background: #f8f3fc;
    border: 1.5px dashed #b698d4;
    border-radius: 8px;
    padding: 5px 10px;
    font-size: 12.5px;
    min-height: 48px; }
.tpl-d .free-note-label { font-size: 10.5px;
    font-weight: 700;
    color: var(--sub-label-text);
    display: block;
    margin-bottom: 2px; }
.tpl-d .text-area-box { font-size: 13px;
    line-height: 1.6;
    color: var(--text-main);
    min-height: 158px;
    padding: 3px 2px;
    white-space: pre-wrap; }
.tpl-d .series-recommend-table { width: 100%;
    border-collapse: separate;
    border-spacing: 0 5px; }
.tpl-d .series-recommend-table th { font-size: 11px;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-bottom: 1.5px solid var(--accent-gold);
    text-align: left;
    padding: 3px 10px;
    border-radius: 5px; }
.tpl-d .series-recommend-row td { background: #fcfaff;
    border-top: 1px solid var(--divider-line);
    border-bottom: 1px solid var(--divider-line);
    padding: 5.5px 10px;
    font-size: 13px;
    vertical-align: middle; }
.tpl-d .series-recommend-row td:first-child { border-left: 3.5px solid var(--accent-purple);
    border-radius: 7px 0 0 7px;
    width: 34%;
    font-weight: 700; }
.tpl-d .series-recommend-row td:last-child { border-right: 1px solid var(--divider-line);
    border-radius: 0 7px 7px 0;
    font-size: 12.5px;
    border-left: 2px dotted var(--accent-lavender); }
.tpl-d .bottom-split-no1 { display: grid;
    grid-template-columns: 1.28fr 1fr;
    gap: 12px;
    flex: 1; }
.tpl-d .watched-header-bar { display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--sub-label-bg);
    border: 1px solid var(--sub-label-border);
    border-left: 3.5px solid var(--accent-purple);
    padding: 4px 10px;
    border-radius: 6px;
    margin-bottom: 6px;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--sub-label-text); }
.tpl-d .watched-grid { display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3.5px 10px; }
.tpl-d .watched-item { display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11.2px;
    padding: 2px 6px;
    border-bottom: 1px dashed var(--divider-line); }
.tpl-d .watch-mark { width: 19px;
    height: 19px;
    border-radius: 50%;
    background: #e9dcf7;
    border: 1px solid #9d7bc2;
    color: #442866;
    font-weight: 800;
    font-size: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0; }
.tpl-d .watch-mark.triangle { background: var(--accent-gold-light);
    border-color: var(--accent-gold);
    color: #8c5d12; }
.tpl-d .extra-series-divider { grid-column: 1 / -1;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-left: 3.5px solid var(--accent-gold);
    padding: 2px 8px;
    border-radius: 4px;
    margin-top: 2px; }
.tpl-d .right-column-stack { display: flex;
    flex-direction: column;
    gap: 11px; }
.tpl-d .sub-section-tag { display: inline-block;
    font-size: 11px;
    font-weight: 700;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-left: 3px solid var(--accent-purple);
    padding: 2px 8px;
    border-radius: 4px;
    margin-bottom: 5px; }
.tpl-d .movies-two-col { display: grid;
    grid-template-columns: 1.05fr 1.15fr;
    gap: 12px; }
.tpl-d .songs-episodes-grid { display: grid;
    grid-template-columns: 0.82fr 1.38fr;
    gap: 12px; }
.tpl-d .episode-table { width: 100%;
    border-collapse: separate;
    border-spacing: 0 4px; }
.tpl-d .episode-table th { font-size: 10.5px;
    color: var(--sub-label-text);
    background: var(--sub-label-bg);
    border-bottom: 1.5px solid var(--accent-gold);
    text-align: left;
    padding: 3px 8px;
    border-radius: 4px; }
.tpl-d .episode-row td { background: #fcfaff;
    border-top: 1px solid var(--divider-line);
    border-bottom: 1px solid var(--divider-line);
    padding: 4.5px 8px;
    font-size: 11.8px;
    height: 29px; }
.tpl-d .episode-row td:first-child { border-left: 3.5px solid var(--accent-purple);
    border-radius: 6px 0 0 6px;
    font-weight: 700;
    width: 36%; }
.tpl-d .episode-row td.ep-num { width: 13%;
    text-align: center;
    font-weight: 800;
    color: var(--sub-label-text);
    background: #f0e6fa;
    border-left: 1px dotted #c2a8de;
    border-right: 1px dotted #c2a8de; }
.tpl-d .episode-row td:last-child { border-right: 1px solid var(--divider-line);
    border-radius: 0 6px 6px 0; }
.tpl-d .episode-row.is-empty td { background: var(--empty-slot-bg);
    border-color: var(--empty-slot-border);
    color: transparent; }
.tpl-d .sheet-footer { position: relative;
    z-index: 1;
    margin-top: 8px;
    padding-top: 7px;
    border-top: 1.5px dashed var(--accent-gold);
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
    color: var(--text-muted); }
.tpl-d .footer-left { display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap; }
.tpl-d .fanmade-badge { background: var(--sub-label-bg);
    border: 1px solid var(--accent-gold);
    color: #442866;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10.5px; }
.tpl-d .footer-credit { font-weight: 700;
    color: #432863;
    background: #fffcf5;
    padding: 3px 12px;
    border-radius: 999px;
    border: 1.5px solid var(--accent-gold); }