@font-face{font-family:Inter;src:url('assets/inter.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:InterItalic;src:url('assets/inter-italic.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:Voyage;src:url('assets/voyage.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:Han;src:url('assets/han-serif-five.woff2') format('woff2');font-weight:700;font-display:swap}
:root{font-family:Inter,'PingFang TC',sans-serif;color:#dddcd6;background:#151718;color-scheme:dark}
*{box-sizing:border-box}body{margin:0;min-height:100svh;background:radial-gradient(ellipse at 50% 34%,#343338 0%,#1f2124 37%,#151718 74%);overflow-x:hidden}
header,footer{display:flex;justify-content:space-between;align-items:center;padding:28px 42px}
.brand{font-family:Voyage,serif;font-size:29px;line-height:1.05}.brand span{font-family:'PingFang TC',sans-serif;font-size:11px;letter-spacing:.28em;display:block;margin-top:9px;color:#7b7c80}
.edition,footer{font-size:10px;letter-spacing:.2em;color:#797b81}header{position:absolute;inset:0 0 auto;z-index:2}
main{min-height:100svh;display:flex;align-items:center;flex-direction:column;justify-content:center;padding:100px 24px 50px}
.stage{position:relative;perspective:1800px;width:var(--card-w,386px);height:calc(var(--card-w,386px)*1.4);margin:0 0 28px;touch-action:none}
.card{all:unset;display:block;position:relative;width:100%;height:100%;cursor:pointer;transform-style:preserve-3d;outline-offset:12px;border-radius:calc(var(--card-w)/22.5);-webkit-tap-highlight-color:transparent}
.card:focus-visible{outline:1px solid #d9cfae}.rotor{position:absolute;inset:0;display:block;transform-style:preserve-3d;will-change:transform}
.face{position:absolute;inset:0;display:block;border-radius:calc(var(--card-w)/22.5);overflow:clip;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 34px 52px -18px #000b,0 3px 7px #0009,0 0 0 1px #a6a6a666;background:#181919;transform:translateZ(1px)}
.face.back{transform:rotateY(180deg) translateZ(1px)}
.artboard{position:absolute;inset:0;width:1080px;height:1512px;transform:scale(var(--scale));transform-origin:0 0;border-radius:48px;overflow:hidden;isolation:isolate;display:block}
.layer{position:absolute;inset:0;display:block;pointer-events:none}
.slot{position:absolute;display:block;max-width:none}
.slot img{display:block;max-width:none}
.video{position:absolute;left:-60px;top:-88px;width:1200px;height:1600px;object-fit:contain;display:block;will-change:transform}
.blur{position:absolute;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.blur.top{backdrop-filter:none;-webkit-backdrop-filter:none;left:32px;top:32px;width:1016px;height:134px;background:rgba(0,0,0,.3);mask:url('assets/BG_blur_1-mask-v72.svg') 0 0/1016px 134px no-repeat;mask-mode:alpha}
.blur.bottom{left:38px;top:1227px;width:1003px;height:247px;background:rgba(0,0,0,.5);mask:url('assets/d148c.svg') -38px -1227px/1080px 1512px no-repeat;mask-mode:luminance}
.circle-base{position:absolute;left:18px;top:18px;width:174px;height:174px;border-radius:50%;background:linear-gradient(#845653,#270f13)}
.diamond-base{position:absolute;left:922.72px;top:53.66px;width:107.566px;height:107.566px;background:#6f2424;border-radius:19px;transform:rotate(45deg)}
.material canvas{display:block;width:100%;height:100%}
.surface-light{position:absolute;inset:0;background:radial-gradient(ellipse at var(--hx,50%) var(--hy,50%),#ffffff27 0%,#ffffff09 35%,transparent 67%),linear-gradient(120deg,transparent 25%,#ffffff14 40%,transparent 57%);mix-blend-mode:screen;pointer-events:none}
.holo-text{background:linear-gradient(125deg,#e7e9df 25%,#a9b9b5 38%,#ddd5dd 45%,#f5edd8 51%,#bdced1 65%,#e7e9df 80%);background-size:210% 210%;background-position:var(--mx,50%) var(--my,50%);background-clip:text;-webkit-background-clip:text;color:transparent}
.text{position:absolute;display:flex;align-items:center;white-space:nowrap;color:white}
.voyage{font-family:Voyage,serif;font-weight:700}.han{font-family:Han,serif;font-weight:700}
.letter{left:46px;top:14px;width:119px;height:182px;justify-content:center;font-size:128px}
.name{left:198px;top:39px;width:210px;height:92px;justify-content:center;font-size:72px}
.cn{left:84px;top:1233px;width:324px;height:171px;font-size:96px;line-height:1}
.category{left:638px;top:51px;width:234px;height:92px;font-size:36px;font-weight:700;justify-content:flex-end}
.quote{left:358px;top:1244px;width:931px;height:171px;font-family:Voyage,Han,serif;font-weight:700;font-size:24px;line-height:1.72;letter-spacing:9.84px}
.credits{font-family:InterItalic,Inter,sans-serif;font-style:italic;font-size:24px;line-height:normal}
.credits.serial{left:84px;top:1394px;width:476px;height:68px}.credits.brandline{left:268px;top:1393px;width:244px;height:68px}.credits.artist{left:494px;top:1393px;width:511px;height:68px;justify-content:flex-end}
.material{background:linear-gradient(118deg,#646a6b,#f9f5e9 34%,#989da2 51%,#f7f7ef 68%,#70747b);background-size:200% 200%;background-position:var(--mx,50%) var(--my,50%);mask-mode:luminance;mask-repeat:no-repeat;position:absolute}
.foil-text{background:linear-gradient(118deg,#b4b9bb,#fffdf5 36%,#9eabb4 52%,#f4f2e6 65%,#d7dad8);background-size:200% 200%;background-position:var(--mx,50%) var(--my,50%);background-clip:text;-webkit-background-clip:text;color:transparent}
.caption{display:flex;align-items:center;gap:30px}.identity{font-family:Han,serif;font-size:22px;letter-spacing:.05em}.identity span{font:11px Inter,sans-serif;letter-spacing:.16em;margin-left:8px;color:#9e9eaa}.caption i{font-style:normal;color:#74737b;margin:0 4px}.attribute{font-size:11px;color:#9e9ba7;letter-spacing:.12em}
.controls{margin-top:20px;display:flex;align-items:center;gap:18px}.controls button{font:12px Inter,'PingFang TC',sans-serif;color:#d7d6d1;border:1px solid #ffffff25;border-radius:22px;background:#ffffff05;padding:10px 18px;cursor:pointer;transition:background .2s,border-color .2s}.controls button:hover{background:#ffffff0e;border-color:#ffffff55}.controls button span{font-size:17px;margin-right:5px}.hint{font-size:11px;color:#777a83}.status{font-size:10px;letter-spacing:.13em;color:#737781;margin:15px 0 0}
footer{position:absolute;inset:auto 0 0;padding-block:24px}
@media(max-width:600px){header{padding:22px 24px}.brand{font-size:25px}.edition{display:none}main{padding-top:115px;padding-bottom:50px}.caption{gap:20px}.identity{font-size:20px}.attribute{font-size:10px}.controls{gap:14px}.hint{font-size:11px}footer{padding:20px 24px;font-size:8px}}
@media(prefers-reduced-motion:reduce){.card,.rotor,.video{will-change:auto}}
/* Coating relief uses the freshly exported motifs. The top laminate covers both faces. */
.foil{filter:drop-shadow(var(--bevel-x,0px) var(--bevel-y,0px) 1px #080d14a6);transform:translateZ(2px)}
.holo{filter:drop-shadow(calc(var(--bevel-x,0px)*-.35) calc(var(--bevel-y,0px)*-.35) .55px #14172066)}
.film{border-radius:48px;overflow:hidden;mix-blend-mode:screen;box-shadow:inset 0 0 0 2px #ffffff24,inset -3px -3px 4px #ffffff12}
.film-material{background:linear-gradient(116deg,transparent 26%,#ffffff14 37%,transparent 49%);mask:none}
.film-material:has(canvas){background:none}
/* Refined coatings: shallow foil shoulders, finely filtered Holo, clear PET. */
.foil{filter:drop-shadow(calc(var(--bevel-x,0px)*.22) calc(var(--bevel-y,0px)*.22) .35px #080d1429);transform:translateZ(.4px)}
.holo{filter:none}
.film{box-shadow:inset 0 0 0 1px #ffffff0d}
.film-material{background:linear-gradient(116deg,transparent 12%,#ffffff08 42%,transparent 77%)}
.film-material:has(canvas){background:none}
.special-glyph,.special-letter{filter:drop-shadow(0 0 2.5px #eff7ff28)}
.special-icon{background:linear-gradient(130deg,#a1bcc2,#eee7f0 42%,#b7adbf 65%,#dbe5cc)}

.emissive{background:#eff3f6}


/* Keep the Figma screen tint inside its Common group during 3D rotation. */
.back [data-layer="common"]{isolation:isolate}
.back .film{mix-blend-mode:normal}

/* A quiet paper core becomes visible only along tilted edges. */
.rotor{--card-depth:calc(var(--card-w)*.0081)}
.face{transform:translateZ(calc(var(--card-depth)*.5))}
.face.back{transform:rotateY(180deg) translateZ(calc(var(--card-depth)*.5))}
.card-stock{position:absolute;inset:0;display:block;transform-style:preserve-3d;pointer-events:none}
.stock-sheet{position:absolute;inset:0;border-radius:calc(var(--card-w)/22.5);background:var(--stock-tone);transform:translateZ(calc(var(--card-depth)*var(--stock-depth)));box-shadow:inset 0 0 0 .35px #777674;display:block}
.name-legibility{background:#fff;opacity:.60}
/* A narrow area-light reflection remains inside the original name vector. */
.name-reflection{background:linear-gradient(115deg,transparent 0%,#fff9 12%,#fffa 28%,#fff7 58%,#e9f0f540 78%,transparent 100%);background-size:340px 180px;background-position:calc(var(--mx,50%) - 210px) 0;background-repeat:no-repeat;mix-blend-mode:screen}
.special-glyph,.special-letter{filter:drop-shadow(0 0 .8px #eff7ff0c)}
.special-icon{will-change:transform}
.foil-letter{background:linear-gradient(118deg,#888f94,#f6f7ed 34%,#64777f 58%,#cdd0cc)}
.holo-glyph{background:linear-gradient(130deg,#a1bcc2,#eee7f0 42%,#b7adbf 65%,#dbe5cc)}
@media(prefers-reduced-motion:reduce){.special-icon{will-change:auto}}

/* The laminate reflects both bright area lights and the dim environment. */
.film{mix-blend-mode:normal}
.foil-letter{background-image:linear-gradient(#ffffff80,#ffffff80),linear-gradient(118deg,#888f94,#f6f7ed 34%,#64777f 58%,#cdd0cc)}
.holo-glyph{background-image:linear-gradient(#ffffff80,#ffffff80),linear-gradient(130deg,#a1bcc2,#eee7f0 42%,#b7adbf 65%,#dbe5cc)}

.card-picker{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;width:min(560px,100%);margin-top:22px}
.card-picker button{appearance:none;background:#ffffff03;border:1px solid #ffffff12;border-radius:10px;color:#a9a9ad;padding:10px 8px;cursor:pointer;transition:background .2s,border-color .2s,color .2s;font:12px Inter,'PingFang TC',sans-serif}
.card-picker button:hover{background:#ffffff09;border-color:#ffffff36;color:#ece8df}
.card-picker button[aria-pressed=true]{background:#ffffff0b;border-color:#cdc8b967;color:#ece8df}
.card-picker button:focus-visible{outline:1px solid #d9cfae;outline-offset:3px}
.picker-title{display:flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap}
.picker-title img{opacity:.75}.picker-title b{font-size:11px;font-weight:500}
.picker-attribute{display:block;font-size:8px;letter-spacing:.1em;margin-top:7px;color:#83858e}
.card-picker button[aria-pressed=true] .picker-attribute{color:#bbb7b0}
@media(min-width:900px){.card-picker{position:absolute;left:calc(50% + var(--card-w)*.5 + 56px);top:calc(50% - 50px);transform:translateY(-50%);width:126px;grid-template-columns:1fr;margin:0;gap:9px}.card-picker button{padding:13px 10px}.picker-attribute{margin-top:8px}}
footer a{margin-left:18px;font-size:9px;letter-spacing:.05em;color:#9b9ba2;text-decoration:none}footer a:hover{color:#ebe8de}
@media(max-width:600px){.card-picker{gap:5px;margin-top:18px}.card-picker button{padding:9px 3px;font-size:11px}.picker-title{gap:3px}.picker-title img{width:13px;height:13px}.picker-attribute{font-size:6.5px;letter-spacing:.03em}footer a{margin-left:9px;font-size:8px}}

/* Neutral gallery backdrop sampled from the personal site's #fafafa collection. */
.header-actions{display:flex;align-items:center;gap:24px}
.theme-toggle{font:10px Inter,'PingFang TC',sans-serif;letter-spacing:.04em;border:1px solid #ffffff25;color:#c4c4c3;background:#ffffff05;border-radius:20px;padding:9px 13px;cursor:pointer}
.theme-toggle:hover{background:#ffffff0c}
.theme-toggle:focus-visible{outline:2px solid #b8ad94;outline-offset:3px}
:root[data-theme=light]{background:#fafafa;color:#34383b;color-scheme:light}
[data-theme=light] body{background:radial-gradient(ellipse at 50% 38%,#fff 0%,#fafafa 53%,#f1f3f6 100%)}
[data-theme=light] .brand span,[data-theme=light] .edition,[data-theme=light] footer{color:#73777c}
[data-theme=light] .identity span,[data-theme=light] .attribute{color:#62676c}
[data-theme=light] .caption i{color:#85898d}
[data-theme=light] .controls button{color:#474c50;background:#fff8;border-color:#34383b30}
[data-theme=light] .controls button:hover{background:#fff;border-color:#34383b60}
[data-theme=light] .hint,[data-theme=light] .status{color:#70757a}
[data-theme=light] .card-picker button{color:#53585d;background:#fff6;border-color:#34383b1f}
[data-theme=light] .card-picker button:hover{color:#282d31;background:#fff;border-color:#34383b55}
[data-theme=light] .card-picker button[aria-pressed=true]{color:#282d31;background:#fff;border-color:#6b717b80;box-shadow:0 3px 14px #30374009}
[data-theme=light] .picker-title img{filter:brightness(.35);opacity:.85}
[data-theme=light] .picker-attribute,[data-theme=light] .card-picker button[aria-pressed=true] .picker-attribute{color:#71767c}
[data-theme=light] footer a{color:#656b71}
[data-theme=light] footer a:hover{color:#292f35}
[data-theme=light] .theme-toggle{color:#51575d;border-color:#34383b26;background:#fff8}
[data-theme=light] .theme-toggle:hover{background:#fff}
[data-theme=light] .face{box-shadow:0 28px 45px -22px #27333c55,0 3px 8px #27333c14,0 0 0 .5px #bac0c426}


@media(max-width:600px){.header-actions{gap:0}.theme-toggle{font-size:9px;padding:8px 11px}}
@media(prefers-reduced-motion:reduce){.stage{transition:none}.stage:hover{transform:none}}

/* Clip the complete reverse composite before 3D projection, including raised coatings. */
.face.back{background:#f2f3f4;overflow:hidden}
.back .artboard{clip-path:inset(0 round 48px)}
[data-theme=light] .stock-sheet{box-shadow:inset 0 0 0 .25px #aeb4b640}

/* Broad diagonal area-light reflections remain readable at neutral view. */
.letter-reflection{background:linear-gradient(115deg,#fff2 0%,#fff6 20%,#fffc 37%,#fffe 48%,#fffd 58%,#fff9 74%,#fff3 100%);background-size:150% 160%;background-position:var(--mx,50%) var(--my,50%);background-repeat:no-repeat;mix-blend-mode:screen;pointer-events:none}

/* Small foil stroke separation, in original design coordinates. */
.foil-glyph{background:#dce2e8}
.glyph-relief-shadow{position:absolute;pointer-events:none}

/* Preserve SVG transparency; coloured vector fills must not attenuate the Holo. */
.special-icon{mask-mode:alpha;background:linear-gradient(130deg,#05d1b4,#9050ee 40%,#fa489e 67%,#ffd44d)}

.border-legibility{background:rgba(255,255,255,.5);pointer-events:none}

/* Flatten and clip the front composite before 3D projection, as on the reverse. */
.face.front{background:#c1c6ca;overflow:hidden}
.front .artboard{clip-path:inset(0 round 48px)}

.badge-background svg{display:block}

/* Personal Holo controls stay beside the live card; saved preferences are browser-local. */
.settings-toggle{font:12px Inter,'PingFang TC',sans-serif;border:1px solid #ffffff25;border-radius:99px;padding:9px 14px;color:#c4c4c3;background:#ffffff06;cursor:pointer}
.settings-toggle:hover,.settings-toggle[aria-expanded=true]{background:#ffffff12;color:#fff}
.holo-settings{position:fixed;right:24px;top:96px;width:326px;max-height:calc(100svh - 120px);overflow:auto;z-index:30;border:1px solid #ffffff20;border-radius:20px;padding:22px;background:#202226f7;color:#e9ebee;box-shadow:0 18px 64px #0005;font-size:14px;backdrop-filter:blur(14px)}
.holo-settings[hidden]{display:none}.settings-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:20px}
.settings-heading h2{font-size:19px;font-weight:500;margin:0 0 6px;letter-spacing:.02em}.settings-heading p{font-size:12px;color:#aeb4bd;margin:0;line-height:1.5}
.settings-close{all:unset;font:24px Inter;cursor:pointer;width:30px;height:30px;text-align:center;border-radius:50%;color:#abb2bc}.settings-close:hover{background:#ffffff12}
.settings-label{display:block;margin-bottom:8px}.holo-settings select{box-sizing:border-box;width:100%;border:1px solid #ffffff25;border-radius:10px;background:#303238;color:inherit;font:13px Inter,'PingFang TC',sans-serif;padding:10px;margin-bottom:20px}
.settings-field{display:flex;align-items:center;justify-content:space-between;margin:0 0 8px;gap:12px}.settings-number{display:flex;align-items:center;gap:5px;color:#aeb4bd}
.settings-number input{width:68px;border:1px solid #ffffff25;border-radius:7px;background:#ffffff07;color:inherit;font:13px Inter;padding:5px 6px;text-align:right}
.holo-settings input[type=range]{display:block;width:100%;margin:0 0 22px;accent-color:#b0bfd1;cursor:pointer}
.settings-help{font-size:12px;line-height:1.7;color:#aeb4bd;margin:0 0 18px}.settings-actions{display:flex;gap:9px;align-items:center}
.settings-actions button,.settings-copy{border:1px solid #ffffff25;border-radius:10px;padding:10px 11px;font:12px Inter,'PingFang TC',sans-serif;background:#ffffff07;color:inherit;cursor:pointer}
.settings-actions .settings-primary{background:#e8ecf2;border-color:#e8ecf2;color:#242a33;margin-left:auto}.settings-copy{width:100%;margin-top:10px;background:transparent}
.holo-settings button:disabled{opacity:.45;cursor:default}.settings-status{min-height:18px;margin:13px 0 0;font-size:12px;line-height:1.6;color:#adb9ca}.holo-settings textarea{width:100%;height:146px;resize:vertical;border:1px solid #ffffff25;border-radius:9px;background:#ffffff07;color:inherit;font:11px monospace;padding:10px;margin-top:10px}
.holo-settings :focus-visible,.settings-toggle:focus-visible{outline:2px solid #a8b7ca;outline-offset:3px}
[data-theme=light] .settings-toggle{background:#fff8;border-color:#34383b26;color:#51575d}[data-theme=light] .settings-toggle:hover,[data-theme=light] .settings-toggle[aria-expanded=true]{background:#fff;color:#292f35}
[data-theme=light] .holo-settings{background:#fafbfdf7;border-color:#cbd0d9;color:#303641;box-shadow:0 16px 50px #27333c20}
[data-theme=light] .settings-heading p,[data-theme=light] .settings-number,[data-theme=light] .settings-help,[data-theme=light] .settings-status{color:#687385}
[data-theme=light] .holo-settings select,[data-theme=light] .settings-number input,[data-theme=light] .holo-settings textarea{border-color:#cfd5df;background:#fff}
[data-theme=light] .settings-actions button,[data-theme=light] .settings-copy{border-color:#cfd5df;background:#fff}
[data-theme=light] .settings-actions .settings-primary{color:#fff;background:#3e4959;border-color:#3e4959}
@media(max-width:600px){.header-actions{gap:7px}.settings-toggle{padding:8px 10px;font-size:11px}.holo-settings{top:auto;bottom:12px;left:12px;right:12px;width:auto;max-height:43svh;padding:18px}.settings-heading{margin-bottom:14px}.holo-settings select{margin-bottom:14px}.holo-settings input[type=range]{margin-bottom:14px}.settings-help{margin-bottom:12px}}
@media(max-width:600px){
 .holo-settings{max-height:48svh;padding:16px 18px}
 .settings-heading{margin-bottom:10px}.settings-heading h2{font-size:18px;margin-bottom:3px}.settings-heading p{font-size:11px}
 .settings-label{margin-bottom:4px}.holo-settings select{padding:8px;margin-bottom:10px}
 .settings-field{margin-bottom:4px}.settings-number input{padding:3px 5px}.holo-settings input[type=range]{margin-bottom:10px}
 .settings-help{font-size:11px;line-height:1.5;margin-bottom:8px}
 .settings-actions button,.settings-copy{padding:8px 10px}.settings-copy{margin-top:8px}
 .settings-status{font-size:11px;min-height:16px;margin-top:8px}
}

.settings-opacity-help{font-size:11px;line-height:1.5;color:#8995a6;margin:-12px 0 18px}
@media(max-width:600px){.settings-opacity-help{margin:-3px 0 8px}.holo-settings{max-height:56svh}}

/* Border material workbench: fixed save controls, scrollable details beside the card. */
.holo-settings{display:flex;flex-direction:column;box-sizing:border-box;width:348px;padding:20px;overflow:hidden;max-height:calc(100svh - 116px)}
.settings-heading{flex-shrink:0;margin-bottom:14px}.holo-settings>#holo-attribute{flex-shrink:0;margin-bottom:12px}
.material-tabs{display:flex;gap:4px;flex-shrink:0;background:#ffffff08;border:1px solid #ffffff16;border-radius:10px;padding:3px;margin-bottom:16px}
.material-tabs button{flex:1;border:0;border-radius:7px;background:transparent;color:#aeb4bd;padding:9px;font:13px Inter,'PingFang TC',sans-serif;cursor:pointer}
.material-tabs [aria-selected=true]{background:#ffffff15;color:#fff}
.settings-scroll{overflow-y:auto;min-height:0;padding:0 4px 0 0;scrollbar-width:thin;overscroll-behavior:contain}
.settings-scroll [hidden]{display:none}.effect-description{font-size:12px;line-height:1.7;margin:-8px 0 5px;color:#aeb4bd;min-height:40px}
.effect-reference{display:inline-block;font-size:11px;color:#a9bdd6;margin:0 0 18px;text-underline-offset:3px}
.material-details{border-top:1px solid #ffffff20;padding-top:12px;margin-top:2px}.material-details summary{font-size:12px;cursor:pointer;margin-bottom:16px;color:#bdc6d2}
.settings-bottom{flex-shrink:0;padding-top:14px;border-top:1px solid #ffffff20;margin-top:16px}.settings-bottom .settings-help{margin-bottom:10px}.settings-bottom textarea{box-sizing:border-box;height:100px}
[data-theme=light] .material-tabs{background:#e8ecf2;border-color:#d7dce4}[data-theme=light] .material-tabs button{color:#687385}[data-theme=light] .material-tabs [aria-selected=true]{background:#fff;color:#303641;box-shadow:0 1px 4px #00000012}
[data-theme=light] .effect-description{color:#687385}[data-theme=light] .effect-reference{color:#536985}[data-theme=light] .material-details,[data-theme=light] .settings-bottom{border-color:#d7dce4}[data-theme=light] .material-details summary{color:#536174}
@media(max-width:600px){.holo-settings{width:auto;max-height:58svh;padding:14px 16px}.settings-heading{margin-bottom:8px}.holo-settings>#holo-attribute{margin-bottom:8px}.material-tabs{margin-bottom:10px}.material-tabs button{padding:7px}.settings-bottom{padding-top:8px;margin-top:8px}.settings-bottom .settings-help{display:none}.effect-description{font-size:11px;margin-bottom:3px;min-height:0}.effect-reference{margin-bottom:12px}.material-details summary{margin-bottom:12px}}

.holo-settings{top:84px;max-height:calc(100svh - 100px)}
.holo-settings .settings-heading h2{font-size:18px;margin-bottom:3px}.holo-settings .settings-heading{margin-bottom:10px}
.holo-settings .settings-label{margin-bottom:6px}.holo-settings select{padding:8px;margin-bottom:12px}
.material-tabs{margin-bottom:12px}.material-tabs button{padding:8px}
.holo-settings input[type=range]{margin-bottom:16px}.settings-bottom .settings-help{display:none}
.settings-bottom{padding-top:10px;margin-top:12px}.effect-reference{margin-bottom:14px}
@media(max-width:600px){.holo-settings{top:auto;max-height:58svh}.holo-settings input[type=range]{margin-bottom:12px}.settings-heading p{display:none}.material-tabs{margin-bottom:10px}.settings-bottom{margin-top:8px;padding-top:8px}}

.effect-description{min-height:0;line-height:1.6}.effect-reference{margin-bottom:12px}#border-basic input[type=range]{margin-bottom:12px}
#border-basic{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
#border-basic .settings-field{flex-wrap:wrap;gap:6px}#border-basic label{width:100%;font-size:13px}
#border-basic .settings-number input{width:50px}#border-basic .settings-number{font-size:12px}

.quote-copy{display:grid;grid-template-columns:max-content 1fr;grid-auto-rows:1.72em;column-gap:0;transform:translateY(-7px)}
.quote-opening{grid-column:1;grid-row:1;white-space:pre}
.quote-line{grid-column:2;white-space:nowrap}

/* Fine concentric engraving stays inside the printed circular background. */
.circle-base::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:repeating-radial-gradient(circle at 50% 50%,transparent 0 4.8px,rgba(255,255,255,.22) 5.1px 6px,rgba(0,0,0,.20) 6.4px 7.3px,transparent 7.7px 10px);mask-image:radial-gradient(ellipse at var(--hx,50%) var(--hy,50%),#000 15%,rgba(0,0,0,.75) 60%,rgba(0,0,0,.4) 100%);-webkit-mask-image:radial-gradient(ellipse at var(--hx,50%) var(--hy,50%),#000 15%,rgba(0,0,0,.75) 60%,rgba(0,0,0,.4) 100%)}

/* Keep the fixed Figma typography immune to mobile text inflation. */
:root{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.artboard{-webkit-text-size-adjust:none;text-size-adjust:none}
