/* GrandCore COLORS v002 / Offline Edit 007. Geometry -> material -> optics -> experience.
   Screen-space optics demonstrations, NOT calibrated PBR or material certification.
   The existing source artworks, 49-mesh witness and all nine direct original URLs are FROZEN. */
.material-rail{border-top:1px solid #6b5945;padding:12px 0 14px;margin-top:8px;min-height:110px}
.material-rail-label{font:700 10px/1.3 system-ui,sans-serif;letter-spacing:.12em;color:#c9ae87;display:block;margin-bottom:11px}
.material-rail-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.material-rail-item{min-width:0;display:flex;flex-direction:column;gap:6px;color:#e6d8c5;font:500 11px/1.35 system-ui,sans-serif}
.material-rail-item>span:last-child{overflow-wrap:anywhere}
.material-rail-swatch{width:100%;height:26px;border:1px solid #ac936c70;box-shadow:inset 0 1px 2px #ffffff46,inset 0 -6px 6px #0007,0 4px 10px #0005;position:relative;overflow:hidden}
.material-rail-swatch:after,.world-material-specimen-surface:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 28%,#fff2 31%,transparent 36%,transparent 75%,#0004 100%);mix-blend-mode:screen}
/* Narrow-band reflection on brushed metals: line marks describe finish direction, not measured BRDF. */
.mat-optics-stainless{background:repeating-linear-gradient(0deg,#f6f8fa14 0px,transparent 1px 4px),linear-gradient(105deg,#21252b,#8c9298 28%,#e3e7e9 39%,#41464b 51%,#a1a6a8 79%,#303336)}
.mat-optics-chrome{background:linear-gradient(170deg,#0a0b0d 0%,#d0d3d5 16%,#202227 29%,#c8cbcb 42%,#15181d 56%,#ebebee 67%,#2b3035 81%,#080a0e)}
.mat-optics-titanium{background:repeating-linear-gradient(0deg,#b9c0c32b 0px,transparent 1px 5px),linear-gradient(118deg,#252f34,#858e8e 22%,#c4cdca 36%,#4c575e 52%,#b0bac0 72%,#232c34)}
.mat-optics-copper{background:repeating-linear-gradient(0deg,#f8d0a524 0px,transparent 1px 4px),linear-gradient(116deg,#3b1a11,#bc7545 24%,#ecc695 36%,#7b3b1c 47%,#d78e56 72%,#402116)}
.mat-optics-copper-aged{background:radial-gradient(circle at 30% 50%,#5f8e7755,transparent 30%),repeating-linear-gradient(90deg,#ddb37b18 0px,transparent 1px 7px),linear-gradient(124deg,#3d2720,#995c40,#687764,#b47f52,#2c2925)}
.mat-optics-bronze{background:linear-gradient(100deg,#362412,#ad7842 23%,#f3c88e 37%,#5b361c 46%,#d5aa67 65%,#46311c 100%)}
.mat-optics-aged-bronze{background:radial-gradient(circle at 72% 35%,#9ba07f33,transparent 38%),linear-gradient(112deg,#241b12,#755336 23%,#b48d57 41%,#5c4b3a 53%,#aa895f 77%,#221d14)}
.mat-optics-walnut{background:repeating-linear-gradient(88deg,#0a05044a 0 1px,transparent 2px 9px,#8c634438 10px 11px,transparent 12px 22px),linear-gradient(93deg,#140f0d,#5f4030 37%,#1b120e 62%,#5e4736 100%)}
.mat-optics-oak{background:repeating-linear-gradient(91deg,#f0c68b15 0 1px,transparent 2px 10px,#261e1452 11px 12px,transparent 13px 26px),linear-gradient(100deg,#372819,#9a7450 48%,#3e2c1c 100%)}
.mat-optics-limestone{background:radial-gradient(ellipse at 35% 22%,#fbf1db35 1px,transparent 4px),repeating-radial-gradient(circle at 75% 60%,#8b836b18 0 1px,transparent 2px 8px),linear-gradient(124deg,#b7af99,#ddd5be 42%,#aca48c 88%)}
.mat-optics-onyx{background:repeating-linear-gradient(113deg,#fff7da2d 0px,transparent 6px 17px),linear-gradient(109deg,#9c9475,#f7e9c7 32%,#c8c1a8 55%,#f7efda 80%,#aca895)}
.mat-optics-jade{background:radial-gradient(ellipse at 68% 35%,#b0e9be8c,transparent 25%),repeating-linear-gradient(117deg,#173c2b 0 2px,#22704d 2px 14px,#0b3b2c 16px 22px),linear-gradient(110deg,#042a1d,#40ab77 42%,#17472f)}
.mat-optics-serpentine{background:repeating-linear-gradient(160deg,transparent 0px 6px,#afd8a356 7px 9px,transparent 10px 22px),linear-gradient(110deg,#102616,#2f6e46 39%,#142b1a 70%,#508c5e)}
.mat-optics-felt{background:repeating-linear-gradient(137deg,#f5f5f512 0px,transparent 1px 3px),linear-gradient(115deg,#27292c,#4d5050 45%,#202325)}
.mat-optics-leather{background:radial-gradient(circle at 17% 42%,#fff2 1px,transparent 2px),repeating-radial-gradient(circle at 50% 50%,#21090b43 0 1px,transparent 3px 5px),linear-gradient(113deg,#2d0e13,#7a2d37 45%,#37121c)}
.mat-optics-saddle{background:repeating-radial-gradient(circle at 20% 30%,#33130c38 0px 1px,transparent 2px 7px),linear-gradient(115deg,#3b2012,#bc7848 43%,#6a351e 100%)}
.mat-optics-lacquer{background:linear-gradient(102deg,#030406 0%,#16191c 24%,#81888a 32%,#101014 38%,#05070a 70%,#424647 80%,#020304)}
.mat-optics-marble{background:repeating-linear-gradient(132deg,#ffffff12 0px,transparent 3px 10px),linear-gradient(112deg,#080a0e,#323c3b 30%,#0b0c0e 53%,#333537 62%,#050609)}
.mat-optics-brick{background:repeating-linear-gradient(0deg,transparent 0 15px,#4d292287 16px 18px),repeating-linear-gradient(92deg,#e2ab7833 0 2px,transparent 3px 38px),linear-gradient(116deg,#5d2e20,#a75b43 51%,#662f23)}
.mat-optics-amber-glass{background:linear-gradient(98deg,#171009,#cb7c20bb 33%,#fff0bd 42%,#945411aa 48%,#3b2410 74%,#df8f30 95%)}
.mat-optics-frosted{background:repeating-linear-gradient(45deg,#ffffff25 0 1px,transparent 2px 4px),linear-gradient(110deg,#637676b5,#cbd6d2 38%,#839c97 80%)}
.mat-optics-clear-glass{background:linear-gradient(111deg,#121c1dbb 0%,#a8d1d166 19%,#f6ffffb5 22%,#294346e3 32%,#c9e6e477 56%,#112327 77%,#cdeae4c4 86%,#22393b)}
.mat-optics-paper{background:repeating-linear-gradient(91deg,#95765910 0 1px,transparent 2px 7px),linear-gradient(116deg,#c3b697,#f4e7ce 48%,#cfc0a5)}
.mat-optics-automotive{background:radial-gradient(circle at 30% 40%,#9c927a6a 0px,transparent 2px),repeating-radial-gradient(circle at 72% 50%,#e4d9c319 0 1px,transparent 2px 8px),linear-gradient(113deg,#030407,#101520 33%,#5a656b 41%,#11131a 48%,#0b0c0f 78%,#b5b9b6 85%,#050608)}
.mat-optics-light{background:linear-gradient(0deg,#331f4c,#714ca8 45%,#c4a9ed 50%,#503277 57%,#211630),radial-gradient(circle,#e5caff,transparent)}
.world-material-system{margin:23px 0;padding:22px;border:1px solid #8c7453;background:linear-gradient(145deg,#1b1a18,#101010 70%);color:#e7d9c5;box-shadow:0 14px 38px #0005}
.world-material-heading>span{display:block;font:700 10px/1.5 system-ui,sans-serif;letter-spacing:.14em;color:#cbb38b}
.world-material-heading h3{font:400 clamp(22px,2.4vw,34px)/1.16 Georgia,serif;color:#f1e6d7;letter-spacing:-.025em;margin:7px 0 10px}
.world-material-heading p{font:400 13px/1.7 system-ui,sans-serif;color:#d6c8b3;margin:0 0 16px}
.world-material-specimens{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.world-material-specimen{display:flex;align-items:stretch;min-width:0;border:1px solid #5b4e3a;background:#11100e}
.world-material-specimen-surface{position:relative;width:39%;min-width:54px;min-height:76px;border-right:1px solid #ad9674;box-shadow:inset 0 1px 1px #ffffff30,inset -12px 0 15px #0008}
.world-material-specimen-copy{padding:9px 9px 10px;min-width:0;flex:1}
.world-material-code{color:#b99f77;font:700 8px/1.3 system-ui,sans-serif;letter-spacing:.055em}
.world-material-specimen h4{font:400 15px/1.2 Georgia,serif;margin:4px 0 5px;color:#f0dfc5;overflow-wrap:anywhere}
.world-material-specimen-copy p{margin:0;color:#c6b8a4;font:400 10px/1.5 system-ui,sans-serif}
.world-material-proof{border-top:1px solid #735d42;margin-top:20px;padding-top:13px}
.world-material-proof summary{cursor:pointer;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:13px;font:700 10px/1.4 system-ui,sans-serif;letter-spacing:.1em;color:#f2d1a3;list-style:none}
.world-material-proof summary::-webkit-details-marker{display:none}
.world-material-proof summary:focus-visible{outline:3px solid #f0d7ab;outline-offset:3px}
.world-material-proof summary span{font-size:16px}
.world-material-boundary,.world-material-limits{font:400 12px/1.7 system-ui,sans-serif;color:#d3c4ac;margin:15px 0}
.world-material-gates{display:grid;grid-template-columns:repeat(3,1fr);list-style:none;margin:14px 0 18px;padding:0;gap:7px}
.world-material-gates li{display:flex;flex-direction:column;gap:5px;border:1px solid #5a4835;background:#17130f;padding:10px}
.world-material-gates li span{font:600 10px/1.3 system-ui,sans-serif;letter-spacing:.07em;color:#e0c7a3}
.world-material-gates li strong{font:700 10px/1.4 system-ui,sans-serif;color:#f6dbc4}
.world-material-dossiers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.world-material-dossier{min-width:0;padding:15px;border:1px solid #564530;background:#16120f}
.world-material-dossier h5{font:normal 18px/1.3 Georgia,serif;color:#efd6ac;margin:0 0 9px}
.world-material-dossier dl{display:grid;grid-template-columns:86px 1fr;gap:6px 9px;margin:0;font:400 11px/1.55 system-ui,sans-serif}
.world-material-dossier dt{color:#e1c49a;font-weight:700}
.world-material-dossier dd{margin:0;color:#d1c4b2;overflow-wrap:anywhere}
.world-material-source-link{display:inline-flex;align-items:center;min-height:44px;margin-top:14px;padding:10px 0;border-bottom:1px solid #ae8c5b;color:#f3d6ac!important;font:700 10px/1.4 system-ui,sans-serif;letter-spacing:.055em}
/* Legibility and touch-target corrections support the same material discovery journey. */
.search-label input{min-height:44px!important}
.card-buttons button,.card-buttons a{min-height:44px}
@media(max-width:1100px){.world-material-specimens{grid-template-columns:1fr}.world-material-gates{grid-template-columns:repeat(2,1fr)}}
@media(max-width:740px){.material-rail{min-height:0}.world-material-system{padding:15px}.world-material-dossiers{grid-template-columns:1fr}.world-material-specimen-surface{width:34%}.world-material-gates{grid-template-columns:repeat(2,1fr)}}
@media(max-width:450px){.material-rail-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.material-rail-item{font-size:10px}.world-material-gates{grid-template-columns:1fr}.world-material-dossier dl{display:block}.world-material-dossier dt{margin-top:9px}.world-material-specimens{gap:7px}}
@media(prefers-reduced-motion:reduce){.material-rail-swatch,.world-material-specimen-surface{animation:none!important;transition:none!important}}