/* Spectra tooth tabs: one material, one physical-style guide, real catalogue links. */
.shade-guide{--sg-iron:var(--ink-2);--sg-dark:var(--tile-2);margin:20px 0 12px;min-width:0}
.sg-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:12px}
.sg-eyebrow{font:400 12px/1.5 Arial,sans-serif;letter-spacing:.16em;color:#6b7176;margin-bottom:7px}
.sg-heading h2{font-size:clamp(28px,3vw,40px);margin:0 0 4px}
.sg-heading p:not(.sg-eyebrow){color:#61676e;font-size:14px}
.sg-forms{display:flex;gap:6px;flex-wrap:wrap;margin:22px 0 8px}
.sg-forms a{padding:7px 25px;border:1px solid #d1d5d8;border-radius:var(--r-card);font-size:14px;min-height:44px;display:flex;align-items:center}
.sg-forms a[aria-selected=true]{background:var(--sg-dark);border-color:var(--sg-dark);color:white}
.sg-form-label{font-size:17px;margin:16px 0 0}.sg-enhanced .sg-form-label{display:none}
.sg-panel[hidden]{display:none!important}
/* One continuous instrument: connected stepped rails, sockets and a Spectra fascia. */
.sg-case{--sg-row-height:168px;--sg-headroom:38px;--sg-back-rail:75px;position:relative;isolation:isolate;width:min(100%,var(--sg-case-width));margin:4px auto 20px;filter:drop-shadow(0 14px 12px #29313a12)}
.sg-viewport{position:relative;direction:ltr;min-width:0;padding:var(--sg-headroom) 22px 0;background:transparent;border-radius:var(--r-tool)}
/* The two end cheeks connect every tier to the same holder. */
.sg-viewport::before,.sg-viewport::after{content:'';position:absolute;top:calc(var(--sg-headroom) + var(--sg-back-rail) - 8px);bottom:0;width:9px;border:1px solid #b9c1c7;border-radius:var(--r-tool);background:transparent;box-shadow:none;z-index:3;pointer-events:none}
.sg-viewport::before{left:6px}.sg-viewport::after{right:6px}
.sg-rack{list-style:none;position:relative;display:grid;grid-template-columns:repeat(var(--sg-columns),minmax(0,1fr));grid-auto-rows:var(--sg-row-height);margin:0;padding:0;gap:0;background:transparent}
.sg-slot{min-width:0;position:relative;display:flex;align-items:flex-start;justify-content:center;margin:0;padding:0}
/* A recessed slot sits behind the metal handle; the continuous front lip hides its tip. */
.sg-slot::before{content:'';position:absolute;bottom:16px;left:50%;transform:translateX(-50%);width:36px;height:9px;border:1px solid #a9b2b9;border-radius:50%;background:#535f68;box-shadow:inset 0 3px 3px #202b36a0,0 1px 0 #ffffffe0;z-index:0}
.sg-slot::after{content:'';position:absolute;inset:auto 0 0;height:10px;border-radius:var(--r-tool);background:transparent;z-index:2;pointer-events:none}
.sg-sample{position:relative;z-index:1;display:block;width:100%;max-width:68px;min-width:44px;height:157px;padding:0;text-decoration:none!important;touch-action:manipulation;color:#303a41;border-radius:var(--r-tool);-webkit-tap-highlight-color:transparent}
.sg-piece{display:flex;position:relative;flex-direction:column;align-items:center;height:100%;transform-origin:50% 85%;transition:transform .42s cubic-bezier(.18,.8,.24,1),filter .42s ease;filter:drop-shadow(0 2px 1px #26343f12)}
.sg-tooth{width:60px;height:76px;display:block;position:relative;z-index:2;flex:none;filter:drop-shadow(0 2px 1px #1b1f2625)}
/* Edition (5): brushed flat steel; the handle stays narrower than the crown. */
.sg-stem{width:36px;height:94px;min-height:94px;position:relative;margin-top:-13px;flex:none;clip-path:polygon(36% 0,64% 0,64% 15px,100% 22px,100% 100%,0 100%,0 22px,36% 15px);background:#cbd3d9;box-shadow:inset 1px 0 0 #e0e5e8,inset -1px 0 0 #a0abb2,inset 0 -1px 0 #8c99a2}
.sg-engraving{position:absolute;inset:23px 0 5px;display:grid;place-items:center}
.sg-label{font:400 12px/1 Arial,sans-serif;letter-spacing:0;text-align:center;white-space:normal;overflow-wrap:anywhere;position:relative;color:#35434d;text-shadow:0 1px 0 #ffffff70}
.sg-long .sg-label{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-90deg);width:66px;font-size:12px;line-height:1;letter-spacing:0;font-weight:400}
.sg-very-long .sg-label{width:72px;font-size:12px;line-height:1.05;transform:translate(-50%,-50%) rotate(-90deg) scaleX(.79)}
.sg-holder{display:flex;justify-content:space-between;align-items:center;gap:18px;min-height:72px;padding:18px 24px;color:#fff;background:var(--tile-2);position:relative;border:1px solid #394047;border-top-color:#73808b;border-radius:var(--r-tool);box-shadow:inset 0 1px 0 #ffffff20,inset 0 -4px 0 #20293045,0 5px 0 -2px #9ba6ae}
.sg-holder::before{content:'';position:absolute;top:-4px;left:0;right:0;height:3px;background:#b9c3ca;border-radius:var(--r-tool)}
.sg-holder::after{content:'';position:absolute;inset:10px 22px 8px auto;width:145px;background-image:conic-gradient(from 90deg,#aeb6bf50 0deg 90deg,transparent 90deg 360deg);background-size:16px 16px;opacity:.2;mask-image:linear-gradient(90deg,transparent,#000);pointer-events:none}
.sg-holder img{width:120px;height:auto;flex-shrink:0;position:relative;z-index:1;object-fit:contain}
.sg-holder>div{position:relative;z-index:1;min-width:0;display:flex;flex-direction:column;align-items:flex-end;gap:3px;text-align:end}
.sg-holder strong{font-size:14px;font-weight:400;line-height:1.4}.sg-holder span{font-size:12px;opacity:.72}
.sg-missing-note,.sg-reference-note{color:#62686e;font-size:12px;line-height:1.8;margin-top:14px;max-width:850px}
.sg-missing-note{display:flex;gap:8px;align-items:baseline}.sg-missing-note>span{display:inline-grid;place-items:center;min-width:19px;height:19px;border:1px dashed #969da2;border-radius:50%;font:12px Arial,sans-serif}
.sg-tooth-missing{color:#92999e;filter:none}
.sg-sample:focus-visible{outline:2px solid #50788d;outline-offset:2px;z-index:4}.sg-sample:focus-visible .sg-piece{transform:translateY(-7px)}
.sg-sample.sg-lifting{z-index:5}.sg-sample.sg-lifting .sg-piece{transform:translateY(-34px) rotate(-3deg) scale(1.025);filter:drop-shadow(3px 10px 5px #26343f35)}
.sg-back{display:inline-block;font-size:14px;border-bottom:1px solid #8f969c;margin:0 0 22px;padding:4px 0}
.shade-pack-page{padding-top:30px}.shade-pack-page .variant-picker{margin-top:0}
.sg-library-links{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;border-block:1px solid #e1e4e6;padding:18px 0;margin:24px 0 30px;font-size:14px}
.sg-library-title{font-weight:700;color:#363b40}.sg-library-links>div{display:flex;flex-wrap:wrap;gap:8px 20px}.sg-library-links a{padding:8px 0;min-height:44px;display:inline-flex;align-items:center;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#bbc0c3}
.sg-library-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.sg-library-card{border:1px solid #dfe2e3;border-radius:var(--r-card);padding:26px;display:block;background:#f8f8f7;transition:border-color .2s}
.sg-library-card:hover{border-color:#7d858b}.sg-library-card h2{font-size:clamp(28px,3vw,40px);margin:16px 0 8px}.sg-library-card>span{color:#656c71;font-size:14px}
.sg-library-swatches{display:flex;gap:3px;direction:ltr;justify-content:center;overflow:hidden;padding:10px 0 16px;border-bottom:3px solid #4b4f54}
.sg-library-swatches .sg-tooth{width:17%;height:auto;max-height:90px;filter:none}
.sg-reference-detail{display:grid;grid-template-columns:minmax(180px,280px) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:start;max-width:1000px}
.sg-reference-sample{display:flex;flex-direction:column;align-items:center;gap:24px;background:#f3f3f1;border:1px solid #e1e3e4;border-radius:var(--r-card);padding:32px 20px;text-align:center}
.sg-reference-sample .sg-tooth{width:120px;height:154px}.sg-reference-sample bdi{font-weight:400;overflow-wrap:anywhere}
.sg-reference-detail h2{font-size:clamp(28px,3vw,40px);margin:0 0 16px}.sg-reference-detail p{line-height:1.9;max-width:620px;color:#656c71}.sg-reference-detail .btn{margin-top:20px}
.sg-pack-links{display:grid;gap:12px}.sg-pack-link{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:20px;border:1px solid #d9dde0;border-radius:var(--r-card)}.sg-pack-link:hover{background:#f7f8f8}.sg-pack-link span,.sg-pack-link bdi{font-size:14px;color:#606a71}
@media(max-width:850px){.sg-library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){.sg-library-grid{grid-template-columns:1fr}.sg-library-card{padding:22px}.sg-reference-detail{grid-template-columns:1fr}.sg-reference-sample{flex-direction:row;justify-content:center;gap:24px}.sg-reference-sample .sg-tooth{width:82px;height:105px}.sg-reference-sample bdi{max-width:180px}.sg-library-links{display:block}.sg-library-links>div{margin-top:8px}}
.shades-body{padding-top:22px}.shade-guide-section{padding-top:28px}
@media(hover:hover) and (pointer:fine){.sg-sample:hover{z-index:4}.sg-sample:hover .sg-piece{transform:translateY(-8px)}.sg-sample.sg-lifting .sg-piece{transform:translateY(-34px) rotate(-3deg) scale(1.025)}}
@media(max-width:1000px){.sg-rack{grid-template-columns:repeat(var(--sg-columns-medium),minmax(0,1fr))}.sg-case{max-width:740px}}
@media(max-width:640px){
 .shade-guide{margin-top:16px}.sg-heading h2{font-size:clamp(28px,3vw,40px)}.sg-heading p:not(.sg-eyebrow){font-size:14px}
 .sg-case{--sg-row-height:148px;--sg-headroom:32px;--sg-back-rail:64px;margin-bottom:16px;max-width:480px}
 .sg-viewport{padding-inline:12px}.sg-viewport::before,.sg-viewport::after{width:8px}.sg-viewport::before{left:3px}.sg-viewport::after{right:3px}
 .sg-rack{grid-template-columns:repeat(var(--sg-columns-small),minmax(0,1fr))}
 .sg-sample{height:132px;max-width:58px}.sg-tooth{width:48px;height:62px}
 .sg-stem{margin-top:-12px;width:30px;height:82px;min-height:82px;clip-path:polygon(36% 0,64% 0,64% 12px,100% 18px,100% 100%,0 100%,0 18px,36% 12px)}
 .sg-engraving{inset:18px 0 4px}.sg-label{font-size:12px}.sg-long .sg-label{font-size:12px;width:58px;line-height:.95}.sg-very-long .sg-label{width:60px;line-height:.95;transform:translate(-50%,-50%) rotate(-90deg) scaleX(.7)}
 .sg-slot::before{width:31px;height:8px}.sg-slot::after{height:10px}
 .sg-holder{padding:13px 15px;gap:14px;min-height:58px;border-radius:var(--r-tool)}.sg-holder img{width:96px}.sg-holder strong{font-size:12px}.sg-holder span{font-size:12px}
 .sg-sample.sg-lifting .sg-piece{transform:translateY(-28px) rotate(-3deg) scale(1.025)}
 .sg-reference-note,.sg-missing-note{font-size:12px}.shades-body{padding-top:16px}}
@media(prefers-reduced-motion:reduce){.sg-piece{transition:none!important}.sg-sample:hover .sg-piece,.sg-sample:focus-visible .sg-piece,.sg-sample.sg-lifting .sg-piece{transform:none!important;filter:none!important}.sg-viewport{scroll-behavior:auto!important}}


/* Approved transparent artwork already contains its surface lighting. */
.sg-tooth-rev5{filter:none}
/* A focused fork after the existing physical-guide lift. Native dialog supplies
   modal focus containment and Escape dismissal; anchors retain real URLs. */
body.sg-choice-open{overflow:hidden}
.sg-choice{box-sizing:border-box;width:min(510px,calc(100% - 32px));max-height:calc(100dvh - 40px);margin:auto;padding:28px;border:1px solid #d4d9dd;border-radius:var(--r-card);background:#fff;color:#262d32;box-shadow:none;font-family:inherit;overflow:auto}
.sg-choice::backdrop{background:rgba(20,27,34,.5);backdrop-filter:blur(4px)}
.sg-choice[open]{animation:sg-choice-enter .18s ease-out}
.sg-choice-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
.sg-choice-top p{margin:0;font:12px/1.5 Arial,sans-serif;letter-spacing:.14em;color:#59646d}
.sg-choice-close{display:grid;place-items:center;width:44px;height:44px;flex:none;border:1px solid #d5dadf;border-radius:50%;padding:0;background:#f6f7f8;color:#29323a;font:21px/1 Arial,sans-serif;cursor:pointer}
.sg-choice-material{margin:0 0 3px;color:#65717a;font-size:14px}
.sg-choice h2{margin:0;font-size:clamp(28px,3vw,40px);line-height:1.45;overflow-wrap:anywhere;color:#242b31}
.sg-choice #sg-choice-hint{margin:8px 0 22px;color:#59636c;font-size:14px}
.sg-choice-actions{display:grid;gap:12px}
.sg-choice-actions>a{display:grid;grid-template-columns:30px minmax(0,1fr) 18px;align-items:center;gap:14px;text-decoration:none;border:1px solid #c8d0d5;border-radius:var(--r-card);padding:19px 16px;color:#29313a;background:#f5f7f8}
.sg-choice-actions>.sg-choice-packs{background:#2d3136;color:#fff;border-color:#2d3136}
.sg-choice-actions strong{display:block;font-size:17px;line-height:1.5;font-weight:400}
.sg-choice-actions small{display:block;font-size:14px;line-height:1.7;margin-top:4px;color:#53616c}
.sg-choice-packs small{color:#d8dfe4}
.sg-choice-symbol{font:12px/1 Arial,sans-serif;opacity:.75}
.sg-choice-actions>a:hover{box-shadow:none;border-color:#6b7e8c}
.sg-choice :focus-visible{outline:3px solid #587a8f;outline-offset:4px}
@keyframes sg-choice-enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:540px){.sg-choice{width:calc(100% - 20px);padding:22px 18px;margin:auto auto 10px;border-radius:var(--r-card)}.sg-choice-actions>a{padding:17px 12px;gap:10px}.sg-choice h2{font-size:clamp(28px,3vw,40px)}}
@media(prefers-reduced-motion:reduce){.sg-choice[open]{animation:none}}