.core-information-records { display: grid; min-height: 100%; grid-template-rows: auto auto minmax(0, 1fr); gap: 12px; }
.core-information-records > header { display: flex; justify-content: space-between; align-items: end; }
.core-information-records > header div { display: grid; gap: 2px; }
.core-information-records > header span,
.core-daily-records > section > header span,
.core-record-certificate-story > header span { color: #b56460; font-size: 9px; font-weight: 950; letter-spacing: .12em; }
.core-information-records > header h2 { margin: 0; color: #624a43; font-family: var(--font-display); font-size: 20px; }
.core-information-records > header p { margin: 0; color: #887068; font-size: 10px; }

.core-information-records > input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.core-record-tabs { display: grid; padding: 5px; grid-template-columns: repeat(3, 1fr); gap: 5px; border-radius: 15px; background: #ecdac9; }
.core-record-tabs label { display: flex; min-height: 38px; padding: 0 14px; align-items: center; justify-content: center; gap: 8px; border-radius: 11px; color: #80665e; cursor: pointer; font-size: 11px; }
.core-record-tabs label span { display: grid; min-width: 19px; height: 19px; padding: 0 5px; place-items: center; border-radius: 10px; background: rgb(255 255 255 / 55%); font-size: 9px; }
#core-record-certificate:focus-visible ~ .core-record-tabs label[for="core-record-certificate"],
#core-record-daily:focus-visible ~ .core-record-tabs label[for="core-record-daily"],
#core-record-visitors:focus-visible ~ .core-record-tabs label[for="core-record-visitors"] { outline: 2px solid #835b58; outline-offset: 2px; }
#core-record-certificate:checked ~ .core-record-tabs label[for="core-record-certificate"],
#core-record-daily:checked ~ .core-record-tabs label[for="core-record-daily"],
#core-record-visitors:checked ~ .core-record-tabs label[for="core-record-visitors"] { background: #af6762; color: white; box-shadow: 0 6px 14px rgb(113 70 61 / 16%); }

.core-record-panels { min-height: 0; }
.core-record-panel { display: none; min-height: 100%; }
#core-record-certificate:checked ~ .core-record-panels .core-record-panel--certificate,
#core-record-daily:checked ~ .core-record-panels .core-record-panel--daily,
#core-record-visitors:checked ~ .core-record-panels .core-record-panel--visitors { display: block; }

.core-record-certificate-layout { display: grid; min-height: 100%; grid-template-columns: 250px minmax(0, 1fr); gap: 14px; }
.core-record-certificate { position: relative; display: grid; overflow: hidden; padding: 15px; justify-items: center; align-content: start; gap: 7px; border: 2px solid rgb(185 116 99 / 35%); border-radius: 21px; background: linear-gradient(150deg, #fffcef, #f8ddc5); box-shadow: 0 12px 28px rgb(85 52 42 / 10%); }
.core-record-certificate::before { position: absolute; inset: 8px; border: 1px dashed rgb(181 105 94 / 34%); border-radius: 16px; content: ""; pointer-events: none; }
.core-record-certificate > span { z-index: 1; color: #b96360; font-size: 9px; font-weight: 950; letter-spacing: .11em; }
.core-record-certificate figure { z-index: 1; display: grid; overflow: hidden; width: 118px; height: 118px; margin: 0; padding-top: 5px; place-items: end center; border: 6px solid #fff9e8; border-radius: 50%; background: #f2ceb2; }
.core-record-certificate figure img { width: 100%; height: 100%; object-fit: contain; object-position: 50% 100%; }
.core-record-certificate h3 { z-index: 1; margin: 0; color: #b75858; font-family: var(--font-display); font-size: 24px; }
.core-record-certificate dl { z-index: 1; display: grid; width: 100%; margin: 0; gap: 2px; }
.core-record-certificate dl div { display: grid; padding: 4px 6px; grid-template-columns: 50px 1fr; border-bottom: 1px dashed rgb(166 103 89 / 24%); }
.core-record-certificate dt { color: #a67467; font-size: 9px; font-weight: 900; }
.core-record-certificate dd { margin: 0; color: #684c45; font-size: 9px; font-weight: 850; }
.core-record-certificate > i { z-index: 1; position: absolute; right: 14px; bottom: 15px; display: grid; width: 53px; height: 53px; place-items: center; border: 3px double #c88356; border-radius: 50%; color: #a86145; font-size: 8px; font-style: normal; font-weight: 950; line-height: 1.15; text-align: center; transform: rotate(-8deg); }

.core-record-certificate-story { display: grid; min-width: 0; padding: 14px; grid-template-rows: auto minmax(0, 1fr) auto; gap: 10px; border-radius: 21px; background: rgb(255 255 255 / 58%); }
.core-record-certificate-story > header { display: flex; justify-content: space-between; align-items: center; }
.core-record-certificate-story > header div { display: grid; gap: 2px; }
.core-record-certificate-story > header h3 { margin: 0; color: #654c45; font-family: var(--font-display); font-size: 17px; }
.core-record-certificate-story > header button { min-height: 31px; padding: 0 11px; border: 1px solid #d9b7a4; border-radius: 10px; background: #fff9ee; color: #8d5758; font-size: 9px; font-weight: 900; }
.core-record-certificate-story ol { display: grid; min-height: 0; overflow: auto; margin: 0; padding: 0 3px 0 0; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; list-style: none; scrollbar-width: thin; }
.core-record-certificate-story li { display: grid; min-width: 0; min-height: 103px; padding: 7px; grid-template-columns: 70px minmax(0, 1fr); gap: 6px; align-items: center; border: 1px solid rgb(176 118 91 / 14%); border-radius: 13px; background: #fffdf8; }
.core-record-certificate-story li img { width: 70px; height: 76px; object-fit: contain; object-position: 50% 100%; border-radius: 10px; background: linear-gradient(#f5dfc8, #edc7aa); }
.core-record-certificate-story li span { display: grid; gap: 4px; }
.core-record-certificate-story li b { color: #6c5048; font-size: 10px; }
.core-record-certificate-story li small { color: #a86a63; font-size: 8px; line-height: 1.35; }
.core-record-badges { display: flex; overflow: auto; gap: 5px; }
.core-record-badges span { flex: 0 0 auto; padding: 4px 8px; border-radius: 10px; background: #f4ded2; color: #8a5a55; font-size: 8px; font-weight: 850; }

.core-daily-records { display: grid; gap: 12px; }
.core-daily-records > section { display: grid; gap: 8px; }
.core-daily-records > section > header { display: flex; justify-content: space-between; align-items: center; }
.core-daily-records > section > header b { color: #71534b; font-size: 10px; }
.core-daily-record-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.core-daily-record { display: grid; padding: 9px; grid-template-columns: 76px minmax(0, 1fr); gap: 9px; align-items: center; border: 1px solid rgb(157 103 82 / 14%); border-radius: 15px; background: #fffdf8; }
.core-daily-record img { width: 76px; height: 68px; object-fit: contain; object-position: 50% 100%; border-radius: 11px; background: #f2d8c1; }
.core-daily-record div { display: grid; gap: 3px; }
.core-daily-record span { color: #a56560; font-size: 8px; font-weight: 900; }
.core-daily-record b { color: #624a43; font-size: 12px; }
.core-daily-record small { color: #8a746c; font-size: 8px; }
.core-cat-companionship { margin-top: 8px; padding: 10px 12px; border-radius: 14px; background: #f3e3d4; }
.core-cat-companionship span { color: #aa6662; font-size: 8px; font-weight: 900; }
.core-cat-companionship b { display: block; margin: 3px 0; color: #674e47; font-size: 11px; }
.core-cat-companionship p { margin: 0; color: #8a746c; font-size: 8px; }
.core-interaction-achievements { display: grid; margin: 0; padding: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; list-style: none; }
.core-interaction-achievements li { display: flex; padding: 9px 11px; justify-content: space-between; border-radius: 13px; background: #f7e9df; color: #765952; font-size: 9px; }
.core-interaction-achievements li span { color: #a06661; }
.core-record-media .core-memory-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.core-record-inline-empty { margin: 0; color: #8a746c; font-size: 10px; }

.core-record-empty { display: grid; min-height: 270px; place-content: center; justify-items: center; gap: 7px; border: 1px dashed rgb(160 105 85 / 26%); border-radius: 21px; background: rgb(255 255 255 / 44%); color: #7c625a; text-align: center; }
.core-record-empty > span { display: grid; width: 58px; height: 58px; place-items: center; border-radius: 50%; background: #efd9c8; color: #aa6662; font-size: 25px; }
.core-record-empty b { font-family: var(--font-display); font-size: 18px; }
.core-record-empty p { width: min(360px, 80%); margin: 0; color: #927d74; font-size: 10px; line-height: 1.6; }
