:root{--ink:#35272d;--muted:#77676d;--rose:#91445f;--pale:#f4e9ed;--line:#e7dade;--paper:#fffcfc}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;color:var(--ink);background:var(--paper);font-family:'Yu Gothic','Meiryo',sans-serif;font-size:16px;line-height:1.6}button,input,select,textarea{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #b27a24;outline-offset:4px}button:disabled{cursor:default;opacity:.5}button,a{touch-action:manipulation}[hidden]{display:none!important}.preview{padding:5px 12px;text-align:center;font-size:12px;background:#efe5e8;color:#654653}header{height:86px;display:flex;align-items:center;justify-content:space-between;padding:12px 24px;border-bottom:1px solid var(--line);background:var(--paper);max-width:1160px;margin:auto}.brand{text-decoration:none;color:var(--ink);font-family:Georgia,'Times New Roman',serif;font-size:31px;letter-spacing:.15em;line-height:1.2}.brand small{display:block;font:8px Arial,sans-serif;letter-spacing:.25em;text-align:center;margin-top:5px}.saved-link{background:none;border:0;min-height:44px;font-size:14px;display:flex;align-items:center;gap:7px}.saved-link>span{font-size:30px}.saved-link b{display:grid;place-content:center;background:var(--rose);color:white;border-radius:50%;min-width:24px;height:24px;font-size:12px}main{max-width:1060px;margin:auto;padding:26px 22px 210px}.intro{text-align:center;margin-bottom:24px}.eyebrow{font-family:Georgia,serif;font-size:12px;letter-spacing:.16em;color:var(--rose);margin:0 0 10px}h1{font-family:'Yu Mincho','Hiragino Mincho ProN',serif;font-size:32px;font-weight:500;letter-spacing:.03em;line-height:1.55;margin:0 0 8px}p{margin:8px 0}h2{font-size:20px;font-weight:500}.intro>p:not(.eyebrow){font-size:14px;color:var(--muted)}.intro .lead{font-family:'Yu Mincho',serif;font-size:19px!important;color:var(--ink)!important;margin:10px 0}.price-note{margin:16px auto 0;display:inline-block;padding:6px 15px;border-radius:30px;background:var(--pale);font-size:14px}.filters{padding:0 0 20px}.filter-line{display:flex;gap:8px}.filter-line button{flex:1;min-height:44px;border:1px solid #cfaebc;border-radius:30px;background:white;font-size:14px;white-space:nowrap;padding:9px 10px}.filter-line button.active{background:var(--rose);color:white;border-color:var(--rose)}.tone-label{font-size:14px;display:flex;align-items:center;gap:15px;margin-top:16px;color:var(--muted)}select{flex:1;min-width:0;background:#fff;border:1px solid var(--line);border-radius:7px;padding:10px;color:var(--ink);font-size:14px;min-height:44px}.list-heading{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin:0 0 12px}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 16px}.card{background:white;border:1px solid var(--line);border-radius:10px;overflow:hidden;position:relative;animation:appear .35s ease both}.photo{display:block;border:0;padding:0;width:100%;position:relative;aspect-ratio:1.55;background:#f0e8e6;overflow:hidden}.photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}.photo:hover img{transform:scale(1.025)}.card-info{padding:12px 12px 15px}.card-info h2{font-size:16px;margin:0;font-weight:500;letter-spacing:.03em}.card-info p{font-size:12px;color:var(--muted);margin:2px 0 0}.heart{position:absolute;top:8px;right:8px;width:44px;height:44px;border:1px solid #e6d5dc;border-radius:50%;background:rgba(255,255,255,.96);font-size:27px;line-height:1;display:grid;place-items:center;color:var(--rose);box-shadow:0 2px 6px #35272d0d}.heart.selected{background:var(--rose);color:white;border-color:var(--rose)}.more{display:block;margin:28px auto 20px;min-width:190px;padding:12px 24px;border:1px solid #c69eae;background:white;border-radius:30px;font-size:15px}.photo-note{font-size:12px;color:var(--muted);line-height:1.8;text-align:center;margin:24px auto 0;max-width:520px}.primary{border:0;background:var(--rose);color:white;min-height:50px;border-radius:8px;padding:13px 18px;font-weight:500;letter-spacing:.025em;width:100%}.primary:active{background:#723047}.bottom-bar{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,620px);background:rgba(255,252,252,.98);border:1px solid var(--line);border-bottom:none;border-radius:18px 18px 0 0;box-shadow:0 -7px 30px #4522350b;padding:12px 20px calc(14px + env(safe-area-inset-bottom))}.bar-copy{display:flex;gap:10px;align-items:center;margin-bottom:10px;min-height:38px;font-size:14px}.bar-copy strong{font:29px Georgia,serif;color:var(--rose);white-space:nowrap}.bar-copy strong>span{font:13px 'Yu Gothic',sans-serif;margin-left:4px;color:var(--ink)}#mini-photos{display:flex;margin-left:auto;gap:5px}#mini-photos img{width:42px;height:34px;object-fit:cover;border-radius:4px}.back{padding:9px 0 18px;border:0;background:none;font-size:14px;color:var(--muted);min-height:44px}.saved-intro{font-size:16px;color:var(--muted);margin-bottom:22px}.selection-summary{padding:14px 16px;background:var(--pale);border-radius:9px;display:flex;align-items:center;gap:17px;margin:20px 0}.selection-summary strong{font:30px Georgia,serif;color:var(--rose)}.selection-summary span{font-size:14px}.choose{min-height:44px;background:white;color:var(--rose);border:1px solid #bc8d9f;border-radius:6px;font-size:14px;width:100%;margin-top:9px}.choose.chosen{background:var(--rose);color:white}.card.chosen-card{border:2px solid var(--rose)}.remove{display:block;font-size:12px;border:0;background:none;text-decoration:underline;padding:12px 4px 0;min-height:40px;color:var(--muted)}.empty{padding:45px 16px;text-align:center;line-height:1.9}.empty h2{font-family:'Yu Mincho',serif}.empty p{font-size:14px}.empty .primary{margin-top:20px;max-width:300px}.large-heart{font-size:60px;color:#bd8fa1}.copy-label{display:block;margin-top:25px;font-size:14px}textarea{display:block;width:100%;resize:vertical;border:1px solid #c9a9b6;padding:15px;background:white;border-radius:8px;margin:9px 0 16px;line-height:1.9}.copy-help{text-align:center;color:var(--muted);font-size:14px;margin:17px 0 35px}.next-step{border-top:1px solid var(--line);padding-top:24px}.next-step>span{font-size:12px;color:var(--rose)}.next-step p{font-size:14px;color:var(--muted)}#confirmation{max-width:780px;margin:auto}#confirm-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:24px}#confirm-grid .card-info{padding:10px 6px}#confirm-grid h2{font-size:13px;word-break:break-all}.detail-image img{width:100%;display:block}.detail-copy{padding:23px}.detail-copy h2{font-size:24px;font-family:Georgia,serif;margin:0 0 10px}.detail-copy .primary{margin-top:20px}dialog{padding:0;border:0;border-radius:14px;max-width:600px;width:calc(100% - 24px);max-height:90dvh;overflow:auto;color:var(--ink);box-shadow:0 20px 80px #22141c55}dialog::backdrop{background:#24151bbb;backdrop-filter:blur(3px)}.close{position:sticky;top:10px;float:right;margin:10px 10px -54px 0;z-index:2;width:44px;height:44px;border:0;border-radius:50%;background:#fffffff2;font-size:28px;color:var(--ink)}#toast{position:fixed;bottom:180px;left:50%;transform:translate(-50%,15px);opacity:0;pointer-events:none;background:#382731;color:white;padding:10px 18px;border-radius:9px;font-size:14px;max-width:calc(100% - 30px);width:max-content;z-index:20;transition:.2s}#toast.show{opacity:1;transform:translate(-50%,0)}@keyframes appear{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}@media(max-width:760px){header{padding:12px 18px;height:77px}main{padding:23px 16px 205px}h1{font-size:27px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}.intro{margin-bottom:20px}.card-info h2{font-size:15px}.tone-label{gap:10px}.filter-line{gap:6px}.filter-line button{padding:9px 6px}.bottom-bar{padding-left:16px;padding-right:16px}.photo{aspect-ratio:1.35}.photo img{object-position:center}.heart{top:6px;right:6px}.saved-intro{font-size:15px}#confirm-grid .photo{aspect-ratio:1}#confirmation h1{font-size:25px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

#confirm-grid h2{word-break:normal;overflow-wrap:anywhere}.code-quantity{display:block;white-space:nowrap}
.page-backbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}.page-backbar .back{padding:8px 12px;min-height:44px;border:1px solid var(--line);border-radius:7px;background:white;font-size:14px}.page-backbar span{font-size:12px;color:var(--muted)}#back-detail{display:block;min-height:44px;padding:8px 0 14px}

