:root{--paper:#f1ede4;--ink:#171716;--muted:#766f65;--line:#23201c2e;--font-geist-mono:"SFMono-Regular", Consolas, "Liberation Mono", monospace}*{box-sizing:border-box}html{background:var(--paper);scroll-behavior:smooth;min-width:320px}body{background:var(--paper);color:var(--ink);margin:0;font-family:Pretendard,Apple SD Gothic Neo,Noto Sans KR,Arial,sans-serif}.archive-loading{background:var(--paper);min-height:100svh;color:var(--ink);place-items:center;font-family:Iowan Old Style,Baskerville,Times New Roman,serif;display:grid;overflow:hidden}.loading-ring{aspect-ratio:1;border:1px solid #1717162e;border-radius:50%;place-content:center;justify-items:center;gap:13px;width:clamp(170px,24vmin,220px);animation:1.4s ease-in-out infinite alternate loading-pulse;display:grid}.loading-ring small,.intro-brand small{color:#8a8379;font-family:var(--font-geist-mono), monospace;letter-spacing:.18em;font-size:7px;font-weight:500}.loading-ring strong,.intro-brand strong{letter-spacing:-.065em;flex-direction:column;align-items:center;gap:clamp(3px,.6vmin,6px);font-family:Iowan Old Style,Baskerville,Times New Roman,serif;font-size:clamp(30px,5vmin,46px);font-weight:500;line-height:.82;display:flex}.loading-ring strong span:last-child,.intro-brand strong span:last-child{padding-left:.42em;font-style:italic;font-weight:400}@keyframes loading-pulse{to{opacity:.35;transform:scale(1.06)}}button,a{color:inherit}button{font:inherit}.archive{isolation:isolate;background:radial-gradient(circle at center, #ffffff8a, transparent 44%), var(--paper);min-height:100svh;position:relative;overflow:hidden}.archive.has-detail{pointer-events:none}.archive.is-intro .site-header,.archive.is-intro .archive-footer,.archive.is-intro .deck-caption,.archive.is-intro .orbit-guide{opacity:0;pointer-events:none}.archive.is-intro .color-stage{pointer-events:none}.intro-skip{z-index:500;color:#676158;letter-spacing:.08em;cursor:pointer;background:0 0;border:0;border-bottom:1px solid #1717166b;padding:8px 0;font-size:9px;position:fixed;bottom:clamp(20px,3vw,36px);right:clamp(20px,3vw,42px)}.intro-skip:hover,.intro-skip:focus-visible{color:var(--ink)}.intro-skip:focus-visible{outline:1px solid var(--ink);outline-offset:5px}.paper-noise,.detail-paper:after,.color-paper:after{content:"";pointer-events:none;opacity:.22;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.94' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E");position:absolute;inset:0}.paper-noise{z-index:20;opacity:.35;position:fixed}.site-header{z-index:30;pointer-events:none;padding-inline:clamp(24px,4vw,68px);justify-content:space-between;align-items:flex-start;width:100%;padding-top:clamp(22px,3vw,44px);transition:opacity .2s;display:flex;position:fixed;top:0;left:0}.wordmark{letter-spacing:-.055em;pointer-events:auto;flex-direction:column;font-family:Iowan Old Style,Baskerville,Times New Roman,serif;font-size:clamp(20px,2.3vw,34px);font-weight:600;line-height:.78;text-decoration:none;display:flex}.wordmark span:last-child{padding-left:.58em;font-style:italic;font-weight:400}.edition{color:var(--muted);font-family:var(--font-geist-mono), monospace;letter-spacing:.15em;flex-direction:column;grid-column:1/-1;justify-self:end;align-items:flex-end;gap:5px;font-size:10px;display:flex}.header-actions{pointer-events:auto;grid-template-columns:auto auto;align-items:flex-end;gap:13px 18px;display:grid}.tools-open-button{min-height:28px;color:var(--ink);letter-spacing:-.02em;cursor:pointer;background:0 0;border:0;border-bottom:1px solid #17171657;align-items:center;gap:8px;padding:0 0 5px;font-size:14px;font-weight:650;transition:border-color .18s,transform .18s;display:inline-flex;position:relative}.tools-open-button small{min-width:22px;font-family:var(--font-geist-mono), monospace;text-align:center;border:1px solid #1717163d;border-radius:999px;padding:2px 5px;font-size:8px;font-weight:500;line-height:1}.tools-open-button:hover{border-color:var(--ink);transform:translateY(-1px)}.tools-open-button:focus-visible{outline:1px solid var(--ink);outline-offset:5px}.tools-open-button:disabled{cursor:default}.tools-open-button.is-tutorial-target:before{content:"";pointer-events:none;border:1px solid #17171680;border-radius:999px;animation:1.15s ease-in-out infinite tutorial-control-pulse;position:absolute;inset:-8px}@keyframes tutorial-control-pulse{0%,to{opacity:.28;transform:scale(.97)}50%{opacity:.85;transform:scale(1.03)}}.contact-link{min-height:28px;color:var(--ink);letter-spacing:-.01em;align-items:center;padding:0 0 5px;font-size:14px;font-weight:600;text-decoration:none;display:inline-flex;position:relative}.contact-link:after{content:"";transform-origin:100%;background:currentColor;height:1px;transition:transform .22s;position:absolute;bottom:0;left:0;right:0;transform:scaleX(.36)}.contact-link:hover:after,.contact-link:focus-visible:after{transform:scaleX(1)}.contact-link:focus-visible{outline:1px solid var(--ink);outline-offset:5px}.palette-nav-wrap{pointer-events:auto;flex-direction:column;align-items:center;gap:8px;width:min(52vw,470px);display:flex;position:absolute;top:clamp(22px,3vw,44px);left:50%;transform:translate(-50%)}.palette-menu{justify-content:center;align-items:center;gap:clamp(16px,2.4vw,34px);display:flex}.palette-menu button{color:#827b72;letter-spacing:-.02em;cursor:pointer;background:0 0;border:0;align-items:baseline;gap:5px;padding:0 0 6px;font-size:19px;font-weight:500;display:flex;position:relative}.palette-menu button:after{content:"";transform-origin:50%;background:currentColor;height:1px;transition:transform .22s;position:absolute;bottom:0;left:0;right:0;transform:scaleX(0)}.palette-menu button:hover,.palette-menu button.is-current{color:var(--ink)}.palette-menu button.is-current:after{transform:scaleX(1)}.palette-menu button:focus-visible{outline:1px solid var(--ink);outline-offset:4px}.palette-menu small{font-family:var(--font-geist-mono), monospace;letter-spacing:.08em;font-size:12px;font-weight:400}.palette-nav-wrap p{color:#726b62;letter-spacing:-.01em;white-space:nowrap;margin:0;font-size:13px;line-height:1.45}.color-stage{--radius:clamp(280px, 24vw, 355px);--intro-radius:clamp(115px, 26vmin, 220px);--card-width:clamp(144px, 11.4vw, 168px);--deck-center-y:112%;overscroll-behavior:none;width:100%;min-height:100svh;position:relative;overflow:hidden}.paper-ring{z-index:1;left:50%;top:var(--deck-center-y);isolation:isolate;width:1px;height:1px;transition:top 1.05s cubic-bezier(.22,1,.36,1);position:absolute;transform:translateZ(0)}.color-stage.is-intro-centered .paper-ring{top:50%}.paper-position{width:var(--card-width);aspect-ratio:210/297;transform-origin:50%;will-change:transform;backface-visibility:hidden;position:absolute;top:0;left:0;translate:-50% -50%}.paper-radius{width:100%;height:100%;transform:translateY(calc(var(--radius) * -1));transform-origin:50%;backface-visibility:hidden;transition:transform 1.05s cubic-bezier(.22,1,.36,1)}.color-stage.is-intro-centered .paper-radius{transform:translateY(calc(var(--intro-radius) * -1))}.paper-lift{transform-origin:bottom;backface-visibility:hidden;width:100%;height:100%;transition:transform .3s cubic-bezier(.22,1,.36,1);position:relative;transform:translate(0,0)}.paper-lift.is-tutorial-target:before{content:"";z-index:5;pointer-events:none;border:1px solid #17171694;animation:1.15s ease-in-out infinite tutorial-card-pulse;position:absolute;inset:-8px}@keyframes tutorial-card-pulse{0%,to{opacity:.25;transform:scale(.98)}50%{opacity:.82;transform:scale(1.02)}}.paper-lift.is-featured{will-change:transform;transform:translateY(-30px)}.color-paper{cursor:pointer;transform-origin:bottom;contain:layout style;-webkit-tap-highlight-color:transparent;border:1px solid #1e1c1930;border-radius:1px;flex-direction:column;justify-content:space-between;align-items:stretch;width:100%;height:100%;padding:13px 11px 15px;transition:box-shadow .35s,filter .25s;display:flex;position:relative;overflow:hidden;box-shadow:-2px 2px 2px #29241e0d,-7px 11px 18px #29241e1c}.color-stage.is-rotating .color-paper,.color-stage.is-rotating .color-paper.is-active{filter:none;transition-duration:.1s;box-shadow:-1px 3px 5px #29241e14}.archive.is-rotating .paper-noise,.color-stage.is-rotating .color-paper:after{opacity:0;mix-blend-mode:normal}.color-paper.is-active{filter:saturate(1.08);box-shadow:-3px 5px 4px #29241e14,-14px 24px 32px #29241e38}.color-paper:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.color-paper.is-dark{color:#fffffff0}.color-paper.is-light{color:#12110fe0}.paper-group{z-index:1;font-family:var(--font-geist-mono), monospace;letter-spacing:.08em;opacity:.7;align-self:flex-start;font-size:clamp(9px,.78vw,11px);position:relative}.paper-label{z-index:1;opacity:0;white-space:nowrap;flex-direction:column;align-items:flex-start;gap:3px;transition:opacity .18s 40ms,transform .26s;display:flex;position:relative;transform:translateY(8px)}.color-paper.is-active .paper-label{opacity:1;transform:translateY(0)}.paper-label strong{letter-spacing:-.02em;font-size:clamp(12px,1vw,15px);font-weight:600}.paper-label em{font-family:var(--font-geist-mono), monospace;letter-spacing:.03em;opacity:.78;font-size:clamp(9px,.76vw,11px);font-style:normal}.paper-label code{font-family:var(--font-geist-mono), monospace;letter-spacing:.06em;font-size:clamp(10px,.84vw,12px)}.stage-center{left:50%;top:var(--deck-center-y);z-index:130;aspect-ratio:1;background:var(--paper);pointer-events:none;border:1px solid #2b272224;border-radius:50%;width:clamp(300px,31vw,460px);transition:top 1.05s cubic-bezier(.22,1,.36,1),width 1.05s cubic-bezier(.22,1,.36,1),box-shadow .6s;position:absolute;transform:translate(-50%,-50%);box-shadow:0 20px 55px #2d28221f}.color-stage.is-intro-centered .stage-center{width:clamp(170px,24vmin,220px);top:50%;box-shadow:0 24px 60px #2d282229}.intro-brand{text-align:center;place-content:center;justify-items:center;gap:13px;display:grid;position:absolute;inset:0}.orbit-guide{left:50%;top:var(--deck-center-y);pointer-events:none;border:1px solid #26231f14;border-radius:50%;position:absolute;transform:translate(-50%,-50%)}.orbit-guide-one{width:calc(var(--radius) * 2.04);aspect-ratio:1}.orbit-guide-two{width:calc(var(--radius) * 1.22);aspect-ratio:1}.deck-caption{z-index:220;color:#5d574f;font-family:var(--font-geist-mono), monospace;letter-spacing:.08em;white-space:nowrap;text-align:center;font-size:14px;font-weight:600;transition:opacity .2s;position:absolute;bottom:clamp(40px,5.5vh,62px);left:50%;transform:translate(-50%)}.deck-caption strong{font-size:19px;font-weight:600;display:block}.deck-caption span{color:#746d64;letter-spacing:.1em;margin-top:4px;font-size:10px;font-weight:400;display:block}.tutorial-card{z-index:400;background:#f1ede4eb;border:1px solid #23201c2e;grid-template-columns:54px 1fr auto;align-items:center;gap:20px;width:min(90vw,560px);min-height:88px;padding:18px 22px;display:grid;position:absolute;top:clamp(150px,25vh,245px);left:50%;translate:-50%;box-shadow:0 18px 42px #2d28221c}.tutorial-card small{color:#8a8379;font-family:var(--font-geist-mono), monospace;letter-spacing:.15em;margin-bottom:7px;font-size:9px;display:block}.tutorial-card p{color:#34312d;word-break:keep-all;margin:0;font-size:14px;font-weight:500;line-height:1.55}.tutorial-card>button{color:#777067;white-space:nowrap;cursor:pointer;background:0 0;border:0;border-bottom:1px solid #1717165c;padding:8px 0;font-size:10px}.tutorial-card>button:hover,.tutorial-card>button:focus-visible{color:var(--ink)}.tutorial-card>button:focus-visible{outline:1px solid var(--ink);outline-offset:4px}.tutorial-gesture{justify-self:center;width:30px;height:42px;display:block;position:relative}.tutorial-gesture.is-wheel{border:1px solid #171716a3;border-radius:17px}.tutorial-gesture.is-wheel i{background:var(--ink);border-radius:2px;width:3px;height:9px;animation:1.15s ease-in-out infinite tutorial-wheel;position:absolute;top:7px;left:50%;transform:translate(-50%)}.tutorial-gesture.is-tap{border:1px solid #17171647;border-radius:50%;width:38px;height:38px;animation:1.15s ease-out infinite tutorial-tap}.tutorial-gesture.is-tap i{background:var(--ink);border-radius:50%;width:9px;height:9px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.tutorial-gesture.is-swipe{width:46px;height:32px}.tutorial-gesture.is-swipe:before{content:"";background:#17171657;height:1px;position:absolute;top:50%;left:5px;right:5px}.tutorial-gesture.is-swipe i{z-index:1;background:var(--ink);border-radius:50%;width:11px;height:11px;margin-top:-5px;animation:1.15s ease-in-out infinite alternate tutorial-swipe;position:absolute;top:50%;left:3px}@keyframes tutorial-wheel{0%{opacity:0;transform:translate(-50%)}35%{opacity:1}to{opacity:0;transform:translate(-50%,12px)}}@keyframes tutorial-tap{0%{opacity:.8;transform:scale(.72)}to{opacity:0;transform:scale(1.2)}}@keyframes tutorial-swipe{0%{transform:translate(0)}to{transform:translate(29px)}}.detail-layer{z-index:1000;place-items:center;padding:4vh 20px;display:grid;position:fixed;inset:0}.detail-scrim{background:#1614128f;position:absolute;inset:0}.detail-paper{aspect-ratio:210/297;background:#f8f5ee;border:1px solid #ffffff59;border-radius:2px;grid-template-rows:35% 65%;width:min(91vw,550px);height:min(88vh,778px);display:grid;position:relative;overflow:hidden;box-shadow:0 42px 100px #0f0d0b6b}.detail-paper:after{z-index:10;opacity:.15}.detail-color{z-index:1;flex-direction:column;justify-content:space-between;padding:clamp(18px,3vh,28px);display:flex;position:relative;overflow:hidden}.detail-color.is-dark{color:#fffdf8}.detail-color.is-light{color:#171716}.detail-index{max-width:calc(100% - 136px);font-family:var(--font-geist-mono), monospace;letter-spacing:.16em;opacity:.75;font-size:11px}.detail-actions{z-index:20;align-items:center;gap:8px;display:flex;position:absolute;top:18px;right:18px}.palette-add-button,.share-button{height:40px;color:inherit;font-family:var(--font-geist-mono), monospace;letter-spacing:.08em;cursor:pointer;background:#ffffff14;border:1px solid;border-radius:999px;padding:0 15px;font-size:11px;transition:transform .18s,background .18s}.palette-add-button[aria-pressed=true]{background:#ffffff47;font-weight:700}.palette-add-button:hover,.share-button:hover{background:#ffffff38;transform:translateY(-2px)}.palette-add-button:focus-visible,.share-button:focus-visible{outline-offset:3px;outline:2px solid}.close-button{z-index:20;width:40px;height:40px;color:inherit;cursor:pointer;background:#ffffff14;border:1px solid;border-radius:50%;place-items:center;padding:0;transition:transform .22s,background .22s;display:grid;position:absolute;top:18px;right:18px}.detail-actions .close-button{position:static}.close-button:hover{background:#ffffff38;transform:rotate(90deg)}.close-button:focus-visible{outline-offset:3px;outline:2px solid}.close-button span{margin-top:-3px;font-family:Arial,sans-serif;font-size:28px;font-weight:200;line-height:1}.detail-meta{font-family:var(--font-geist-mono), monospace;letter-spacing:.09em;align-items:center;gap:5px;margin-bottom:5px;font-size:13px;display:flex}.hex-copy-button{color:inherit;cursor:pointer;background:#ffffff17;border:1px solid;border-radius:999px;align-items:center;gap:7px;padding:4px 7px;transition:background .16s,transform .16s;display:inline-flex}.hex-copy-button:hover{background:#ffffff3d;transform:translateY(-1px)}.hex-copy-button:focus-visible{outline-offset:2px;outline:2px solid}.hex-copy-button code{color:inherit;font:inherit}.hex-copy-button span{letter-spacing:.04em;opacity:.72;font-size:9px}.detail-title-wrap h2{letter-spacing:-.055em;margin:0;font-family:Iowan Old Style,Noto Serif KR,Batang,serif;font-size:clamp(32px,5.2vh,52px);font-weight:500;line-height:1}.detail-source{color:currentColor;font-family:var(--font-geist-mono), monospace;letter-spacing:.1em;opacity:.68;margin-top:10px;font-size:7px;text-decoration:none;display:inline-block}.detail-source:hover{text-underline-offset:3px;text-decoration:underline}.detail-content{z-index:1;scrollbar-width:thin;scrollbar-color:#aaa398 transparent;min-height:0;padding:clamp(20px,3vh,30px);position:relative;overflow-y:auto}.detail-content section+section{border-top:1px solid var(--line);margin-top:28px;padding-top:25px}.section-heading{align-items:center;gap:9px;margin-bottom:15px;display:flex}.section-heading span{font-family:var(--font-geist-mono), monospace;color:#8a8379;font-size:10px}.section-heading h3{letter-spacing:-.03em;margin:0;font-family:Iowan Old Style,Noto Serif KR,Batang,serif;font-size:20px;font-weight:600}.harmony-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}.harmony{grid-template-columns:42px 1fr;align-items:center;gap:10px;min-width:0;display:grid}.harmony-swatch{aspect-ratio:1;border:1px solid #221f1b21;border-radius:50%;place-items:center;width:42px;display:grid;position:relative;box-shadow:inset 0 0 0 4px #ffffff1f}.harmony-swatch.is-empty{color:#8a8379;box-shadow:none;background:#221f1b06;border-style:dashed}.harmony-swatch.is-empty:after{content:"—";font-family:var(--font-geist-mono), monospace;font-size:14px}.harmony div{flex-direction:column;min-width:0;display:flex}.harmony div>span{color:#746d64;letter-spacing:.03em;font-size:10px}.harmony strong{text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:600;overflow:hidden}.harmony code{color:#6f685f;font-family:var(--font-geist-mono), monospace;margin-top:2px;font-size:10px}.harmony div>.harmony-unavailable{color:#8a8379;font-family:var(--font-geist-mono), monospace;letter-spacing:0;margin-top:3px;font-size:9px}.harmony-copy-button{color:#6f685f;cursor:pointer;background:0 0;border:0;border-bottom:1px solid #0000;align-items:center;gap:5px;width:-moz-fit-content;width:fit-content;margin:2px 0 0;padding:2px 5px 2px 0;display:inline-flex}.harmony-copy-button code{color:inherit;margin:0}.harmony-copy-button span{font-family:var(--font-geist-mono), monospace;opacity:0;font-size:9px;transition:opacity .15s}.harmony-copy-button:hover,.harmony-copy-button:focus-visible{border-bottom-color:currentColor;outline:0}.harmony-copy-button:hover span,.harmony-copy-button:focus-visible span{opacity:.78}.detail-notice{z-index:40;color:#fffdf8;max-width:calc(100% - 36px);font-family:var(--font-geist-mono), monospace;letter-spacing:.02em;text-align:center;white-space:nowrap;pointer-events:none;background:#1b1916eb;border:1px solid #ffffff24;border-radius:999px;padding:9px 14px;font-size:11px;position:absolute;bottom:16px;left:50%;translate:-50%;box-shadow:0 10px 26px #0f0d0b33}.detail-tutorial-hint{z-index:40;color:#fffdf8;pointer-events:none;background:#1b1916f0;border:1px solid #ffffff24;border-radius:3px;align-items:center;gap:10px;width:min(100% - 36px,410px);padding:11px 14px;font-size:11px;line-height:1.5;display:flex;position:absolute;bottom:16px;left:50%;translate:-50%;box-shadow:0 10px 28px #0f0d0b3d}.detail-tutorial-hint small{color:#c9c1b5;font-family:var(--font-geist-mono), monospace;letter-spacing:.08em;flex:none;font-size:8px}.tools-layer{z-index:2000;justify-content:flex-end;display:flex;position:fixed;inset:0}.tools-scrim{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);cursor:pointer;background:#1614127a;border:0;width:100%;position:absolute;inset:0}.color-tools{background:linear-gradient(#ffffff57, #ffffff1f), var(--paper);border-left:1px solid #17171629;grid-template-rows:auto minmax(0,1fr);width:min(100%,540px);height:100dvh;display:grid;position:relative;overflow:hidden;box-shadow:-26px 0 80px #0f0d0b3d}.tools-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;min-height:116px;padding:26px 28px 22px;display:flex}.tools-header small,.tool-text-field>span,.contrast-score>span{color:var(--muted);font-family:var(--font-geist-mono), monospace;letter-spacing:.13em;font-size:9px}.tools-header h2{letter-spacing:-.055em;margin:6px 0 0;font-family:Iowan Old Style,Noto Serif KR,Batang,serif;font-size:32px;font-weight:500;line-height:1}.tools-close{cursor:pointer;background:0 0;border:1px solid #1717168a;border-radius:50%;place-items:center;width:42px;height:42px;padding:0 0 3px;font-family:Arial,sans-serif;font-size:27px;font-weight:200;transition:transform .2s,background .2s;display:grid}.tools-close:hover{background:#1717160f;transform:rotate(90deg)}.tools-close:focus-visible,.tool-section button:focus-visible,.tool-section input:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.tools-scroll{overscroll-behavior:contain;min-height:0;padding:0 28px max(44px, env(safe-area-inset-bottom));scrollbar-width:thin;scrollbar-color:#aaa398 transparent;overflow-y:auto}.tool-section{padding:28px 0 32px;scroll-margin-top:8px;transition:background .18s,box-shadow .18s;position:relative}.tool-section.is-tutorial-focus{background:#ffffff57;margin-inline:-12px;padding-inline:12px;box-shadow:inset 0 0 0 1px #17171638}.tool-section+.tool-section{border-top:1px solid var(--line)}.tool-heading{grid-template-columns:24px 1fr;gap:10px;margin-bottom:20px;display:grid}.tool-heading>span{color:#8a8379;font-family:var(--font-geist-mono), monospace;padding-top:3px;font-size:9px}.tool-heading h3{letter-spacing:-.035em;margin:0;font-family:Iowan Old Style,Noto Serif KR,Batang,serif;font-size:22px;font-weight:600}.tool-heading p{color:#6f685f;word-break:keep-all;margin:6px 0 0;font-size:13px;line-height:1.55}.tools-tutorial-guide{z-index:1;background:#e8e1d5;border:1px solid #1717162e;grid-template-columns:auto minmax(0,1fr);gap:7px 12px;margin:-4px 0 18px;padding:14px;display:grid;position:relative;box-shadow:0 10px 24px #2d282214}.tools-tutorial-guide>small{color:#7b746a;font-family:var(--font-geist-mono), monospace;letter-spacing:.1em;padding-top:2px;font-size:8px}.tools-tutorial-guide>p{color:#34312d;word-break:keep-all;margin:0;font-size:12px;font-weight:550;line-height:1.55}.tools-tutorial-guide>div{grid-column:2;align-items:center;gap:8px;display:flex}.tools-tutorial-guide button{color:#5f5951;cursor:pointer;background:0 0;border:1px solid #1717164d;border-radius:999px;min-height:32px;padding:0 11px;font-size:10px;font-weight:650}.tools-tutorial-guide button.is-primary{border-color:var(--ink);background:var(--ink);color:#fffdf8}.tool-text-field{background:#ffffff61;border:1px solid #1717163d;flex-direction:column;justify-content:center;gap:5px;min-height:62px;padding:10px 14px;display:flex}.tool-text-field:focus-within{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}.tool-text-field.is-invalid{border-color:#a8392f}.tool-text-field input{min-width:0;color:var(--ink);font-family:var(--font-geist-mono), monospace;background:0 0;border:0;outline:0;padding:0;font-size:16px}.tool-text-field input::placeholder{color:#938c82}.search-results{background:#ffffff4d;border:1px solid #17171629;max-height:324px;margin-top:10px;overflow-y:auto}.search-result{border-bottom:1px solid #1717161a;min-height:92px;padding:11px 12px 12px}.search-result:last-child{border-bottom:0}.search-result-summary{grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:11px;display:grid}.result-swatch{aspect-ratio:1;border:1px solid #17171626;border-radius:50%;width:34px;box-shadow:inset 0 0 0 3px #fff3}.search-result-summary>span:nth-child(2){flex-direction:column;gap:3px;min-width:0;display:flex}.search-results strong{text-overflow:ellipsis;white-space:nowrap;font-size:22px;overflow:hidden}.search-results small,.search-results code{color:#726b62;font-family:var(--font-geist-mono), monospace;font-size:14px}.search-result-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;margin-top:9px;padding-left:45px;display:grid}.search-result-actions button{cursor:pointer;background:0 0;border:1px solid #17171638;border-radius:999px;min-height:38px;padding:0 8px;font-size:14px;font-weight:650;line-height:1.2}.search-result-actions button:hover{border-color:var(--ink);background:#ffffff94}.search-result-actions button:disabled{cursor:not-allowed;opacity:.36}.empty-result{color:#777067;text-align:center;margin:0;padding:22px 14px;font-size:12px}.contrast-inputs input[type=color]{cursor:pointer;background:#ffffff61;border:1px solid #1717163d;border-radius:0;width:100%;height:62px;padding:4px;overflow:hidden}.contrast-inputs input[type=color]::-webkit-color-swatch{border:0}.tool-button-row{flex-wrap:wrap;gap:8px;margin-top:12px;display:flex}.tool-button-row button{cursor:pointer;background:0 0;border:1px solid #17171657;border-radius:999px;min-height:38px;padding:0 13px;font-size:11px;font-weight:600}.tool-button-row button:hover{background:#1717160f}.tool-button-row button.is-primary{border-color:var(--ink);background:var(--ink);color:#fffdf8}.tool-button-row button:disabled{cursor:not-allowed;opacity:.38}.contrast-inputs{grid-template-columns:1fr 38px 1fr;align-items:end;gap:8px;display:grid}.contrast-inputs label{grid-template-columns:38px minmax(0,1fr);gap:7px;min-width:0;display:grid}.contrast-inputs label>span{color:#6f685f;grid-column:1/-1;font-size:11px;font-weight:650}.contrast-inputs input[type=color]{height:42px}.contrast-inputs input:not([type=color]){min-width:0;height:42px;color:var(--ink);font-family:var(--font-geist-mono), monospace;background:#ffffff61;border:1px solid #1717163d;padding:0 9px;font-size:11px}.contrast-inputs input[aria-invalid=true]{border-color:#a8392f}.contrast-swap{cursor:pointer;background:#ffffff47;border:1px solid #1717163d;width:38px;height:42px;padding:0;font-size:18px}.contrast-preview{border:1px solid #17171624;flex-direction:column;justify-content:center;gap:5px;min-height:100px;margin-top:14px;padding:20px;display:flex}.contrast-preview strong{font-family:Iowan Old Style,Baskerville,Times New Roman,serif;font-size:28px;line-height:1}.contrast-preview span{font-size:13px}.contrast-score{justify-content:space-between;align-items:flex-end;gap:14px;padding:17px 0 13px;display:flex}.contrast-score strong{letter-spacing:-.055em;font-family:Iowan Old Style,Baskerville,Times New Roman,serif;font-size:42px;font-weight:500;line-height:.9}.contrast-score strong small{font-family:var(--font-geist-mono), monospace;letter-spacing:0;margin-left:3px;font-size:11px}.contrast-results{border-top:1px solid var(--line);margin:0}.contrast-results>div{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;min-height:40px;display:flex}.contrast-results dt{color:#5f5951;font-size:12px}.contrast-results dd{font-family:var(--font-geist-mono), monospace;border-radius:999px;margin:0;padding:4px 8px;font-size:9px;font-weight:700}.contrast-results dd.is-pass{color:#235d3a;background:#dcebdd}.contrast-results dd.is-fail{color:#8a312b;background:#f1ddd8}.contrast-note{color:#777067;margin:10px 0 0;font-size:10px;line-height:1.5}.hex-error{color:#96382f;margin:12px 0 0;font-size:12px}.contrast-footer{justify-content:space-between;align-items:center;gap:12px;margin-top:14px;display:flex}.contrast-reset{cursor:pointer;background:0 0;border:1px solid #17171647;border-radius:999px;min-height:32px;padding:0 12px;font-size:10px;font-weight:650}.contrast-reset:hover{border-color:var(--ink);background:#1717160d}.wcag-link{color:#6f685f;font-family:var(--font-geist-mono), monospace;letter-spacing:.08em;text-underline-offset:3px;font-size:8px;text-decoration:underline;display:inline-block}.saved-palette{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.saved-palette>div{background:#ffffff47;border:1px solid #17171624;grid-template-columns:34px minmax(0,1fr) 24px;align-items:center;gap:9px;min-width:0;min-height:54px;padding:7px 7px 7px 9px;display:grid}.saved-swatch{aspect-ratio:1;border:1px solid #17171629;border-radius:50%;width:34px}.saved-palette>div>span:nth-child(2){flex-direction:column;gap:2px;min-width:0;display:flex}.saved-palette strong{text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.saved-palette code{color:#6f685f;font-family:var(--font-geist-mono), monospace;font-size:9px}.saved-palette button{color:#70695f;cursor:pointer;background:0 0;border:0;border-radius:50%;width:24px;height:24px;padding:0 0 2px}.saved-palette button:hover{background:#17171614}.css-preview{color:#f7f2e9;max-height:170px;font-family:var(--font-geist-mono), monospace;white-space:pre;background:#22211f;border:1px solid #17171624;margin:12px 0 0;padding:14px;font-size:10px;line-height:1.65;overflow:auto}.empty-palette{color:#756e64;text-align:center;border:1px dashed #17171647;align-content:center;place-items:center;gap:8px;min-height:120px;padding:20px;display:grid}.empty-palette span{font-family:Iowan Old Style,serif;font-size:30px;line-height:1}.empty-palette p{max-width:280px;margin:0;font-size:12px;line-height:1.55}.tools-notice{z-index:10;left:50%;bottom:max(18px, env(safe-area-inset-bottom));color:#fffdf8;text-align:center;white-space:nowrap;pointer-events:none;background:#1b1916f0;border-radius:999px;max-width:calc(100% - 36px);padding:10px 15px;font-size:11px;position:absolute;translate:-50%;box-shadow:0 10px 28px #0f0d0b38}.tone-section{grid-template-columns:1fr 1.25fr;column-gap:28px;display:grid}.tone-section .section-heading{grid-column:1/-1}.best-tone>span{color:#8a8379;font-family:var(--font-geist-mono), monospace;letter-spacing:.13em;margin-bottom:3px;font-size:10px;display:block}.best-tone strong{letter-spacing:-.05em;font-family:Iowan Old Style,Noto Serif KR,Batang,serif;font-size:clamp(28px,3.8vh,36px);font-weight:500;display:block}.best-tone p{color:#6e675e;word-break:keep-all;margin:7px 0 0;font-size:12px;line-height:1.6}.ratings{flex-direction:column;gap:8px;display:flex}.rating{grid-template-columns:54px 1fr 28px;align-items:center;gap:8px;font-size:11px;display:grid}.rating>span:first-child{color:#625c54}.stars{gap:2px;display:flex}.stars i{color:#d8d1c6;font-size:11px;font-style:normal}.stars i.filled{color:#24211d}.rating>strong{font-family:var(--font-geist-mono), monospace;text-align:right;font-size:10px;font-weight:500}.archive-footer{z-index:260;transition:opacity .2s;position:fixed;bottom:clamp(16px,2.4vw,28px);left:clamp(24px,4vw,68px)}.archive-footer nav{align-items:center;gap:18px;display:flex}.archive-footer a{color:#665f56;font-family:var(--font-geist-mono), monospace;letter-spacing:.04em;font-size:10px;text-decoration:none}.archive-footer a:hover,.archive-footer a:focus-visible{color:var(--ink);text-underline-offset:4px;text-decoration:underline}.archive-footer a:focus-visible{outline:1px solid var(--ink);outline-offset:4px}.info-page{isolation:isolate;background:radial-gradient(circle at 70% 10%, #ffffffa6, transparent 32%), var(--paper);min-height:100svh;position:relative;overflow:hidden}.info-page>:not(.paper-noise){z-index:2;position:relative}.info-header{justify-content:space-between;align-items:flex-start;gap:36px;width:min(100%,1280px);margin:0 auto;padding:clamp(24px,3.5vw,48px) clamp(24px,5vw,72px);display:flex}.info-header nav{flex-wrap:wrap;justify-content:flex-end;gap:10px clamp(16px,2vw,28px);display:flex}.info-header nav a{color:#777067;padding-bottom:6px;font-size:11px;font-weight:500;text-decoration:none;position:relative}.info-header nav a:after{content:"";background:currentColor;height:1px;transition:transform .2s;position:absolute;bottom:0;left:0;right:0;transform:scaleX(0)}.info-header nav a:hover,.info-header nav a:focus-visible,.info-header nav a[aria-current=page]{color:var(--ink)}.info-header nav a:hover:after,.info-header nav a:focus-visible:after,.info-header nav a[aria-current=page]:after{transform:scaleX(1)}.info-header nav a:focus-visible{outline:1px solid var(--ink);outline-offset:4px}.info-main{width:min(100% - 48px,1120px);margin:clamp(52px,8vw,112px) auto 0}.info-hero{grid-template-columns:minmax(150px,.38fr) minmax(0,1fr);gap:clamp(32px,7vw,100px);padding-bottom:clamp(46px,6vw,78px);display:grid}.info-index,.info-eyebrow{font-family:var(--font-geist-mono), monospace}.info-index{color:#8c857b;letter-spacing:.14em;font-size:9px;display:block}.info-eyebrow{color:#6f685f;letter-spacing:.14em;margin:14px 0 0;font-size:9px}.info-hero h1{letter-spacing:-.065em;word-break:keep-all;max-width:820px;margin:0;font-family:Iowan Old Style,Noto Serif KR,Batang,serif;font-size:clamp(40px,6.2vw,82px);font-weight:500;line-height:1.04}.info-lead{color:#5f5951;word-break:keep-all;max-width:720px;margin:clamp(24px,3vw,38px) 0 0;font-size:clamp(14px,1.25vw,17px);line-height:1.85}.info-palette{grid-template-columns:repeat(5,1fr);height:8px;display:grid;overflow:hidden}.info-palette i{display:block}.info-article{padding-bottom:clamp(72px,10vw,140px)}.info-section{border-bottom:1px solid var(--line);grid-template-columns:minmax(210px,.42fr) minmax(0,1fr);gap:clamp(30px,7vw,100px);padding:clamp(42px,5vw,68px) 0;display:grid}.info-section>header{align-items:baseline;gap:13px;display:flex}.info-section>header span{color:#8a8379;font-family:var(--font-geist-mono), monospace;font-size:9px}.info-section h2{letter-spacing:-.045em;word-break:keep-all;margin:0;font-family:Iowan Old Style,Noto Serif KR,Batang,serif;font-size:clamp(21px,2vw,29px);font-weight:600;line-height:1.25}.info-section-body{color:#555049;word-break:keep-all;max-width:720px;font-size:14px;line-height:1.85}.info-section-body p{margin:0}.info-section-body p+p{margin-top:16px}.info-section-body ul{margin:0;padding-left:1.2em}.info-section-body li+li{margin-top:9px}.info-section-body a,.contact-card a{color:var(--ink);text-underline-offset:4px;text-decoration-thickness:1px}.info-section-body code{color:#312e2a;font-family:var(--font-geist-mono), monospace;background:#ffffff4d;border:1px solid #23201c1f;margin-inline:.18em;padding:.16em .36em;font-size:.9em}.info-formula{border:1px solid var(--line);width:min(100%,420px);font-family:var(--font-geist-mono), monospace;text-align:center;background:#fff3;grid-template-columns:repeat(3,1fr);margin-top:28px;padding:26px 24px 38px;font-size:clamp(28px,5vw,46px);display:grid;position:relative}.info-formula .is-red{color:#d63232}.info-formula .is-green{color:#47833f}.info-formula .is-blue{color:#315b87}.info-formula small{color:#8a8379;letter-spacing:.16em;font-size:8px;position:absolute;bottom:13px;left:0;right:0}.info-definitions{margin:0}.info-definitions div{border-bottom:1px solid #23201c1c;grid-template-columns:86px 1fr;gap:18px;padding:16px 0;display:grid}.info-definitions div:first-child{padding-top:0}.info-definitions dt{color:var(--ink);font-weight:600}.info-definitions dd{margin:0}.info-effective{color:#817a70;font-family:var(--font-geist-mono), monospace;letter-spacing:.06em;margin:42px 0 0;font-size:9px}.contact-card{border:1px solid var(--line);background:#ffffff40;margin:clamp(48px,7vw,88px) 0 0;padding:clamp(30px,5vw,58px)}.contact-card>span{color:#847d73;font-family:var(--font-geist-mono), monospace;letter-spacing:.15em;font-size:8px}.contact-card h2{margin:18px 0 8px;font-family:Iowan Old Style,Noto Serif KR,Batang,serif;font-size:22px;font-weight:600}.contact-card a{letter-spacing:-.035em;overflow-wrap:anywhere;font-family:Iowan Old Style,Baskerville,serif;font-size:clamp(26px,4.5vw,54px)}.contact-card p{color:#777067;margin:20px 0 0;font-size:12px}.info-footer{border-top:1px solid var(--line);color:#817a70;width:min(100% - 48px,1120px);font-family:var(--font-geist-mono), monospace;letter-spacing:.08em;justify-content:space-between;gap:20px;margin:0 auto;padding:22px 0 32px;font-size:8px;display:flex}.info-footer a{text-decoration:none}.info-footer a:hover,.info-footer a:focus-visible{color:var(--ink);text-underline-offset:4px;text-decoration:underline}@media (max-width:760px){.site-header{padding-top:20px}.edition{display:none}.header-actions{align-self:flex-start;gap:0 10px}.tools-open-button{gap:5px;padding-bottom:3px;font-size:12px}.tools-open-button small{min-width:20px;padding-inline:4px;font-size:7px}.contact-link{font-size:13px}.palette-nav-wrap{gap:6px;width:90vw;top:56px}.palette-menu{gap:clamp(10px,3.2vw,18px)}.palette-menu button{gap:3px;font-size:15px}.palette-menu small{font-size:12px}.palette-nav-wrap p{text-overflow:ellipsis;max-width:90vw;font-size:11px;overflow:hidden}.color-stage{--radius:clamp(190px, 52vw, 225px);--card-width:clamp(105px, 28.5vw, 123px);--deck-center-y:98%;touch-action:pan-y pinch-zoom;min-height:100svh}.stage-center{width:clamp(238px,68vw,286px)}.color-paper{padding:9px 7px 10px}.color-paper.is-active{filter:none}.paper-group{font-size:9px}.paper-label strong{font-size:11px}.paper-label em{font-size:8px}.paper-label code{font-size:9px}.deck-caption{font-size:10px;bottom:48px}.deck-caption strong{font-size:16px}.tutorial-card{grid-template-columns:40px minmax(0,1fr);gap:9px 12px;width:calc(100vw - 28px);min-height:0;padding:14px;top:clamp(124px,18vh,152px)}.tutorial-card small{margin-bottom:6px;font-size:8px}.tutorial-card p{font-size:13px}.tutorial-card>button{grid-column:2;justify-self:start;padding-block:4px;font-size:9px}.tutorial-gesture{grid-row:1/span 2}.intro-skip{bottom:20px;right:20px}.detail-layer{padding:5vh 4vw}.detail-paper{grid-template-rows:31% 69%;width:92vw;height:min(88svh,720px)}.detail-layer.is-mobile-optimized .detail-paper{box-shadow:0 18px 50px #0f0d0b52}.detail-layer.is-mobile-optimized .detail-paper:after,.archive.is-touch.has-detail .paper-noise{display:none}.archive.is-touch.has-detail .paper-ring,.archive.is-touch.has-detail .orbit-guide,.archive.is-touch.has-detail .stage-center,.archive.is-touch.has-detail .deck-caption{opacity:0}.detail-color{padding:18px}.detail-index{max-width:calc(100% - 122px)}.detail-actions{gap:6px;top:14px;right:14px}.palette-add-button,.share-button{height:38px;padding-inline:13px;font-size:10px}.color-tools{border-left:0;width:100%}.tools-header{min-height:96px;padding:max(18px, env(safe-area-inset-top)) 18px 17px}.tools-header h2{font-size:28px}.tools-scroll{padding-inline:18px}.tool-section{padding-block:24px 28px}.tool-section.is-tutorial-focus{margin-inline:-8px;padding-inline:8px}.tools-tutorial-guide{grid-template-columns:1fr;gap:7px;padding:12px}.tools-tutorial-guide>div{grid-column:1}.tool-heading{margin-bottom:16px}.tool-heading h3{font-size:20px}.tool-heading p{font-size:12px}.tool-button-row button{flex:auto}.tools-notice{font-size:10px}.detail-meta{flex-wrap:wrap;font-size:12px}.hex-copy-button{min-height:34px;padding-inline:10px}.detail-content{padding:20px 18px 24px}.close-button{width:38px;height:38px;top:14px;right:14px}.harmony-copy-button{min-height:28px;padding-right:7px}.harmony-copy-button span{opacity:.72}.detail-notice,.detail-tutorial-hint{bottom:max(12px, env(safe-area-inset-bottom));font-size:10px}.detail-title-wrap h2{font-size:clamp(30px,9.5vw,42px)}.tone-section{grid-template-columns:1fr}.ratings{margin-top:18px}.rating{grid-template-columns:58px 1fr 30px}.archive-footer{left:16px;right:16px;bottom:max(10px, env(safe-area-inset-bottom))}.archive-footer nav{justify-content:space-between;gap:10px}.archive-footer a{font-size:9px}.info-header{gap:22px;padding:20px 18px}.info-header .wordmark{flex:none;font-size:20px}.info-header nav{gap:8px 14px}.info-header nav a{font-size:10px}.info-main{width:calc(100% - 36px);margin-top:50px}.info-hero{grid-template-columns:1fr;gap:28px;padding-bottom:44px}.info-hero h1{font-size:clamp(38px,12vw,54px)}.info-lead{font-size:14px;line-height:1.75}.info-section{grid-template-columns:1fr;gap:24px;padding:40px 0}.info-section-body{font-size:13px;line-height:1.8}.info-definitions div{grid-template-columns:68px 1fr;gap:12px}.contact-card{margin-top:44px;padding:28px 20px}.contact-card a{font-size:clamp(20px,6vw,28px)}.info-footer{flex-direction:column;width:calc(100% - 36px)}}@media (max-width:420px){.saved-palette{grid-template-columns:1fr}.contrast-inputs{grid-template-columns:1fr 34px 1fr;gap:6px}.contrast-inputs label{grid-template-columns:34px minmax(0,1fr);gap:5px}.contrast-inputs input:not([type=color]){padding-inline:6px;font-size:10px}.harmony-grid{grid-template-columns:1fr;gap:14px}.harmony{grid-template-columns:42px 1fr}.harmony-swatch{width:42px}}@media (max-width:380px){.color-stage{--radius:190px;--card-width:105px}.harmony-grid{gap:12px}.harmony{grid-template-columns:34px 1fr;gap:7px}.harmony-swatch{width:34px}}@media (max-height:720px) and (min-width:761px){.color-stage{--radius:clamp(260px, 24vw, 340px);--card-width:clamp(135px, 11.25vw, 162px);--deck-center-y:114%}.stage-center{width:clamp(280px,29vw,380px)}.deck-caption{bottom:40px}.detail-paper{grid-template-rows:31% 69%}.detail-content section+section{margin-top:18px;padding-top:17px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}