/* アイコン 74 個。data-ic の名前ごとに 1 行（名前は 7.2 の表のとおり。ai は auto に、新しく error）。
   色（currentColor）と大きさと並びは media.css の .m-ic が決める。ここは絵だけを置く。media.css のあとに読む（同じ強さなので、あとのこちらが勝つ）。
   絵の変数は --ic-img。--ic は tokens.css の大きさ（24px）の名前なので、絵には使わない。media.css に古い絵の規則（--ic に url を入れるもの）が残っていても、
   .m-ic[data-ic] で --ic を元に戻すので、width: var(--ic) は縮まない。名前がここに無い .m-ic は何も描かない（四角い塊にはならない）。
   24 x 24 の枠、線の太さ 2、まるい端とまるい角、1 色。16 px で使う 15 個だけ線 2.5（小さくても細くならない）。
   状態は形で分ける：check（できた）、info（お知らせ）、warn（三角）、error（まるに×）。wand は筆、sparkle は光の輪。星や杖の形は描かない。 */
.m-ic { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'/%3E"); -webkit-mask: var(--ic-img) center / contain no-repeat; mask: var(--ic-img) center / contain no-repeat; }
.m-ic[data-ic] { --ic: inherit; }
.m-ic[data-ic="back"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5 L8 12 L15 19'/%3E%3C/svg%3E"); }
.m-ic[data-ic="next"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5 L16 12 L9 19'/%3E%3C/svg%3E"); }
.m-ic[data-ic="cross"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6 L18 18 M18 6 L6 18'/%3E%3C/svg%3E"); }
.m-ic[data-ic="cross-small"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.5 7.5 L16.5 16.5 M16.5 7.5 L7.5 16.5'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="check"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5 L10 17.5 L19 7'/%3E%3C/svg%3E"); }
.m-ic[data-ic="plus"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5 V19 M5 12 H19'/%3E%3C/svg%3E"); }
.m-ic[data-ic="pause"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='5' width='4' height='14' rx='1.5'/%3E%3Crect x='14' y='5' width='4' height='14' rx='1.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="play"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 5.5 L18.5 12 L8 18.5 Z'/%3E%3C/svg%3E"); }
.m-ic[data-ic="home"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 11 L12 4 L20 11 V19.5 a1 1 0 0 1 -1 1 H5 a1 1 0 0 1 -1 -1 Z M10 20.5 V15 a1 1 0 0 1 1 -1 H13 a1 1 0 0 1 1 1 V20.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="list"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8.5 7 H20 M8.5 12 H20 M8.5 17 H20 M4 7 h.01 M4 12 h.01 M4 17 h.01'/%3E%3C/svg%3E"); }
.m-ic[data-ic="card"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5.5' width='18' height='13' rx='2.5'/%3E%3Cpath d='M3 10 H21 M6.5 15 H10.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="card-check"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5.5' width='20' height='13' rx='2.5'/%3E%3Cpath d='M8.5 12.4 L11.5 15.4 L17 9.4'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="card-warn"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='6.5' width='15' height='12' rx='2.5'/%3E%3Cpath d='M2.5 10.5 H17.5 M5.5 15 H9'/%3E%3Cpath d='M21.2 5.5 V11 M21.2 14.5 h.01'/%3E%3C/svg%3E"); }
.m-ic[data-ic="person"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M5 20 a7 7 0 0 1 14 0'/%3E%3C/svg%3E"); }
.m-ic[data-ic="bell"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5 a6 6 0 0 0 -6 6 v4.5 l-1.5 2.5 h15 l-1.5 -2.5 V9.5 a6 6 0 0 0 -6 -6 Z M10 19.5 a2 2 0 0 0 4 0'/%3E%3C/svg%3E"); }
.m-ic[data-ic="bell-dot"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16.5 11.6 V14 L18 16.5 H3.5 L5 14 V10 A5.75 5.75 0 0 1 12.43 4.5'/%3E%3Cpath d='M8.8 19.5 a2 2 0 0 0 4 0'/%3E%3Cpath d='M18.2 5.8 h.01' stroke-width='5.6'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="clock"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7 V12 L15.5 14'/%3E%3C/svg%3E"); }
.m-ic[data-ic="clock-cut"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='13.5' r='7.5'/%3E%3Cpath d='M9.5 2.8 H14.5 M12 13.5 L15 10.5'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="clock-check"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12 A9 9 0 1 0 12 21'/%3E%3Cpath d='M12 7 V12 L15.5 14'/%3E%3Cpath d='M14 17.8 L16.4 20.2 L21 15.4'/%3E%3C/svg%3E"); }
.m-ic[data-ic="hourglass"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3.5 H17 M7 20.5 H17 M8 3.5 V6.5 a4 4 0 0 0 1.6 3.2 L12 12 L9.6 14.3 A4 4 0 0 0 8 17.5 V20.5 M16 3.5 V6.5 a4 4 0 0 1 -1.6 3.2 L12 12 L14.4 14.3 A4 4 0 0 1 16 17.5 V20.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="ring"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15.08 3.54 A9 9 0 1 1 8.92 3.54'/%3E%3C/svg%3E"); } /* 44 px。輪だけ（数字は置く側が重ねる） */
.m-ic[data-ic="calendar"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2.5'/%3E%3Cpath d='M3.5 10 H20.5 M8 3 V6.5 M16 3 V6.5 M8 14.5 h.01 M12 14.5 h.01 M16 14.5 h.01'/%3E%3C/svg%3E"); }
.m-ic[data-ic="yen"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M9 8 L12 12.5 L15 8 M12 12.5 V17 M9.5 12.5 H14.5 M9.5 15 H14.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="tag"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 5.5 a1 1 0 0 1 1 -1 H12 L20.5 13 L13 20.5 L4.5 12 Z M8.5 8.5 h.01'/%3E%3C/svg%3E"); }
.m-ic[data-ic="ticket"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7 H20 a1 1 0 0 1 1 1 V10.5 a1.5 1.5 0 0 0 0 3 V16 a1 1 0 0 1 -1 1 H4 a1 1 0 0 1 -1 -1 V13.5 a1.5 1.5 0 0 0 0 -3 V8 a1 1 0 0 1 1 -1 Z M15 9 V10 M15 11.5 V12.5 M15 14 V15'/%3E%3C/svg%3E"); }
.m-ic[data-ic="ticket-back"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7 H20 a1 1 0 0 1 1 1 V10.5 a1.5 1.5 0 0 0 0 3 V16 a1 1 0 0 1 -1 1 H4 a1 1 0 0 1 -1 -1 V13.5 a1.5 1.5 0 0 0 0 -3 V8 a1 1 0 0 1 1 -1 Z'/%3E%3Cpath d='M16 12 H9 M11.4 9.8 L9 12 L11.4 14.2'/%3E%3C/svg%3E"); }
.m-ic[data-ic="tickets-none"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.5 7 H4 a1 1 0 0 0 -1 1 V10.5 a1.5 1.5 0 0 1 0 3 V16 a1 1 0 0 0 1 1 H6.5 M17.5 7 H20 a1 1 0 0 1 1 1 V10.5 a1.5 1.5 0 0 0 0 3 V16 a1 1 0 0 1 -1 1 H17.5 M10.6 7 H13.4 M10.6 17 H13.4'/%3E%3C/svg%3E"); }
.m-ic[data-ic="clip"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5.5' width='17' height='13' rx='2.5'/%3E%3Cpath d='M10.5 9.5 L14.5 12 L10.5 14.5 Z'/%3E%3C/svg%3E"); }
.m-ic[data-ic="plan-box"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='16' height='16' rx='2.5'/%3E%3Cpath d='M4 14.5 L14.5 4 M9.5 20 L20 9.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="loop"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12 A7.5 7.5 0 0 1 18 7.2 M18.5 3.5 V7.5 H14.5 M19.5 12 A7.5 7.5 0 0 1 6 16.8 M5.5 20.5 V16.5 H9.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="door"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 20.5 V4.5 a1 1 0 0 1 1 -1 H15 a1 1 0 0 1 1 1 V20.5 M3 20.5 H21 M12.5 12 h.01'/%3E%3C/svg%3E"); }
.m-ic[data-ic="hand"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 12.5 V6 a1.25 1.25 0 0 1 2.5 0 V11 M10.5 5 a1.25 1.25 0 0 1 2.5 0 V11 M13 6 a1.25 1.25 0 0 1 2.5 0 V11.5 M15.5 8.5 a1.25 1.25 0 0 1 2.5 0 V15 a6 6 0 0 1 -6 6 h-1 a5.5 5.5 0 0 1 -4.4 -2.2 L4.7 14.8 a1.25 1.25 0 0 1 2 -1.5 L8 15'/%3E%3C/svg%3E"); }
.m-ic[data-ic="exit"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 4 H6 a1.5 1.5 0 0 0 -1.5 1.5 V18.5 A1.5 1.5 0 0 0 6 20 H10 M15 8 L19 12 L15 16 M19 12 H9'/%3E%3C/svg%3E"); }
.m-ic[data-ic="slash"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3 L21 21'/%3E%3C/svg%3E"); } /* 他のアイコンに重ねる斜めの線（下の .ic-stack で重ねる） */
.m-ic[data-ic="lock"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='10.5' width='14' height='10' rx='2'/%3E%3Cpath d='M8 10.5 V8 a4 4 0 0 1 8 0 V10.5 M12 14.5 V16.5'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="receipt"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3.5 H18 V20.5 L16 19 L14 20.5 L12 19 L10 20.5 L8 19 L6 20.5 Z M9 8 H15 M9 12 H15'/%3E%3C/svg%3E"); }
.m-ic[data-ic="refresh"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 12 A8 8 0 1 1 17.66 6.34'/%3E%3Cpath d='M17.7 2.4 V6.3 H13.8'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="external"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3.5 H20.5 V10 M20.5 3.5 L11 13'/%3E%3Cpath d='M18 14.5 V18.5 a2 2 0 0 1 -2 2 H5.5 a2 2 0 0 1 -2 -2 V8 a2 2 0 0 1 2 -2 H9.5'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="info"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11 V16.5 M12 7.8 h.01'/%3E%3C/svg%3E"); }
.m-ic[data-ic="warn"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 L21.5 20 H2.5 Z M12 10 V14.5 M12 17.2 h.01'/%3E%3C/svg%3E"); }
.m-ic[data-ic="error"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M9 9 L15 15 M15 9 L9 15'/%3E%3C/svg%3E"); }
.m-ic[data-ic="wifi-off"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8.11 16.11 A5.5 5.5 0 0 1 15.89 16.11'/%3E%3Cpath d='M3.57 12.93 A11 11 0 0 1 20.43 12.93'/%3E%3Cpath d='M12 20.2 h.01'/%3E%3Cpath d='M3 3 L21 21'/%3E%3C/svg%3E"); }
.m-ic[data-ic="film"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='4' width='17' height='16' rx='2.5'/%3E%3Cpath d='M8 4 V20 M16 4 V20 M3.5 9 H8 M3.5 15 H8 M16 9 H20.5 M16 15 H20.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="photo"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4.5' width='18' height='15' rx='2.5'/%3E%3Ccircle cx='8.5' cy='9.5' r='1.4'/%3E%3Cpath d='M3.5 17 L9 12.5 L13.5 16.5 M12.5 15.5 L15 13 L20.5 18'/%3E%3C/svg%3E"); }
.m-ic[data-ic="file"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.5 3 H14 L19.5 8.5 V19 a2 2 0 0 1 -2 2 H6.5 a2 2 0 0 1 -2 -2 V5 a2 2 0 0 1 2 -2 Z'/%3E%3Cpath d='M14 3 V8.5 H19.5'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="up-cloud"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.1 15.2 A6.5 6.5 0 1 1 16.1 8.8 H16.8 A4 4 0 0 1 18.5 16.4'/%3E%3Cpath d='M12 21 V12.5 M8.5 15.5 L12 12 L15.5 15.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="camera"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 8 H8 L9.5 5.5 H14.5 L16 8 H19.5 a1 1 0 0 1 1 1 V18.5 a1 1 0 0 1 -1 1 H4.5 a1 1 0 0 1 -1 -1 V9 a1 1 0 0 1 1 -1 Z'/%3E%3Ccircle cx='12' cy='13.2' r='3.2'/%3E%3C/svg%3E"); }
.m-ic[data-ic="wand"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 12 L19.5 4.5 M12 12 L15.5 15.5 C15.5 18 13 20 9.5 20 C6.5 20 5 19 4 18 C5.5 17.5 6 16.5 6.5 15 C7.5 12.5 10 11.5 12 12 Z'/%3E%3C/svg%3E"); }
.m-ic[data-ic="auto"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13.2 3 L5.5 13.2 H11.4 L10.6 21 L18.5 10.8 H12.6 Z'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="face"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M9 10 h.01 M15 10 h.01'/%3E%3Cpath d='M8.5 14.5 a4.5 4.5 0 0 0 7 0'/%3E%3C/svg%3E"); }
.m-ic[data-ic="scissors"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='6.5' r='2.5'/%3E%3Ccircle cx='6' cy='17.5' r='2.5'/%3E%3Cpath d='M8 8 L20.5 17 M8 16 L20.5 7'/%3E%3C/svg%3E"); }
.m-ic[data-ic="text"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8 V5.5 a1 1 0 0 1 1 -1 H18 a1 1 0 0 1 1 1 V8 M12 4.5 V19.5 M9 19.5 H15'/%3E%3C/svg%3E"); }
.m-ic[data-ic="sparkle"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3.5'/%3E%3Cpath d='M13.8 5.2 L14.6 2.6 M18.8 10.2 L21.7 9.4 M17 17 L18.7 18.7 M10.2 18.8 L9.4 21.4 M5.2 13.8 L2.3 14.6 M7.1 7.1 L5.6 5.6'/%3E%3C/svg%3E"); }
.m-ic[data-ic="palette"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21 A9 9 0 1 1 21 12 A4.5 4.5 0 0 1 16.5 16.5 H14.6 a1.7 1.7 0 0 0 -1.35 2.75 l.3 .4 A1.7 1.7 0 0 1 12 21 Z'/%3E%3Cpath d='M7.5 11.5 h.01 M9.5 7.5 h.01 M14.5 7.5 h.01 M17.5 11.5 h.01' stroke-width='2.6'/%3E%3C/svg%3E"); }
.m-ic[data-ic="music"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 17.5 V5.5 L19 3.5 V15.5'/%3E%3Ccircle cx='6.5' cy='17.5' r='2.5'/%3E%3Ccircle cx='16.5' cy='15.5' r='2.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="speaker"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 5.5 L7 9 H4.5 a1.5 1.5 0 0 0 -1.5 1.5 v3 a1.5 1.5 0 0 0 1.5 1.5 H7 L11 18.5 Z'/%3E%3Cpath d='M15 9.2 a3.8 3.8 0 0 1 0 5.6 M18.3 6.5 a7.5 7.5 0 0 1 0 11'/%3E%3C/svg%3E"); }
.m-ic[data-ic="pencil"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20 L5 15.5 L16 4.5 a1.8 1.8 0 0 1 2.5 0 L19.5 5.5 a1.8 1.8 0 0 1 0 2.5 L8.5 19 Z M14 6.5 L17.5 10'/%3E%3C/svg%3E"); }
.m-ic[data-ic="quote"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.5 15.5 h.01 M15 15.5 h.01' stroke-width='6'/%3E%3Cpath d='M6.5 15.5 C6.5 11.5 8 8.5 11 6.5 M15 15.5 C15 11.5 16.5 8.5 19.5 6.5'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="trash"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7 H20 M9 7 V4.5 a1 1 0 0 1 1 -1 H14 a1 1 0 0 1 1 1 V7 M6 7 L7 19.5 a1.5 1.5 0 0 0 1.5 1.5 H15.5 a1.5 1.5 0 0 0 1.5 -1.5 L18 7 M10 11 V17 M14 11 V17'/%3E%3C/svg%3E"); }
.m-ic[data-ic="save"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 V14.5 M8 10.5 L12 14.5 L16 10.5 M4.5 15.5 V18.5 a1 1 0 0 0 1 1 H18.5 a1 1 0 0 0 1 -1 V15.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="repeat"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 12 V11 a4 4 0 0 1 4 -4 H20.5 M17 3.5 L20.5 7 L17 10.5 M20.5 12 V13 a4 4 0 0 1 -4 4 H3.5 M7 13.5 L3.5 17 L7 20.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="link"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg transform='rotate(-45 12 12)'%3E%3Cpath d='M10 8 H7 a4 4 0 0 0 0 8 H10 M14 8 H17 a4 4 0 0 1 0 8 H14 M8.5 12 H15.5'/%3E%3C/g%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="mail"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2.5'/%3E%3Cpath d='M3.5 8 L12 13.5 L20.5 8'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="people"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9.5' cy='8' r='3.3'/%3E%3Cpath d='M3.5 20 a6 6 0 0 1 12 0'/%3E%3Cpath d='M15.5 4.9 a3.2 3.2 0 0 1 0 6.2'/%3E%3Cpath d='M17.6 14.3 a6 6 0 0 1 3.9 5.7'/%3E%3C/svg%3E"); }
.m-ic[data-ic="shop"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4.5 H19 L20.5 9.5 a2.83 2.83 0 0 1 -5.67 0 a2.83 2.83 0 0 1 -5.67 0 a2.83 2.83 0 0 1 -5.67 0 Z'/%3E%3Cpath d='M5 12.5 V19.5 a1 1 0 0 0 1 1 H18 a1 1 0 0 0 1 -1 V12.5 M10 20.5 V16 a1 1 0 0 1 1 -1 H13 a1 1 0 0 1 1 1 V20.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="salon"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='6.5' r='2.5'/%3E%3Ccircle cx='6' cy='17.5' r='2.5'/%3E%3Cpath d='M8 8 L20.5 17 M8 16 L20.5 7'/%3E%3C/svg%3E"); } /* scissors と同じ絵 */
.m-ic[data-ic="nail"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='11' width='12' height='10' rx='2.5'/%3E%3Cpath d='M9 11 V8 H15 V11 M10.5 8 V3.5 H13.5 V8'/%3E%3C/svg%3E"); }
.m-ic[data-ic="cup"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 9 H16 V14 a5 5 0 0 1 -5 5 H9 a5 5 0 0 1 -5 -5 Z'/%3E%3Cpath d='M16 10 H17.5 a2.5 2.5 0 0 1 0 5 H15.5 M8 3.5 c-1 1.2 1 2.3 0 4 M12 3.5 c-1 1.2 1 2.3 0 4'/%3E%3C/svg%3E"); }
.m-ic[data-ic="dots"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12 h.01 M12 12 h.01 M19 12 h.01' stroke-width='4'/%3E%3C/svg%3E"); }
.m-ic[data-ic="note"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='17.5' r='3'/%3E%3Cpath d='M11 17.5 V4.5 L18.5 8.5'/%3E%3C/svg%3E"); }
.m-ic[data-ic="heart"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20 C6 15.5 3.5 12.5 3.5 9 a4.5 4.5 0 0 1 8.5 -2 a4.5 4.5 0 0 1 8.5 2 C20.5 12.5 18 15.5 12 20 Z'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="comment"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 19.4 A8.5 8.5 0 1 0 4.6 16 L3.5 20.5 Z'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="share"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 4 L20.5 9.5 L15 15 M20.5 9.5 H9 a5 5 0 0 0 -5 5 V20'/%3E%3C/svg%3E"); } /* 16 px 用（線 2.5） */
.m-ic[data-ic="spinner"] { --ic-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5 a8.5 8.5 0 1 0 8.5 8.5'/%3E%3C/svg%3E"); } /* 止まった輪。まわすのは置く側の CSS */
/* 重ねる入れ物 .ic-stack：中の .m-ic と字を、同じ場所に重ねて置く。slash を他のアイコンの上に置くとき（斜めの線をあとに書く）と、ring の中に数字を入れるときに使う。 */
.ic-stack { display: inline-grid; flex: none; vertical-align: -.25em; }
.ic-stack > * { grid-area: 1 / 1; }
.ic-stack > .m-ic { vertical-align: baseline; }
.ic-stack > :not(.m-ic) { place-self: center; }