#watchface-maker{--navy:#10243b;--navy-deep:#0a192a;--gold:#d5a148;--paper:#f8f4eb;--ink:#15263a;--line:#d8d0c2;width:100%;background:#f4efe5;color:var(--ink);font-family:Arial,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;isolation:isolate}
#watchface-maker,#watchface-maker *{box-sizing:border-box}
#watchface-maker button,#watchface-maker input,#watchface-maker select{font:inherit}#watchface-maker button{cursor:pointer}
#watchface-maker .top{height:72px;background:var(--navy-deep);color:#fff;border-bottom:1px solid #ffffff1f}
#watchface-maker .top-inner{width:min(1150px,calc(100% - 56px));height:100%;margin:auto;display:flex;align-items:center;justify-content:space-between}
#watchface-maker .brand{display:flex;align-items:center;gap:11px;font-size:13px;font-weight:800;letter-spacing:.17em}
#watchface-maker .brand-mark{width:22px;height:22px;border:2px solid var(--gold);border-radius:50%;position:relative}
#watchface-maker .brand-mark:before,#watchface-maker .brand-mark:after{content:"";position:absolute;left:9px;bottom:9px;width:2px;background:var(--gold);transform-origin:bottom;border-radius:2px}
#watchface-maker .brand-mark:before{height:7px;transform:rotate(35deg)}#watchface-maker .brand-mark:after{height:5px;transform:rotate(-55deg)}
#watchface-maker .top-note{font-size:10px;color:#aeb9c5;letter-spacing:.22em}
#watchface-maker .intro{position:relative;overflow:hidden;background:linear-gradient(125deg,var(--navy-deep),var(--navy) 65%,#183553);color:#fff}
#watchface-maker .intro:before{content:"";position:absolute;width:520px;height:520px;right:-150px;top:-260px;border:1px solid #d5a1483d;border-radius:50%;box-shadow:0 0 0 65px #d5a1480a,0 0 0 130px #d5a1480a}
#watchface-maker .intro-inner{position:relative;width:min(1150px,calc(100% - 56px));min-height:390px;margin:auto;display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:60px;align-items:center;padding:42px 0 48px}
#watchface-maker .eyebrow{margin:0;color:#e5b867;font-size:10px;letter-spacing:.24em;font-weight:bold}
#watchface-maker .intro h1{max-width:720px;margin:15px 0 18px;background:transparent!important;border:0;box-shadow:none;font:clamp(38px,5vw,67px)/1.09 Georgia,"Yu Mincho",serif;letter-spacing:-.055em}
#watchface-maker .intro h1 em{color:#e4b15b;font-style:normal;font-weight:normal}
#watchface-maker .lead{max-width:610px;margin:0;color:#c2ccd6;font-size:14px;line-height:1.9}
#watchface-maker .hero-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}
#watchface-maker .hero-tags span{padding:7px 11px;border:1px solid #ffffff2b;border-radius:999px;color:#e2e8ed;font-size:10px;letter-spacing:.06em;background:#ffffff0a}
#watchface-maker .hero-visual{display:flex;align-items:center;gap:20px;justify-content:flex-end}
#watchface-maker .hero-clock{position:relative;width:250px;aspect-ratio:1;flex:none;border-radius:50%;background:#fbf8f1;border:7px solid #d6ab5a;box-shadow:0 24px 55px #0000004d,inset 0 0 0 1px #14284133}
#watchface-maker .hero-clock:after{content:"";position:absolute;left:50%;top:50%;width:13px;height:13px;border:4px solid #fbf8f1;border-radius:50%;background:var(--navy);transform:translate(-50%,-50%);z-index:4}
#watchface-maker .dial-number{position:absolute;color:var(--navy);font:700 19px Georgia,serif}#watchface-maker .n12{left:50%;top:18px;transform:translateX(-50%)}#watchface-maker .n3{right:20px;top:50%;transform:translateY(-50%)}#watchface-maker .n6{left:50%;bottom:17px;transform:translateX(-50%)}#watchface-maker .n9{left:20px;top:50%;transform:translateY(-50%)}
#watchface-maker .hero-hand{position:absolute;left:50%;bottom:50%;border-radius:4px;transform-origin:50% 100%;background:var(--navy);z-index:2}
#watchface-maker .hero-hour{width:7px;height:66px;transform:translateX(-50%) rotate(305deg)}#watchface-maker .hero-minute{width:5px;height:88px;transform:translateX(-50%) rotate(60deg)}#watchface-maker .hero-second{width:2px;height:96px;background:var(--gold);transform:translateX(-50%)}
#watchface-maker .hero-spec{display:grid;gap:13px;color:#dce3e9;font-size:9px;letter-spacing:.14em;writing-mode:vertical-rl}
#watchface-maker .hero-spec strong{color:#e5b867;font-size:11px}
#watchface-maker .output{margin-top:24px}#watchface-maker .output .select-label{margin-top:0}#watchface-maker .download-title{margin:16px 0 8px;font-size:12px;font-weight:bold;letter-spacing:.04em}
#watchface-maker .downloads{display:grid;grid-template-columns:repeat(2,max-content);gap:6px}#watchface-maker .download{padding:10px 12px;border:0;border-radius:4px;background:#172a42;color:#fff;font-size:12px;font-weight:bold}
#watchface-maker .workspace{max-width:1150px;margin:auto;padding:36px 28px 60px;display:grid;grid-template-columns:max-content minmax(0,1fr);gap:58px}
#watchface-maker .panel{padding:22px;background:#fffdf8;border:1px solid #ddd4c5;box-shadow:0 12px 30px #26394b12}
#watchface-maker label{display:block;margin:15px 0 5px;font-size:12px;font-weight:bold;letter-spacing:.04em}
#watchface-maker .select-label{position:relative;display:inline-block;width:fit-content}#watchface-maker .select-label select{display:block;width:auto;margin-top:7px;padding:11px 34px 11px 11px;border:1px solid #d6cfc2;border-radius:3px;background:#fff;color:#1b2b3d;font-weight:600;appearance:none}#watchface-maker .arrow{position:absolute;right:12px;bottom:10px;font-size:17px;pointer-events:none}
#watchface-maker fieldset{width:fit-content;min-width:0;margin:14px 0 0;padding:2px 10px 10px;border:1px solid #d6cfc2;border-radius:3px}#watchface-maker legend{padding:0 6px;font-size:13px;font-weight:bold}#watchface-maker .colors{display:grid;grid-template-columns:repeat(2,max-content);gap:9px}#watchface-maker .color{display:grid;grid-template-columns:30px 1fr;gap:4px;align-items:center;margin:5px 0 0}#watchface-maker .color span{grid-column:1/3}#watchface-maker .color-value{display:none}#watchface-maker .color-swatch{width:28px;height:28px;padding:2px;border:1px solid #a9a39a;border-radius:2px;background:#fff}#watchface-maker .color-swatch i{display:block;width:100%;height:100%;background:#000}#watchface-maker .color-swatch:focus-visible,#watchface-maker .palette-option:focus-visible{outline:2px solid #d49a32;outline-offset:2px}#watchface-maker .color code{font-size:11px;color:#66707c}#watchface-maker .color-picker{display:none;grid-column:1/-1;margin-top:5px;padding-top:10px;border-top:1px solid #e3ddd3}#watchface-maker .color-picker.is-open{display:block}#watchface-maker .color-picker-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-size:11px;font-weight:bold}#watchface-maker .palette-close{padding:2px 6px;border:0;background:transparent;color:#66707c;font-size:16px;line-height:1}#watchface-maker .color-palette{display:grid;grid-template-columns:repeat(8,26px);gap:4px}#watchface-maker .palette-option{width:26px;height:26px;padding:0;border:1px solid #ffffff99;border-radius:2px}#watchface-maker .custom-color{display:flex;align-items:center;gap:8px;margin:10px 0 0;font-size:11px;color:#66707c}#watchface-maker .custom-color input{width:28px;height:28px;padding:0;border:0;background:none}
#watchface-maker .toggle{display:grid;grid-template-columns:1fr auto;column-gap:10px;width:fit-content;align-items:center;margin:17px 0}#watchface-maker .toggle input{display:none}#watchface-maker .toggle i{width:38px;height:22px;border-radius:11px;background:#c9c9c4;position:relative}#watchface-maker .toggle i:after{content:"";position:absolute;width:16px;height:16px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.2s}#watchface-maker .toggle input:checked+i{background:#d49a32}#watchface-maker .toggle input:checked+i:after{left:19px}
#watchface-maker .preview{text-align:center}#watchface-maker .preview-label{display:flex;gap:10px;align-items:center;justify-content:center;color:#8a9197;font-size:10px;letter-spacing:.18em;font-weight:bold}#watchface-maker .preview-label span{width:38px;height:1px;background:#cfc7ba}#watchface-maker canvas{display:block;width:min(440px,76vw);aspect-ratio:1;margin:22px auto;border-radius:50%}#watchface-maker .hint{font-size:12px;color:#747c83}
@media(max-width:820px){#watchface-maker .intro-inner{grid-template-columns:1fr 240px;gap:30px}#watchface-maker .hero-clock{width:210px}#watchface-maker .hero-spec{display:none}}
@media(max-width:640px){#watchface-maker .top{height:60px}#watchface-maker .top-inner,#watchface-maker .intro-inner{width:calc(100% - 40px)}#watchface-maker .top-note{display:none}#watchface-maker .intro-inner{min-height:auto;grid-template-columns:1fr;padding:38px 0 42px}#watchface-maker .intro h1{font-size:clamp(37px,12vw,53px)}#watchface-maker .hero-visual{justify-content:center;margin-top:8px}#watchface-maker .hero-clock{width:220px}#watchface-maker .workspace{grid-template-columns:1fr;gap:30px;padding:26px 20px}#watchface-maker .panel{width:fit-content}}