.card-info .color-names{color:var(--ink);font-size:12px;line-height:1.85;margin:7px 0 5px;font-weight:400}.color-names .color-name{display:inline-block;max-width:100%;overflow-wrap:anywhere;vertical-align:top}.color-separator{color:var(--muted)}#detail-colors{font-size:15px;line-height:1.9;margin:8px 0 14px;color:var(--ink)}

.card-info .collection-name{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;color:var(--rose);font-size:16px;line-height:1.65;font-weight:600;margin:9px 0 6px;overflow-wrap:anywhere;letter-spacing:.015em}#detail-display-name{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;color:var(--rose);font-size:24px;line-height:1.6;font-weight:600;margin:8px 0 12px;overflow-wrap:anywhere}#detail-display-name:not([hidden])+#detail-colors{border-top:1px solid var(--line);padding-top:10px;font-size:13px}.card-info .collection-name+.color-names{color:var(--muted)}

.card-info .collection-story{font-size:12px;line-height:1.85;color:#65515b;margin:5px 0 10px}.card-info .collection-story+.color-names{border-top:1px solid var(--line);padding-top:9px;color:var(--muted)}#detail-story{font-size:15px;line-height:1.9;margin:8px 0 15px;color:#65515b}#detail-colors{border-top:1px solid var(--line);padding-top:10px}.gallery-view{display:none}
@media(max-width:760px){.gallery-view{display:flex;gap:8px;margin:0 0 17px}.gallery-view button{flex:1;min-height:44px;border:1px solid #cba2b2;border-radius:8px;background:white;color:var(--rose);font-size:14px;padding:9px}.gallery-view button[aria-pressed=true]{background:var(--rose);color:white;border-color:var(--rose)}#collection:not(.compact-gallery) #grid{grid-template-columns:1fr;gap:24px}#collection:not(.compact-gallery) .photo{aspect-ratio:1.65}#collection:not(.compact-gallery) .card-info{padding:17px 19px 19px}#collection:not(.compact-gallery) .card-info h2{font-size:13px;color:var(--muted)}#collection:not(.compact-gallery) .collection-name{font-size:22px;margin:7px 0 9px}#collection:not(.compact-gallery) .collection-story{font-size:14px;line-height:1.9}#collection:not(.compact-gallery) .color-names{font-size:12px}#collection .heart{width:46px;height:46px;top:10px;right:10px}.compact-gallery .collection-story{display:none}#saved-grid,#confirm-grid{grid-template-columns:1fr}#saved-grid .photo,#confirm-grid .photo{aspect-ratio:1.65}#saved-grid .card-info,#confirm-grid .card-info{padding:16px}#saved-grid .collection-name,#confirm-grid .collection-name{font-size:20px}}

/* 作品番号を、来店前に選ぶ対象として明示する。 */
.card-info .work-number-label,.detail-copy .work-number-label{font-size:11px;color:var(--muted);margin:0 0 3px;letter-spacing:.08em}
.card-info h2.work-number,#collection:not(.compact-gallery) .card-info h2.work-number,#confirm-grid h2.work-number,.detail-copy #detail-code{font-family:inherit;font-size:18px;font-weight:700;color:var(--rose);margin:0;line-height:1.5;letter-spacing:.015em}
.card-info .work-number-guide,.detail-copy .work-number-guide{font-size:12px;line-height:1.8;color:#654653;background:var(--pale);border-radius:6px;padding:7px 9px;margin:7px 0 12px;overflow-wrap:anywhere}
.detail-copy #detail-code{font-size:24px}
@media(max-width:760px){#collection:not(.compact-gallery) .card-info h2.work-number{font-size:21px}#collection:not(.compact-gallery) .work-number-guide{font-size:13px}.compact-gallery .card-info h2.work-number{font-size:15px}.compact-gallery .work-number-guide{font-size:11px;padding:6px}#confirm-grid .code-quantity{display:inline}}

.color-visit-policy{border:1px solid #d1a9b9;border-left:4px solid var(--rose);border-radius:10px;background:#fcf6f8;padding:20px;margin:20px 0 26px;text-align:left;color:#513b45;font-size:16px;line-height:1.85}
.color-visit-policy>strong{display:block;font-size:18px;color:var(--rose)}.color-visit-policy p{font-size:16px;color:#513b45;margin:10px 0 0;line-height:1.85}
.color-fee-box{padding:16px;margin-top:18px;background:#f3e3e9;border:1px solid #d8b4c2;border-radius:8px}
.color-visit-policy .color-change-fee{margin:0;color:#6d2542;line-height:1.65}.fee-condition{display:block;font-size:18px;font-weight:700}.color-change-fee>strong{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 8px;font-size:19px;margin-top:7px}.color-change-fee .fee-amount{font-size:32px;line-height:1.45;white-space:nowrap}.fee-ending{display:block;font-size:15px}
.color-visit-policy .color-fee-reason{border-top:1px solid #d8b4c2;padding-top:12px;margin-top:12px;font-size:17px;font-weight:600;color:#51313f;line-height:1.85}.color-visit-policy .color-recommendation{font-size:17px;margin-top:16px}.selection-summary strong{white-space:nowrap}
@media(max-width:760px){.color-visit-policy{padding:16px}.color-fee-box{padding:14px}.selection-summary{gap:12px}.selection-summary strong{font-size:26px}.bar-copy strong>span{font-size:12px}}

.color-visit-policy .fee-warning{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:20px;font-weight:700;color:#6d2542;line-height:1.5}.fee-warning span{font-size:26px;line-height:1}

/* Official Diana logo: use the supplied image without changing its proportions. */
header{height:152px;padding-top:6px;padding-bottom:6px}
.brand{display:block;flex:none;line-height:0;letter-spacing:0}
.brand .brand-logo{display:block;width:120px;height:auto;max-width:100%;object-fit:contain}
.site-footer .footer-logo{display:block;margin:0 auto 12px;padding:0;line-height:0;letter-spacing:0}
.footer-logo-image{display:block;width:128px;height:auto;object-fit:contain}
.recruit-logo{display:block;width:170px;max-width:75%;height:auto;object-fit:contain;margin:0 auto 24px}
@media(max-width:760px){header{height:126px;padding-top:6px;padding-bottom:6px}.brand .brand-logo{width:96px}.footer-logo-image{width:120px}.recruit-logo{width:150px}}

/* An explicit personal-save action, separate from public reactions. */
.card-info .save-candidate{display:block;position:static;width:100%;min-height:48px;margin:16px 0 0;padding:10px 7px;border:1px solid #bd849a;border-radius:10px;background:#fff9fb;color:#803e57;font-size:13px;font-weight:700;line-height:1.6;white-space:normal}
.card-info .save-candidate.selected{background:#91445f;border-color:#91445f;color:white}
@media(max-width:760px){.nail-card .card-info .save-candidate,.compact-gallery .card-info .save-candidate{font-size:12px;padding:10px 5px}}